feat react: add egg routes filtering

resources/scripts/api/server/getServer.ts

@@ -3,91 +3,94 @@ import { rawDataToServerAllocation, rawDataToServerEggVariable } from '@/api/tra
 import { ServerEggVariable, ServerStatus } from '@/api/server/types';
 
 export interface Allocation {
-    id: number;
-    ip: string;
-    alias: string | null;
-    port: number;
-    notes: string | null;
-    isDefault: boolean;
+  id: number;
+  ip: string;
+  alias: string | null;
+  port: number;
+  notes: string | null;
+  isDefault: boolean;
 }
 
 export interface Server {
-    id: string;
-    internalId: number | string;
-    uuid: string;
-    name: string;
-    node: string;
-    isNodeUnderMaintenance: boolean;
-    status: ServerStatus;
-    sftpDetails: {
-        ip: string;
-        port: number;
-    };
-    invocation: string;
-    dockerImage: string;
-    description: string;
-    limits: {
-        memory: number;
-        swap: number;
-        disk: number;
-        io: number;
-        cpu: number;
-        threads: string;
-    };
-    eggFeatures: string[];
-    featureLimits: {
-        databases: number;
-        allocations: number;
-        backups: number;
-    };
-    isTransferring: boolean;
-    variables: ServerEggVariable[];
-    allocations: Allocation[];
-    
-    BlueprintFramework: {
-        eggId: number;
-    };
+  id: string;
+  internalId: number | string;
+  uuid: string;
+  name: string;
+  node: string;
+  isNodeUnderMaintenance: boolean;
+  status: ServerStatus;
+  sftpDetails: {
+    ip: string;
+    port: number;
+  };
+  invocation: string;
+  dockerImage: string;
+  description: string;
+  limits: {
+    memory: number;
+    swap: number;
+    disk: number;
+    io: number;
+    cpu: number;
+    threads: string;
+  };
+  eggFeatures: string[];
+  featureLimits: {
+    databases: number;
+    allocations: number;
+    backups: number;
+  };
+  isTransferring: boolean;
+  variables: ServerEggVariable[];
+  allocations: Allocation[];
+
+  BlueprintFramework: {
+    eggId: number;
+  };
 }
 
 export const rawDataToServerObject = ({ attributes: data }: FractalResponseData): Server => ({
-    id: data.identifier,
-    internalId: data.internal_id,
-    uuid: data.uuid,
-    name: data.name,
-    node: data.node,
-    isNodeUnderMaintenance: data.is_node_under_maintenance,
-    status: data.status,
-    invocation: data.invocation,
-    dockerImage: data.docker_image,
-    sftpDetails: {
-        ip: data.sftp_details.ip,
-        port: data.sftp_details.port,
-    },
-    description: data.description ? (data.description.length > 0 ? data.description : null) : null,
-    limits: { ...data.limits },
-    eggFeatures: data.egg_features || [],
-    featureLimits: { ...data.feature_limits },
-    isTransferring: data.is_transferring,
-    variables: ((data.relationships?.variables as FractalResponseList | undefined)?.data || []).map(
-        rawDataToServerEggVariable
-    ),
-    allocations: ((data.relationships?.allocations as FractalResponseList | undefined)?.data || []).map(
-        rawDataToServerAllocation
-    ),
+  id: data.identifier,
+  internalId: data.internal_id,
+  uuid: data.uuid,
+  name: data.name,
+  node: data.node,
+  isNodeUnderMaintenance: data.is_node_under_maintenance,
+  status: data.status,
+  invocation: data.invocation,
+  dockerImage: data.docker_image,
+  sftpDetails: {
+    ip: data.sftp_details.ip,
+    port: data.sftp_details.port,
+  },
+  description: data.description ? (data.description.length > 0 ? data.description : null) : null,
+  limits: { ...data.limits },
+  eggFeatures: data.egg_features || [],
+  featureLimits: { ...data.feature_limits },
+  isTransferring: data.is_transferring,
+  variables: ((data.relationships?.variables as FractalResponseList | undefined)?.data || []).map(
+    rawDataToServerEggVariable
+  ),
+  allocations: ((data.relationships?.allocations as FractalResponseList | undefined)?.data || []).map(
+    rawDataToServerAllocation
+  ),
 
-    BlueprintFramework: { ...data.BlueprintFramework }
+  BlueprintFramework: {
+    eggId: data.BlueprintFramework.egg_id,
+  },
 });
 
 export default (uuid: string): Promise<[Server, string[]]> => {
-    return new Promise((resolve, reject) => {
-        http.get(`/api/client/servers/${uuid}`)
-            .then(({ data }) =>
-                resolve([
-                    rawDataToServerObject(data),
-                    // eslint-disable-next-line camelcase
-                    data.meta?.is_server_owner ? ['*'] : data.meta?.user_permissions || [],
-                ])
-            )
-            .catch(reject);
-    });
+  return new Promise((resolve, reject) => {
+    http
+      .get(`/api/client/servers/${uuid}`)
+      .then(({ data }) =>
+        resolve([
+          rawDataToServerObject(data),
+          // eslint-disable-next-line camelcase
+          data.meta?.is_server_owner ? ['*'] : data.meta?.user_permissions || [],
+        ])
+      )
+      .catch(reject);
+  });
 };

