feat: refactor not found page for server component

src/app/_components/not-found-page/home-button.tsx

@@ -1,23 +1,15 @@
-"use client";
-
-import { Home as HomeIcon } from "@mui/icons-material";
 import { Button } from "@mui/material";
-import { useRouter } from "next/navigation";
+import Link from "next/link";
 import { ReactElement } from "react";
 
-export const HomeButton = (): ReactElement => {
-    const { push } = useRouter();
-
-    const handleClick = (): void => {
-        push("/");
-    };
-
-    return (
-        <Button
-            onClick={handleClick}
-            startIcon={<HomeIcon />}
-        >
-            Accueil
-        </Button>
-    );
-};
+import { HomeIcon } from "./home-icon";
+
+export const HomeButton = (): ReactElement => (
+    <Button
+        component={Link}
+        href="/"
+        startIcon={<HomeIcon />}
+    >
+        Accueil
+    </Button>
+);

src/app/_components/not-found-page/home-icon.tsx

@@ -0,0 +1,8 @@
+"use client";
+
+import { Home } from "@mui/icons-material";
+import { ReactElement } from "react";
+
+export const HomeIcon = (): ReactElement => (
+    <Home />
+);

src/components/ad.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { ReactElement, useEffect } from "react";
 
 declare global {

src/components/highlight.tsx

@@ -3,15 +3,15 @@ import { ReactElement } from "react";
 
 import { removeAccents } from "@utils/misc/string";
 
+const massageString = (value: string): string => (
+    removeAccents(value).toLocaleLowerCase()
+);
+
 interface Props {
     word: string;
     highlight: string;
 }
 
-const massageString = (value: string): string => (
-    removeAccents(value).toLocaleLowerCase()
-);
-
 export const Highlight = ({ word, highlight }: Props): ReactElement => {
     const massagedWord: string = massageString(word);
     const massagedHighlight: string = massageString(highlight);