text: import React from "react"
  import Grid from "@material-ui/core/Grid"
  import DateRangeIcon from "@material-ui/icons/DateRange"
  import styled from 'styled-components'
  import { makeStyles } from '@material-ui/core/styles';
  
  const Dates = styled.div`
    font-size: 12px;
  `
  
  const useStyles = makeStyles({
    icon: {
      fontSize: '14px',
      marginRight: '4px',
    }
  })
  
  function DateRange({ start, end }) {
    const classes = useStyles()
    return (
      <>
        <Grid item>
          <DateRangeIcon color='action' className={classes.icon}></DateRangeIcon>
        </Grid>
        <Grid item>
          <Dates>
            {start} - {end}
          </Dates>
        </Grid>
      </>
    )
  }
  
  export default DateRange
  