all repos — caroster @ 943931a5ccd92069bfad1e8b2e4310b237797bc6

[Octree] Group carpool to your event https://caroster.io

app/src/containers/Car/index.js (view raw)

 1import React, {useReducer} from 'react';
 2import {makeStyles} from '@material-ui/core/styles';
 3import Divider from '@material-ui/core/Divider';
 4import Paper from '@material-ui/core/Paper';
 5import {useTranslation} from 'react-i18next';
 6import {useStrapi} from 'strapi-react-context';
 7import {useEvent} from '../../contexts/Event';
 8import {useToast} from '../../contexts/Toast';
 9import useProfile from '../../hooks/useProfile';
10import PassengersList from '../PassengersList';
11import HeaderEditing from './HeaderEditing';
12import Header from './Header';
13
14const Car = ({car}) => {
15  const classes = useStyles();
16  const {t} = useTranslation();
17  const strapi = useStrapi();
18  const {event} = useEvent();
19  const {addEvent} = useProfile();
20  const {addToast} = useToast();
21  const [isEditing, toggleEditing] = useReducer(i => !i, false);
22
23  if (!car) return null;
24
25  const addPassenger = async passenger => {
26    try {
27      await strapi.services.cars.update(car.id, {
28        passengers: [...(car.passengers || []), passenger],
29      });
30      addEvent(event);
31    } catch (error) {
32      console.error(error);
33    }
34  };
35
36  const removePassenger = async idx => {
37    if (car?.passengers) {
38      try {
39        await strapi.services.events.update(event.id, {
40          waiting_list: [...(event.waiting_list || []), car.passengers[idx]],
41        });
42        await strapi.services.cars.update(car.id, {
43          passengers: car.passengers.filter((_, i) => i !== idx),
44        });
45      } catch (error) {
46        console.error(error);
47        addToast(t('car.errors.cant_remove_passenger'));
48      }
49    }
50  };
51
52  return (
53    <Paper className={classes.root}>
54      {isEditing ? (
55        <HeaderEditing car={car} toggleEditing={toggleEditing} />
56      ) : (
57        <Header car={car} toggleEditing={toggleEditing} />
58      )}
59      <Divider />
60      {!isEditing && (
61        <PassengersList
62          passengers={car.passengers}
63          places={car.seats}
64          addPassenger={addPassenger}
65          onClick={removePassenger}
66          icon="close"
67        />
68      )}
69    </Paper>
70  );
71};
72
73const useStyles = makeStyles(theme => ({
74  root: {
75    position: 'relative',
76  },
77}));
78
79export default Car;