feat(ThreatPacks): Add threat packs and mitigation packs support

awslabs · Jul 9, 2024 · 13be704 · 13be704
1 parent 61022ac
commit 13be704
Show file tree

Hide file tree

Showing 22 changed files with 3,505 additions and 229 deletions.
diff --git a/.projen/tasks.json b/.projen/tasks.json
diff --git a/package.json b/package.json
diff --git a/packages/threat-composer-app/src/containers/AppLayout/index.tsx b/packages/threat-composer-app/src/containers/AppLayout/index.tsx
@@ -15,7 +15,6 @@
  ******************************************************************************************************************** */
 import {
   DEFAULT_WORKSPACE_ID,
-  useGlobalSetupContext,
 } from '@aws/threat-composer';
 import { SideNavigationProps } from '@cloudscape-design/components/side-navigation';
 import { FC, PropsWithChildren, useMemo } from 'react';
@@ -46,12 +45,6 @@ const AppLayout: FC<PropsWithChildren<{}>> = ({
   const notifications = useNotifications();
   const [searchParams] = useSearchParams();
 
-  const { features } = useGlobalSetupContext();
-
-  const isThreatPackFeatureOn = useMemo(() => {
-    return features.includes('threatPacks');
-  }, [features]);
-
   const navigationItems: SideNavigationProps.Item[] = useMemo(() => {
     const navItems: SideNavigationProps.Item[] = [
       {
@@ -95,8 +88,6 @@ const AppLayout: FC<PropsWithChildren<{}>> = ({
         href: generateUrl(ROUTE_VIEW_THREAT_MODEL_PATH, searchParams, workspaceId),
         type: 'link',
       },
-    ];
-    return isThreatPackFeatureOn ? navItems.concat([
       { type: 'divider' },
       {
         type: 'section',
@@ -114,9 +105,10 @@ const AppLayout: FC<PropsWithChildren<{}>> = ({
           },
         ],
       },
-    ]) : navItems;
+    ];
 
-  }, [searchParams, workspaceId, isThreatPackFeatureOn]);
+    return navItems;
+  }, [searchParams, workspaceId]);
 
   return (<AppLayoutComponent
     title='threat-composer'

diff --git a/...threat-composer/src/components/workspaces/MitigationPack/components/GeneralInfo/index.tsx b/...threat-composer/src/components/workspaces/MitigationPack/components/GeneralInfo/index.tsx
@@ -14,7 +14,6 @@
   limitations under the License.
  ******************************************************************************************************************** */
 import Container from '@cloudscape-design/components/container';
-import Header from '@cloudscape-design/components/header';
 import { FC } from 'react';
 import { MitigationPack } from '../../../../../customTypes';
 
@@ -25,15 +24,7 @@ export interface GeneralInfoProps {
 const GeneralInfo: FC<GeneralInfoProps> = ({
   mitigationPack,
 }) => {
-  return (<Container
-    header={
-      <Header
-        variant="h2"
-      >
-        Mitigation Pack - {mitigationPack.name}
-      </Header>
-    }
-  >
+  return (<Container>
     {mitigationPack.description}
   </Container>);
 };

diff --git a/packages/threat-composer/src/components/workspaces/MitigationPack/index.tsx b/packages/threat-composer/src/components/workspaces/MitigationPack/index.tsx
@@ -14,6 +14,8 @@
   limitations under the License.
  ******************************************************************************************************************** */
 import Button from '@cloudscape-design/components/button';
+import ContentLayout from '@cloudscape-design/components/content-layout';
+import Header from '@cloudscape-design/components/header';
 import SpaceBetween from '@cloudscape-design/components/space-between';
 import { useMemo, FC, useCallback, useState } from 'react';
 import GeneralInfo from './components/GeneralInfo';
@@ -92,18 +94,24 @@ const MitigationPack: FC<MitigationPackProp> = ({
     return null;
   }
 
-  return (<SpaceBetween direction='vertical' size='s'>
-    <GeneralInfo mitigationPack={mitigationPack} />
-    <Table
-      columnDefinitions={colDef}
-      actions={actions}
-      header="Mitigations"
-      items={mitigationPack.mitigations || []}
-      wrapLines={true}
-      isItemDisabled={isItemDisabled}
-      selectedItems={totalSelectedItems}
-      onSelectionChange={({ detail }) => setSelectedItems([...detail.selectedItems])}
-    /></SpaceBetween>);
+  return (<ContentLayout header={
+    <Header
+      variant="h2"
+    >
+      Mitigation Pack - {mitigationPack.name}
+    </Header>
+  }><SpaceBetween direction='vertical' size='s'>
+      <GeneralInfo mitigationPack={mitigationPack} />
+      <Table
+        columnDefinitions={colDef}
+        actions={actions}
+        header="Mitigations"
+        items={mitigationPack.mitigations || []}
+        wrapLines={true}
+        isItemDisabled={isItemDisabled}
+        selectedItems={totalSelectedItems}
+        onSelectionChange={({ detail }) => setSelectedItems([...detail.selectedItems])}
+      /></SpaceBetween></ContentLayout>);
 };
 
 export default MitigationPack;
diff --git a/...hreat-composer/src/components/workspaces/MitigationPacks/components/GeneralInfo/index.tsx b/...hreat-composer/src/components/workspaces/MitigationPacks/components/GeneralInfo/index.tsx
diff --git a/packages/threat-composer/src/components/workspaces/MitigationPacks/index.tsx b/packages/threat-composer/src/components/workspaces/MitigationPacks/index.tsx
@@ -15,13 +15,15 @@
  ******************************************************************************************************************** */
 import Box from '@cloudscape-design/components/box';
 import Button from '@cloudscape-design/components/button';
+import ContentLayout from '@cloudscape-design/components/content-layout';
+import Header from '@cloudscape-design/components/header';
 import SpaceBetween from '@cloudscape-design/components/space-between';
 import { FC, useMemo } from 'react';
-import GeneralInfo from './components/GeneralInfo';
 import { useMitigationPacksContext } from '../../../contexts/MitigationPacksContext';
 import { MitigationPack } from '../../../customTypes/referencePacks';
 import Table, { ColumnDefinition } from '../../generic/Table';
 
+
 export interface MitigationPacksProps {
   onMitigationPackLinkClicked?: (id: string) => void;
 }
@@ -34,7 +36,7 @@ const MitigationPacks: FC<MitigationPacksProps> = ({
   const colDef: ColumnDefinition<MitigationPack>[] = useMemo(() => [
     {
       id: 'id',
-      minWidth: 100,
+      minWidth: 150,
       header: 'Id',
       cell: (data) => (<Button variant="inline-link" onClick={() => onMitigationPackLinkClicked?.(data.id)}>
         {data.id}
@@ -68,16 +70,21 @@ const MitigationPacks: FC<MitigationPacksProps> = ({
     },
   ], [mitigationPackUsage, onMitigationPackLinkClicked]);
 
-  return (<SpaceBetween direction='vertical' size='s'>
-    <GeneralInfo />
-    <Table
-      columnDefinitions={colDef}
-      header="Mitigation packs"
-      items={mitigationPacks}
-      disableRowSelect={true}
-      wrapLines={true}
-
-    /></SpaceBetween>);
+  return (<ContentLayout header={<Header
+    variant="h2"
+    description="Allow you to quickly find and add bulk or selected mitigation candidates to your current workspace"
+    counter={`(${mitigationPacks.length})`}
+  >
+    Mitigation Packs
+  </Header>}>
+    <SpaceBetween direction='vertical' size='s'>
+      <Table
+        columnDefinitions={colDef}
+        items={mitigationPacks}
+        disableRowSelect={true}
+        wrapLines={true}
+      /></SpaceBetween>
+  </ContentLayout>);
 };
 
 export default MitigationPacks;
diff --git a/...ges/threat-composer/src/components/workspaces/ThreatPack/components/GeneralInfo/index.tsx b/...ges/threat-composer/src/components/workspaces/ThreatPack/components/GeneralInfo/index.tsx
@@ -14,7 +14,6 @@
   limitations under the License.
  ******************************************************************************************************************** */
 import Container from '@cloudscape-design/components/container';
-import Header from '@cloudscape-design/components/header';
 import { FC } from 'react';
 import { ThreatPack } from '../../../../../customTypes';
 
@@ -25,15 +24,7 @@ export interface GeneralInfoProps {
 const GeneralInfo: FC<GeneralInfoProps> = ({
   threatPack,
 }) => {
-  return (<Container
-    header={
-      <Header
-        variant="h2"
-      >
-        Threat Pack - {threatPack.name}
-      </Header>
-    }
-  >
+  return (<Container>
     {threatPack.description}
   </Container>);
 };

diff --git a/packages/threat-composer/src/components/workspaces/ThreatPack/index.tsx b/packages/threat-composer/src/components/workspaces/ThreatPack/index.tsx
@@ -14,6 +14,8 @@
   limitations under the License.
  ******************************************************************************************************************** */
 import Button from '@cloudscape-design/components/button';
+import ContentLayout from '@cloudscape-design/components/content-layout';
+import Header from '@cloudscape-design/components/header';
 import SpaceBetween from '@cloudscape-design/components/space-between';
 import TextContent from '@cloudscape-design/components/text-content';
 import { useMemo, FC, useCallback, useState } from 'react';
@@ -137,18 +139,28 @@ const ThreatPack: FC<ThreatPackProp> = ({
     return null;
   }
 
-  return (<SpaceBetween direction='vertical' size='s'>
-    <GeneralInfo threatPack={threatPack} />
-    <Table
-      columnDefinitions={colDef}
-      actions={actions}
-      header="Threats"
-      items={threatPack.threats || []}
-      wrapLines={true}
-      isItemDisabled={isItemDisabled}
-      selectedItems={totalSelectedItems}
-      onSelectionChange={({ detail }) => setSelectedItems([...detail.selectedItems])}
-    /></SpaceBetween>);
+  return (<ContentLayout
+    header={
+      <Header
+        variant="h2"
+      >
+        Threat Pack - {threatPack.name}
+      </Header>
+    }
+  >
+    <SpaceBetween direction='vertical' size='s'>
+      <GeneralInfo threatPack={threatPack} />
+      <Table
+        columnDefinitions={colDef}
+        actions={actions}
+        header="Threats"
+        items={threatPack.threats || []}
+        wrapLines={true}
+        isItemDisabled={isItemDisabled}
+        selectedItems={totalSelectedItems}
+        onSelectionChange={({ detail }) => setSelectedItems([...detail.selectedItems])}
+      /></SpaceBetween>
+  </ContentLayout>);
 };
 
 export default ThreatPack;
diff --git a/...es/threat-composer/src/components/workspaces/ThreatPacks/components/GeneralInfo/index.tsx b/...es/threat-composer/src/components/workspaces/ThreatPacks/components/GeneralInfo/index.tsx