From 34bb453009353f659dfc8068c9666306f18648a2 Mon Sep 17 00:00:00 2001
From: Tianyi LIANG <tianyi@igem.org>
Date: Fri, 17 May 2024 22:52:09 +0800
Subject: [PATCH] refactor: MODIFY definition in pages.ts

---
 src/components/Navbar/index.tsx | 12 ++++++-----
 src/containers/App/App.tsx      |  2 +-
 src/pages.ts                    | 14 ++++++-------
 src/utils/getPathMapping.ts     | 37 +++++++++++++++++----------------
 src/utils/useDocumentTitle.ts   |  4 ++--
 5 files changed, 36 insertions(+), 33 deletions(-)

diff --git a/src/components/Navbar/index.tsx b/src/components/Navbar/index.tsx
index 1cd7253..afa72e9 100644
--- a/src/components/Navbar/index.tsx
+++ b/src/components/Navbar/index.tsx
@@ -11,11 +11,13 @@ function ExampleNavbar() {
     if ("folder" in page && page.folder) {
       const folder = [];
       for (const subpage of page.folder) {
-        folder.push(
-          <NavDropdown.Item as={Link} to={subpage.path} target="_blank">
-            {subpage.name}
-          </NavDropdown.Item>,
-        );
+        if ("path" in subpage && subpage.path) {
+          folder.push(
+            <NavDropdown.Item as={Link} to={subpage.path} target="_blank">
+              {subpage.name}
+            </NavDropdown.Item>,
+          );
+        }
       }
       pages.push(
         <NavDropdown title={page.name} id="basic-nav-dropdown">
diff --git a/src/containers/App/App.tsx b/src/containers/App/App.tsx
index a05f9ea..7e0b2b3 100644
--- a/src/containers/App/App.tsx
+++ b/src/containers/App/App.tsx
@@ -52,7 +52,7 @@ const App = () => {
             <Route
               key={path}
               path={path}
-              element={<Header title={title} lead={lead} />}
+              element={<Header title={title || ""} lead={lead || ""} />}
             />
           );
         })}
diff --git a/src/pages.ts b/src/pages.ts
index 71a8116..e425ee3 100644
--- a/src/pages.ts
+++ b/src/pages.ts
@@ -1,17 +1,17 @@
 interface Base {
-  name: string;
+  name: string | undefined;
 }
 
 class Folder implements Base {
-  name!: string;
-  folder!: Page[];
+  name: string | undefined;
+  folder: Page[] | undefined;
 }
 
 class Page implements Base {
-  name!: string;
-  title!: string;
-  path!: string;
-  lead?: string;
+  name: string | undefined;
+  title: string | undefined;
+  path: string | undefined;
+  lead: string | undefined;
 }
 
 const Pages: (Page | Folder)[] = [
diff --git a/src/utils/getPathMapping.ts b/src/utils/getPathMapping.ts
index ad228b6..b8ea3ce 100644
--- a/src/utils/getPathMapping.ts
+++ b/src/utils/getPathMapping.ts
@@ -1,27 +1,28 @@
 import pages from "../pages.ts";
 
 const getPathMapping = () => {
-  const map: {
-    [key: string]: { name: string; title: string; lead: string };
-  } = {};
-  pages.forEach((item) => {
-    if ("folder" in item && item.folder) {
+  return pages.reduce<{
+    [key: string]: {
+      name: string | undefined;
+      title: string | undefined;
+      lead: string | undefined;
+    };
+  }>((map, item) => {
+    if ("path" in item && item.path) {
+      map[item.path] = { name: item.name, title: item.title, lead: item.lead };
+    } else if ("folder" in item && item.folder) {
       item.folder.forEach((page) => {
-        map[page.path] = {
-          name: page.name,
-          title: page.title,
-          lead: page.lead || "",
-        };
+        if (page.path) {
+          map[page.path] = {
+            name: page.name,
+            title: page.title,
+            lead: page.lead,
+          };
+        }
       });
-    } else if ("path" in item && item.path) {
-      map[item.path] = {
-        name: item.name,
-        title: item.title,
-        lead: item.lead || "",
-      };
     }
-  });
-  return map;
+    return map;
+  }, {});
 };
 
 export default getPathMapping;
diff --git a/src/utils/useDocumentTitle.ts b/src/utils/useDocumentTitle.ts
index 5d25982..94d85aa 100644
--- a/src/utils/useDocumentTitle.ts
+++ b/src/utils/useDocumentTitle.ts
@@ -1,8 +1,8 @@
 import { useEffect } from "react";
 
-function useDocumentTitle(title: string) {
+function useDocumentTitle(title: any) {
   useEffect(() => {
-    document.title = `${title} | ${import.meta.env.VITE_TEAM_NAME} - iGEM ${import.meta.env.VITE_TEAM_YEAR}`;
+    document.title = `${title || ""} | ${import.meta.env.VITE_TEAM_NAME} - iGEM ${import.meta.env.VITE_TEAM_YEAR}`;
   }, [title]);
 }
 
-- 
GitLab