diff --git a/packages/berlin/src/components/cycles/Cycles.tsx b/packages/berlin/src/components/cycles/Cycles.tsx index 926b5f9f..2da49123 100644 --- a/packages/berlin/src/components/cycles/Cycles.tsx +++ b/packages/berlin/src/components/cycles/Cycles.tsx @@ -1,14 +1,20 @@ import { GetCycleResponse } from 'api'; import { Body } from '../typography/Body.styled'; import { useNavigate } from 'react-router-dom'; +import { CalendarX2 } from 'lucide-react'; +import Button from '../button'; type CyclesProps = { cycles: GetCycleResponse[] | undefined; - errorMessage: string; eventId: string | undefined; + fallback: { + message: string; + buttonMessage: string; + buttonOnClick: () => void; + }; }; -function Cycles({ cycles, errorMessage, eventId }: CyclesProps) { +function Cycles({ cycles, eventId, fallback }: CyclesProps) { const navigate = useNavigate(); const formatDate = (date: string) => { @@ -34,7 +40,11 @@ function Cycles({ cycles, errorMessage, eventId }: CyclesProps) { )) ) : ( - {errorMessage} +
+ + {fallback.message} + +
)} ); diff --git a/packages/berlin/src/pages/Event.tsx b/packages/berlin/src/pages/Event.tsx index 7f9fb6b5..7846f9af 100644 --- a/packages/berlin/src/pages/Event.tsx +++ b/packages/berlin/src/pages/Event.tsx @@ -48,8 +48,28 @@ function Event() { const [activeTab, setActiveTab] = useState('upcoming'); const tabs = { - upcoming: , - past: , + upcoming: ( + setActiveTab('past'), + }} + /> + ), + past: ( + setActiveTab('upcoming'), + }} + /> + ), }; return (