Bed 4812 (#970)

* wip: new posture api * chore: cleanup trends client api * chore: bump doodle * refactor: standard SortOrder * chore: install new modules * chore: add new colors * chore: add license back * fix: undo formatting changes * fix: PostureFindingTrend to match spec * chore: remove severity_label * chore: change trends API endpoint and response type
SpecterOps · Nov 26, 2024 · 6f7f4ca · 6f7f4ca
1 parent 48f6949
commit 6f7f4ca
Show file tree

Hide file tree

Showing 7 changed files with 40 additions and 28 deletions.
diff --git a/cmd/ui/src/styles/constants.ts b/cmd/ui/src/styles/constants.ts
@@ -26,5 +26,7 @@ export const colors = {
     red: '#e52d2d',
     green: '#03b603',
     softRed: '#FF7E79',
+    softRed2: '#E15851',
     softGreen: '#A8D08D',
+    softGreen2: '#02C577',
 };
diff --git a/packages/javascript/bh-shared-ui/src/components/SSOProviderTable/SSOProviderTable.test.tsx b/packages/javascript/bh-shared-ui/src/components/SSOProviderTable/SSOProviderTable.test.tsx
@@ -17,6 +17,7 @@
 import userEvent from '@testing-library/user-event';
 import { OIDCProviderInfo, SAMLProviderInfo, SSOProvider } from 'js-client-library';
 import { render, screen } from '../../test-utils';
+import { SortOrder } from '../../utils';
 import SSOProviderTable from './SSOProviderTable';
 
 const samlProvider: SSOProvider = {
@@ -66,7 +67,7 @@ describe('SSOProviderTable', () => {
 
     it('should sort by type', async () => {
         const user = userEvent.setup();
-        let typeSortOrder: 'asc' | 'desc' | undefined;
+        let typeSortOrder: SortOrder;
         const onToggleTypeSortOrder = () => {
             if (!typeSortOrder || typeSortOrder === 'desc') {
                 typeSortOrder = 'asc';

diff --git a/packages/javascript/bh-shared-ui/src/components/SSOProviderTable/SSOProviderTable.tsx b/packages/javascript/bh-shared-ui/src/components/SSOProviderTable/SSOProviderTable.tsx
@@ -14,30 +14,31 @@
 //
 // SPDX-License-Identifier: Apache-2.0
 
+import { Button } from '@bloodhoundenterprise/doodleui';
+import { faEllipsisVertical, faTrash } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import {
-    Skeleton,
+    IconButton,
+    ListItemIcon,
+    ListItemText,
+    Menu,
+    MenuItem,
+    MenuProps,
     Paper,
+    Skeleton,
     Table,
     TableBody,
     TableCell,
     TableContainer,
     TableHead,
     TableRow,
     TableSortLabel,
-    IconButton,
-    ListItemIcon,
-    ListItemText,
-    Menu,
-    MenuItem,
-    MenuProps,
     useTheme,
 } from '@mui/material';
-import { Button } from '@bloodhoundenterprise/doodleui';
-import { faEllipsisVertical, faTrash } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import withStyles from '@mui/styles/withStyles';
-import { FC, useState, MouseEventHandler } from 'react';
 import { SSOProvider } from 'js-client-library';
+import { FC, MouseEventHandler, useState } from 'react';
+import { SortOrder } from '../../utils';
 
 const StyledMenu = withStyles({
     paper: {
@@ -107,7 +108,7 @@ const SSOProviderTable: FC<{
     onDeleteSSOProvider: (ssoProviderId: SSOProvider['id']) => void;
     onClickSSOProvider: (ssoProviderId: SSOProvider['id']) => void;
     onToggleTypeSortOrder: () => void;
-    typeSortOrder?: 'asc' | 'desc';
+    typeSortOrder?: SortOrder;
 }> = ({ ssoProviders, loading, onDeleteSSOProvider, onClickSSOProvider, typeSortOrder, onToggleTypeSortOrder }) => {
     const theme = useTheme();
     return (

diff --git a/packages/javascript/bh-shared-ui/src/utils/types.ts b/packages/javascript/bh-shared-ui/src/utils/types.ts
@@ -20,3 +20,7 @@ export type DeepPartial<T> = T extends object
           [P in keyof T]?: DeepPartial<T[P]>;
       }
     : T;
+
+export type SortOrder = 'asc' | 'desc' | undefined;
+
+export type ValueOf<T> = T[keyof T];
diff --git a/packages/javascript/bh-shared-ui/src/views/SSOConfiguration/SSOConfiguration.tsx b/packages/javascript/bh-shared-ui/src/views/SSOConfiguration/SSOConfiguration.tsx
@@ -14,26 +14,26 @@
 //
 // SPDX-License-Identifier: Apache-2.0
 
-import { useState, FC, useMemo, ChangeEvent } from 'react';
 import { faSearch } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { Box, Grid, Typography, Paper, TextField, useTheme } from '@mui/material';
-import { useMutation, useQuery } from 'react-query';
+import { Box, Grid, Paper, TextField, Typography, useTheme } from '@mui/material';
 import { CreateOIDCProviderRequest, SSOProvider } from 'js-client-library';
-import { apiClient } from '../../utils';
+import { ChangeEvent, FC, useMemo, useState } from 'react';
+import { useMutation, useQuery } from 'react-query';
 import {
+    ConfirmationDialog,
+    CreateMenu,
     CreateSAMLProviderDialog,
     CreateSAMLProviderFormInputs,
-    CreateMenu,
-    ConfirmationDialog,
     DocumentationLinks,
-    SSOProviderTable,
     PageWithTitle,
     SSOProviderInfoPanel,
+    SSOProviderTable,
 } from '../../components';
 import CreateOIDCProviderDialog from '../../components/CreateOIDCProviderDialog';
 import { useFeatureFlag } from '../../hooks';
 import { useNotifications } from '../../providers';
+import { SortOrder, apiClient } from '../../utils';
 
 const SSOConfiguration: FC = () => {
     /* Hooks */
@@ -46,7 +46,7 @@ const SSOConfiguration: FC = () => {
     const [dialogOpen, setDialogOpen] = useState<'SAML' | 'OIDC' | 'DELETE' | ''>('');
     const [nameFilter, setNameFilter] = useState<string>('');
     const [createProviderError, setCreateProviderError] = useState<string>('');
-    const [typeSortOrder, setTypeSortOrder] = useState<'asc' | 'desc' | undefined>();
+    const [typeSortOrder, setTypeSortOrder] = useState<SortOrder>();
 
     const listSSOProvidersQuery = useQuery(['listSSOProviders'], ({ signal }) =>
         apiClient.listSSOProviders({ signal }).then((res) => res.data.data)

diff --git a/packages/javascript/js-client-library/src/client.ts b/packages/javascript/js-client-library/src/client.ts
@@ -30,9 +30,9 @@ import {
     ListFileIngestJobsResponse,
     ListFileTypesForIngestResponse,
     PaginatedResponse,
-    PostureResponse,
     PostureFindingTrendsResponse,
     PostureHistoryResponse,
+    PostureResponse,
     SavedQuery,
     StartFileIngestResponse,
     UpdateConfigurationResponse,
@@ -287,7 +287,7 @@ class BHEAPIClient {
         options?: types.RequestOptions
     ) => {
         return this.baseClient.get<PostureFindingTrendsResponse>(
-            `/api/v2/finding-trends/${environmentId}`,
+            `/api/v2/domains/${environmentId}/finding-trends`,
             Object.assign(
                 {
                     start: start?.toISOString(),

diff --git a/packages/javascript/js-client-library/src/responses.ts b/packages/javascript/js-client-library/src/responses.ts
@@ -101,14 +101,18 @@ type PostureStat = TimestampFields & {
 export type PostureResponse = PaginatedResponse<PostureStat[]>;
 
 type PostureFindingTrend = {
+    environment_id: string;
     finding: string;
-    start_count: number;
-    end_count: number;
-    severity: number;
-    severity_label: string;
+    finding_count_start: number;
+    finding_count_end: number;
+    composite_risk: number;
 };
 
-export type PostureFindingTrendsResponse = { findings: PostureFindingTrend[]; total_start: number; total_end: number };
+export type PostureFindingTrendsResponse = TimeWindowedResponse<{
+    findings: PostureFindingTrend[];
+    total_finding_count_start: number;
+    total_finding_count_end: number;
+}>;
 
 type PostureHistoryAggregatedData = {
     date: string;