resources/scripts/blueprint/extends/routers/ServerRouter.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
 import { NavLink, Route, Switch, useRouteMatch } from 'react-router-dom';
 import TransitionRouter from '@/TransitionRouter';
 import PermissionRoute from '@/components/elements/PermissionRoute';
@@ -12,6 +12,30 @@ import { ServerContext } from '@/state/server';
 import routes from '@/routers/routes';
 import blueprintRoutes from './routes';
 
+const blueprintExtensions = [...new Set(blueprintRoutes.server.map((route) => route.identifier))];
+
+/**
+ * Get the route egg IDs for each extension with server routes.
+ */
+const useExtensionEggs = () => {
+  const [extensionEggs, setExtensionEggs] = useState<{ [x: string]: string[] }>(
+    blueprintExtensions.reduce((prev, current) => ({ ...prev, [current]: ['-1'] }), {})
+  );
+
+  useEffect(() => {
+    (async () => {
+      const newEggs: { [x: string]: string[] } = {};
+      for (const id of blueprintExtensions) {
+        const resp = await fetch(`/api/client/extensions/blueprint/eggs?${new URLSearchParams({ id })}`);
+        newEggs[id] = (await resp.json()) as string[];
+      }
+      setExtensionEggs(newEggs);
+    })();
+  }, []);
+
+  return extensionEggs;
+};
+
 export const NavigationLinks = () => {
   const rootAdmin = useStoreState((state) => state.user.data!.rootAdmin);
   const serverEgg = ServerContext.useStoreState((state) => state.server.data?.BlueprintFramework.eggId);
@@ -22,10 +46,11 @@ export const NavigationLinks = () => {
     }
     return `${(url ? match.url : match.path).replace(/\/*$/, '')}/${value.replace(/^\/+/, '')}`;
   };
+  const extensionEggs = useExtensionEggs();
+  console.log(serverEgg);
 
   return (
     <>
-
       {/* Pterodactyl routes */}
       {routes.server
         .filter((route) => !!route.name)
@@ -41,29 +66,31 @@ export const NavigationLinks = () => {
               {route.name}
             </NavLink>
           )
-        )
-      }
+        )}
 
       {/* Blueprint routes */}
