diff --git a/src/components/forms/event-form.tsx b/src/components/forms/event-form.tsx index 11bf820..f13e830 100644 --- a/src/components/forms/event-form.tsx +++ b/src/components/forms/event-form.tsx @@ -58,9 +58,12 @@ const EventForm: React.FC = (props) => { error, } = usePostApiEvent(); const { data, isLoading, error: fetchError } = useGetApiUserMe(); - const { data: eventData } = useGetApiEventEventID(props.eventId!, { - query: { enabled: props.type === 'edit' }, - }); + const { data: eventData, isLoading: eventLoading } = useGetApiEventEventID( + props.eventId!, + { + query: { enabled: props.type === 'edit' }, + }, + ); const patchEvent = usePatchApiEventEventID(); const router = useRouter(); @@ -87,7 +90,7 @@ const EventForm: React.FC = (props) => { // Update state when event data loads React.useEffect(() => { - if (props.type === 'edit' && event) { + if (props.type === 'edit' && event && !eventLoading) { setTitle(event.title || ''); // Parse start_time and end_time if (event.start_time) { @@ -113,7 +116,7 @@ const EventForm: React.FC = (props) => { setEndDate(end); setEndTime(end.toTimeString().slice(0, 5)); // "HH:mm" } - }, [event, props.type, startFromUrl, endFromUrl]); + }, [event, props.type, startFromUrl, endFromUrl, eventLoading]); async function handleSubmit(e: React.FormEvent) { e.preventDefault(); @@ -210,8 +213,9 @@ const EventForm: React.FC = (props) => { const createdAtDisplay = new Date(createdAtValue).toLocaleDateString(); const updatedAtDisplay = new Date(updatedAtValue).toLocaleDateString(); - if (props.type === 'edit' && isLoading) return
Loading...
; - if (props.type === 'edit' && fetchError) + if (props.type === 'edit' && (isLoading || eventLoading)) + return
Loading...
; + if (props.type === 'edit' && (fetchError || !eventData?.data?.event)) return
Error loading event.
; return ( @@ -232,7 +236,7 @@ const EventForm: React.FC = (props) => { } name='eventName' variantSize='big' - value={title} + value={title || (props.type === 'edit' && event?.title) || ''} onChange={(e) => setTitle(e.target.value)} /> @@ -265,7 +269,9 @@ const EventForm: React.FC = (props) => { label='Location' placeholder='where is the event?' name='eventLocation' - value={location} + value={ + location || (props.type === 'edit' && event?.location) || '' + } onChange={(e) => setLocation(e.target.value)} /> @@ -301,7 +307,11 @@ const EventForm: React.FC = (props) => { placeholder='What is the event about?' name='eventDescription' variantSize='textarea' - value={description} + value={ + description || + (props.type === 'edit' && event?.description) || + '' + } onChange={(e) => setDescription(e.target.value)} >