[Response Ops] Rule Specific Flapping - Create/Edit Rule Flyout Front…

…end Changes (#189341)

## Summary
Issue: #189135

Frontend changes for the rule specific flapping feature in the existing
rule flyout.

To test: Simply go to
`x-pack/plugins/triggers_actions_ui/public/common/constants/index.ts`
and set line 89 `IS_RULE_SPECIFIC_FLAPPING_ENABLED = false` to `true`.
This acts as a feature flag. Then you may go to the create/edit rule
flyout to see this new input. This PR does not contain changes to allow
for saving/editing of this field. That will come with the backend PR.

### Flapping Enabled Without Override
<img width="648" alt="Screenshot 2024-07-29 at 12 11 02 AM"
src="https://github.com/user-attachments/assets/82b552c5-faf3-459f-a22d-69ea95292d89">

### Flapping Enabled With Override
<img width="652" alt="Screenshot 2024-07-29 at 12 11 07 AM"
src="https://github.com/user-attachments/assets/2d305570-8cd6-4488-af5b-8c78cb3c2b3a">

### Flapping Disabled With or Without Override
<img width="652" alt="image"
src="https://github.com/user-attachments/assets/5bb76e6a-85e5-4992-a37f-a737d083ec54">

### Checklist
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

---------

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>

packages/kbn-alerting-types/index.ts

@@ -17,4 +17,5 @@ export * from './r_rule_types';
 export * from './rule_notify_when_type';
 export * from './rule_type_types';
 export * from './rule_types';
+export * from './rule_flapping';
 export * from './search_strategy_types';

packages/kbn-alerting-types/rule_flapping.ts

@@ -0,0 +1,12 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+export const MIN_LOOK_BACK_WINDOW = 2;
+export const MAX_LOOK_BACK_WINDOW = 20;
+export const MIN_STATUS_CHANGE_THRESHOLD = 2;
+export const MAX_STATUS_CHANGE_THRESHOLD = 20;

packages/kbn-alerting-types/rule_types.ts

@@ -239,6 +239,10 @@ export interface Rule<Params extends RuleTypeParams = never> {
   running?: boolean | null;
   viewInAppRelativeUrl?: string;
   alertDelay?: AlertDelay | null;
+  flapping?: {
+    lookBackWindow: number;
+    statusChangeThreshold: number;
+  };
 }
 
 export type SanitizedRule<Params extends RuleTypeParams = never> = Omit<

packages/kbn-alerts-ui-shared/src/common/apis/create_rule/create_rule.test.ts

@@ -62,6 +62,10 @@ describe('createRule', () => {
       alert_delay: {
         active: 10,
       },
+      flapping: {
+        look_back_window: 10,
+        status_change_threshold: 10,
+      },
     };
 
     const ruleToCreate: CreateRuleBody<RuleTypeParams> = {
@@ -109,10 +113,18 @@ describe('createRule', () => {
       alertDelay: {
         active: 10,
       },
+      flapping: {
+        lookBackWindow: 10,
+        statusChangeThreshold: 10,
+      },
     };
     http.post.mockResolvedValueOnce(resolvedValue);
 
     const result = await createRule({ http, rule: ruleToCreate as CreateRuleBody });
+    expect(http.post).toHaveBeenCalledWith('/api/alerting/rule', {
+      body: '{"params":{"aggType":"count","termSize":5,"thresholdComparator":">","timeWindowSize":5,"timeWindowUnit":"m","groupBy":"all","threshold":[1000],"index":[".kibana"],"timeField":"alert.executionStatus.lastExecutionDate"},"consumer":"alerts","schedule":{"interval":"1m"},"tags":[],"name":"test","enabled":true,"throttle":null,"notifyWhen":"onActionGroupChange","rule_type_id":".index-threshold","actions":[{"group":"threshold met","id":"83d4d860-9316-11eb-a145-93ab369a4461","params":{"level":"info","message":"Rule \'{{rule.name}}\' is active for group \'{{context.group}}\':\\n\\n- Value: {{context.value}}\\n- Conditions Met: {{context.conditions}} over {{rule.params.timeWindowSize}}{{rule.params.timeWindowUnit}}\\n- Timestamp: {{context.date}}"},"frequency":{"notify_when":"onActionGroupChange","throttle":null,"summary":false}},{"id":".test-system-action","params":{}}],"alert_delay":{"active":10},"flapping":{"look_back_window":10,"status_change_threshold":10}}',
+    });
+
     expect(result).toEqual({
       actions: [
         {
@@ -169,6 +181,10 @@ describe('createRule', () => {
       alertDelay: {
         active: 10,
       },
+      flapping: {
+        lookBackWindow: 10,
+        statusChangeThreshold: 10,
+      },
     });
   });
 });

packages/kbn-alerts-ui-shared/src/common/apis/create_rule/transform_create_rule_body.test.ts

@@ -55,6 +55,10 @@ const ruleToCreate: CreateRuleBody<RuleTypeParams> = {
   alertDelay: {
     active: 10,
   },
+  flapping: {
+    lookBackWindow: 10,
+    statusChangeThreshold: 10,
+  },
 };
 
 describe('transformCreateRuleBody', () => {
@@ -96,8 +100,11 @@ describe('transformCreateRuleBody', () => {
         },
         { id: '.test-system-action', params: {} },
       ],
-
       alert_delay: { active: 10 },
+      flapping: {
+        look_back_window: 10,
+        status_change_threshold: 10,
+      },
     });
   });
 });