-      {blueprintRoutes.server.length > 0 && blueprintRoutes.server
-        .filter((route) => !!route.name)
-        .filter((route) => route.adminOnly ? rootAdmin : true)
-        .filter((route) => route.eggs && serverEgg ? route.eggs.includes(serverEgg) : true )
-        .map((route) =>
-          route.permission ? (
-            <Can key={route.path} action={route.permission} matchAny>
-              <NavLink to={to(route.path, true)} exact={route.exact}>
+      {blueprintRoutes.server.length > 0 &&
+        blueprintRoutes.server
+          .filter((route) => !!route.name)
+          .filter((route) => (route.adminOnly ? rootAdmin : true))
+          .filter((route) =>
+            extensionEggs[route.identifier].includes('-1')
+              ? true
+              : extensionEggs[route.identifier].find((id) => id === serverEgg?.toString())
+          )
+          .map((route) =>
+            route.permission ? (
+              <Can key={route.path} action={route.permission} matchAny>
+                <NavLink to={to(route.path, true)} exact={route.exact}>
+                  {route.name}
+                </NavLink>
+              </Can>
+            ) : (
+              <NavLink key={route.path} to={to(route.path, true)} exact={route.exact}>
                 {route.name}
               </NavLink>
-            </Can>
-          ) : (
-            <NavLink key={route.path} to={to(route.path, true)} exact={route.exact}>
-              {route.name}
-            </NavLink>
-          )
-        )
-      }
-
+            )
+          )}
     </>
   );
 };
@@ -78,13 +105,13 @@ export const NavigationRouter = () => {
     }
     return `${(url ? match.url : match.path).replace(/\/*$/, '')}/${value.replace(/^\/+/, '')}`;
   };
+  const extensionEggs = useExtensionEggs();
 
   const location = useLocation();
   return (
     <>
       <TransitionRouter>
         <Switch location={location}>
-
           {/* Pterodactyl routes */}
           {routes.server.map(({ path, permission, component: Component }) => (
             <PermissionRoute key={path} permission={permission} path={to(path)} exact>
@@ -95,21 +122,25 @@ export const NavigationRouter = () => {
           ))}
 
           {/* Blueprint routes */}
-          {blueprintRoutes.server.length > 0 && blueprintRoutes.server
-            .filter((route) => route.adminOnly ? rootAdmin : true)
-            .filter((route) => route.eggs && serverEgg ? route.eggs.includes(serverEgg) : true )
-            .map(({ path, permission, component: Component }) => (
-              <PermissionRoute key={path} permission={permission} path={to(path)} exact>
-                <Spinner.Suspense>
-                  <Component />
-                </Spinner.Suspense>
-              </PermissionRoute>
-            ))
-          }
+          {blueprintRoutes.server.length > 0 &&
+            blueprintRoutes.server
+              .filter((route) => (route.adminOnly ? rootAdmin : true))
+              .filter((route) =>
+                extensionEggs[route.identifier].includes('-1')
+                  ? true
+                  : extensionEggs[route.identifier].find((id) => id === serverEgg?.toString())
+              )
+              .map(({ path, permission, component: Component }) => (
+                <PermissionRoute key={path} permission={permission} path={to(path)} exact>
+                  <Spinner.Suspense>
+                    <Component />
+                  </Spinner.Suspense>
+                </PermissionRoute>
+              ))}
 
           <Route path={'*'} component={NotFound} />
         </Switch>
       </TransitionRouter>
     </>
   );
-};
+};

resources/scripts/blueprint/extends/routers/routes.ts

@@ -2,7 +2,7 @@ import React from 'react';
 
 /* blueprint/import */
 
-interface RouteDefinition { 
+interface RouteDefinition {
   path: string;
   name: string | undefined;
   component: React.ComponentType;
@@ -12,7 +12,6 @@ interface RouteDefinition {
 }
 interface ServerRouteDefinition extends RouteDefinition {
   permission: string | string[] | null;
-  eggs?: number[];
 }
 interface Routes {
   account: RouteDefinition[];
@@ -26,4 +25,4 @@ export default {
   server: [
     /* routes/server */
   ],
-} as Routes;
+} as Routes;