feat(web): add custom 500 error page

Author: Manuel Proß

web/src/app/error/500/page.tsx

@@ -0,0 +1,3 @@
+export default function Custom500() {
+	return <h1 className="h1">500 - Internal server error</h1>;
+}

web/src/app/not-found.tsx

@@ -0,0 +1,12 @@
+import Link from "next/link";
+
+export default function NotFound() {
+	return (
+		<div>
+			<h1 className="h1">Resource not found!</h1>
+			<Link className="link" href="/">
+				Return Home
+			</Link>
+		</div>
+	);
+}

web/src/app/page.tsx

@@ -3,11 +3,17 @@ import useSWR from "swr";
 import Hero from "@/components/Strapi/Sections/HeroSection";
 import PageContent from "@/components/Strapi/Sections/Content";
 import { PageAttributes, Routes } from "@/types/strapi";
+import Error from "next/error";
+import { redirect } from "next/navigation";
 
 const fetcher = (url: string) => fetch(url).then(res => res.json() as Promise<PageAttributes>);
 
 export default function Home() {
-	const { data } = useSWR(`/api/${Routes.homepage}`, fetcher);
+	const { data, error } = useSWR<PageAttributes, Error>(`/api/${Routes.homepage}`, fetcher);
+
+	if (error) {
+		redirect("/error/500");
+	}
 
 	return (
 		<main className="pb-12">