packages/kbn-alerts-ui-shared/src/common/apis/create_rule/transform_create_rule_body.ts

@@ -8,11 +8,26 @@
 
 import { RewriteResponseCase } from '@kbn/actions-types';
 import { CreateRuleBody } from './types';
+import { Rule } from '../../types';
+
+const transformCreateRuleFlapping = (flapping: Rule['flapping']) => {
+  if (!flapping) {
+    return flapping;
+  }
+
+  return {
+    flapping: {
+      look_back_window: flapping.lookBackWindow,
+      status_change_threshold: flapping.statusChangeThreshold,
+    },
+  };
+};
 
 export const transformCreateRuleBody: RewriteResponseCase<CreateRuleBody> = ({
   ruleTypeId,
   actions = [],
   alertDelay,
+  flapping,
   ...res
 }): any => ({
   ...res,
@@ -44,4 +59,5 @@ export const transformCreateRuleBody: RewriteResponseCase<CreateRuleBody> = ({
     };
   }),
   ...(alertDelay ? { alert_delay: alertDelay } : {}),
+  ...(flapping !== undefined ? transformCreateRuleFlapping(flapping) : {}),
 });

packages/kbn-alerts-ui-shared/src/common/apis/create_rule/types.ts

@@ -20,4 +20,5 @@ export interface CreateRuleBody<Params extends RuleTypeParams = RuleTypeParams>
   throttle?: Rule<Params>['throttle'];
   notifyWhen?: Rule<Params>['notifyWhen'];
   alertDelay?: Rule<Params>['alertDelay'];
+  flapping?: Rule<Params>['flapping'];
 }

packages/kbn-alerts-ui-shared/src/common/apis/update_rule/transform_update_rule_body.test.ts

@@ -52,6 +52,10 @@ const ruleToUpdate: UpdateRuleBody<RuleTypeParams> = {
   alertDelay: {
     active: 10,
   },
+  flapping: {
+    lookBackWindow: 10,
+    statusChangeThreshold: 10,
+  },
 };
 
 describe('transformUpdateRuleBody', () => {
@@ -98,6 +102,10 @@ describe('transformUpdateRuleBody', () => {
       },
       tags: [],
       throttle: null,
+      flapping: {
+        look_back_window: 10,
+        status_change_threshold: 10,
+      },
     });
   });
 });

packages/kbn-alerts-ui-shared/src/common/apis/update_rule/transform_update_rule_body.ts

@@ -8,10 +8,25 @@
 
 import { RewriteResponseCase } from '@kbn/actions-types';
 import { UpdateRuleBody } from './types';
+import { Rule } from '../../types';
+
+const transformUpdateRuleFlapping = (flapping: Rule['flapping']) => {
+  if (!flapping) {
+    return flapping;
+  }
+
+  return {
+    flapping: {
+      look_back_window: flapping.lookBackWindow,
+      status_change_threshold: flapping.statusChangeThreshold,
+    },
+  };
+};
 
 export const transformUpdateRuleBody: RewriteResponseCase<UpdateRuleBody> = ({
   actions = [],
   alertDelay,
+  flapping,
   ...res
 }): any => ({
   ...res,
@@ -41,4 +56,5 @@ export const transformUpdateRuleBody: RewriteResponseCase<UpdateRuleBody> = ({
     };
   }),
   ...(alertDelay ? { alert_delay: alertDelay } : {}),
+  ...(flapping !== undefined ? transformUpdateRuleFlapping(flapping) : {}),
 });

packages/kbn-alerts-ui-shared/src/common/apis/update_rule/types.ts

@@ -17,4 +17,5 @@ export interface UpdateRuleBody<Params extends RuleTypeParams = RuleTypeParams>
   throttle?: Rule<Params>['throttle'];
   notifyWhen?: Rule<Params>['notifyWhen'];
   alertDelay?: Rule<Params>['alertDelay'];
+  flapping?: Rule<Params>['flapping'];
 }