Replace URL generation with slug property for ListPage

vicr123 · Jan 23, 2024 · 8ed4bba · 8ed4bba
1 parent 30c9f67
commit 8ed4bba
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 7 deletions.
diff --git a/Parlance/ClientApp/src/components/ListPage.tsx b/Parlance/ClientApp/src/components/ListPage.tsx
@@ -6,29 +6,27 @@ import {useTranslation} from "react-i18next";
 
 interface ListPageItemObject {
     name: string,
+    slug: string,
     render: ReactNode
     default?: boolean
 }
 
 type ListPageItem = ListPageItemObject | string;
 
-function toUrl(name: string) {
-    return name.toLowerCase().replace(" ", "-")
-}
-
 function ListItem(props: {
     name: string
+    slug: string
     default?: boolean
 }) {
     const navigate = useNavigate();
     const location = useLocation();
 
     const switchPage = () => {
-        navigate(toUrl(props.name));
+        navigate(props.slug);
     };
 
     let styles = [Styles.listItem, Styles.listItemClickable]
-    if (location.pathname.includes(toUrl(props.name))) {
+    if (location.pathname.includes(props.slug)) {
         styles.push(Styles.selected);
     }
 
@@ -78,7 +76,7 @@ export default function ListPage({items}: {
         </Route>
         <Route element={<ListPageInner items={items} isLeftPane={false} />}>
             {(items.filter(item => typeof (item) === "object") as ListPageItemObject[]).flatMap((item, index) => {
-                const routes = [<Route key={index} path={`/${toUrl(item.name)}/*`} element={item.render}/>]
+                const routes = [<Route key={index} path={`/${item.slug}/*`} element={item.render}/>]
                 if (item.default) routes.push(<Route key={"default"} path={`/*`} element={item.render}/>)
                 return routes;
             })}

diff --git a/Parlance/ClientApp/src/pages/Administration/index.js b/Parlance/ClientApp/src/pages/Administration/index.js
@@ -16,24 +16,29 @@ export default function(props) {
         t("PROJECTS"),
         {
             name: t("PROJECTS"),
+            slug: "projects",
             render: <Projects />
         },
         {
             name: t("GLOSSARIES"),
+            slug: "glossaries",
             render: <Glossaries />
         },
         t("SSH"),
         {
             name: t("SSH_KEYS"),
+            slug: "ssh-keys",
             render: <SSH />
         },
         t("USERS_AND_PERMISSIONS"),
         {
             name: t("SUPERUSERS"),
+            slug: "superusers",
             render: <Superusers />
         },
         {
             name: t("LOCALES"),
+            slug: "locales",
             render: <Locales />
         }
     ];

diff --git a/Parlance/ClientApp/src/pages/Projects/Subprojects/Languages/Translation/Dashboard.tsx b/Parlance/ClientApp/src/pages/Projects/Subprojects/Languages/Translation/Dashboard.tsx
@@ -33,15 +33,18 @@ export default function Dashboard() {
         t("DASHBOARD"),
         {
             name: t("OVERVIEW"),
+            slug: "overview",
             render: <Overview data={data}/>,
             default: true
         },
         {
             name: t("GLOSSARIES"),
+            slug: "glossaries",
             render: <GlossariesDashboard />
         },
         {
             name: t("COMMENTS"),
+            slug: "comments",
             render: <CommentsDashboard />
         }
     ];