From 6c9926c91376f7ae2dcc471eb77960cf7eb11ce0 Mon Sep 17 00:00:00 2001
From: Yuliia Naumenko <yuliia.naumenko@elastic.com>
Date: Tue, 24 Mar 2020 09:25:38 -0700
Subject: [PATCH] Remove "Upgrade" badge on disabled action types in the create
 connector flyout

---
 .../action_type_menu.test.tsx                 |  7 +-----
 .../action_type_menu.tsx                      | 23 +++++++++----------
 2 files changed, 12 insertions(+), 18 deletions(-)

diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_menu.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_menu.test.tsx
index 84d5269337b9e6..0fb759226c21fd 100644
--- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_menu.test.tsx
+++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_menu.test.tsx
@@ -184,11 +184,6 @@ describe('connector_add_flyout', () => {
       </ActionsConnectorsContextProvider>
     );
 
-    const element = wrapper.find('[data-test-subj="my-action-type-card"]');
-    expect(element.exists()).toBeTruthy();
-    expect(element.first().prop('betaBadgeLabel')).toEqual('Upgrade');
-    expect(element.first().prop('betaBadgeTooltipContent')).toEqual(
-      'This connector is disabled because it requires a gold license.'
-    );
+    expect(wrapper.find('EuiToolTip [data-test-subj="my-action-type-card"]').exists()).toBeTruthy();
   });
 });
diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_menu.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_menu.tsx
index 2dd5e413faf9c5..91ecfb2fa8dedd 100644
--- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_menu.tsx
+++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_menu.tsx
@@ -6,6 +6,7 @@
 import React, { useEffect, useState } from 'react';
 import { EuiFlexItem, EuiCard, EuiIcon, EuiFlexGrid, EuiSpacer } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
+import { EuiToolTip } from '@elastic/eui';
 import { ActionType, ActionTypeIndex } from '../../../types';
 import { loadActionTypes } from '../../lib/action_connector_api';
 import { useActionsConnectorsContext } from '../../context/actions_connectors_context';
@@ -81,21 +82,19 @@ export const ActionTypeMenu = ({
           description={item.selectMessage}
           isDisabled={!checkEnabledResult.isEnabled}
           onClick={() => onActionTypeChange(item.actionType)}
-          betaBadgeLabel={
-            checkEnabledResult.isEnabled
-              ? undefined
-              : i18n.translate(
-                  'xpack.triggersActionsUI.sections.actionsConnectorsList.upgradeBadge',
-                  { defaultMessage: 'Upgrade' }
-                )
-          }
-          betaBadgeTooltipContent={
-            checkEnabledResult.isEnabled ? undefined : checkEnabledResult.message
-          }
         />
       );
 
-      return <EuiFlexItem key={index}>{card}</EuiFlexItem>;
+      return (
+        <EuiFlexItem key={index}>
+          {checkEnabledResult.isEnabled && card}
+          {checkEnabledResult.isEnabled === false && (
+            <EuiToolTip position="top" content={checkEnabledResult.message}>
+              {card}
+            </EuiToolTip>
+          )}
+        </EuiFlexItem>
+      );
     });
 
   return (