import { Box, Button, Center, Heading, Text } from '@chakra-ui/react';
import { MdControlCamera } from 'react-icons/md';

import { PageLayoutInfoCenter } from '@/components/Layout/PageLayoutInfoCenter';
import { TopBar } from '@/components/TopBar/TopBar';

export const Error401 = () => {
  return (
    <>
      <TopBar />
      <PageLayoutInfoCenter padding="25px">
        <Center>
          <MdControlCamera size="250px" color="red.600" />
        </Center>
        <Box textAlign="center">
          <Heading>Erreur 401</Heading>
          <Text color="red.600">
            Vous n'êtes pas autorisé a accéder a ce contenu.
          </Text>
          <Button as="a" variant="link" href="/">
            Retour à l'accueil
          </Button>
        </Box>
      </PageLayoutInfoCenter>
    </>
  );
};
