frontend/containers/EventBar/LinkedEventSwitch.tsx (view raw)
1import {Button, ButtonGroup} from '@mui/material';
2import {useTranslation} from 'react-i18next';
3import useEventStore from '../../stores/useEventStore';
4import Link from 'next/link';
5import {useRouter} from 'next/router';
6
7type Props = {};
8
9const LinkedEventSwitch = (props: Props) => {
10 const {t} = useTranslation();
11 const router = useRouter();
12 const loadedEvent = useEventStore(s => s.event);
13 const linkedEvent = loadedEvent?.linkedEvent?.data?.attributes;
14
15 if (!loadedEvent || !linkedEvent) return null;
16
17 const goEvent = loadedEvent.isReturnEvent ? linkedEvent : loadedEvent;
18 const returnEvent = loadedEvent.isReturnEvent ? loadedEvent : linkedEvent;
19
20 return (
21 <ButtonGroup variant="contained">
22 <Link href={router.asPath.replace(loadedEvent.uuid, goEvent.uuid)}>
23 <Button
24 color={loadedEvent.isReturnEvent ? 'inherit' : 'secondary'}
25 sx={{color: 'black'}}
26 >
27 {t`event.linked.goEvent`} ({goEvent.travels?.data?.length || 0})
28 </Button>
29 </Link>
30 <Link href={router.asPath.replace(loadedEvent.uuid, returnEvent.uuid)}>
31 <Button
32 color={!loadedEvent.isReturnEvent ? 'inherit' : 'secondary'}
33 sx={{color: 'black'}}
34 >
35 {t`event.linked.returnEvent`} (
36 {returnEvent?.travels?.data?.length || 0})
37 </Button>
38 </Link>
39 </ButtonGroup>
40 );
41};
42
43export default LinkedEventSwitch;