From 7c893e60385abdba90182ac78970d25ac3893a69 Mon Sep 17 00:00:00 2001 From: Thomas Date: Fri, 16 Aug 2024 11:55:43 -0400 Subject: [PATCH 01/14] Refactored Top Vuln Bar Layer onClick - onClick now pushes to history a link to the All Vulns table with the domain name included. - Inside the All Vulns table, the domain name is used to filter the table to only show vulnerabilities for that domain. --- frontend/src/pages/Risk/TopVulnerableDomains.tsx | 11 +++++++++-- .../src/pages/Vulnerabilities/Vulnerabilities.tsx | 9 +++++++-- 2 files changed, 16 insertions(+), 4 deletions(-) diff --git a/frontend/src/pages/Risk/TopVulnerableDomains.tsx b/frontend/src/pages/Risk/TopVulnerableDomains.tsx index e00b0f83..72df6881 100644 --- a/frontend/src/pages/Risk/TopVulnerableDomains.tsx +++ b/frontend/src/pages/Risk/TopVulnerableDomains.tsx @@ -71,6 +71,12 @@ const TopVulnerableDomains = (props: { data: Point[] }) => { //Custom Bar Layer to allow for top to bottom tab navigation const CustomBarLayer = ({ bars }: { bars: any[]; [key: string]: any }) => { const reversedBars = [...bars].reverse(); + const filteredVulnTableLink = + '/inventory/vulnerabilities?sort=createdAt&desc=false'; + const filteredVulnTableLinkHandler = ( + filteredVulnTableLink: string, + domain: string + ) => history.push(filteredVulnTableLink, { domain: domain }); return reversedBars.map((bar) => ( { } in Domain:${' '} ${bar.data.indexValue}`} onClick={() => { - history.push( - `/inventory/vulnerabilities?domain=${bar.data.label}&severity=${bar.data.id}` + filteredVulnTableLinkHandler( + filteredVulnTableLink, + bar.data.indexValue ); }} /> diff --git a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx index fe891262..66413d9a 100644 --- a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx +++ b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx @@ -53,6 +53,7 @@ export interface VulnerabilityRow { } interface LocationState { + domain: any; title: string; } @@ -198,7 +199,11 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ const location = useLocation(); const state = location.state as LocationState; const [initialFilters, setInitialFilters] = useState>( - state?.title ? [{ id: 'title', value: state.title }] : [] + state?.title + ? [{ id: 'title', value: state.title }] + : state?.domain + ? [{ id: 'domain', value: state.domain }] + : [] ); const [filters, setFilters] = useState>([]); @@ -460,7 +465,7 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ - Displaying {state.title} vulnerabilities.{' '} + Displaying {state.title || state.domain} vulnerabilities.{' '} From 44d9252eced054a8aebae1c71089025d685dc891 Mon Sep 17 00:00:00 2001 From: Thomas Date: Fri, 16 Aug 2024 12:21:03 -0400 Subject: [PATCH 02/14] Added new filterModel state in All Vulnerabilities - Takes initialFilters and maps it to new the filterModel state. - Allows the table tool bar to display initial filters brought in from Overview page. - Woot! --- .../pages/Vulnerabilities/Vulnerabilities.tsx | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx index 66413d9a..aa2480e3 100644 --- a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx +++ b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx @@ -215,6 +215,14 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ filters: initialFilters ? initialFilters : filters }); + const [filterModel, setFilterModel] = useState( + initialFilters.map((filter) => ({ + field: filter.id, + operatorValue: 'contains', + value: filter.value + })) + ); + const [anchorEl, setAnchorEl] = useState(null); const resetVulnerabilities = useCallback(() => { @@ -461,7 +469,7 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ ]} >

- {initialFilters.length > 0 && ( + {/* {initialFilters.length > 0 && ( @@ -472,7 +480,7 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ - )} + )} */} {isLoading ? ( @@ -510,6 +518,12 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ }); }} filterMode="server" + filterModel={{ + items: filterModel.map((item) => ({ + ...item, + operator: 'contains' + })) + }} onFilterModelChange={(model) => { const filters = model.items.map((item) => ({ id: item.field, From 161dfc01a5cb676204c49d9b59b0d391235e5f7f Mon Sep 17 00:00:00 2001 From: Thomas Date: Fri, 16 Aug 2024 14:27:58 -0400 Subject: [PATCH 03/14] Removed setFilterModel from Vulnerabilities.tsx --- .../pages/Vulnerabilities/Vulnerabilities.tsx | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx index aa2480e3..8e134946 100644 --- a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx +++ b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx @@ -200,9 +200,19 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ const state = location.state as LocationState; const [initialFilters, setInitialFilters] = useState>( state?.title - ? [{ id: 'title', value: state.title }] + ? [ + { + id: 'title', + value: state.title + } + ] : state?.domain - ? [{ id: 'domain', value: state.domain }] + ? [ + { + id: 'domain', + value: state.domain + } + ] : [] ); const [filters, setFilters] = useState>([]); @@ -215,7 +225,7 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ filters: initialFilters ? initialFilters : filters }); - const [filterModel, setFilterModel] = useState( + const [filterModel] = useState( initialFilters.map((filter) => ({ field: filter.id, operatorValue: 'contains', From 5a002178fb73108e6d5701ebec1e727a9854be64 Mon Sep 17 00:00:00 2001 From: Thomas Date: Tue, 20 Aug 2024 14:11:32 -0400 Subject: [PATCH 04/14] Large refactor of All Vulnerabilities table - Removed the old react-table type definitions of Filter and Sort. - Replaced them with MUI GridFilterItem type definitions. - Edited Query type to include a CustomGridFilterItem type. - Moved the Query type into its own file. - Removed SortingRule type from Query type. - Removed Sort from fetchVulnerabilites and searchVulnerabilities functions. - Edited table to use a filter model based in state that now reflects user changes to the filter. - Filter model can now accept initial filters passed in from Location state. - Removed previous Paper div that alerted the user to initial filters being applied and allowed for reset. - These features are now handled by the filter model. --- .../pages/Vulnerabilities/Vulnerabilities.tsx | 81 ++++++++----------- frontend/src/types/index.ts | 9 +-- frontend/src/types/query.ts | 11 +++ 3 files changed, 45 insertions(+), 56 deletions(-) create mode 100644 frontend/src/types/query.ts diff --git a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx index 8e134946..64c7e9b6 100644 --- a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx +++ b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx @@ -1,6 +1,5 @@ import React, { useState, useCallback, useEffect } from 'react'; import { useHistory, useLocation } from 'react-router-dom'; -import { Filters, SortingRule } from 'react-table'; import { Query } from 'types'; import { useAuthContext } from 'context'; import { Vulnerability } from 'types'; @@ -16,7 +15,12 @@ import { Stack, Typography } from '@mui/material'; -import { DataGrid, GridColDef, GridRenderCellParams } from '@mui/x-data-grid'; +import { + DataGrid, + GridColDef, + GridFilterItem, + GridRenderCellParams +} from '@mui/x-data-grid'; import CustomToolbar from 'components/DataGrid/CustomToolbar'; import OpenInNewIcon from '@mui/icons-material/OpenInNew'; import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; @@ -95,14 +99,12 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ const vulnerabilitiesSearch = useCallback( async ({ filters, - sort, page, pageSize = PAGE_SIZE, doExport = false, groupBy = undefined }: { - filters: Filters; - sort: SortingRule[]; + filters: GridFilterItem[]; page: number; pageSize?: number; doExport?: boolean; @@ -116,7 +118,7 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ .reduce( (accum, next) => ({ ...accum, - [next.id]: next.value + [next.field]: next.value }), {} ); @@ -146,8 +148,6 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ { body: { page, - sort: sort[0]?.id ?? 'createdAt', - order: sort[0]?.desc ? 'DESC' : 'ASC', filters: tableFilters, pageSize, groupBy @@ -168,7 +168,6 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ try { const resp = await vulnerabilitiesSearch({ filters: query.filters, - sort: query.sort, page: query.page, pageSize: query.pageSize ?? PAGE_SIZE, groupBy @@ -198,41 +197,42 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ const history = useHistory(); const location = useLocation(); const state = location.state as LocationState; - const [initialFilters, setInitialFilters] = useState>( + const [initialFilters, setInitialFilters] = useState( state?.title ? [ { - id: 'title', - value: state.title + field: 'title', + value: state.title, + operator: 'contains' } ] : state?.domain ? [ { - id: 'domain', - value: state.domain + field: 'domain', + value: state.domain, + operator: 'contains' } ] : [] ); - const [filters, setFilters] = useState>([]); + const [filters, setFilters] = useState(initialFilters); const [paginationModel, setPaginationModel] = useState({ page: 0, pageSize: PAGE_SIZE, pageCount: 0, - sort: [], - filters: initialFilters ? initialFilters : filters + filters: filters }); - const [filterModel] = useState( - initialFilters.map((filter) => ({ - field: filter.id, - operatorValue: 'contains', - value: filter.value + const [filterModel, setFilterModel] = useState({ + items: filters.map((filter) => ({ + id: filter.id, + field: filter.field, + value: filter.value, + operator: filter.operator })) - ); - + }); const [anchorEl, setAnchorEl] = useState(null); const resetVulnerabilities = useCallback(() => { @@ -240,7 +240,6 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ fetchVulnerabilities({ page: 1, pageSize: PAGE_SIZE, - sort: [], filters: [] }); }, [fetchVulnerabilities]); @@ -250,7 +249,6 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ fetchVulnerabilities({ page: 1, pageSize: PAGE_SIZE, - sort: [], filters: initialFilters }); }, [fetchVulnerabilities, initialFilters]); @@ -479,18 +477,6 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ ]} >

- {/* {initialFilters.length > 0 && ( - - - - Displaying {state.title || state.domain} vulnerabilities.{' '} - - - - - )} */} {isLoading ? ( @@ -523,27 +509,26 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ fetchVulnerabilities({ page: model.page + 1, pageSize: model.pageSize, - sort: paginationModel.sort, filters: paginationModel.filters }); }} filterMode="server" - filterModel={{ - items: filterModel.map((item) => ({ - ...item, - operator: 'contains' - })) - }} + filterModel={filterModel} onFilterModelChange={(model) => { const filters = model.items.map((item) => ({ - id: item.field, - value: item.value + id: item.id, + field: item.field, + value: item.value, + operator: item.operator })); setFilters(filters); + setFilterModel((prevFilterModel) => ({ + ...prevFilterModel, + items: filters + })); fetchVulnerabilities({ page: paginationModel.page + 1, pageSize: paginationModel.pageSize, - sort: paginationModel.sort, filters: filters }); }} diff --git a/frontend/src/types/index.ts b/frontend/src/types/index.ts index 0e585e1e..b5539049 100644 --- a/frontend/src/types/index.ts +++ b/frontend/src/types/index.ts @@ -1,4 +1,3 @@ -import { SortingRule, Filters } from 'react-table'; export * from './cpe'; export * from './cve'; export * from './domain'; @@ -6,16 +5,10 @@ export * from './vulnerability'; export * from './scan'; export * from './organization'; export * from './user'; +export * from './query'; export * from './role'; export * from './scan-task'; export * from './saved-search'; export * from './stats'; export * from './report'; export * from './notification'; - -export interface Query { - sort: SortingRule[]; - page: number; - filters: Filters; - pageSize?: number; -} diff --git a/frontend/src/types/query.ts b/frontend/src/types/query.ts new file mode 100644 index 00000000..f8bba514 --- /dev/null +++ b/frontend/src/types/query.ts @@ -0,0 +1,11 @@ +import { GridFilterItem } from '@mui/x-data-grid'; + +export interface CustomGridFilterItem extends GridFilterItem { + customProperty?: T; +} + +export interface Query { + page: number; + filters: CustomGridFilterItem[]; + pageSize?: number; +} From 684940e59c5e01247b9101b8fce660b71a5466bd Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Wed, 21 Aug 2024 09:47:18 -0400 Subject: [PATCH 05/14] Fix vulnerability rating selection from overview chart --- .../src/pages/Risk/VulnerabilityBarChart.tsx | 10 ++++-- .../pages/Vulnerabilities/Vulnerabilities.tsx | 32 +++++++++++++++++++ 2 files changed, 40 insertions(+), 2 deletions(-) diff --git a/frontend/src/pages/Risk/VulnerabilityBarChart.tsx b/frontend/src/pages/Risk/VulnerabilityBarChart.tsx index e7f1f37a..9ccacf3e 100644 --- a/frontend/src/pages/Risk/VulnerabilityBarChart.tsx +++ b/frontend/src/pages/Risk/VulnerabilityBarChart.tsx @@ -23,6 +23,11 @@ const VulnerabilityBarChart = (props: { const { cardRoot, cardSmall, header, chartSmall } = RiskStyles.classesRisk; const [ariaLabel, setAriaLabel] = useState(''); const ariaLiveRef = useRef(null); + const filteredVulnTableLink = '/inventory/vulnerabilities'; + const filteredVulnTableLinkHandler = ( + filteredVulnTableLink: string, + severity: string + ) => history.push(filteredVulnTableLink, { severity: severity }); const CustomBarLayer = ({ bars }: { bars: any[]; [key: string]: any }) => ( <> @@ -47,8 +52,9 @@ const VulnerabilityBarChart = (props: { onClick={() => { //To-Do: Fix onClick so that it correctly sends user to All Vulns table with severity level as a filter. if (type === 'vulns') { - history.push( - `/inventory/vulnerabilities?severity=${bar.indexValue}` + filteredVulnTableLinkHandler( + `${filteredVulnTableLink}`, + `${bar.data.indexValue}` ); } }} diff --git a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx index 64c7e9b6..32ff44ff 100644 --- a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx +++ b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx @@ -58,6 +58,7 @@ export interface VulnerabilityRow { interface LocationState { domain: any; + severity: string; title: string; } @@ -197,6 +198,29 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ const history = useHistory(); const location = useLocation(); const state = location.state as LocationState; + // const paramsArray = [ + // [ + // { + // field: 'title', + // value: state.title, + // operator: 'contains' + // } + // ], + // [ + // { + // field: 'domain', + // value: state.domain, + // operator: 'contains' + // } + // ], + // [ + // { + // field: 'severity', + // value: state.severity, + // operator: 'contains' + // } + // ] + // ]; const [initialFilters, setInitialFilters] = useState( state?.title ? [ @@ -214,6 +238,14 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ operator: 'contains' } ] + : state?.severity + ? [ + { + field: 'severity', + value: state.severity, + operator: 'contains' + } + ] : [] ); const [filters, setFilters] = useState(initialFilters); From 2742d93868ed95916c503ba0b12e70fb2cdd5903 Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Wed, 21 Aug 2024 09:51:48 -0400 Subject: [PATCH 06/14] Refactor filter type for Domain.tsx --- frontend/src/hooks/useDomainApi.ts | 6 ++---- frontend/src/pages/Domains/Domains.tsx | 22 +++++++++++++++++----- 2 files changed, 19 insertions(+), 9 deletions(-) diff --git a/frontend/src/hooks/useDomainApi.ts b/frontend/src/hooks/useDomainApi.ts index 37fe5880..89b70026 100644 --- a/frontend/src/hooks/useDomainApi.ts +++ b/frontend/src/hooks/useDomainApi.ts @@ -18,14 +18,14 @@ export const useDomainApi = (showAll?: boolean) => { const { currentOrganization, apiPost, apiGet } = useAuthContext(); const listDomains = useCallback( async (query: DomainQuery, doExport = false) => { - const { page, sort, filters, pageSize = PAGE_SIZE } = query; + const { page, filters, pageSize = PAGE_SIZE } = query; const tableFilters: any = filters .filter((f) => Boolean(f.value)) .reduce( (accum, next) => ({ ...accum, - [next.id]: next.value + [next.field]: next.value }), {} ); @@ -42,8 +42,6 @@ export const useDomainApi = (showAll?: boolean) => { body: { pageSize, page, - sort: sort[0]?.id ?? 'name', - order: sort[0]?.desc ? 'DESC' : 'ASC', filters: tableFilters } } diff --git a/frontend/src/pages/Domains/Domains.tsx b/frontend/src/pages/Domains/Domains.tsx index 3cf7b39e..f14bd7bf 100644 --- a/frontend/src/pages/Domains/Domains.tsx +++ b/frontend/src/pages/Domains/Domains.tsx @@ -10,7 +10,7 @@ import { Alert, Button, IconButton, Paper } from '@mui/material'; import OpenInNewIcon from '@mui/icons-material/OpenInNew'; import { DataGrid, GridColDef, GridRenderCellParams } from '@mui/x-data-grid'; import CustomToolbar from 'components/DataGrid/CustomToolbar'; -import { differenceInCalendarDays, parseISO } from 'date-fns'; +import { differenceInCalendarDays, parseISO, set } from 'date-fns'; const PAGE_SIZE = 15; @@ -35,6 +35,14 @@ export const Domains: React.FC = () => { const [filters, setFilters] = useState['filters']>([]); const [loadingError, setLoadingError] = useState(false); const [isLoading, setIsLoading] = useState(false); + const [filterModel, setFilterModel] = useState({ + items: filters.map((filter) => ({ + id: filter.id, + field: filter.field, + value: filter.value, + operator: filter.operator + })) + }); const fetchDomains = useCallback( async (q: Query) => { @@ -73,7 +81,6 @@ export const Domains: React.FC = () => { fetchDomains({ page: 1, pageSize: PAGE_SIZE, - sort: [], filters: [] }); }, [fetchDomains]); @@ -182,21 +189,26 @@ export const Domains: React.FC = () => { fetchDomains({ page: model.page + 1, pageSize: model.pageSize, - sort: paginationModel.sort, filters: paginationModel.filters }); }} filterMode="server" + filterModel={filterModel} onFilterModelChange={(model) => { const filters = model.items.map((item) => ({ id: item.field, - value: item.value + field: item.field, + value: item.value, + operator: item.operator })); setFilters(filters); + setFilterModel((prevFilterModel) => ({ + ...prevFilterModel, + items: filters + })); fetchDomains({ page: paginationModel.page + 1, pageSize: paginationModel.pageSize, - sort: paginationModel.sort, filters: filters }); }} From 446bd495b0d498b23fc2426086d3fa9af9bc5d52 Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Wed, 21 Aug 2024 09:53:49 -0400 Subject: [PATCH 07/14] Removed manual sort from Domain.tsx --- frontend/src/pages/Domains/Domains.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/frontend/src/pages/Domains/Domains.tsx b/frontend/src/pages/Domains/Domains.tsx index f14bd7bf..5a5d3c6d 100644 --- a/frontend/src/pages/Domains/Domains.tsx +++ b/frontend/src/pages/Domains/Domains.tsx @@ -72,7 +72,6 @@ export const Domains: React.FC = () => { page: 0, pageSize: PAGE_SIZE, pageCount: 0, - sort: [], filters: filters }); From 30f280620c5612f37ceb1a07188258c72ea1abac Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Thu, 22 Aug 2024 15:31:27 -0400 Subject: [PATCH 08/14] Refactored from Query to OrgQuery to maintain Table Functionality --- frontend/src/components/Table/Table.tsx | 4 ++-- frontend/src/types/org-query.ts | 8 ++++++++ 2 files changed, 10 insertions(+), 2 deletions(-) create mode 100644 frontend/src/types/org-query.ts diff --git a/frontend/src/components/Table/Table.tsx b/frontend/src/components/Table/Table.tsx index b76fd404..584bf89a 100644 --- a/frontend/src/components/Table/Table.tsx +++ b/frontend/src/components/Table/Table.tsx @@ -1,6 +1,6 @@ import React, { useEffect, useImperativeHandle } from 'react'; import { Table as UsaTable } from '@trussworks/react-uswds'; -import { Query } from 'types'; +import { OrgQuery } from 'types/org-query'; import { useTable, useExpanded, @@ -25,7 +25,7 @@ interface TableProps { initialFilterBy?: Filters; pageCount?: number; pageSize?: number; - fetchData?: (query: Query) => void; + fetchData?: (query: OrgQuery) => void; disableFilters?: boolean; renderPagination?: (table: TableInstance) => JSX.Element; renderExpanded?: (row: Row) => JSX.Element; diff --git a/frontend/src/types/org-query.ts b/frontend/src/types/org-query.ts new file mode 100644 index 00000000..6719d915 --- /dev/null +++ b/frontend/src/types/org-query.ts @@ -0,0 +1,8 @@ +import { SortingRule, Filters } from 'react-table'; + +export interface OrgQuery { + sort: SortingRule[]; + page: number; + filters: Filters; + pageSize?: number; +} From a3bc6464adaf135f331d0205f76c19237badc13f Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Thu, 22 Aug 2024 15:38:20 -0400 Subject: [PATCH 09/14] Refactored from Query to OrgQuery in ScanTasksView --- frontend/src/pages/Scans/ScanTasksView.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/frontend/src/pages/Scans/ScanTasksView.tsx b/frontend/src/pages/Scans/ScanTasksView.tsx index 5eac37f8..84b51017 100644 --- a/frontend/src/pages/Scans/ScanTasksView.tsx +++ b/frontend/src/pages/Scans/ScanTasksView.tsx @@ -1,6 +1,6 @@ import React, { useCallback, useEffect, useState } from 'react'; -import { Query, Scan } from 'types'; -import { ScanTask } from 'types'; +import { OrgQuery } from 'types/org-query'; +import { Scan, ScanTask } from 'types'; import { useAuthContext } from 'context'; // @ts-ignore:next-line import { formatDistanceToNow, parseISO } from 'date-fns'; @@ -117,7 +117,7 @@ export const ScanTasksView: React.FC = () => { const PAGE_SIZE = 15; const fetchScanTasks = useCallback( - async (query: Query) => { + async (query: OrgQuery) => { const { page, sort, filters } = query; try { const tableFilters: { From 0ba2ee85773fca552a32350b4c074686a7956146 Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Thu, 22 Aug 2024 15:44:04 -0400 Subject: [PATCH 10/14] Removed unused import --- frontend/src/pages/Domains/Domains.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/pages/Domains/Domains.tsx b/frontend/src/pages/Domains/Domains.tsx index 5a5d3c6d..b711fee8 100644 --- a/frontend/src/pages/Domains/Domains.tsx +++ b/frontend/src/pages/Domains/Domains.tsx @@ -10,7 +10,7 @@ import { Alert, Button, IconButton, Paper } from '@mui/material'; import OpenInNewIcon from '@mui/icons-material/OpenInNew'; import { DataGrid, GridColDef, GridRenderCellParams } from '@mui/x-data-grid'; import CustomToolbar from 'components/DataGrid/CustomToolbar'; -import { differenceInCalendarDays, parseISO, set } from 'date-fns'; +import { differenceInCalendarDays, parseISO } from 'date-fns'; const PAGE_SIZE = 15; From 4f586ce3731d45bb4fc088adbd03811c07f7668c Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Fri, 23 Aug 2024 10:16:46 -0400 Subject: [PATCH 11/14] Restored onKeyDown to Severity,Ports, and Top Domains graphs --- frontend/src/pages/Risk/TopVulnerableDomains.tsx | 9 +++++++++ frontend/src/pages/Risk/TopVulnerablePorts.tsx | 9 +++++++++ frontend/src/pages/Risk/VulnerabilityBarChart.tsx | 11 ++++++++++- 3 files changed, 28 insertions(+), 1 deletion(-) diff --git a/frontend/src/pages/Risk/TopVulnerableDomains.tsx b/frontend/src/pages/Risk/TopVulnerableDomains.tsx index f8edc88c..7b0be2c1 100644 --- a/frontend/src/pages/Risk/TopVulnerableDomains.tsx +++ b/frontend/src/pages/Risk/TopVulnerableDomains.tsx @@ -111,6 +111,15 @@ const TopVulnerableDomains = (props: { data: Point[] }) => { bar.data.indexValue ); }} + onKeyDown={(e) => { + if (e.key === 'Enter' || e.key === ' ') { + e.preventDefault(); + filteredVulnTableLinkHandler( + filteredVulnTableLink, + bar.data.indexValue + ); + } + }} /> diff --git a/frontend/src/pages/Risk/TopVulnerablePorts.tsx b/frontend/src/pages/Risk/TopVulnerablePorts.tsx index cad9da61..d44d360e 100644 --- a/frontend/src/pages/Risk/TopVulnerablePorts.tsx +++ b/frontend/src/pages/Risk/TopVulnerablePorts.tsx @@ -43,6 +43,15 @@ const TopVulnerablePorts = (props: { data: Point[] }) => { ); window.location.reload(); }} + onKeyDown={(e) => { + if (e.key === 'Enter' || e.key === ' ') { + e.preventDefault(); + history.push( + `/inventory?filters[0][field]=services.port&filters[0][values][0]=n_${bar.data.indexValue}_n&filters[0][type]=any` + ); + window.location.reload(); + } + }} /> diff --git a/frontend/src/pages/Risk/VulnerabilityBarChart.tsx b/frontend/src/pages/Risk/VulnerabilityBarChart.tsx index 9ccacf3e..b0505aca 100644 --- a/frontend/src/pages/Risk/VulnerabilityBarChart.tsx +++ b/frontend/src/pages/Risk/VulnerabilityBarChart.tsx @@ -5,6 +5,7 @@ import { Paper, Tooltip } from '@mui/material'; import { Point } from './Risk'; import * as RiskStyles from './style'; import { getSeverityColor, getServicesColor, getTooltipColor } from './utils'; +import e from 'cors'; // Define the type to match the BarDatum structure interface BarData extends BarDatum { @@ -50,7 +51,6 @@ const VulnerabilityBarChart = (props: { tabIndex={0} aria-label={`${bar.data.value} ${bar.data.indexValue} level severities in this organization.`} onClick={() => { - //To-Do: Fix onClick so that it correctly sends user to All Vulns table with severity level as a filter. if (type === 'vulns') { filteredVulnTableLinkHandler( `${filteredVulnTableLink}`, @@ -58,6 +58,15 @@ const VulnerabilityBarChart = (props: { ); } }} + onKeyDown={(e) => { + if (e.key === 'Enter' || e.key === ' ') { + e.preventDefault(); + filteredVulnTableLinkHandler( + filteredVulnTableLink, + bar.data.indexValue + ); + } + }} /> From ddaf8c1cf195f0e15bec8027abb2c184b42b6a58 Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Fri, 23 Aug 2024 10:22:13 -0400 Subject: [PATCH 12/14] Removed unused import --- frontend/src/pages/Risk/VulnerabilityBarChart.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/frontend/src/pages/Risk/VulnerabilityBarChart.tsx b/frontend/src/pages/Risk/VulnerabilityBarChart.tsx index b0505aca..aa1214dd 100644 --- a/frontend/src/pages/Risk/VulnerabilityBarChart.tsx +++ b/frontend/src/pages/Risk/VulnerabilityBarChart.tsx @@ -5,7 +5,6 @@ import { Paper, Tooltip } from '@mui/material'; import { Point } from './Risk'; import * as RiskStyles from './style'; import { getSeverityColor, getServicesColor, getTooltipColor } from './utils'; -import e from 'cors'; // Define the type to match the BarDatum structure interface BarData extends BarDatum { From ce4713fb06d278fd10f59964e81ceb8382a0371c Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Fri, 23 Aug 2024 12:04:39 -0400 Subject: [PATCH 13/14] Adjusted routing to proper URL in TopVulnerableDomains --- frontend/src/pages/Risk/TopVulnerableDomains.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/frontend/src/pages/Risk/TopVulnerableDomains.tsx b/frontend/src/pages/Risk/TopVulnerableDomains.tsx index f8edc88c..31336978 100644 --- a/frontend/src/pages/Risk/TopVulnerableDomains.tsx +++ b/frontend/src/pages/Risk/TopVulnerableDomains.tsx @@ -70,8 +70,7 @@ const TopVulnerableDomains = (props: { data: Point[] }) => { //Custom Bar Layer to allow for top to bottom tab navigation const CustomBarLayer = ({ bars }: { bars: any[]; [key: string]: any }) => { const reversedBars = [...bars].reverse(); - const filteredVulnTableLink = - '/inventory/vulnerabilities?sort=createdAt&desc=false'; + const filteredVulnTableLink = '/inventory/vulnerabilities'; const filteredVulnTableLinkHandler = ( filteredVulnTableLink: string, domain: string From 97eefbc3499509add9bbd246c5bc7145cbd96512 Mon Sep 17 00:00:00 2001 From: Chrtorres Date: Fri, 23 Aug 2024 16:31:34 -0400 Subject: [PATCH 14/14] Removed commented unused codee --- .../pages/Vulnerabilities/Vulnerabilities.tsx | 23 ------------------- 1 file changed, 23 deletions(-) diff --git a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx index 32ff44ff..6dc84dbc 100644 --- a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx +++ b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx @@ -198,29 +198,6 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ const history = useHistory(); const location = useLocation(); const state = location.state as LocationState; - // const paramsArray = [ - // [ - // { - // field: 'title', - // value: state.title, - // operator: 'contains' - // } - // ], - // [ - // { - // field: 'domain', - // value: state.domain, - // operator: 'contains' - // } - // ], - // [ - // { - // field: 'severity', - // value: state.severity, - // operator: 'contains' - // } - // ] - // ]; const [initialFilters, setInitialFilters] = useState( state?.title ? [