From d7fc0a9467f6b79a499c03665ff5c9f7a180ce9c Mon Sep 17 00:00:00 2001 From: FinnIckler Date: Wed, 20 Dec 2023 11:05:43 +0100 Subject: [PATCH] Add preferred events to the frontend (#400) --- .../src/api/helper/context/user_context.ts | 3 +++ Frontend/src/api/helper/routes.ts | 3 +++ .../src/api/mocks/get_preferred_events.ts | 26 ++++++++++++++++++ .../src/api/user/get/get_preferred_events.ts | 12 +++++++++ .../register/components/CompetingStep.jsx | 6 +++-- Frontend/src/ui/providers/UserProvider.jsx | 27 ++++++++++++++++--- 6 files changed, 71 insertions(+), 6 deletions(-) create mode 100644 Frontend/src/api/mocks/get_preferred_events.ts create mode 100644 Frontend/src/api/user/get/get_preferred_events.ts diff --git a/Frontend/src/api/helper/context/user_context.ts b/Frontend/src/api/helper/context/user_context.ts index dbc89c2d..131f93a1 100644 --- a/Frontend/src/api/helper/context/user_context.ts +++ b/Frontend/src/api/helper/context/user_context.ts @@ -1,3 +1,4 @@ +import { EventId } from '@wca/helpers' import { createContext } from 'react' export interface UserFull { @@ -28,8 +29,10 @@ export interface UserFull { } interface UserContext { user: UserFull | null + preferredEvents: EventId[] | null } export const UserContext = createContext({ user: null, + preferredEvents: null, }) diff --git a/Frontend/src/api/helper/routes.ts b/Frontend/src/api/helper/routes.ts index 69aeb0bc..39b1201f 100644 --- a/Frontend/src/api/helper/routes.ts +++ b/Frontend/src/api/helper/routes.ts @@ -32,6 +32,9 @@ export const competitionContactFormRoute = (compId: string) => export const pollingRoute = (userId: string, competitionId: string) => `${process.env.POLL_URL}?attendee_id=${competitionId}-${userId}` export const meRoute = `${process.env.WCA_URL}/api/v0/users/me` + +export const preferredEventsRoute = `${process.env.WCA_URL}/api/v0/users/me/preferred_events` + export const myBookmarkedCompetitionsRoute = `${process.env.WCA_URL}/api/v0/users/me/bookmarks` // This will break when urls get really big, maybe we should switch to POST? export const usersInfoRoute = (ids: string[]) => diff --git a/Frontend/src/api/mocks/get_preferred_events.ts b/Frontend/src/api/mocks/get_preferred_events.ts new file mode 100644 index 00000000..d4b5f46b --- /dev/null +++ b/Frontend/src/api/mocks/get_preferred_events.ts @@ -0,0 +1,26 @@ +import { EventId } from '@wca/helpers' + +export function getPreferredEventsMock(): EventId[] { + const events = [ + '222', + '333', + '444', + '555', + '666', + '777', + '333bf', + '333fm', + '333oh', + 'clock', + 'minx', + 'pyram', + 'skewb', + 'sq1', + '444bf', + '555bf', + '333mbf', + ] + const end = Math.round(Math.random() * events.length) + const start = Math.round(Math.random() * end) + return events.slice(start, end) as EventId[] +} diff --git a/Frontend/src/api/user/get/get_preferred_events.ts b/Frontend/src/api/user/get/get_preferred_events.ts new file mode 100644 index 00000000..30b33756 --- /dev/null +++ b/Frontend/src/api/user/get/get_preferred_events.ts @@ -0,0 +1,12 @@ +import { EventId } from '@wca/helpers' +import externalServiceFetch from '../../helper/external_service_fetch' +import { preferredEventsRoute } from '../../helper/routes' +import { getPreferredEventsMock } from '../../mocks/get_preferred_events' + +export default async function getPreferredEvents(): Promise { + if (process.env.NODE_ENV === 'production') { + return externalServiceFetch(preferredEventsRoute) + } + // returns a random selection of events as a mock + return getPreferredEventsMock() +} diff --git a/Frontend/src/pages/register/components/CompetingStep.jsx b/Frontend/src/pages/register/components/CompetingStep.jsx index e3b4b017..533a88d1 100644 --- a/Frontend/src/pages/register/components/CompetingStep.jsx +++ b/Frontend/src/pages/register/components/CompetingStep.jsx @@ -26,13 +26,15 @@ import Processing from './Processing' const maxCommentLength = 240 export default function CompetingStep({ nextStep }) { - const { user } = useContext(UserContext) + const { user, preferredEvents } = useContext(UserContext) const { competitionInfo } = useContext(CompetitionContext) const { registration, isRegistered, refetch } = useContext(RegistrationContext) const [comment, setComment] = useState('') - const [selectedEvents, setSelectedEvents] = useState([]) + const [selectedEvents, setSelectedEvents] = useState( + preferredEvents.filter((event) => competitionInfo.event_ids.includes(event)) + ) const [guests, setGuests] = useState(0) const [processing, setProcessing] = useState(false) diff --git a/Frontend/src/ui/providers/UserProvider.jsx b/Frontend/src/ui/providers/UserProvider.jsx index 37ce4ba3..161cec09 100644 --- a/Frontend/src/ui/providers/UserProvider.jsx +++ b/Frontend/src/ui/providers/UserProvider.jsx @@ -3,6 +3,7 @@ import React from 'react' import { getJWT } from '../../api/auth/get_jwt' import { UserContext } from '../../api/helper/context/user_context' import getMe from '../../api/user/get/get_me' +import getPreferredEvents from '../../api/user/get/get_preferred_events' import LoadingMessage from '../messages/loadingMessage' // The User key is just for mocks, so it can probably be moved somewhere else @@ -20,21 +21,39 @@ export default function UserProvider({ children }) { refetchOnWindowFocus: false, refetchOnReconnect: false, onError: (_) => { - // We are not logged in, set user explicitly to undefined? + // We are not logged in, we set the user to undefined below }, onSuccess: (_) => { // Get a new token so when a user switches account it overwrites the token getJWT(true) }, }) - return isLoading ? ( + const { + isLoading: preferredEventsLoading, + data: preferredEvents, + isError: preferredEventsError, + } = useQuery({ + queryKey: ['user-preferred'], + queryFn: () => getPreferredEvents(), + retry: false, + refetchOnWindowFocus: false, + refetchOnReconnect: false, + }) + return isLoading || preferredEventsLoading ? ( ) : // eslint-disable-next-line unicorn/no-nested-ternary isError ? ( - + {children} ) : ( - {children} + + {children} + ) }