viewable archived games

client/src/app/archive/[id]/not-found.tsx

@@ -0,0 +1,8 @@
+export default function NotFound() {
+  return (
+    <div className="flex flex-col items-center justify-center gap-4">
+      <div className="text-2xl font-bold">Error 404</div>
+      <div className="text-xl">Not found</div>
+    </div>
+  );
+}

client/src/app/archive/[id]/page.tsx

@@ -0,0 +1,45 @@
+import ArchivedGame from "@/components/archive/ArchivedGame";
+import { getArchivedGame } from "@/lib/game";
+import type { Game } from "@chessu/types";
+import { notFound } from "next/navigation";
+
+export async function generateMetadata({ params }: { params: { id: number } }) {
+  const game = (await getArchivedGame({ id: params.id })) as Game | undefined;
+  if (!game) {
+    return {
+      description: "Game not found",
+      robots: {
+        index: false,
+        follow: false,
+        nocache: true,
+        noarchive: true
+      }
+    };
+  }
+  return {
+    description: `Archived game: ${game.white?.name} vs ${game.black?.name}`,
+    openGraph: {
+      title: "chessu",
+      description: `Archived game: ${game.white?.name} vs ${game.black?.name}`,
+      url: `https://ches.su/archive/${game.id}`,
+      siteName: "chessu",
+      locale: "en_US",
+      type: "website"
+    },
+    robots: {
+      index: false,
+      follow: false,
+      nocache: true,
+      noarchive: true
+    }
+  };
+}
+
+export default async function Game({ params }: { params: { id: number } }) {
+  const game = (await getArchivedGame({ id: params.id })) as Game | undefined;
+  if (!game) {
+    notFound();
+  }
+
+  return <ArchivedGame game={game} />;
+}