feat: add ParticipantListEntry component and integrate draft into event form

This commit is contained in:
micha 2025-06-17 19:01:14 +02:00
parent f5450d9b4f
commit 8369a92520
2 changed files with 41 additions and 2 deletions

View file

@ -9,6 +9,7 @@ import {
useGetApiUserMe,
usePostApiEvent,
} from '@/generated/api/default/default';
import ParticipantListEntry from '@/components/custom-ui/participantListEntry';
type eventFormProps = {
type?: 'create' | 'edit';
@ -22,6 +23,10 @@ export default function EventForm({ type = 'edit' }: eventFormProps) {
const [startTime, setStartTime] = React.useState<string>('12:00');
const [endDate, setEndDate] = React.useState<Date | undefined>();
const [endTime, setEndTime] = React.useState<string>('13:00');
const [selectedParticipants, setSelectedParticipants] = React.useState<{ [name: string]: boolean }>({
'Max Muster': false,
// Add more participants as needed
});
async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
e.preventDefault();
@ -161,8 +166,17 @@ export default function EventForm({ type = 'edit' }: eventFormProps) {
</div>
</div>
<div className='h-full w-full'>
<Label>Participants here</Label>{' '}
{/* TODO: add participants input */}
<Label>Participants</Label> {/* TODO: add participants input */}
<ParticipantListEntry
participant="Max Muster"
checked={selectedParticipants['Max Muster']}
onCheck={checked =>
setSelectedParticipants(prev => ({
...prev,
['Max Muster']: checked,
}))
}
></ParticipantListEntry>
</div>
</div>

View file

@ -0,0 +1,25 @@
import React from 'react';
type ParticipantListEntryProps = {
participant: string;
checked?: boolean;
onCheck?: (checked: boolean) => void;
};
export default function ParticipantListEntry({
participant,
checked = false,
onCheck,
}: ParticipantListEntryProps) {
return (
<div className='flex items-center gap-2 py-1 ml-5'>
<input
type='checkbox'
checked={checked}
onChange={(e) => onCheck?.(e.target.checked)}
className='accent-primary cursor-pointer'
/>
<span>{participant}</span>
</div>
);
}