import Page from 'components/Page';
import React from 'react';
import { useHistory } from 'react-router-dom';

import { Button, Typography } from '@material-ui/core';

const NotFound = () => {
  const { push } = useHistory();
  return (
    <Page>
      <Typography variant="h1" component="h2" align="center">
        404
      </Typography>
      <Typography variant="subtitle1" color="textSecondary" align="center">
        The page you've tried to access does not exist or has moved
        <br />
        <Button onClick={() => push('/')} color="primary">
          Go To Home Page
        </Button>
      </Typography>
    </Page>
  );
};

export default NotFound;