From 33733b64a7ffaed5a57a544bdf8e6ff0a0df1ce7 Mon Sep 17 00:00:00 2001
From: David Leek <david@getunleash.io>
Date: Tue, 18 Mar 2025 11:13:23 +0100
Subject: [PATCH] chore: fix missing primary routes for commandbar (#9557)

---
 .../src/component/commandBar/CommandBar.tsx   |  6 +++++-
 .../MainLayout/NavigationSidebar/useRoutes.ts |  6 +++++-
 .../__snapshots__/routes.test.tsx.snap        | 20 ++++++++++++++-----
 frontend/src/component/menu/routes.ts         | 13 +++++++-----
 frontend/src/interfaces/route.ts              |  1 +
 5 files changed, 34 insertions(+), 12 deletions(-)

diff --git a/frontend/src/component/commandBar/CommandBar.tsx b/frontend/src/component/commandBar/CommandBar.tsx
index e77f5223dc..0319465fa1 100644
--- a/frontend/src/component/commandBar/CommandBar.tsx
+++ b/frontend/src/component/commandBar/CommandBar.tsx
@@ -126,7 +126,11 @@ export const CommandBar = () => {
     const [value, setValue] = useState<string>('');
     const { routes } = useRoutes();
     const allRoutes: Record<string, IPageRouteInfo> = {};
-    for (const route of [...routes.mainNavRoutes, ...routes.adminRoutes]) {
+    for (const route of [
+        ...routes.mainNavRoutes,
+        ...routes.adminRoutes,
+        ...routes.primaryRoutes,
+    ]) {
         allRoutes[route.path] = {
             path: route.path,
             route: route.route,
diff --git a/frontend/src/component/layout/MainLayout/NavigationSidebar/useRoutes.ts b/frontend/src/component/layout/MainLayout/NavigationSidebar/useRoutes.ts
index 86c3e807eb..fbbf379864 100644
--- a/frontend/src/component/layout/MainLayout/NavigationSidebar/useRoutes.ts
+++ b/frontend/src/component/layout/MainLayout/NavigationSidebar/useRoutes.ts
@@ -1,5 +1,5 @@
 import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
-import { getNavRoutes } from 'component/menu/routes';
+import { getNavRoutes, getPrimaryRoutes } from 'component/menu/routes';
 import { useAdminRoutes } from 'component/admin/useAdminRoutes';
 import { filterByConfig, mapRouteLink } from 'component/common/util';
 
@@ -7,12 +7,16 @@ export const useRoutes = () => {
     const { uiConfig } = useUiConfig();
     const routes = getNavRoutes();
     const adminRoutes = useAdminRoutes();
+    const primaryRoutes = getPrimaryRoutes();
 
     const filteredMainRoutes = {
         mainNavRoutes: routes
             .filter(filterByConfig(uiConfig))
             .map(mapRouteLink),
         adminRoutes,
+        primaryRoutes: primaryRoutes
+            .filter(filterByConfig(uiConfig))
+            .map(mapRouteLink),
     };
 
     return { routes: filteredMainRoutes };
diff --git a/frontend/src/component/menu/__tests__/__snapshots__/routes.test.tsx.snap b/frontend/src/component/menu/__tests__/__snapshots__/routes.test.tsx.snap
index 4c105b262a..6dd1646738 100644
--- a/frontend/src/component/menu/__tests__/__snapshots__/routes.test.tsx.snap
+++ b/frontend/src/component/menu/__tests__/__snapshots__/routes.test.tsx.snap
@@ -12,7 +12,9 @@ exports[`returns all baseRoutes 1`] = `
   },
   {
     "component": [Function],
-    "menu": {},
+    "menu": {
+      "primary": true,
+    },
     "path": "/personal",
     "title": "Dashboard",
     "type": "protected",
@@ -90,7 +92,9 @@ exports[`returns all baseRoutes 1`] = `
   },
   {
     "component": [Function],
-    "menu": {},
+    "menu": {
+      "primary": true,
+    },
     "path": "/projects",
     "title": "Projects",
     "type": "protected",
@@ -104,7 +108,9 @@ exports[`returns all baseRoutes 1`] = `
   },
   {
     "component": [Function],
-    "menu": {},
+    "menu": {
+      "primary": true,
+    },
     "path": "/search",
     "title": "Search",
     "type": "protected",
@@ -119,7 +125,9 @@ exports[`returns all baseRoutes 1`] = `
       },
     },
     "hidden": false,
-    "menu": {},
+    "menu": {
+      "primary": true,
+    },
     "path": "/playground",
     "title": "Playground",
     "type": "protected",
@@ -127,7 +135,9 @@ exports[`returns all baseRoutes 1`] = `
   {
     "component": [Function],
     "enterprise": true,
-    "menu": {},
+    "menu": {
+      "primary": true,
+    },
     "path": "/insights",
     "title": "Insights",
     "type": "protected",
diff --git a/frontend/src/component/menu/routes.ts b/frontend/src/component/menu/routes.ts
index 500137d928..956f76bbae 100644
--- a/frontend/src/component/menu/routes.ts
+++ b/frontend/src/component/menu/routes.ts
@@ -68,7 +68,7 @@ export const routes: IRoute[] = [
         title: 'Dashboard',
         component: PersonalDashboard,
         type: 'protected',
-        menu: {},
+        menu: { primary: true },
     },
 
     // Project
@@ -127,7 +127,7 @@ export const routes: IRoute[] = [
         title: 'Projects',
         component: ProjectList,
         type: 'protected',
-        menu: {},
+        menu: { primary: true },
     },
     {
         path: '/projects-archive',
@@ -143,7 +143,7 @@ export const routes: IRoute[] = [
         title: 'Search',
         component: FeatureToggleListTable,
         type: 'protected',
-        menu: {},
+        menu: { primary: true },
     },
 
     // Playground
@@ -153,7 +153,7 @@ export const routes: IRoute[] = [
         component: LazyPlayground,
         hidden: false,
         type: 'protected',
-        menu: {},
+        menu: { primary: true },
     },
 
     // Insights
@@ -162,7 +162,7 @@ export const routes: IRoute[] = [
         title: 'Insights',
         component: Insights,
         type: 'protected',
-        menu: {},
+        menu: { primary: true },
         enterprise: true,
     },
 
@@ -536,3 +536,6 @@ export const baseRoutes = routes.filter((route) => !route.hidden);
 export const getNavRoutes = () => {
     return getCondensedRoutes(baseRoutes.filter((route) => route.menu.main));
 };
+export const getPrimaryRoutes = () => {
+    return getCondensedRoutes(baseRoutes.filter((route) => route.menu.primary));
+};
diff --git a/frontend/src/interfaces/route.ts b/frontend/src/interfaces/route.ts
index 4189a0af57..3a11df64f5 100644
--- a/frontend/src/interfaces/route.ts
+++ b/frontend/src/interfaces/route.ts
@@ -30,6 +30,7 @@ export interface INavigationMenuItem {
 
 interface IRouteMenu {
     main?: boolean;
+    primary?: boolean;
     adminSettings?: boolean;
     mode?: Array<'pro' | 'enterprise'>;
     billing?: boolean;