[SIEM] [Case] Bulk status update, add comment avatar, id => title in breadcrumbs

x-pack/legacy/plugins/siem/public/containers/case/api.ts

@@ -15,7 +15,15 @@ import {
   User,
 } from '../../../../../../plugins/case/common/api';
 import { KibanaServices } from '../../lib/kibana';
-import { AllCases, Case, CasesStatus, Comment, FetchCasesProps, SortFieldCase } from './types';
+import {
+  AllCases,
+  BulkUpdateStatus,
+  Case,
+  CasesStatus,
+  Comment,
+  FetchCasesProps,
+  SortFieldCase,
+} from './types';
 import { CASES_URL } from './constants';
 import {
   convertToCamelCase,
@@ -92,7 +100,7 @@ export const getCases = async ({
 };
 
 export const postCase = async (newCase: CaseRequest): Promise<Case> => {
-  const response = await KibanaServices.get().http.fetch<CaseResponse>(`${CASES_URL}`, {
+  const response = await KibanaServices.get().http.fetch<CaseResponse>(CASES_URL, {
     method: 'POST',
     body: JSON.stringify(newCase),
   });
@@ -104,13 +112,21 @@ export const patchCase = async (
   updatedCase: Partial<CaseRequest>,
   version: string
 ): Promise<Case[]> => {
-  const response = await KibanaServices.get().http.fetch<CasesResponse>(`${CASES_URL}`, {
+  const response = await KibanaServices.get().http.fetch<CasesResponse>(CASES_URL, {
     method: 'PATCH',
     body: JSON.stringify({ cases: [{ ...updatedCase, id: caseId, version }] }),
   });
   return convertToCamelCase<CasesResponse, Case[]>(decodeCasesResponse(response));
 };
 
+export const patchCasesStatus = async (cases: BulkUpdateStatus[]): Promise<Case[]> => {
+  const response = await KibanaServices.get().http.fetch<CasesResponse>(CASES_URL, {
+    method: 'PATCH',
+    body: JSON.stringify({ cases }),
+  });
+  return convertToCamelCase<CasesResponse, Case[]>(decodeCasesResponse(response));
+};
+
 export const postComment = async (newComment: CommentRequest, caseId: string): Promise<Comment> => {
   const response = await KibanaServices.get().http.fetch<CommentResponse>(
     `${CASES_URL}/${caseId}/comments`,
@@ -139,7 +155,7 @@ export const patchComment = async (
 };
 
 export const deleteCases = async (caseIds: string[]): Promise<boolean> => {
-  const response = await KibanaServices.get().http.fetch<string>(`${CASES_URL}`, {
+  const response = await KibanaServices.get().http.fetch<string>(CASES_URL, {
     method: 'DELETE',
     query: { ids: JSON.stringify(caseIds) },
   });

x-pack/legacy/plugins/siem/public/containers/case/types.ts

@@ -75,3 +75,9 @@ export interface FetchCasesProps {
 export interface ApiProps {
   signal: AbortSignal;
 }
+
+export interface BulkUpdateStatus {
+  status: string;
+  id: string;
+  version: string;
+}

x-pack/legacy/plugins/siem/public/containers/case/use_bulk_update_case.tsx

@@ -0,0 +1,106 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { useCallback, useReducer } from 'react';
+import { errorToToaster, useStateToaster } from '../../components/toasters';
+import * as i18n from './translations';
+import { patchCasesStatus } from './api';
+import { BulkUpdateStatus, Case } from './types';
+
+interface UpdateState {
+  isUpdated: boolean;
+  isLoading: boolean;
+  isError: boolean;
+}
+type Action =
+  | { type: 'FETCH_INIT' }
+  | { type: 'FETCH_SUCCESS'; payload: boolean }
+  | { type: 'FETCH_FAILURE' }
+  | { type: 'RESET_IS_UPDATED' };
+
+const dataFetchReducer = (state: UpdateState, action: Action): UpdateState => {
+  switch (action.type) {
+    case 'FETCH_INIT':
+      return {
+        ...state,
+        isLoading: true,
+        isError: false,
+      };
+    case 'FETCH_SUCCESS':
+      return {
+        ...state,
+        isLoading: false,
+        isError: false,
+        isUpdated: action.payload,
+      };
+    case 'FETCH_FAILURE':
+      return {
+        ...state,
+        isLoading: false,
+        isError: true,
+      };
+    case 'RESET_IS_UPDATED':
+      return {
+        ...state,
+        isUpdated: false,
+      };
+    default:
+      return state;
+  }
+};
+interface UseUpdateCase extends UpdateState {
+  updateBulkStatus: (cases: Case[], status: string) => void;
+  dispatchResetIsUpdated: () => void;
+}
+
+export const useUpdateCases = (): UseUpdateCase => {
+  const [state, dispatch] = useReducer(dataFetchReducer, {
+    isLoading: false,
+    isError: false,
+    isUpdated: false,
+  });
+  const [, dispatchToaster] = useStateToaster();
+
+  const dispatchUpdateCases = useCallback((cases: BulkUpdateStatus[]) => {
+    let cancel = false;
+    const patchData = async () => {
+      try {
+        dispatch({ type: 'FETCH_INIT' });
+        await patchCasesStatus(cases);
+        if (!cancel) {
+          dispatch({ type: 'FETCH_SUCCESS', payload: true });
+        }
+      } catch (error) {
+        if (!cancel) {
+          errorToToaster({
+            title: i18n.ERROR_TITLE,
+            error: error.body && error.body.message ? new Error(error.body.message) : error,
+            dispatchToaster,
+          });
+          dispatch({ type: 'FETCH_FAILURE' });
+        }
+      }
+    };
+    patchData();
+    return () => {
+      cancel = true;
+    };
+  }, []);
+
+  const dispatchResetIsUpdated = useCallback(() => {
+    dispatch({ type: 'RESET_IS_UPDATED' });
+  }, []);
+
+  const updateBulkStatus = useCallback((cases: Case[], status: string) => {
+    const updateCasesStatus: BulkUpdateStatus[] = cases.map(theCase => ({
+      status,
+      id: theCase.id,
+      version: theCase.version,
+    }));
+    dispatchUpdateCases(updateCasesStatus);
+  }, []);
+  return { ...state, updateBulkStatus, dispatchResetIsUpdated };
+};

x-pack/legacy/plugins/siem/public/lib/kibana/hooks.ts

@@ -6,8 +6,13 @@
 
 import moment from 'moment-timezone';
 
+import { useCallback, useEffect, useState } from 'react';
+import { i18n } from '@kbn/i18n';
 import { DEFAULT_DATE_FORMAT, DEFAULT_DATE_FORMAT_TZ } from '../../../common/constants';
 import { useUiSetting, useKibana } from './kibana_react';
+import { errorToToaster, useStateToaster } from '../../components/toasters';
+import { AuthenticatedUser } from '../../../../../../plugins/security/common/model';
+import { convertToCamelCase } from '../../containers/case/utils';
 
 export const useDateFormat = (): string => useUiSetting<string>(DEFAULT_DATE_FORMAT);
 
@@ -17,3 +22,62 @@ export const useTimeZone = (): string => {
 };
 
 export const useBasePath = (): string => useKibana().services.http.basePath.get();
+
+interface UserRealm {
+  name: string;
+  type: string;
+}
+
+export interface AuthenticatedElasticUser {
+  username: string;
+  email: string;
+  fullName: string;
+  roles: string[];
+  enabled: boolean;
+  metadata?: {
+    _reserved: boolean;
+  };
+  authenticationRealm: UserRealm;
+  lookupRealm: UserRealm;
+  authenticationProvider: string;
+}
+
+export const useCurrentUser = (): AuthenticatedElasticUser | null => {
+  const [user, setUser] = useState<AuthenticatedElasticUser | null>(null);
+
+  const [, dispatchToaster] = useStateToaster();
+
+  const { security } = useKibana().services;
+
+  const fetchUser = useCallback(() => {
+    let didCancel = false;
+    const fetchData = async () => {
+      try {
+        const response = await security.authc.getCurrentUser();
+        if (!didCancel) {
+          setUser(convertToCamelCase<AuthenticatedUser, AuthenticatedElasticUser>(response));
+        }
+      } catch (error) {
+        if (!didCancel) {
+          errorToToaster({
+            title: i18n.translate('xpack.siem.getCurrentUser.Error', {
+              defaultMessage: 'Error getting user',
+            }),
+            error: error.body && error.body.message ? new Error(error.body.message) : error,
+            dispatchToaster,
+          });
+          setUser(null);
+        }
+      }
+    };
+    fetchData();
+    return () => {
+      didCancel = true;
+    };
+  }, [security]);
+
+  useEffect(() => {
+    fetchUser();
+  }, []);
+  return user;
+};

x-pack/legacy/plugins/siem/public/pages/case/components/all_cases/__mock__/index.tsx

@@ -10,7 +10,7 @@ import { UseGetCasesState } from '../../../../../containers/case/use_get_cases';
 export const useGetCasesMockState: UseGetCasesState = {
   data: {
     countClosedCases: 0,
-    countOpenCases: 0,
+    countOpenCases: 5,
     cases: [
       {
         id: '3c4ddcc0-4e99-11ea-9290-35d05cb55c15',