diff --git a/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.scss b/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.scss
index 32ab1bd7b1821..24dbb865742d8 100644
--- a/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.scss
+++ b/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.scss
@@ -7,3 +7,10 @@
box-shadow: none;
}
}
+
+.actConnectorsListGrid {
+ .euiToolTipAnchor,
+ .euiCard {
+ height: 100%;
+ }
+}
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 70aa862aa3c3d..0fb759226c21f 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', () => {
);
- 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 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 2dd5e413faf9c..91ecfb2fa8ded 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 {card};
+ return (
+
+ {checkEnabledResult.isEnabled && card}
+ {checkEnabledResult.isEnabled === false && (
+
+ {card}
+
+ )}
+
+ );
});
return (