1import React from 'react';
 2import Card from '@material-ui/core/Card';
 3import CardActions from '@material-ui/core/CardActions';
 4import CardContent from '@material-ui/core/CardContent';
 5import Typography from '@material-ui/core/Typography';
 6import Button from '@material-ui/core/Button';
 7import {useTranslation} from 'react-i18next';
 8export const EventCard = ({event}) => {
 9  const {t} = useTranslation();
10  return (
11    <Card>
12      <CardContent>
13        <Typography gutterBottom variant="h6" component="h3">
14          {event.name}
15        </Typography>
16        <Typography variant="body1">{t('event.fields.starts_on')}</Typography>
17        <Typography variant="body2" gutterBottom>
18          {event.date || t('event.fields.empty')}
19        </Typography>
20        <Typography variant="body1">{t('event.fields.address')}</Typography>
21        <Typography variant="body2" gutterBottom>
22          {event.address || t('event.fields.empty')}
23        </Typography>
24      </CardContent>
25      <CardActions>
26        <Button href={`/e/${event.id}`}>
27          {t('dashboard.actions.see_event')}
28        </Button>
29      </CardActions>
30    </Card>
31  );
32};