Show toaster when attaching to an existing case

elastic · Feb 26, 2021 · 50d851d · 50d851d
1 parent 361336f
commit 50d851d
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 6 deletions.
diff --git a/...ns/security_solution/public/cases/components/timeline_actions/add_to_case_action.test.tsx b/...ns/security_solution/public/cases/components/timeline_actions/add_to_case_action.test.tsx
@@ -30,12 +30,18 @@ jest.mock('../../../common/components/toasters', () => {
 
 jest.mock('../all_cases', () => {
   return {
-    AllCases: ({ onRowClick }: { onRowClick: ({ id }: { id: string }) => void }) => {
+    AllCases: ({ onRowClick }: { onRowClick: (theCase: Partial<Case>) => void }) => {
       return (
         <button
           type="button"
           data-test-subj="all-cases-modal-button"
-          onClick={() => onRowClick({ id: 'selected-case' })}
+          onClick={() =>
+            onRowClick({
+              id: 'selected-case',
+              title: 'the selected case',
+              settings: { syncAlerts: true },
+            })
+          }
         >
           {'case-row'}
         </button>
@@ -219,7 +225,7 @@ describe('AddToCaseAction', () => {
     });
   });
 
-  it('navigates to case view', async () => {
+  it('navigates to case view when attach to a new case', async () => {
     const wrapper = mount(
       <TestProviders>
         <AddToCaseAction {...props} />
@@ -244,4 +250,45 @@ describe('AddToCaseAction', () => {
 
     expect(mockNavigateToApp).toHaveBeenCalledWith('securitySolution:case', { path: '/new-case' });
   });
+
+  it('navigates to case view when attach to an existing case', async () => {
+    usePostCommentMock.mockImplementation(() => {
+      return {
+        ...defaultPostComment,
+        postComment: jest.fn().mockImplementation(({ caseId, data, updateCase }) => {
+          updateCase({
+            id: 'selected-case',
+            title: 'the selected case',
+            settings: { syncAlerts: true },
+          });
+        }),
+      };
+    });
+
+    const wrapper = mount(
+      <TestProviders>
+        <AddToCaseAction {...props} />
+      </TestProviders>
+    );
+
+    wrapper.find(`[data-test-subj="attach-alert-to-case-button"]`).first().simulate('click');
+    wrapper.find(`[data-test-subj="add-existing-case-menu-item"]`).first().simulate('click');
+    wrapper.find(`[data-test-subj="all-cases-modal-button"]`).first().simulate('click');
+
+    expect(mockDispatchToaster).toHaveBeenCalled();
+    const toast = mockDispatchToaster.mock.calls[0][0].toast;
+
+    const toastWrapper = mount(
+      <EuiGlobalToastList toasts={[toast]} toastLifeTimeMs={6000} dismissToast={() => {}} />
+    );
+
+    toastWrapper
+      .find('[data-test-subj="toaster-content-case-view-link"]')
+      .first()
+      .simulate('click');
+
+    expect(mockNavigateToApp).toHaveBeenCalledWith('securitySolution:case', {
+      path: '/selected-case',
+    });
+  });
 });
diff --git a/...plugins/security_solution/public/cases/components/timeline_actions/add_to_case_action.tsx b/...plugins/security_solution/public/cases/components/timeline_actions/add_to_case_action.tsx
@@ -70,7 +70,7 @@ const AddToCaseActionComponent: React.FC<AddToCaseActionProps> = ({
   } = useControl();
 
   const attachAlertToCase = useCallback(
-    async (theCase: Case) => {
+    async (theCase: Case, updateCase?: (newCase: Case) => void) => {
       closeCaseFlyoutOpen();
       await postComment({
         caseId: theCase.id,
@@ -83,6 +83,7 @@ const AddToCaseActionComponent: React.FC<AddToCaseActionProps> = ({
             name: rule?.name != null ? rule.name[0] : null,
           },
         },
+        updateCase,
       });
     },
     [closeCaseFlyoutOpen, postComment, eventId, eventIndex, rule]
@@ -109,9 +110,9 @@ const AddToCaseActionComponent: React.FC<AddToCaseActionProps> = ({
         return;
       }
 
-      attachAlertToCase(theCase);
+      attachAlertToCase(theCase, onCaseSuccess);
     },
-    [attachAlertToCase, openCaseFlyoutOpen]
+    [attachAlertToCase, onCaseSuccess, openCaseFlyoutOpen]
   );
 
   const { modal: allCasesModal, openModal: openAllCaseModal } = useAllCasesModal({