Adjust order and naming of header action buttons

elastic · Sep 30, 2022 · 7d2bd7d · 7d2bd7d
1 parent bfb6b58
commit 7d2bd7d
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 61 deletions.
diff --git a/x-pack/plugins/observability/public/pages/alert_details/components/header_actions.test.tsx b/x-pack/plugins/observability/public/pages/alert_details/components/header_actions.test.tsx
@@ -52,8 +52,6 @@ describe('Header Actions', () => {
     mockKibana();
   });
 
-  const mockViewInExternalApp = jest.fn();
-
   it('should display an actions button', () => {
     const { queryByTestId } = render(<HeaderActions alert={alertWithTags} />);
     expect(queryByTestId('alert-details-header-actions-menu-button')).toBeTruthy();
@@ -82,21 +80,4 @@ describe('Header Actions', () => {
       });
     });
   });
-
-  it('should show a connector action if passed an externalConnector prop', async () => {
-    const { findByRole, getByTestId } = render(
-      <HeaderActions
-        alert={alertWithTags}
-        externalConnector={{ name: 'foo', onViewInExternalApp: mockViewInExternalApp }}
-      />
-    );
-
-    fireEvent.click(await findByRole('button', { name: 'Actions' }));
-    const button = getByTestId('view-in-external-app-button');
-    expect(button).toBeTruthy();
-
-    fireEvent.click(button);
-
-    expect(mockViewInExternalApp).toBeCalledTimes(1);
-  });
 });
diff --git a/x-pack/plugins/observability/public/pages/alert_details/components/header_actions.tsx b/x-pack/plugins/observability/public/pages/alert_details/components/header_actions.tsx
@@ -20,13 +20,9 @@ import { TopAlert } from '../../alerts';
 
 export interface HeaderActionsProps {
   alert: TopAlert | null;
-  externalConnector?: {
-    name: string;
-    onViewInExternalApp: (alertId: string) => void;
-  };
 }
 
-export function HeaderActions({ alert, externalConnector }: HeaderActionsProps) {
+export function HeaderActions({ alert }: HeaderActionsProps) {
   const {
     http,
     cases: {
@@ -69,7 +65,7 @@ export function HeaderActions({ alert, externalConnector }: HeaderActionsProps)
     selectCaseModal.open({ attachments });
   };
 
-  const handleViewRuleConditions = () => {
+  const handleViewRuleDetails = () => {
     setIsPopoverOpen(false);
     setRuleConditionsFlyoutOpen(true);
   };
@@ -79,12 +75,6 @@ export function HeaderActions({ alert, externalConnector }: HeaderActionsProps)
     setSnoozeModalOpen(true);
   };
 
-  const handleOpenInExternalApp = () => {
-    if (alert) {
-      externalConnector?.onViewInExternalApp(alert.fields[ALERT_UUID]);
-    }
-  };
-
   return (
     <>
       <EuiPopover
@@ -108,58 +98,42 @@ export function HeaderActions({ alert, externalConnector }: HeaderActionsProps)
           <EuiButtonEmpty
             size="s"
             color="text"
-            onClick={handleAddToCase}
-            data-test-subj="add-to-case-button"
+            disabled={!alert?.fields[ALERT_RULE_UUID]}
+            onClick={handleViewRuleDetails}
+            data-test-subj="view-rule-details-button"
           >
             <EuiText size="s">
-              {i18n.translate('xpack.observability.alertDetails.addToCase', {
-                defaultMessage: 'Add to case',
+              {i18n.translate('xpack.observability.alertDetails.viewRuleDetails', {
+                defaultMessage: 'View rule details',
               })}
             </EuiText>
           </EuiButtonEmpty>
 
           <EuiButtonEmpty
             size="s"
             color="text"
-            disabled={!alert?.fields[ALERT_RULE_UUID]}
-            onClick={handleViewRuleConditions}
-            data-test-subj="view-rule-conditions-button"
+            onClick={handleOpenSnoozeModal}
+            data-test-subj="snooze-rule-button"
           >
             <EuiText size="s">
-              {i18n.translate('xpack.observability.alertDetails.viewRuleConditons', {
-                defaultMessage: 'View rule conditions',
+              {i18n.translate('xpack.observability.alertDetails.editSnoozeRule', {
+                defaultMessage: 'Snooze the rule',
               })}
             </EuiText>
           </EuiButtonEmpty>
 
           <EuiButtonEmpty
             size="s"
             color="text"
-            onClick={handleOpenSnoozeModal}
-            data-test-subj="snooze-rule-button"
+            onClick={handleAddToCase}
+            data-test-subj="add-to-case-button"
           >
             <EuiText size="s">
-              {i18n.translate('xpack.observability.alertDetails.editSnoozeRule', {
-                defaultMessage: 'Snooze the rule',
+              {i18n.translate('xpack.observability.alertDetails.addToCase', {
+                defaultMessage: 'Add to case',
               })}
             </EuiText>
           </EuiButtonEmpty>
-
-          {externalConnector ? (
-            <EuiButtonEmpty
-              size="s"
-              color="text"
-              onClick={handleOpenInExternalApp}
-              data-test-subj="view-in-external-app-button"
-            >
-              <EuiText size="s">
-                {i18n.translate('xpack.observability.alertDetails.viewInExternalApp', {
-                  defaultMessage: 'View in {name}',
-                  values: { name: externalConnector.name },
-                })}
-              </EuiText>
-            </EuiButtonEmpty>
-          ) : null}
         </EuiFlexGroup>
       </EuiPopover>
 

diff --git a/x-pack/plugins/observability/public/pages/alert_details/components/page_title.test.tsx b/x-pack/plugins/observability/public/pages/alert_details/components/page_title.test.tsx
@@ -22,7 +22,7 @@ describe('Page Title', () => {
 
   it('should display a title when it is passed', () => {
     const { getByText } = renderComp(defaultProps);
-    expect(getByText('Great success')).toBeTruthy();
+    expect(getByText(defaultProps.title)).toBeTruthy();
   });
 
   it('should display an active badge when active is true', async () => {