From 899aefd8517c5f6a5bc621a7697dfc244b95c9a7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Sun, 11 Aug 2024 13:25:41 -0500
Subject: [PATCH] feat: 404 page and redirects

---
 src/app/not-found.tsx | 44 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 44 insertions(+)
 create mode 100644 src/app/not-found.tsx

diff --git a/src/app/not-found.tsx b/src/app/not-found.tsx
new file mode 100644
index 000000000..36ef4abd1
--- /dev/null
+++ b/src/app/not-found.tsx
@@ -0,0 +1,44 @@
+'use client';
+
+import { DiscordLogoIcon, HomeIcon } from '@radix-ui/react-icons';
+import { Button, Flex, Heading, Text } from '@radix-ui/themes';
+import Link from 'next/link';
+import { redirect, usePathname } from 'next/navigation';
+import PageWrapper from '../components/PageWrapper';
+
+const redirects = new Map([
+  ['/tools/ratings', '/tools/rating'],
+  ['/tools/tank-performance', '/tools/performance'],
+]);
+
+export default function Page() {
+  const pathname = usePathname();
+
+  redirects.forEach((to, from) => {
+    if (pathname.startsWith(from)) {
+      redirect(to);
+    }
+  });
+
+  return (
+    <PageWrapper>
+      <Flex direction="column" justify="center" align="center" flexGrow="1">
+        <Heading>404: page not found</Heading>
+        <Text color="gray">Where would you like to go?</Text>
+
+        <Flex mt="4" gap="2">
+          <Link href="/">
+            <Button>
+              <HomeIcon /> Home
+            </Button>
+          </Link>
+          <Link href="https://discord.gg/nDt7AjGJQH">
+            <Button variant="outline">
+              <DiscordLogoIcon /> Discord
+            </Button>
+          </Link>
+        </Flex>
+      </Flex>
+    </PageWrapper>
+  );
+}