fix(lightbox): fill the heart icon when liked (#538 follow-up)

@Tietge86 spotted that both branches of the heart-icon className were
`text-white` — the conditional was a no-op, the `fill-current` class
that would actually fill the icon was missing entirely. The button
background was turning red on like, but the heart icon stayed as a
white outline against the red, making it nearly invisible.

Move text-white outside the conditional (always white against the
red/dark backgrounds the button uses), and add fill-current to the
liked branch so the heart fills in.

Same shape as bug 2 of the original report — the like state needed to
be visually unambiguous. PhotoLikes.tsx was already fixed in this PR;
this catches the equivalent latent bug in the inline lightbox toolbar
button.

Also: bug 4 of the original report (recovery flow) turned out to be
SMTP misconfig on the reporter's end (mailhog silently dropping
emails), not a PicPeak bug. Confirmed in this thread; no further
backend changes needed.

Refs: #538
This commit is contained in:
Paul Nothaft
2026-05-20 17:23:20 +02:00
parent 4d92fb4590
commit 600c29db8a
@@ -662,7 +662,11 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
aria-label={myLiked ? 'Unlike photo' : 'Like photo'}
title={myLiked ? 'Unlike' : 'Like'}
>
<Heart className={`w-5 h-5 ${myLiked ? 'text-white' : 'text-white'}`} />
{/* fill-current on the liked state so the heart is
actually visible against the red background — both
branches were `text-white` only (#538 follow-on
bug from @Tietge86). */}
<Heart className={`w-5 h-5 text-white ${myLiked ? 'fill-current' : ''}`} />
</button>
{/* Aggregate like count is admin-only when the admin
has hidden feedback from guests (#538 bug 3). Without