add 'user-managed' label to the rule details page for the api keys cr…

…eated by users
elastic · Apr 25, 2023 · eec9043 · eec9043
1 parent b0c7c2d
commit eec9043
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 8 deletions.
diff --git a/x-pack/plugins/triggers_actions_ui/public/application/lib/rule_api/common_transformations.ts b/x-pack/plugins/triggers_actions_ui/public/application/lib/rule_api/common_transformations.ts
@@ -63,6 +63,7 @@ export const transformRule: RewriteRequestCase<Rule> = ({
   created_at: createdAt,
   updated_at: updatedAt,
   api_key_owner: apiKeyOwner,
+  api_key_created_by_user: apiKeyCreatedByUser,
   notify_when: notifyWhen,
   mute_all: muteAll,
   muted_alert_ids: mutedInstanceIds,
@@ -95,6 +96,7 @@ export const transformRule: RewriteRequestCase<Rule> = ({
   activeSnoozes,
   ...(lastRun ? { lastRun: transformLastRun(lastRun) } : {}),
   ...(nextRun ? { nextRun } : {}),
+  ...(apiKeyCreatedByUser !== undefined ? { apiKeyCreatedByUser } : {}),
   ...rest,
 });
 

diff --git a/...gers_actions_ui/public/application/sections/rule_details/components/rule_details.test.tsx b/...gers_actions_ui/public/application/sections/rule_details/components/rule_details.test.tsx
@@ -22,8 +22,6 @@ import {
 import { useKibana } from '../../../../common/lib/kibana';
 import { ruleTypeRegistryMock } from '../../../rule_type_registry.mock';
 
-export const DATE_9999 = '9999-12-31T12:34:56.789Z';
-
 jest.mock('../../../../common/lib/kibana');
 
 jest.mock('../../../../common/lib/config_api', () => ({
@@ -110,12 +108,21 @@ describe('rule_details', () => {
     });
 
     it('renders the API key owner badge when user can manage API keys', () => {
-      const rule = mockRule();
-      expect(
-        shallow(
-          <RuleDetails rule={rule} ruleType={ruleType} actionTypes={[]} {...mockRuleApis} />
-        ).find(<EuiBadge>{rule.apiKeyOwner}</EuiBadge>)
-      ).toBeTruthy();
+      const rule = mockRule({ apiKeyOwner: 'elastic' });
+      const wrapper = mountWithIntl(
+        <RuleDetails rule={rule} ruleType={ruleType} actionTypes={[]} {...mockRuleApis} />
+      );
+      expect(wrapper.find('[data-test-subj="apiKeyOwnerLabel"]').first().text()).toBe('elastic');
+    });
+
+    it('renders the user-managed label when apiKeyCreatedByUser is true', async () => {
+      const rule = mockRule({ apiKeyOwner: 'elastic', apiKeyCreatedByUser: true });
+      const wrapper = mountWithIntl(
+        <RuleDetails rule={rule} ruleType={ruleType} actionTypes={[]} {...mockRuleApis} />
+      );
+      expect(wrapper.find('[data-test-subj="apiKeyOwnerLabel"]').first().text()).toBe(
+        'elastic (user-managed)'
+      );
     });
 
     it(`doesn't render the API key owner badge when user can't manage API keys`, () => {
@@ -819,6 +826,7 @@ describe('rule_details', () => {
         lastExecutionDate: new Date('2020-08-20T19:23:38Z'),
       },
       revision: 0,
+      apiKeyCreatedByUser: false,
       ...overloads,
     };
   }

diff --git a/.../triggers_actions_ui/public/application/sections/rule_details/components/rule_details.tsx b/.../triggers_actions_ui/public/application/sections/rule_details/components/rule_details.tsx
@@ -21,6 +21,7 @@ import {
   EuiButton,
   EuiIcon,
   EuiLink,
+  EuiTextColor,
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { toMountPoint } from '@kbn/kibana-react-plugin/public';
@@ -366,6 +367,15 @@ export const RuleDetails: React.FunctionComponent<RuleDetailsProps> = ({
                   <EuiFlexItem grow={false}>
                     <EuiText size="s" data-test-subj="apiKeyOwnerLabel">
                       <b>{rule.apiKeyOwner}</b>
+                      {rule.apiKeyCreatedByUser ? (
+                        <EuiTextColor color="subdued">
+                          &nbsp;
+                          <FormattedMessage
+                            id="xpack.triggersActionsUI.sections.ruleDetails.userManagedApikey"
+                            defaultMessage="(user-managed)"
+                          />
+                        </EuiTextColor>
+                      ) : null}
                     </EuiText>
                   </EuiFlexItem>
                 </EuiFlexGroup>