[7.12] [Security Solution] Case ui enhancement (#91863) (#93395)

* [Security Solution] Case ui enhancement (#91863) * ui enhancement * fix actions * unit test * update row actions * add case status all * update find status * fix type * remove all case count from dropdown * fix type error * fix unit test * disable bulk actions on status all * clean up * fix types * fix cypress tests * review * review * update status is only available for individual cases * update available actions on status all * fix unit test * remove lodash get * rename status all * omit status if it is set to all * do not sent status if itis set to all * Remove all status from the backend * Hide actions on all status * fix unit test Co-authored-by: Kibana Machine <[email protected]> Co-authored-by: Christos Nasikas <[email protected]> # Conflicts: # x-pack/plugins/security_solution/public/cases/components/all_cases/actions.tsx # x-pack/plugins/security_solution/public/cases/components/all_cases/index.test.tsx # x-pack/plugins/security_solution/public/cases/components/bulk_actions/index.tsx # x-pack/plugins/security_solution/public/cases/components/status/config.ts * fix unit tests * fix cypress test
elastic · Mar 3, 2021 · a6f9c40 · a6f9c40
1 parent 6ea2399
commit a6f9c40
Show file tree

Hide file tree

Showing 24 changed files with 342 additions and 104 deletions.
diff --git a/x-pack/plugins/case/server/routes/api/cases/find_cases.ts b/x-pack/plugins/case/server/routes/api/cases/find_cases.ts
@@ -37,7 +37,6 @@ export function initFindCasesApi({ caseService, router, logger }: RouteDeps) {
           CasesFindRequestRt.decode(request.query),
           fold(throwErrors(Boom.badRequest), identity)
         );
-
         const queryArgs = {
           tags: queryParams.tags,
           reporters: queryParams.reporters,
@@ -47,7 +46,6 @@ export function initFindCasesApi({ caseService, router, logger }: RouteDeps) {
         };
 
         const caseQueries = constructQueryOptions(queryArgs);
-
         const cases = await caseService.findCasesGroupedByID({
           client,
           caseOptions: { ...queryParams, ...caseQueries.case },

diff --git a/x-pack/plugins/case/server/routes/api/cases/helpers.ts b/x-pack/plugins/case/server/routes/api/cases/helpers.ts
@@ -28,7 +28,7 @@ export const addStatusFilter = ({
   appendFilter,
   type = CASE_SAVED_OBJECT,
 }: {
-  status: CaseStatuses | undefined;
+  status?: CaseStatuses;
   appendFilter?: string;
   type?: string;
 }) => {

diff --git a/x-pack/plugins/security_solution/cypress/integration/cases/creation.spec.ts b/x-pack/plugins/security_solution/cypress/integration/cases/creation.spec.ts
@@ -6,6 +6,7 @@
  */
 
 import { case1 } from '../../objects/case';
+import { COLLAPSED_ACTION_BTN } from '../../screens/alerts_detection_rules';
 
 import {
   ALL_CASES_CLOSE_ACTION,
@@ -47,6 +48,7 @@ import {
   backToCases,
   createCase,
   fillCasesMandatoryfields,
+  filterStatusOpen,
 } from '../../tasks/create_new_case';
 import { loginAndWaitForPageWithoutDateRange } from '../../tasks/login';
 
@@ -75,6 +77,7 @@ describe('Cases', () => {
     attachTimeline(this.mycase);
     createCase();
     backToCases();
+    filterStatusOpen();
 
     cy.get(ALL_CASES_PAGE_TITLE).should('have.text', 'Cases');
     cy.get(ALL_CASES_OPEN_CASES_STATS).should('have.text', 'Open cases1');
@@ -91,6 +94,7 @@ describe('Cases', () => {
     cy.get(ALL_CASES_COMMENTS_COUNT).should('have.text', '0');
     cy.get(ALL_CASES_OPENED_ON).should('include.text', 'ago');
     cy.get(ALL_CASES_SERVICE_NOW_INCIDENT).should('have.text', 'Not pushed');
+    cy.get(COLLAPSED_ACTION_BTN).click();
     cy.get(ALL_CASES_DELETE_ACTION).should('exist');
     cy.get(ALL_CASES_CLOSE_ACTION).should('exist');
 

diff --git a/x-pack/plugins/security_solution/cypress/screens/all_cases.ts b/x-pack/plugins/security_solution/cypress/screens/all_cases.ts
@@ -27,6 +27,8 @@ export const ALL_CASES_NAME = '[data-test-subj="case-details-link"]';
 
 export const ALL_CASES_OPEN_CASES_COUNT = '[data-test-subj="case-status-filter"]';
 
+export const ALL_CASES_OPEN_FILTER = '[data-test-subj="case-status-filter-open"]';
+
 export const ALL_CASES_OPEN_CASES_STATS = '[data-test-subj="openStatsHeader"]';
 
 export const ALL_CASES_OPENED_ON = '[data-test-subj="case-table-column-createdAt"]';

diff --git a/x-pack/plugins/security_solution/cypress/tasks/create_new_case.ts b/x-pack/plugins/security_solution/cypress/tasks/create_new_case.ts
@@ -11,6 +11,7 @@ import {
   ServiceNowconnectorOptions,
   TestCase,
 } from '../objects/case';
+import { ALL_CASES_OPEN_CASES_COUNT, ALL_CASES_OPEN_FILTER } from '../screens/all_cases';
 
 import {
   BACK_TO_CASES_BTN,
@@ -40,6 +41,11 @@ export const backToCases = () => {
   cy.get(BACK_TO_CASES_BTN).click({ force: true });
 };
 
+export const filterStatusOpen = () => {
+  cy.get(ALL_CASES_OPEN_CASES_COUNT).click();
+  cy.get(ALL_CASES_OPEN_FILTER).click();
+};
+
 export const fillCasesMandatoryfields = (newCase: TestCase) => {
   cy.get(TITLE_INPUT).type(newCase.name, { force: true });
   newCase.tags.forEach((tag) => {

diff --git a/x-pack/plugins/security_solution/public/cases/components/all_cases/actions.tsx b/x-pack/plugins/security_solution/public/cases/components/all_cases/actions.tsx
@@ -12,31 +12,21 @@ import { CaseStatuses } from '../../../../../case/common/api';
 import { Case, SubCase } from '../../containers/types';
 import { UpdateCase } from '../../containers/use_get_cases';
 import * as i18n from './translations';
+import { isIndividual } from './helpers';
 
 interface GetActions {
   caseStatus: string;
   dispatchUpdate: Dispatch<Omit<UpdateCase, 'refetchCasesStatus'>>;
   deleteCaseOnClick: (deleteCase: Case) => void;
 }
 
-const hasSubCases = (subCases: SubCase[] | null | undefined) =>
-  subCases != null && subCases?.length > 0;
-
 export const getActions = ({
   caseStatus,
   dispatchUpdate,
   deleteCaseOnClick,
 }: GetActions): Array<DefaultItemIconButtonAction<Case>> => [
   {
-    description: i18n.DELETE_CASE,
-    icon: 'trash',
-    name: i18n.DELETE_CASE,
-    onClick: deleteCaseOnClick,
-    type: 'icon',
-    'data-test-subj': 'action-delete',
-  },
-  {
-    available: (item) => caseStatus === CaseStatuses.open && !hasSubCases(item.subCases),
+    enabled: (item: Case | SubCase) => isIndividual(item) && item.status !== CaseStatuses.closed,
     description: i18n.CLOSE_CASE,
     icon: 'folderCheck',
     name: i18n.CLOSE_CASE,
@@ -51,9 +41,9 @@ export const getActions = ({
     'data-test-subj': 'action-close',
   },
   {
-    available: (item) => caseStatus !== CaseStatuses.open && !hasSubCases(item.subCases),
+    enabled: (item: Case | SubCase) => isIndividual(item) && item.status !== CaseStatuses.open,
     description: i18n.REOPEN_CASE,
-    icon: 'folderExclamation',
+    icon: 'folderOpen',
     name: i18n.REOPEN_CASE,
     onClick: (theCase: Case) =>
       dispatchUpdate({
@@ -65,4 +55,12 @@ export const getActions = ({
     type: 'icon',
     'data-test-subj': 'action-open',
   },
+  {
+    description: i18n.DELETE_CASE,
+    icon: 'trash',
+    name: i18n.DELETE_CASE,
+    onClick: deleteCaseOnClick,
+    type: 'icon',
+    'data-test-subj': 'action-delete',
+  },
 ];
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
@@ -19,7 +19,7 @@ import { RIGHT_ALIGNMENT } from '@elastic/eui/lib/services';
 import styled from 'styled-components';
 import { DefaultItemIconButtonAction } from '@elastic/eui/src/components/basic_table/action_types';
 
-import { CaseStatuses } from '../../../../../case/common/api';
+import { CaseStatuses, CaseType } from '../../../../../case/common/api';
 import { getEmptyTagValue } from '../../../common/components/empty_value';
 import { Case, SubCase } from '../../containers/types';
 import { FormattedRelativePreferenceDate } from '../../../common/components/formatted_date';
@@ -204,7 +204,7 @@ export const getCasesColumns = (
       name: i18n.STATUS,
       render: (theCase: Case) => {
         if (theCase?.subCases == null || theCase.subCases.length === 0) {
-          if (theCase.status == null) {
+          if (theCase.status == null || theCase.type === CaseType.collection) {
             return getEmptyTagValue();
           }
           return <Status type={theCase.status} />;

diff --git a/x-pack/plugins/security_solution/public/cases/components/all_cases/helpers.ts b/x-pack/plugins/security_solution/public/cases/components/all_cases/helpers.ts
@@ -6,14 +6,24 @@
  */
 
 import { filter } from 'lodash/fp';
-import { AssociationType, CaseStatuses } from '../../../../../case/common/api';
+import { AssociationType, CaseStatuses, CaseType } from '../../../../../case/common/api';
 import { Case, SubCase } from '../../containers/types';
 import { statuses } from '../status';
 
+export const isSelectedCasesIncludeCollections = (selectedCases: Case[]) =>
+  selectedCases.length > 0 &&
+  selectedCases.some((caseObj: Case) => caseObj.type === CaseType.collection);
+
 export const isSubCase = (theCase: Case | SubCase): theCase is SubCase =>
   (theCase as SubCase).caseParentId !== undefined &&
   (theCase as SubCase).associationType === AssociationType.subCase;
 
+export const isCollection = (theCase: Case | SubCase | null | undefined) =>
+  theCase != null && (theCase as Case).type === CaseType.collection;
+
+export const isIndividual = (theCase: Case | SubCase | null | undefined) =>
+  theCase != null && (theCase as Case).type === CaseType.individual;
+
 export const getSubCasesStatusCountsBadges = (
   subCases: SubCase[]
 ): Array<{ name: CaseStatuses; color: string; count: number }> => {