diff --git a/src/components/Event/Event.tsx b/src/components/Event/Event.tsx index b00e6c4..8d9cfd2 100644 --- a/src/components/Event/Event.tsx +++ b/src/components/Event/Event.tsx @@ -1,21 +1,11 @@ import { useCallback, useEffect, useState } from 'react'; import { getEvent } from '../api'; import { IEvent } from '../types'; -import UILink from '../UI/UILink'; -import UISecondaryBox from '../UI/UISecondaryBox'; -import UISecondaryHeader from '../UI/UISecondaryHeader'; import useImmutable from '../useImmutable'; +import EventContent from './EventContent'; import EventContext from './EventContext'; -import EventDetails from './EventDetails'; -import EventInterestForm from './EventInterestForm'; import EventPlaceholder from './EventPlaceholder'; -type NotNull = T extends null ? never : T; - -function GroupName({ group }: { group: NotNull }) { - return {group.name}; -} - export default function Event({ id, initial, @@ -44,8 +34,6 @@ export default function Event({ return

Event Not Found

; } - const { name, group } = event; - return ( - -
- {name} - Created by {event.creator.name} -
- {group && } -
- - -
+
); } diff --git a/src/components/Event/EventAdminControls.tsx b/src/components/Event/EventAdminControls.tsx new file mode 100644 index 0000000..1bcd0c3 --- /dev/null +++ b/src/components/Event/EventAdminControls.tsx @@ -0,0 +1,83 @@ +import { useCallback, useState } from 'react'; +import { deleteEvent } from '../api'; +import UIPressable from '../UI/UIPressable'; +import { useCurrentEventId } from './EventHooks'; + +export enum AsyncCallbackStatus { + NONE = 0, + PENDING = 1, + RESOLVED = 2, + REJECTED = 3, +} + +export function useAsyncCallback( + callback: (...args: A) => Promise +) { + const [status, setStatus] = useState(AsyncCallbackStatus.NONE); + + const cb = useCallback( + (...args: any) => { + setStatus(AsyncCallbackStatus.PENDING); + + callback(...args) + .then(() => setStatus(AsyncCallbackStatus.RESOLVED)) + .catch(() => setStatus(AsyncCallbackStatus.REJECTED)); + }, + [callback] + ); + + const reset = useCallback(() => setStatus(AsyncCallbackStatus.NONE), []); + + return [cb as typeof callback, status, reset] as const; +} + +export default function EventAdminControls() { + const id = useCurrentEventId(); + // const desc = useCurrentEventDescription(); + + // const descriptionTextareaRef = useRef(null); + + const [onPressDelete, deletionStatus] = useAsyncCallback( + useCallback(() => deleteEvent(id), [id]) + ); + + // const [onSaveDescription, saveDescriptionStatus] = useAsyncCallback( + // useCallback(() => { + // if (!descriptionTextareaRef.current) { + // return Promise.reject('Textarea not ready'); + // } + // setEditDescriptionOpen(false); + // return setEventDescription(id, descriptionTextareaRef.current.value); + // }, [id]) + // ); + + // const [editDescriptionOpen, setEditDescriptionOpen] = useState(false); + + return ( +
+ {deletionStatus === AsyncCallbackStatus.NONE ? ( + Delete + ) : deletionStatus === AsyncCallbackStatus.PENDING ? ( + Deleting... + ) : deletionStatus === AsyncCallbackStatus.RESOLVED ? ( + Deleted + ) : ( + Delete failed + )} + + {/* {!editDescriptionOpen ? ( + setEditDescriptionOpen(true)}> + Edit description + + ) : ( + <> +