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';
 6
 7interface Props {
 8  label: string;
 9  events: object[];
10}
11
12const Section = (props: Props) => {
13  const {label, events} = props;
14  return (
15    <Box mb={8}>
16      <Typography gutterBottom variant="h6" component="h3">
17        {label}
18      </Typography>
19      <Grid container spacing={4}>
20        {events.map(event => (
21          <Grid item xs={12} md={3} lg={4} key={event.id}>
22            <EventCard event={event} />
23          </Grid>
24        ))}
25      </Grid>
26    </Box>
27  );
28};
29
30export default Section;