feat: add user image to ParticipantListEntry component

This commit is contained in:
micha 2025-06-22 21:21:06 +02:00
parent 44a75ff12e
commit 10080b8513
2 changed files with 8 additions and 4 deletions

View file

@ -148,6 +148,7 @@ export default function ShowEvent() {
<ParticipantListEntry <ParticipantListEntry
key={user.user.id} key={user.user.id}
participant={user.user.name} participant={user.user.name}
imageSrc={user.user.image}
></ParticipantListEntry> ></ParticipantListEntry>
))} ))}
</div> </div>

View file

@ -6,19 +6,22 @@ import { useTheme } from 'next-themes';
type ParticipantListEntryProps = { type ParticipantListEntryProps = {
participant: string; participant: string;
imageSrc?: string; imageSrc?: string | null;
}; };
export default function ParticipantListEntry({ export default function ParticipantListEntry({
participant, participant,
imageSrc,
}: ParticipantListEntryProps) { }: ParticipantListEntryProps) {
const { resolvedTheme } = useTheme(); const { resolvedTheme } = useTheme();
const defaultImage =
const iconSrc =
resolvedTheme === 'dark' ? user_default_dark : user_default_light; resolvedTheme === 'dark' ? user_default_dark : user_default_light;
const finalImageSrc = imageSrc ?? defaultImage;
return ( return (
<div className='flex items-center gap-2 py-1 ml-5'> <div className='flex items-center gap-2 py-1 ml-5'>
<Image src={iconSrc} alt='Avatar' width={30} height={30} /> <Image src={finalImageSrc} alt='Avatar' width={30} height={30} />
<span>{participant}</span> <span>{participant}</span>
</div> </div>
); );