diff --git a/src/components/Authentication/createSession.ts b/src/components/Authentication/createSession.ts index 40073ef..955e88a 100644 --- a/src/components/Authentication/createSession.ts +++ b/src/components/Authentication/createSession.ts @@ -1,6 +1,4 @@ -const domain = process.env.REACT_APP_API_DOMAIN; - -console.log({ domain }); +import { domain } from '../api'; export async function createSession(code: string, redirectUrl: string) { const res = await fetch(domain + 'create_session', { diff --git a/src/components/Event/Event.tsx b/src/components/Event/Event.tsx index a2d2c23..766db62 100644 --- a/src/components/Event/Event.tsx +++ b/src/components/Event/Event.tsx @@ -1,14 +1,9 @@ import { useCallback, useEffect } from 'react'; import { green, lightgrey } from '../../lib/colors'; import getPlaceDetails from '../../lib/getPlaceDetails'; -import { - addOrUpdateEventSignup, - getEvent, - getEventSignups, - removeEventSignup, -} from '../api'; +import { addOrUpdateEventSignup, getEvent, removeEventSignup } from '../api'; import { useMe } from '../hooks'; -import { IEvent, IEventSignup } from '../types'; +import { IEvent } from '../types'; import UIButton from '../UI/UIButton'; import UILink from '../UI/UILink'; import UIPlacesAutocomplete from '../UI/UIPlacesAutocomplete'; @@ -24,8 +19,6 @@ function GroupName({ group }: { group: IEvent['group'] }) { return {group.name}; } -const NOT_LOADED = {}; - export default function Event({ id, initial, @@ -33,13 +26,14 @@ export default function Event({ id: number; initial?: IEvent; }) { - const [event, setEvent] = useImmutable({ + const [event, setEvent] = useImmutable({ id, name: '', group: { id: 0, name: '', }, + signups: {}, carpools: [], startTime: '', endTime: '', @@ -51,8 +45,6 @@ export default function Event({ duration: 0, ...(initial || {}), }); - const [signups, setSignups] = - useImmutable>(NOT_LOADED); const me = useMe()!; @@ -71,13 +63,13 @@ export default function Event({ if (placeId) { const details = await getPlaceDetails(placeId); - signups[me.id] = { + event.signups[me.id] = { user: { id: me.id, name: me.name }, placeId, ...details, }; } else { - signups[me.id] = { + event.signups[me.id] = { user: { id: me.id, name: me.name }, placeId: null, latitude: null, @@ -86,30 +78,18 @@ export default function Event({ }; } }, - [id, me.id, me.name, signups] + [event.signups, id, me.id, me.name] ); const removeSignup = useCallback(async () => { await removeEventSignup(id); - if (signups[me.id]) { - delete signups[me.id]; + if (event.signups[me.id]) { + delete event.signups[me.id]; } - }, [id, me.id, signups]); + }, [id, me.id, event.signups]); - const interested = !!signups[me.id]; - - useEffect(() => { - getEventSignups(id) - .then((signups) => { - const signupMap: Record = {}; - for (let signup of signups) { - signupMap[signup.user.id] = signup; - } - setSignups(signupMap); - }) - .catch(console.error); - }, [id, setSignups]); + const interested = !!event.signups[me.id]; if (!event) { return Loading...; @@ -124,7 +104,6 @@ export default function Event({ refresh, default: false, tentativeInvites, - signups, }} > @@ -151,15 +130,15 @@ export default function Event({ updateSignup(placeId); }} style={ - signups[me.id]?.placeId != null + event.signups[me.id]?.placeId != null ? { border: '2px solid ' + green } : {} } - placeId={signups[me.id]?.placeId} + placeId={event.signups[me.id]?.placeId} />
- {signups !== null && } + {event.signups !== null && } )}
diff --git a/src/components/Event/EventCarpools.tsx b/src/components/Event/EventCarpools.tsx index d036a33..25558ec 100644 --- a/src/components/Event/EventCarpools.tsx +++ b/src/components/Event/EventCarpools.tsx @@ -12,10 +12,11 @@ import { useMe } from '../hooks'; import { IEvent } from '../types'; import useOptimalPath from '../useOptimalPath'; import EventContext from './EventContext'; -import useMySignup from './useMySignup'; +import { useMySignup } from './EventHooks'; function useMemberLocations(members: IEvent['carpools'][0]['members']) { - const { signups } = useContext(EventContext); + const { event } = useContext(EventContext); + const signups = event.signups; return useMemo( () => diff --git a/src/components/Event/EventContext.tsx b/src/components/Event/EventContext.tsx index 20aaac1..b6768b3 100644 --- a/src/components/Event/EventContext.tsx +++ b/src/components/Event/EventContext.tsx @@ -1,5 +1,5 @@ import { createContext } from 'react'; -import { IEvent, IEventSignup } from '../types'; +import { IEvent } from '../types'; const EventContext = createContext({ refresh: () => { @@ -7,7 +7,6 @@ const EventContext = createContext({ }, event: null! as IEvent, default: true, - signups: {} as Record, tentativeInvites: {} as Record, }); diff --git a/src/components/Event/useMySignup.tsx b/src/components/Event/EventHooks.ts similarity index 59% rename from src/components/Event/useMySignup.tsx rename to src/components/Event/EventHooks.ts index d44c73a..7d4f05e 100644 --- a/src/components/Event/useMySignup.tsx +++ b/src/components/Event/EventHooks.ts @@ -2,8 +2,12 @@ import { useContext, useMemo } from 'react'; import { useMe } from '../hooks'; import EventContext from './EventContext'; -export default function useMySignup() { - const { signups } = useContext(EventContext); +export function useSignups() { + return useContext(EventContext).event.signups; +} + +export function useMySignup() { + const signups = useSignups(); const me = useMe()!; return useMemo(() => signups[me.id] ?? null, [signups, me.id]); diff --git a/src/components/Event/EventSignups.tsx b/src/components/Event/EventSignups.tsx index cc361e9..de5e512 100644 --- a/src/components/Event/EventSignups.tsx +++ b/src/components/Event/EventSignups.tsx @@ -7,7 +7,7 @@ import { IEventSignup } from '../types'; import EventCarpoolCreateButton from './EventCarpoolCreateButton'; import EventContext from './EventContext'; import pickLatLong from './pickLatLong'; -import useMySignup from './useMySignup'; +import { useMySignup } from './EventHooks'; function EventSignup({ signup }: { signup: IEventSignup }) { const { user } = signup; @@ -79,7 +79,8 @@ function EventSignup({ signup }: { signup: IEventSignup }) { } export default function EventSignups() { - const { event, signups } = useContext(EventContext); + const { event } = useContext(EventContext); + const signups = event.signups; const carpools = event.carpools; const signupsWithoutCarpool = useMemo(() => { @@ -92,6 +93,8 @@ export default function EventSignups() { .map((id) => signups[id]); }, [signups, carpools]); + console.log(signups); + return (

People without a carpool

diff --git a/src/components/api.ts b/src/components/api.ts index 38c5896..b828de3 100644 --- a/src/components/api.ts +++ b/src/components/api.ts @@ -1,12 +1,12 @@ import { GroupPreview } from './GroupJoinerLink'; import { IInvitation, IEventSignup, ICarpool, IEvent, IGroup } from './types'; -const base = (() => { - const domain = - process.env.NODE_ENV === 'production' - ? process.env.REACT_APP_API_PROD - : process.env.REACT_APP_API_LOCAL; +export const domain = + process.env.NODE_ENV === 'production' + ? process.env.REACT_APP_API_PROD + : process.env.REACT_APP_API_LOCAL; +export const base = (() => { if (domain?.endsWith('/')) { return domain.slice(0, -1) + '/api'; } else { diff --git a/src/components/types.ts b/src/components/types.ts index 1c67526..3bb24cf 100644 --- a/src/components/types.ts +++ b/src/components/types.ts @@ -71,6 +71,7 @@ export type IEvent = { name: string; }[]; }[]; + signups: Record; startTime: string; // Datestring duration: number; endTime: string | null; // Datestring