import {makeStyles} from '@material-ui/core/styles';
import Grid from '@material-ui/core/Grid';
import {useTranslation} from 'react-i18next';
import EventCard from './EventCard';
import Section from './Section';
const DashboardEvents = ({
futureEvents = [],
noDateEvents = [],
pastEvents = [],
}) => {
const {t} = useTranslation();
const classes = useStyles();
return (
{futureEvents.length > 0 && (
<>
{t('dashboard.sections.future', {
count: futureEvents.length,
})}
{cardsForEvents(futureEvents)}
>
)}
{noDateEvents.length > 0 && (
<>
{t('dashboard.sections.noDate', {
count: noDateEvents.length,
})}
{cardsForEvents(noDateEvents)}
>
)}
{pastEvents.length > 0 && (
<>
{t('dashboard.sections.past', {count: pastEvents.length})}
{cardsForEvents(pastEvents)}
>
)}
);
};
const cardsForEvents = events =>
events.map(event => (
));
const useStyles = makeStyles(theme => ({
root: {
flexGrow: 1,
width: '100%',
maxWidth: '90rem',
margin: '0 auto',
paddingBottom: theme.spacing(10),
},
}));
export default DashboardEvents;