frontend/containers/DashboardEvents/Section.tsx (view raw)
1import React from 'react';
2import Grid from '@material-ui/core/Grid';
3import Typography from '@material-ui/core/Typography';
4import Box from '@material-ui/core/Box';
5import EventCard from './EventCard';
6import { EventEntity } from '../../generated/graphql';
7
8interface Props {
9 label: string;
10 events: EventEntity[];
11}
12
13const Section = (props: Props) => {
14 const {label, events} = props;
15 return (
16 <Box mb={8}>
17 <Typography gutterBottom variant="h6" component="h3">
18 {label}
19 </Typography>
20 <Grid container spacing={4}>
21 {events.map(event => (
22 <Grid item xs={12} md={3} lg={4} key={event.id}>
23 <EventCard event={event} />
24 </Grid>
25 ))}
26 </Grid>
27 </Box>
28 );
29};
30
31export default Section;