import * as React from "react";
import Box from "@mui/material/Box";
import EmailTable from "../../components/tables/EmailTable";
import Button from "@mui/material/Button";
import { useHistory } from "react-router";
import Grid from "@mui/material/Grid";

// Page contains table with emails and buttons for creating and importing new email
function EmailsPage() {
  const history = useHistory();

  return (
    <Box>
      <Grid container mt={5} columnSpacing={4}>
        <Grid item container xs={6} justifyContent="right">
          <Button
            variant="contained"
            onClick={(e) => history.push("emails/create")}
          >
            Add
          </Button>
        </Grid>
        <Grid item container xs={6} justifyContent="left">
          <Button
            variant="contained"
            onClick={(e) => history.push("emails/import")}
          >
            Import
          </Button>
        </Grid>
      </Grid>
      <EmailTable />
    </Box>
  );
}

export default EmailsPage;
