import { Box, Divider, Grid, Link, Typography } from '@mui/material';
import { FC } from 'react';
import { useTranslation } from 'react-i18next';

const Footer: FC = () => {
  const { t } = useTranslation();

  return (
    <Box
      sx={{
        marginTop: 2,
        display: 'flex',
        justifyContent: 'center',
      }}
    >
      <Box sx={{ maxWidth: '800px', flexGrow: 1 }}>
        <Grid container spacing={2}>
          <Grid item xs={12} sx={{ height: '50px' }} />
          <Grid item xs={12}>
            <Divider />
          </Grid>
          <Grid item xs={12} sx={{ display: 'flex', justifyContent: 'center' }}>
            <Link href="https://www.flaticon.com/free-icons/guests-book" title="guests book icons">
              <Typography variant="caption">{t('Favicon')}</Typography>
            </Link>
          </Grid>
          <Grid item xs={12} sx={{ display: 'flex', justifyContent: 'center' }}>
            <Typography variant="caption">© 2024 Kilian Kurt Hofmann | Build {__APP_VERSION__}</Typography>
          </Grid>
        </Grid>
      </Box>
    </Box>
  );
};

export default Footer;

/*



*/
