From fb1488c9b055611ad71410cae33fbe5aa48c7518 Mon Sep 17 00:00:00 2001 From: Julien Richard Date: Fri, 3 Mar 2023 11:26:04 +0100 Subject: [PATCH] [front] Align ui filters on runtime mapping capability (#2936) --- .../src/private/components/Search.js | 2 +- .../analysis/ExternalReferences.tsx | 4 +- .../private/components/analysis/Groupings.tsx | 30 ++++----- .../private/components/analysis/Reports.tsx | 24 +++---- .../components/arsenal/Vulnerabilities.tsx | 7 ++- .../private/components/cases/Feedbacks.tsx | 8 +-- .../private/components/cases/Incidents.tsx | 8 +-- .../ContainerStixCyberObservables.tsx | 8 +-- ...ontainerStixObjectsOrStixRelationships.tsx | 8 +-- ...eObjectOrStixCoreRelationshipContainers.js | 6 +- .../private/components/data/Relationships.js | 2 +- .../private/components/events/Incidents.tsx | 4 +- .../components/observations/Indicators.js | 2 +- .../observations/StixCyberObservables.tsx | 62 ++++++++----------- .../indicators/IndicatorEntities.js | 14 +++-- 15 files changed, 91 insertions(+), 98 deletions(-) diff --git a/opencti-platform/opencti-front/src/private/components/Search.js b/opencti-platform/opencti-front/src/private/components/Search.js index bba616a554f6..97728c3957fa 100644 --- a/opencti-platform/opencti-front/src/private/components/Search.js +++ b/opencti-platform/opencti-front/src/private/components/Search.js @@ -183,7 +183,7 @@ class Search extends Component { creator: { label: 'Creator', width: '12%', - isSortable: true, + isSortable: isRuntimeSort, }, objectLabel: { label: 'Labels', diff --git a/opencti-platform/opencti-front/src/private/components/analysis/ExternalReferences.tsx b/opencti-platform/opencti-front/src/private/components/analysis/ExternalReferences.tsx index 784a0f6fb11b..9570eb1b7105 100644 --- a/opencti-platform/opencti-front/src/private/components/analysis/ExternalReferences.tsx +++ b/opencti-platform/opencti-front/src/private/components/analysis/ExternalReferences.tsx @@ -40,7 +40,7 @@ const ExternalReferences: FunctionComponent = () => { }, ); const { sortBy, orderAsc, searchTerm, filters, numberOfElements } = viewStorage; - const isRuntimeSort = helper?.isRuntimeFieldEnable(); + const isRuntimeSort = helper?.isRuntimeFieldEnable() ?? false; const dataColumns = { source_name: { label: 'Source name', @@ -60,7 +60,7 @@ const ExternalReferences: FunctionComponent = () => { creator: { label: 'Creator', width: '12%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, created: { label: 'Creation date', diff --git a/opencti-platform/opencti-front/src/private/components/analysis/Groupings.tsx b/opencti-platform/opencti-front/src/private/components/analysis/Groupings.tsx index d6fcf4abc889..b85753b85eb7 100644 --- a/opencti-platform/opencti-front/src/private/components/analysis/Groupings.tsx +++ b/opencti-platform/opencti-front/src/private/components/analysis/Groupings.tsx @@ -1,4 +1,4 @@ -import React, { FunctionComponent } from 'react'; +import React, { FunctionComponent, useContext } from 'react'; import ListLines from '../../../components/list_lines/ListLines'; import GroupingsLines, { groupingsLinesQuery, @@ -16,7 +16,6 @@ import { GroupingsLinesPaginationQuery$variables, } from './groupings/__generated__/GroupingsLinesPaginationQuery.graphql'; import { GroupingLine_node$data } from './groupings/__generated__/GroupingLine_node.graphql'; -import { ModuleHelper } from '../../../utils/platformModulesHelper'; import { GroupingLineDummy } from './groupings/GroupingLine'; const LOCAL_STORAGE_KEY = 'view-groupings'; @@ -33,6 +32,7 @@ const Groupings: FunctionComponent = ({ authorId, onChangeOpenExports, }) => { + const { helper } = useContext(UserContext); const additionnalFilters = []; if (authorId) { additionnalFilters.push({ @@ -87,7 +87,7 @@ const Groupings: FunctionComponent = ({ groupingsLinesQuery, paginationOptions, ); - const renderLines = (helper: ModuleHelper | undefined) => { + const renderLines = () => { let exportContext = null; if (objectId) { exportContext = `of-entity-${objectId}`; @@ -104,7 +104,7 @@ const Groupings: FunctionComponent = ({ ...finalFilters, entity_type: [{ id: 'Grouping', value: 'Grouping' }], }; - const isRuntimeSort = helper?.isRuntimeFieldEnable(); + const isRuntimeSort = helper?.isRuntimeFieldEnable() ?? false; const dataColumns = { name: { label: 'Name', @@ -119,12 +119,12 @@ const Groupings: FunctionComponent = ({ createdBy: { label: 'Author', width: '12%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, creator: { label: 'Creators', width: '12%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, objectLabel: { label: 'Labels', @@ -143,7 +143,7 @@ const Groupings: FunctionComponent = ({ }, objectMarking: { label: 'Marking', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, width: '8%', }, }; @@ -221,16 +221,12 @@ const Groupings: FunctionComponent = ({ ); }; return ( - - {({ helper }) => ( -
- {renderLines(helper)} - - - -
- )} - +
+ {renderLines()} + + + +
); }; diff --git a/opencti-platform/opencti-front/src/private/components/analysis/Reports.tsx b/opencti-platform/opencti-front/src/private/components/analysis/Reports.tsx index 7cbd51bb710b..b2e15fdba651 100644 --- a/opencti-platform/opencti-front/src/private/components/analysis/Reports.tsx +++ b/opencti-platform/opencti-front/src/private/components/analysis/Reports.tsx @@ -1,4 +1,4 @@ -import React, { FunctionComponent } from 'react'; +import React, { FunctionComponent, useContext } from 'react'; import ListLines from '../../../components/list_lines/ListLines'; import ReportsLines, { reportsLinesQuery } from './reports/ReportsLines'; import ReportCreation from './reports/ReportCreation'; @@ -12,7 +12,6 @@ import { ReportsLinesPaginationQuery$variables, } from './reports/__generated__/ReportsLinesPaginationQuery.graphql'; import { Filters } from '../../../components/list_lines'; -import { ModuleHelper } from '../../../utils/platformModulesHelper'; import { ReportLine_node$data } from './reports/__generated__/ReportLine_node.graphql'; import useEntityToggle from '../../../utils/hooks/useEntityToggle'; import useQueryLoading from '../../../utils/hooks/useQueryLoading'; @@ -32,6 +31,7 @@ const Reports: FunctionComponent = ({ authorId, onChangeOpenExports, }) => { + const { helper } = useContext(UserContext); const additionnalFilters = []; if (authorId) { additionnalFilters.push({ @@ -87,7 +87,7 @@ const Reports: FunctionComponent = ({ reportsLinesQuery, paginationOptions, ); - const renderLines = (helper: ModuleHelper | undefined) => { + const renderLines = () => { let exportContext = null; if (objectId) { exportContext = `of-entity-${objectId}`; @@ -99,7 +99,7 @@ const Reports: FunctionComponent = ({ ...renderFilters, entity_type: [{ id: 'Report', value: 'Report' }], }; - const isRuntimeSort = helper?.isRuntimeFieldEnable(); + const isRuntimeSort = helper?.isRuntimeFieldEnable() ?? false; const dataColumns = { name: { label: 'Title', @@ -114,12 +114,12 @@ const Reports: FunctionComponent = ({ createdBy: { label: 'Author', width: '12%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, creator: { label: 'Creators', width: '12%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, objectLabel: { label: 'Labels', @@ -138,7 +138,7 @@ const Reports: FunctionComponent = ({ }, objectMarking: { label: 'Marking', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, width: '8%', }, }; @@ -220,18 +220,14 @@ const Reports: FunctionComponent = ({ ); }; return ( - - {({ helper }) => ( - +
- {renderLines(helper)} + {renderLines()}
- - )} - + ); }; diff --git a/opencti-platform/opencti-front/src/private/components/arsenal/Vulnerabilities.tsx b/opencti-platform/opencti-front/src/private/components/arsenal/Vulnerabilities.tsx index 24454e20a75c..24c1b48ed0dc 100644 --- a/opencti-platform/opencti-front/src/private/components/arsenal/Vulnerabilities.tsx +++ b/opencti-platform/opencti-front/src/private/components/arsenal/Vulnerabilities.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useContext } from 'react'; import ListLines from '../../../components/list_lines/ListLines'; import VulnerabilitiesLines, { vulnerabilitiesLinesQuery, @@ -14,8 +14,11 @@ import { VulnerabilitiesLinesPaginationQuery$variables, } from './vulnerabilities/__generated__/VulnerabilitiesLinesPaginationQuery.graphql'; import { usePaginationLocalStorage } from '../../../utils/hooks/useLocalStorage'; +import { UserContext } from '../../../utils/hooks/useAuth'; const Vulnerabilities = () => { + const { helper } = useContext(UserContext); + const isRuntimeSort = helper?.isRuntimeFieldEnable() ?? false; const { viewStorage, helpers, paginationOptions } = usePaginationLocalStorage( 'view-vulnerabilities', { @@ -65,7 +68,7 @@ const Vulnerabilities = () => { creator: { label: 'Creators', width: '12%', - isSortable: true, + isSortable: isRuntimeSort, }, }; diff --git a/opencti-platform/opencti-front/src/private/components/cases/Feedbacks.tsx b/opencti-platform/opencti-front/src/private/components/cases/Feedbacks.tsx index 0194d3a30930..656f03de08bc 100644 --- a/opencti-platform/opencti-front/src/private/components/cases/Feedbacks.tsx +++ b/opencti-platform/opencti-front/src/private/components/cases/Feedbacks.tsx @@ -70,7 +70,7 @@ const Feedbacks: FunctionComponent = () => { openExports, numberOfElements, } = viewStorage; - const isRuntimeSort = helper?.isRuntimeFieldEnable(); + const isRuntimeSort = helper?.isRuntimeFieldEnable() ?? false; const dataColumns = { name: { label: 'Name', @@ -85,12 +85,12 @@ const Feedbacks: FunctionComponent = () => { createdBy: { label: 'Author', width: '12%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, creator: { label: 'Creators', width: '12%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, objectLabel: { label: 'Labels', @@ -110,7 +110,7 @@ const Feedbacks: FunctionComponent = () => { objectMarking: { label: 'Marking', width: '8%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, }; const queryRef = useQueryLoading( diff --git a/opencti-platform/opencti-front/src/private/components/cases/Incidents.tsx b/opencti-platform/opencti-front/src/private/components/cases/Incidents.tsx index ae86f89e3b9e..fbf913501751 100644 --- a/opencti-platform/opencti-front/src/private/components/cases/Incidents.tsx +++ b/opencti-platform/opencti-front/src/private/components/cases/Incidents.tsx @@ -73,7 +73,7 @@ const Incidents: FunctionComponent = () => { openExports, numberOfElements, } = viewStorage; - const isRuntimeSort = helper?.isRuntimeFieldEnable(); + const isRuntimeSort = helper?.isRuntimeFieldEnable() ?? false; const dataColumns = { name: { label: 'Name', @@ -93,12 +93,12 @@ const Incidents: FunctionComponent = () => { createdBy: { label: 'Author', width: '11%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, creator: { label: 'Creators', width: '11%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, objectLabel: { label: 'Labels', @@ -118,7 +118,7 @@ const Incidents: FunctionComponent = () => { objectMarking: { label: 'Marking', width: '8%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, }; const queryRef = useQueryLoading( diff --git a/opencti-platform/opencti-front/src/private/components/common/containers/ContainerStixCyberObservables.tsx b/opencti-platform/opencti-front/src/private/components/common/containers/ContainerStixCyberObservables.tsx index 980db7b1c577..ec10f6d04d13 100644 --- a/opencti-platform/opencti-front/src/private/components/common/containers/ContainerStixCyberObservables.tsx +++ b/opencti-platform/opencti-front/src/private/components/common/containers/ContainerStixCyberObservables.tsx @@ -232,7 +232,7 @@ const ContainerStixCyberObservablesComponent: FunctionComponent { - const isRuntimeSort = helper?.isRuntimeFieldEnable(); + const isRuntimeSort = helper?.isRuntimeFieldEnable() ?? false; return { entity_type: { label: 'Type', @@ -242,7 +242,7 @@ const ContainerStixCyberObservablesComponent: FunctionComponent { paginationOptions, ); // eslint-disable-next-line class-methods-use-this - const isRuntimeSort = helper?.isRuntimeFieldEnable(); + const isRuntimeSort = helper?.isRuntimeFieldEnable() ?? false; const buildColumns = { name: { label: 'Name', @@ -122,7 +122,7 @@ const Incidents: FunctionComponent = () => { objectMarking: { label: 'Marking', width: '8%', - isSortable: isRuntimeSort ?? false, + isSortable: isRuntimeSort, }, }; const renderCards = () => { diff --git a/opencti-platform/opencti-front/src/private/components/observations/Indicators.js b/opencti-platform/opencti-front/src/private/components/observations/Indicators.js index b7ba292695fe..4c0ad0498802 100644 --- a/opencti-platform/opencti-front/src/private/components/observations/Indicators.js +++ b/opencti-platform/opencti-front/src/private/components/observations/Indicators.js @@ -261,7 +261,7 @@ class Indicators extends Component { creator: { label: 'Creators', width: '10%', - isSortable: true, + isSortable: isRuntimeSort, }, valid_until: { label: 'Valid until', diff --git a/opencti-platform/opencti-front/src/private/components/observations/StixCyberObservables.tsx b/opencti-platform/opencti-front/src/private/components/observations/StixCyberObservables.tsx index 04bef18e2ecd..97a2461548b4 100644 --- a/opencti-platform/opencti-front/src/private/components/observations/StixCyberObservables.tsx +++ b/opencti-platform/opencti-front/src/private/components/observations/StixCyberObservables.tsx @@ -1,4 +1,4 @@ -import { FunctionComponent } from 'react'; +import { FunctionComponent, useContext } from 'react'; import makeStyles from '@mui/styles/makeStyles'; import { React } from 'mdi-material-ui'; import StixCyberObservableCreation from './stix_cyber_observables/StixCyberObservableCreation'; @@ -13,7 +13,6 @@ import StixCyberObservablesLines, { import ToolBar from '../data/ToolBar'; import { Theme } from '../../../components/Theme'; import { Filters } from '../../../components/list_lines'; -import { ModuleHelper } from '../../../utils/platformModulesHelper'; import { StixCyberObservablesLinesPaginationQuery$data, } from './stix_cyber_observables/__generated__/StixCyberObservablesLinesPaginationQuery.graphql'; @@ -40,6 +39,8 @@ const LOCAL_STORAGE_KEY = 'view-stix-cyber-observables'; const StixCyberObservables: FunctionComponent = () => { const classes = useStyles(); + const { helper } = useContext(UserContext); + const isRuntimeSort = helper?.isRuntimeFieldEnable() ?? false; const { viewStorage, paginationOptions, helpers } = usePaginationLocalStorage( LOCAL_STORAGE_KEY, @@ -109,8 +110,7 @@ const StixCyberObservables: FunctionComponent = () => { selectAll, ); - const buildColumns = (helper: ModuleHelper | undefined) => { - const isRuntimeSort = helper?.isRuntimeFieldEnable(); + const buildColumns = () => { return { entity_type: { label: 'Type', @@ -159,13 +159,11 @@ const StixCyberObservables: FunctionComponent = () => { } const finalFilters = { ...viewStorage.filters, entity_type: finalType }; return ( - - {({ helper }) => ( -
- + { 'sightedBy', 'creator', ]} - > - + ( - + render={({ props }: { props: StixCyberObservablesLinesPaginationQuery$data }) => ( + )} - /> - - + + { handleClearSelectedElements={handleClearSelectedElements} variant="large" handleCopy={handleCopy} - /> -
- )} - + /> + ); }; diff --git a/opencti-platform/opencti-front/src/private/components/observations/indicators/IndicatorEntities.js b/opencti-platform/opencti-front/src/private/components/observations/indicators/IndicatorEntities.js index 05cee9a2b3a5..294085643614 100644 --- a/opencti-platform/opencti-front/src/private/components/observations/indicators/IndicatorEntities.js +++ b/opencti-platform/opencti-front/src/private/components/observations/indicators/IndicatorEntities.js @@ -2,6 +2,7 @@ import React, { Component } from 'react'; import * as PropTypes from 'prop-types'; import { compose } from 'ramda'; import withStyles from '@mui/styles/withStyles'; +import { UserContext } from '../../../../utils/hooks/useAuth'; import { QueryRenderer } from '../../../../relay/environment'; import inject18n from '../../../../components/i18n'; import ListLines from '../../../../components/list_lines/ListLines'; @@ -38,7 +39,8 @@ class IndicatorEntities extends Component { this.setState({ searchTerm: value }); } - renderLines(paginationOptions) { + renderLines(helper, paginationOptions) { + const isRuntimeSort = helper.isRuntimeFieldEnable(); const { indicatorId } = this.props; const { sortBy, orderAsc } = this.state; const link = `/dashboard/observations/indicators/${indicatorId}/knowledge`; @@ -61,12 +63,12 @@ class IndicatorEntities extends Component { createdBy: { label: 'Author', width: '12%', - isSortable: false, + isSortable: isRuntimeSort, }, creator: { label: 'Creators', width: '12%', - isSortable: false, + isSortable: isRuntimeSort, }, start_time: { label: 'First obs.', @@ -131,7 +133,9 @@ class IndicatorEntities extends Component { }; return (
- {view === 'lines' ? this.renderLines(paginationOptions) : ''} + + {({ helper }) => (<> + {view === 'lines' ? this.renderLines(helper, paginationOptions) : ''} + )} +
); }