[7.x] [Security Solution] Case ui enhancement (#91863)

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 },

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;
 }) => {

x-pack/plugins/security_solution/cypress/integration/cases/creation.spec.ts

@@ -46,6 +46,7 @@ import {
   backToCases,
   createCase,
   fillCasesMandatoryfields,
+  filterStatusOpen,
 } from '../../tasks/create_new_case';
 import { loginAndWaitForPageWithoutDateRange } from '../../tasks/login';
 
@@ -74,6 +75,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');

x-pack/plugins/security_solution/cypress/screens/all_cases.ts

@@ -25,6 +25,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"]';

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) => {

x-pack/plugins/security_solution/public/cases/components/all_cases/actions.tsx

@@ -13,23 +13,22 @@ import { Case, SubCase } from '../../containers/types';
 import { UpdateCase } from '../../containers/use_get_cases';
 import { statuses } from '../status';
 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>> => {
   const openCaseAction = {
-    available: (item: Case) => caseStatus !== CaseStatuses.open && !hasSubCases(item.subCases),
+    available: (item: Case | SubCase) => item.status !== CaseStatuses.open,
+    enabled: (item: Case | SubCase) => isIndividual(item),
     description: statuses[CaseStatuses.open].actions.single.title,
     icon: statuses[CaseStatuses.open].icon,
     name: statuses[CaseStatuses.open].actions.single.title,
@@ -45,8 +44,8 @@ export const getActions = ({
   };
 
   const makeInProgressAction = {
-    available: (item: Case) =>
-      caseStatus !== CaseStatuses['in-progress'] && !hasSubCases(item.subCases),
+    available: (item: Case) => item.status !== CaseStatuses['in-progress'],
+    enabled: (item: Case | SubCase) => isIndividual(item),
     description: statuses[CaseStatuses['in-progress']].actions.single.title,
     icon: statuses[CaseStatuses['in-progress']].icon,
     name: statuses[CaseStatuses['in-progress']].actions.single.title,
@@ -62,7 +61,8 @@ export const getActions = ({
   };
 
   const closeCaseAction = {
-    available: (item: Case) => caseStatus !== CaseStatuses.closed && !hasSubCases(item.subCases),
+    available: (item: Case | SubCase) => item.status !== CaseStatuses.closed,
+    enabled: (item: Case | SubCase) => isIndividual(item),
     description: statuses[CaseStatuses.closed].actions.single.title,
     icon: statuses[CaseStatuses.closed].icon,
     name: statuses[CaseStatuses.closed].actions.single.title,
@@ -78,6 +78,9 @@ export const getActions = ({
   };
 
   return [
+    openCaseAction,
+    makeInProgressAction,
+    closeCaseAction,
     {
       description: i18n.DELETE_CASE,
       icon: 'trash',
@@ -86,8 +89,5 @@ export const getActions = ({
       type: 'icon',
       'data-test-subj': 'action-delete',
     },
-    openCaseAction,
-    makeInProgressAction,
-    closeCaseAction,
   ];
 };

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} />;

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 }> => {