feat: 404 page and redirects

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>
+  );
+}