import { Link } from "@repo/ui/design/Link"
import { MainLayout } from "@repo/ui/MainLayout"
import { useTranslations } from "next-intl"
/**
* Note that `app/[locale]/[...rest]/page.tsx` is necessary for this page to render.
*/
const NotFound: React.FC = () => {
const t = useTranslations()
return (
<MainLayout className="items-center justify-center text-center">
<h1 className="text-3xl font-semibold">
{t("errors.error")} 404 - {t("errors.not-found")}
</h1>
<p className="mb-4 mt-2">
{t("errors.page-doesnt-exist")}{" "}
<Link href="/">{t("errors.return-to-home-page")}</Link>
</p>
</MainLayout>
)
}
export default NotFound
