Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 | 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x | import { Typography } from "@material-ui/core"; import HtmlMeta from "components/HtmlMeta"; import StyledLink from "components/StyledLink"; import { useAuthContext } from "features/auth/AuthProvider"; import { Trans, useTranslation } from "i18n"; import { GLOBAL } from "i18n/namespaces"; import { useEffect, useState } from "react"; import Graphic from "resources/404graphic.png"; import { baseRoute, dashboardRoute } from "routes"; import makeStyles from "utils/makeStyles"; const useStyles = makeStyles((theme) => ({ graphic: { height: "50%", width: "50%", margin: theme.spacing(8, 0), }, root: { display: "flex", flexDirection: "column", alignItems: "center", }, })); export default function NotFoundPage() { const { t } = useTranslation(GLOBAL); const classes = useStyles(); const { authState: { authenticated }, } = useAuthContext(); const [isMounted, setIsMounted] = useState(false); useEffect(() => setIsMounted(true), []); return ( <> <HtmlMeta title={t("not_found_text_1")} /> <div className={classes.root}> <img src={Graphic.src} alt={t("not_found_alt")} className={classes.graphic} /> <Typography>{t("not_found_text_1")}</Typography> <Typography> <Trans t={t} i18nKey="not_found_text_2"> Do you just want to <StyledLink href={!authenticated || !isMounted ? baseRoute : dashboardRoute} > go home? </StyledLink> </Trans> </Typography> </div> </> ); } |