From d63a2466650943e9afd3f45f908d823e5c181494 Mon Sep 17 00:00:00 2001 From: Steph Milovic Date: Thu, 8 Apr 2021 18:36:46 -0600 Subject: [PATCH] [Security Solution] [Cases] Small UI bugfixes (#96511) --- .../cases/components/all_cases/columns.tsx | 40 +++++++++---------- .../cases/components/all_cases/index.test.tsx | 2 +- .../cases/components/all_cases/index.tsx | 2 +- .../connectors_dropdown.test.tsx | 5 +++ .../configure_cases/connectors_dropdown.tsx | 4 +- .../configure_cases/field_mapping.tsx | 2 +- .../field_mapping_row_static.tsx | 6 +-- .../public/cases/containers/types.ts | 1 - 8 files changed, 33 insertions(+), 29 deletions(-) diff --git a/x-pack/plugins/security_solution/public/cases/components/all_cases/columns.tsx b/x-pack/plugins/security_solution/public/cases/components/all_cases/columns.tsx index 86f854fd0a1450..1efcdf2d792f46 100644 --- a/x-pack/plugins/security_solution/public/cases/components/all_cases/columns.tsx +++ b/x-pack/plugins/security_solution/public/cases/components/all_cases/columns.tsx @@ -14,6 +14,8 @@ import { EuiTableActionsColumnType, EuiTableComputedColumnType, EuiTableFieldDataColumnType, + EuiFlexGroup, + EuiFlexItem, } from '@elastic/eui'; import { RIGHT_ALIGNMENT } from '@elastic/eui/lib/services'; import styled from 'styled-components'; @@ -73,12 +75,12 @@ export const getCasesColumns = ( return theCase.status !== CaseStatuses.closed ? ( caseDetailsLinkComponent ) : ( - <> - {caseDetailsLinkComponent} - + + {caseDetailsLinkComponent} + {i18n.CLOSED} - - + + ); } return getEmptyTagValue(); @@ -132,7 +134,6 @@ export const getCasesColumns = ( align: RIGHT_ALIGNMENT, field: 'totalAlerts', name: ALERTS, - sortable: true, render: (totalAlerts: Case['totalAlerts']) => totalAlerts != null ? renderStringField(`${totalAlerts}`, `case-table-column-alertsCount`) @@ -142,22 +143,21 @@ export const getCasesColumns = ( align: RIGHT_ALIGNMENT, field: 'totalComment', name: i18n.COMMENTS, - sortable: true, render: (totalComment: Case['totalComment']) => totalComment != null ? renderStringField(`${totalComment}`, `case-table-column-commentCount`) : getEmptyTagValue(), }, - filterStatus === CaseStatuses.open + filterStatus === CaseStatuses.closed ? { - field: 'createdAt', - name: i18n.OPENED_ON, + field: 'closedAt', + name: i18n.CLOSED_ON, sortable: true, - render: (createdAt: Case['createdAt']) => { - if (createdAt != null) { + render: (closedAt: Case['closedAt']) => { + if (closedAt != null) { return ( - - + + ); } @@ -165,14 +165,14 @@ export const getCasesColumns = ( }, } : { - field: 'closedAt', - name: i18n.CLOSED_ON, + field: 'createdAt', + name: i18n.OPENED_ON, sortable: true, - render: (closedAt: Case['closedAt']) => { - if (closedAt != null) { + render: (createdAt: Case['createdAt']) => { + if (createdAt != null) { return ( - - + + ); } diff --git a/x-pack/plugins/security_solution/public/cases/components/all_cases/index.test.tsx b/x-pack/plugins/security_solution/public/cases/components/all_cases/index.test.tsx index 0fafdaf81f0955..fec7cb6d98e611 100644 --- a/x-pack/plugins/security_solution/public/cases/components/all_cases/index.test.tsx +++ b/x-pack/plugins/security_solution/public/cases/components/all_cases/index.test.tsx @@ -816,7 +816,7 @@ describe('AllCases', () => { wrapper.find('button[data-test-subj="case-status-filter"]').simulate('click'); wrapper.find('button[data-test-subj="case-status-filter-in-progress"]').simulate('click'); expect(setQueryParams).toBeCalledWith({ - sortField: 'updatedAt', + sortField: 'createdAt', }); }); }); diff --git a/x-pack/plugins/security_solution/public/cases/components/all_cases/index.tsx b/x-pack/plugins/security_solution/public/cases/components/all_cases/index.tsx index c5748a321c19b3..9f3e23fcde1c09 100644 --- a/x-pack/plugins/security_solution/public/cases/components/all_cases/index.tsx +++ b/x-pack/plugins/security_solution/public/cases/components/all_cases/index.tsx @@ -342,7 +342,7 @@ export const AllCases = React.memo( newFilterOptions.status && newFilterOptions.status === CaseStatuses['in-progress'] ) { - setQueryParams({ sortField: SortFieldCase.updatedAt }); + setQueryParams({ sortField: SortFieldCase.createdAt }); } setFilters(newFilterOptions); refreshCases(false); diff --git a/x-pack/plugins/security_solution/public/cases/components/configure_cases/connectors_dropdown.test.tsx b/x-pack/plugins/security_solution/public/cases/components/configure_cases/connectors_dropdown.test.tsx index 1f1876756773d6..ac0bb1f1c742fc 100644 --- a/x-pack/plugins/security_solution/public/cases/components/configure_cases/connectors_dropdown.test.tsx +++ b/x-pack/plugins/security_solution/public/cases/components/configure_cases/connectors_dropdown.test.tsx @@ -41,6 +41,7 @@ describe('ConnectorsDropdown', () => { "inputDisplay": { "inputDisplay": { "inputDisplay": { "inputDisplay": { "inputDisplay": + @@ -77,7 +77,7 @@ const ConnectorsDropdownComponent: React.FC = ({ { value: connector.id, inputDisplay: ( - + = ({ {' '} - + {i18n.FIELD_MAPPING_FIRST_COL} diff --git a/x-pack/plugins/security_solution/public/cases/components/configure_cases/field_mapping_row_static.tsx b/x-pack/plugins/security_solution/public/cases/components/configure_cases/field_mapping_row_static.tsx index a732f403ee646b..07f5fe35bc834d 100644 --- a/x-pack/plugins/security_solution/public/cases/components/configure_cases/field_mapping_row_static.tsx +++ b/x-pack/plugins/security_solution/public/cases/components/configure_cases/field_mapping_row_static.tsx @@ -28,9 +28,9 @@ const FieldMappingRowComponent: React.FC = ({ selectedActionType, ]); return ( - + - + {securitySolutionField} @@ -40,7 +40,7 @@ const FieldMappingRowComponent: React.FC = ({ - + {isLoading ? ( diff --git a/x-pack/plugins/security_solution/public/cases/containers/types.ts b/x-pack/plugins/security_solution/public/cases/containers/types.ts index 6feb5a1501a76b..ac60f2999c5109 100644 --- a/x-pack/plugins/security_solution/public/cases/containers/types.ts +++ b/x-pack/plugins/security_solution/public/cases/containers/types.ts @@ -117,7 +117,6 @@ export interface AllCases extends CasesStatus { export enum SortFieldCase { createdAt = 'createdAt', closedAt = 'closedAt', - updatedAt = 'updatedAt', } export interface ElasticUser {