1import List from '@material-ui/core/List';
 2import ListItem from '@material-ui/core/ListItem';
 3import {makeStyles} from '@material-ui/core/styles';
 4import Passenger from './Passenger';
 5import {PassengerEntity} from '../../generated/graphql';
 6
 7interface Props {
 8  passengers: PassengerEntity[];
 9  Button: ({
10    onClick,
11    disabled,
12  }: {
13    onClick: () => void;
14    disabled?: boolean;
15  }) => JSX.Element;
16  disabled?: boolean;
17  isTravel?: boolean;
18  places?: number;
19  onPress?: (passengerId: string) => void;
20  onClick?: (passengerId: string) => void;
21}
22
23const PassengersList = (props: Props) => {
24  const {passengers, places, Button, onClick, onPress, disabled, isTravel} =
25    props;
26  const classes = useStyles();
27  let list = passengers;
28
29  if (places) {
30    const emptyList = [...Array(places)];
31    list = Array.isArray(passengers)
32      ? emptyList.map((u, index) => passengers[index])
33      : emptyList;
34  }
35
36  return (
37    <div className={classes.container}>
38      <List disablePadding>
39        {!!list &&
40          list.map((passenger, index) => (
41            <ListItem
42              className={classes.passenger}
43              key={index}
44              disabled={disabled}
45              button={!!onPress}
46              onClick={() => !!onPress && onPress(passenger.id)}
47            >
48              <Passenger
49                key={index}
50                passenger={passenger}
51                isTravel={isTravel}
52                button={
53                  <Button
54                    onClick={() => onClick && onClick(passenger.id)}
55                    disabled={disabled}
56                  />
57                }
58              />
59            </ListItem>
60          ))}
61      </List>
62    </div>
63  );
64};
65
66const useStyles = makeStyles(theme => ({
67  container: {
68    padding: theme.spacing(0, 0, 1, 0),
69  },
70  passenger: {
71    paddingRight: theme.spacing(12),
72  },
73}));
74
75export default PassengersList;