Add event filter to the contests page (#30)

cubing · Aug 30, 2024 · 4fbd867 · 4fbd867
1 parent c5bd5de
commit 4fbd867
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 16 deletions.
diff --git a/client/app/competitions/page.tsx b/client/app/competitions/page.tsx
@@ -1,5 +1,6 @@
 import { ssrFetch } from '~/helpers/fetchUtils';
 import ContestsTable from '@c/ContestsTable';
+import EventButtons from '../components/EventButtons';
 
 // SEO
 export const metadata = {
@@ -14,13 +15,20 @@ export const metadata = {
   },
 };
 
-const ContestsPage = async () => {
-  const { payload: contests } = await ssrFetch('/competitions');
+const ContestsPage = async (
+  {
+    searchParams: { eventId },
+  }: {
+    searchParams: { eventId?: string };
+  }
+) => {
+  const { payload: events } = await ssrFetch('/events');
+  const { payload: contests } = await ssrFetch(`/competitions${eventId ? `?eventId=${eventId}` : ''}`);
 
   return (
     <div>
       <h2 className="mb-4 text-center">All contests</h2>
-
+      {events && <EventButtons key={eventId} eventId={eventId} events={events} forPage="competitions" />}
       {contests?.length > 0 ? (
         <ContestsTable contests={contests} />
       ) : (

diff --git a/client/app/components/EventButtons.tsx b/client/app/components/EventButtons.tsx
@@ -13,37 +13,43 @@ const EventButtons = ({
 }: {
   eventId: string;
   events: IEvent[];
-  forPage: 'results' | 'rankings' | 'data-entry';
+  forPage: 'results' | 'rankings' | 'competitions' | 'data-entry';
 }) => {
   const router = useRouter();
   const { id, singleOrAvg } = useParams();
   const searchParams = useSearchParams();
 
   const [selectedCat, setSelectedCat] = useState(
-    eventCategories.find((el) => events.find((e) => e.eventId === eventId).groups.includes(el.group)),
+    eventCategories.find((el) => events.find((e) => e.eventId === eventId)?.groups.includes(el.group)) ?? eventCategories[0],
   );
 
   // If hideCategories = true, just show all events that were passed in
   const filteredEvents = useMemo(
-    () => (forPage !== 'rankings' ? events : events.filter((el) => el.groups.includes(selectedCat.group))),
+    () => (!['rankings', 'competitions'].includes(forPage) ? events : events.filter((el) => el.groups.includes(selectedCat.group))),
     [events, selectedCat],
   );
 
-  const handleEventClick = (eventId: string) => {
+  const handleEventClick = (newEventId: string) => {
     if (forPage === 'results') {
-      router.push(`/competitions/${id}/results?eventId=${eventId}`);
+      router.push(`/competitions/${id}/results?eventId=${newEventId}`);
     } else if (forPage === 'rankings') {
       const show = searchParams.get('show');
-      router.push(`/rankings/${eventId}/${singleOrAvg}${show ? `?show=${show}` : ''}`);
+      router.push(`/rankings/${newEventId}/${singleOrAvg}${show ? `?show=${show}` : ''}`);
+    } else if (forPage === 'competitions') {
+      if (searchParams.get('eventId') === newEventId) {
+        window.location.href = '/competitions';
+      } else {
+        router.push(`/competitions?eventId=${newEventId}`);
+      }
     } else {
-      window.location.href = `/mod/competition/${id}?eventId=${eventId}`;
+      window.location.href = `/mod/competition/${id}?eventId=${newEventId}`;
     }
   };
 
   return (
     <div>
       {/* Event categories */}
-      {forPage === 'rankings' && (
+      {['rankings', 'competitions'].includes(forPage) && (
         <>
           <div className="btn-group btn-group-sm mt-2 mb-3" role="group">
             {eventCategories.map((cat) => (
@@ -59,7 +65,7 @@ const EventButtons = ({
             ))}
           </div>
 
-          {selectedCat.description && <p>{selectedCat.description}</p>}
+          {selectedCat?.description && <p>{selectedCat.description}</p>}
         </>
       )}
 

diff --git a/server/src/modules/contests/contests.controller.ts b/server/src/modules/contests/contests.controller.ts
@@ -25,12 +25,12 @@ import { RolesGuard } from '~/src/guards/roles.guard';
 export class ContestsController {
   constructor(private readonly logger: MyLogger, private readonly service: ContestsService) {}
 
-  // GET /competitions?region=...
+  // GET /competitions?region=...&eventId=...
   @Get()
-  async getContests(@Query('region') region: string) {
+  async getContests(@Query('region') region?: string, @Query('eventId') eventId?: string) {
     this.logger.logAndSave('Getting contests', LogType.GetContests);
 
-    return await this.service.getContests(region);
+    return await this.service.getContests(region, eventId);
   }
 
   // GET /competitions/mod

diff --git a/server/src/modules/contests/contests.service.ts b/server/src/modules/contests/contests.service.ts
@@ -137,9 +137,13 @@ export class ContestsService {
     }
   }
 
-  async getContests(region?: string): Promise<ContestDocument[]> {
+  async getContests(region?: string, eventId?: string): Promise<ContestDocument[]> {
     const queryFilter: any = { state: { $gt: ContestState.Created, $lt: ContestState.Removed } };
     if (region) queryFilter.countryIso2 = region;
+    if (eventId) {
+      const event = await this.eventsService.getEventById(eventId);
+      queryFilter['events.event'] = event._id;
+    }
 
     const contests = await this.contestModel.find(queryFilter, excl).sort({ startDate: -1 }).exec();
     return contests;