feat: add 404 page

app/src/locales.ts

@@ -16,6 +16,8 @@ interface Translations {
   relatedContent: string;
   committee: string;
   commission: string;
+  error404: string;
+  error404desc: string;
 }
 
 type OptionsOperators = {
@@ -30,6 +32,8 @@ const translations: { [key in Locale]: Translations & OptionsOperators } = {
     relatedContent: "related content",
     committee: "committee",
     commission: "commission",
+    error404: "error 404",
+    error404desc: "this page does not exist!",
     capitalize: (s) => s.replace(/^(\s*\w)/, (s) => s.toUpperCase()),
     plural: (s) => s + "s",
   },
@@ -40,6 +44,8 @@ const translations: { [key in Locale]: Translations & OptionsOperators } = {
     relatedContent: "contenu lié",
     committee: "comité",
     commission: "commission",
+    error404: "erreur 404",
+    error404desc: "cette page n'existe pas!",
     capitalize: (s) => s.replace(/^(\s*\w)/, (s) => s.toUpperCase()),
     plural: (s) => (s.endsWith("u") ? s + "x" : s + "s"),
   },

app/src/pages/404.tsx

@@ -0,0 +1,26 @@
+import Button from "@/components/Button";
+import { locale, translate } from "@/locales";
+import { useRouter } from "next/router";
+
+export default function NotFound() {
+  const router = useRouter();
+  return (
+    <>
+      <div className="text">
+        <h1 className="title">
+          {translate("error404", locale(router), {
+            capitalize: true,
+            plural: false,
+          })}
+        </h1>
+        <h4>
+          {translate("error404desc", locale(router), {
+            capitalize: true,
+            plural: false,
+          })}
+        </h4>
+        <Button text="Home" link="/" size="large" />
+      </div>
+    </>
+  );
+}