Add admin and custom tabs back and make it configurable (#969)

Signed-off-by: Aaron Chong <aaronchongth@gmail.com>
open-rmf · Jul 31, 2024 · c92f2ba · c92f2ba
1 parent 6d0bc87
commit c92f2ba
Show file tree

Hide file tree

Showing 4 changed files with 74 additions and 3 deletions.
diff --git a/packages/dashboard/app-config.json b/packages/dashboard/app-config.json
@@ -33,5 +33,7 @@
       }
     }
   },
+  "customTabs": false,
+  "adminTab": false,
   "cartIds": []
 }
diff --git a/packages/dashboard/src/app-config.ts b/packages/dashboard/src/app-config.ts
@@ -57,6 +57,8 @@ export interface AppConfig {
   defaultMapLevel: string;
   allowedTasks: TaskResource[];
   resources: Record<string, Resources> & Record<'default', Resources>;
+  customTabs: boolean;
+  adminTab: boolean;
   // FIXME(koonpeng): this is used for very specific tasks, should be removed when mission
   // system is implemented.
   cartIds: string[];

diff --git a/packages/dashboard/src/components/app.tsx b/packages/dashboard/src/components/app.tsx
@@ -7,7 +7,16 @@ import 'react-grid-layout/css/styles.css';
 import { Navigate, Route, Routes } from 'react-router-dom';
 import { LoginPage, PrivateRoute } from 'rmf-auth';
 import { AppConfigContext, AuthenticatorContext, ResourcesContext } from '../app-config';
-import { DashboardRoute, LoginRoute, RobotsRoute, TasksRoute } from '../util/url';
+import {
+  AdminRoute,
+  CustomRoute1,
+  CustomRoute2,
+  DashboardRoute,
+  LoginRoute,
+  RobotsRoute,
+  TasksRoute,
+} from '../util/url';
+import { AdminRouter } from './admin';
 import { AppBase } from './app-base';
 import { SettingsContext } from './app-contexts';
 import { AppEvents } from './app-events';
@@ -16,7 +25,7 @@ import { dashboardWorkspace } from './dashboard';
 import { RmfApp } from './rmf-app';
 import { robotsWorkspace } from './robots/robots-workspace';
 import { tasksWorkspace } from './tasks/tasks-workspace';
-import { Workspace } from './workspace';
+import { ManagedWorkspace, Workspace } from './workspace';
 
 export default function App(): JSX.Element | null {
   const authenticator = React.useContext(AuthenticatorContext);
@@ -84,6 +93,33 @@ export default function App(): JSX.Element | null {
                   </PrivateRoute>
                 }
               />
+
+              <Route
+                path={CustomRoute1}
+                element={
+                  <PrivateRoute unauthorizedComponent={loginRedirect} user={user}>
+                    <ManagedWorkspace key="custom1" workspaceId="custom1" />
+                  </PrivateRoute>
+                }
+              />
+
+              <Route
+                path={CustomRoute2}
+                element={
+                  <PrivateRoute unauthorizedComponent={loginRedirect} user={user}>
+                    <ManagedWorkspace key="custom2" workspaceId="custom2" />
+                  </PrivateRoute>
+                }
+              />
+
+              <Route
+                path={AdminRoute}
+                element={
+                  <PrivateRoute unauthorizedComponent={loginRedirect} user={user}>
+                    <AdminRouter />
+                  </PrivateRoute>
+                }
+              />
             </Routes>
           </AppBase>
         </RmfApp>

diff --git a/packages/dashboard/src/components/appbar.tsx b/packages/dashboard/src/components/appbar.tsx
@@ -59,7 +59,14 @@ import {
 } from '../app-config';
 import { useCreateTaskFormData } from '../hooks/useCreateTaskForm';
 import useGetUsername from '../hooks/useFetchUser';
-import { DashboardRoute, RobotsRoute, TasksRoute } from '../util/url';
+import {
+  AdminRoute,
+  CustomRoute1,
+  CustomRoute2,
+  DashboardRoute,
+  RobotsRoute,
+  TasksRoute,
+} from '../util/url';
 import { AppControllerContext, SettingsContext } from './app-contexts';
 import { AppEvents } from './app-events';
 import { RmfAppContext } from './rmf-app';
@@ -336,6 +343,30 @@ export const AppBar = React.memo(({ extraToolbarItems }: AppBarProps): React.Rea
             aria-label="Tasks"
             onTabClick={() => navigate(TasksRoute)}
           />
+          {appConfig.customTabs && (
+            <>
+              <StyledAppBarTab
+                label="Custom 1"
+                value="custom1"
+                aria-label="Custom 1"
+                onTabClick={() => navigate(CustomRoute1)}
+              />
+              <StyledAppBarTab
+                label="Custom 2"
+                value="custom2"
+                aria-label="Custom 2"
+                onTabClick={() => navigate(CustomRoute2)}
+              />
+            </>
+          )}
+          {appConfig.adminTab && profile?.user.is_admin && (
+            <StyledAppBarTab
+              label="Admin"
+              value="admin"
+              aria-label="Admin"
+              onTabClick={() => navigate(AdminRoute)}
+            />
+          )}
         </NavigationBar>
         <Toolbar variant="dense" sx={{ textAlign: 'right', flexGrow: -1 }}>
           <StyledAppBarButton