app/src/containers/CarColumns/WaitingList.js (view raw)
1import React from 'react';
2import Typography from '@material-ui/core/Typography';
3import Paper from '@material-ui/core/Paper';
4import {makeStyles} from '@material-ui/core/styles';
5import {useTranslation} from 'react-i18next';
6import {useStrapi} from 'strapi-react-context';
7import {useEvent} from '../../contexts/Event';
8import PassengersList from '../PassengersList';
9import Divider from '@material-ui/core/Divider';
10
11const WaitingList = ({car}) => {
12 const {t} = useTranslation();
13 const {event} = useEvent();
14 const strapi = useStrapi();
15 const classes = useStyles();
16
17 const addPassenger = async passenger => {
18 try {
19 await strapi.services.events.update(event.id, {
20 waiting_list: [...(event.waiting_list || []), passenger],
21 });
22 } catch (error) {
23 console.error(error);
24 }
25 };
26
27 const removePassenger = async idx => {
28 try {
29 await strapi.services.events.update(event.id, {
30 waiting_list: event.waiting_list.filter((_, i) => i !== idx),
31 });
32 } catch (error) {
33 console.error(error);
34 }
35 };
36
37 return (
38 <Paper>
39 <div className={classes.header}>
40 <Typography variant="h5">{t('passenger.title')}</Typography>
41 </div>
42 <Divider />
43 <PassengersList
44 hideEmpty
45 passengers={event.waiting_list}
46 places={50}
47 addPassenger={addPassenger}
48 removePassenger={removePassenger}
49 />
50 </Paper>
51 );
52};
53
54const useStyles = makeStyles(theme => ({
55 header: {padding: theme.spacing(2)},
56}));
57
58export default WaitingList;