1import React from 'react';
 2import ListItemAvatar from '@material-ui/core/ListItemAvatar';
 3import ListItemIcon from '@material-ui/core/ListItemIcon';
 4import ListItemText from '@material-ui/core/ListItemText';
 5import Icon from '@material-ui/core/Icon';
 6import {makeStyles} from '@material-ui/core/styles';
 7import {useTranslation} from 'react-i18next';
 8
 9const Passenger = ({passenger, button}) => {
10  const {t} = useTranslation();
11  const classes = useStyles();
12
13  return !!passenger ? (
14    <>
15      <ListItemText primary={passenger} />
16      {button}
17    </>
18  ) : (
19    <>
20      <ListItemAvatar>
21        <ListItemIcon color="disabled">
22          <Icon>person</Icon>
23        </ListItemIcon>
24      </ListItemAvatar>
25      <ListItemText
26        classes={{
27          root: classes.empty,
28        }}
29        primary={t('car.passengers.empty')}
30      />
31    </>
32  );
33};
34
35const useStyles = makeStyles(theme => ({
36  empty: {
37    color: theme.palette.text.secondary,
38  },
39}));
40
41export default Passenger;