From 4921c3e3ca548a412d8659be8781796a09f66a96 Mon Sep 17 00:00:00 2001 From: camilovegag Date: Mon, 5 Aug 2024 08:15:54 -0500 Subject: [PATCH 1/3] Add eventDisplayRank to events type --- packages/api/src/types/Events.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/api/src/types/Events.ts b/packages/api/src/types/Events.ts index 2ea07899..69fe8a37 100644 --- a/packages/api/src/types/Events.ts +++ b/packages/api/src/types/Events.ts @@ -9,6 +9,7 @@ export type GetEventResponse = { description: string | null; fields: unknown; status: 'OPEN' | 'CLOSED' | 'UPCOMING' | null; + eventDisplayRank: number | null; }; export type GetEventsResponse = GetEventResponse[]; From 5ae4b5c4afdf1e537b4f95b39e5b1cab7ecc8fe7 Mon Sep 17 00:00:00 2001 From: camilovegag Date: Mon, 5 Aug 2024 08:16:10 -0500 Subject: [PATCH 2/3] Sort events by eventDisplayRank --- packages/berlin/src/components/events/Events.tsx | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/packages/berlin/src/components/events/Events.tsx b/packages/berlin/src/components/events/Events.tsx index 1e11699b..e2a24d36 100644 --- a/packages/berlin/src/components/events/Events.tsx +++ b/packages/berlin/src/components/events/Events.tsx @@ -2,14 +2,14 @@ import { useNavigate } from 'react-router-dom'; // API -import { GetEventResponse } from 'api'; +import { GetEventsResponse } from 'api'; // Components import { Body } from '../typography/Body.styled'; import { Subtitle } from '../typography/Subtitle.styled'; type EventsProps = { - events: GetEventResponse[] | undefined; + events: GetEventsResponse | null | undefined; errorMessage: string; }; @@ -20,8 +20,14 @@ export default function Events({ events, errorMessage }: EventsProps) { navigate(`/events/${eventId}/cycles`); }; - return events?.length ? ( - events.map((event) => { + const sortedEvents = events?.sort((a, b) => { + const rankA = a.eventDisplayRank ?? Number.MAX_SAFE_INTEGER; + const rankB = b.eventDisplayRank ?? Number.MAX_SAFE_INTEGER; + return rankA - rankB; + }); + + return sortedEvents?.length ? ( + sortedEvents.map((event) => { return (
Date: Mon, 5 Aug 2024 08:16:21 -0500 Subject: [PATCH 3/3] Remove tabs from events page --- packages/berlin/src/pages/Events.tsx | 18 +----------------- 1 file changed, 1 insertion(+), 17 deletions(-) diff --git a/packages/berlin/src/pages/Events.tsx b/packages/berlin/src/pages/Events.tsx index 01923e4f..73986f1c 100644 --- a/packages/berlin/src/pages/Events.tsx +++ b/packages/berlin/src/pages/Events.tsx @@ -1,5 +1,4 @@ // React and third-party libraries -import { useMemo, useState } from 'react'; import { useQuery } from '@tanstack/react-query'; // API @@ -11,11 +10,9 @@ import useUser from '../hooks/useUser'; // Components import { FlexColumn } from '../components/containers/FlexColumn.styled'; import { Title } from '../components/typography/Title.styled'; -import * as Tabs from '../components/tabs'; import EventsCards from '../components/events'; function Events() { - const [activeTab, setActiveTab] = useState('upcoming'); const { user } = useUser(); const { data: events } = useQuery({ queryKey: ['events'], @@ -23,26 +20,13 @@ function Events() { enabled: !!user?.id, }); - const openEvents = useMemo(() => events?.filter((event) => event.status === 'OPEN'), [events]); - const closedEvents = useMemo( - () => events?.filter((events) => events.status === 'CLOSED'), - [events], - ); - - const tabNames = ['upcoming', 'past']; - const tabs = { - upcoming: , - past: , - }; - return (
Events -
- +
);