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