From 6aba8d29ea19d996f0f9561a82c44dbbda183c20 Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Wed, 25 Jan 2023 22:29:57 -0800
Subject: [PATCH] Set content based on URL

---
 next.config.js  |  8 ++++++++
 pages/about.tsx | 34 +++++++++++++++++++++++-----------
 2 files changed, 31 insertions(+), 11 deletions(-)

diff --git a/next.config.js b/next.config.js
index 24e220ba..c268ed51 100644
--- a/next.config.js
+++ b/next.config.js
@@ -27,6 +27,14 @@ module.exports = {
         source: '/weapons',
         destination: '/new',
       },
+      {
+        source: '/updates',
+        destination: '/about',
+      },
+      {
+        source: '/roadmap',
+        destination: '/about',
+      },
       {
         source: '/p/:shortcode/characters',
         destination: '/p/:shortcode',
diff --git a/pages/about.tsx b/pages/about.tsx
index e698eba5..9b0ac9f6 100644
--- a/pages/about.tsx
+++ b/pages/about.tsx
@@ -29,25 +29,37 @@ const AboutRoute: React.FC<Props> = (props: Props) => {
 
   const [currentTab, setCurrentTab] = useState<AboutTabs>(AboutTabs.About)
 
-  function handleTabClicked(event: React.ChangeEvent<HTMLInputElement>) {
-    const path = [
-      router.asPath.split('/').filter((el) => el != '')[1],
-      event.target.value,
-    ].join('/')
+  useEffect(() => {
+    const parts = router.asPath.split('/')
+    const tab = parts[parts.length - 1]
 
-    // TODO: Decide if we want /about/changlog or /changelog
-    // TODO: Then, set up Next.js rewrites
-    switch (event.target.value) {
+    switch (tab) {
       case 'about':
-        // router.replace(path)
         setCurrentTab(AboutTabs.About)
         break
       case 'updates':
-        // router.replace(path)
         setCurrentTab(AboutTabs.Updates)
         break
       case 'roadmap':
-        // router.replace(path)
+        setCurrentTab(AboutTabs.Roadmap)
+        break
+    }
+  }, [router.asPath])
+
+  function handleTabClicked(event: React.ChangeEvent<HTMLInputElement>) {
+    const path = `/${event.target.value}`
+
+    switch (event.target.value) {
+      case 'about':
+        router.replace(path)
+        setCurrentTab(AboutTabs.About)
+        break
+      case 'updates':
+        router.replace(path)
+        setCurrentTab(AboutTabs.Updates)
+        break
+      case 'roadmap':
+        router.replace(path)
         setCurrentTab(AboutTabs.Roadmap)
         break
       default: