[ResponseOps][Rules]Hide number of conditions on Rule page when Rule …

…type do not allow multiple conditions (elastic#204385) Closes elastic#194809 ## Summary The "Conditions" section on the Rule page definition list is now hidden for the rule types that don't allow multiple conditions https://github.com/user-attachments/assets/eed1518a-91c4-453c-8294-643f86f05e30 todo: add/change tests
e40pud · Jan 9, 2025 · 49690d7 · 49690d7
1 parent ce07226
commit 49690d7
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 25 deletions.
diff --git a/...s_actions_ui/public/application/sections/rule_details/components/rule_definition.test.tsx b/...s_actions_ui/public/application/sections/rule_details/components/rule_definition.test.tsx
@@ -188,10 +188,10 @@ describe('Rule Definition', () => {
     expect(ruleDescription.find('div.euiText').text()).toEqual('Security detection rule');
   });
 
-  it('show rule conditions "', async () => {
+  it('show rule conditions only if the rule allows multiple conditions', async () => {
     const ruleConditions = wrapper.find('[data-test-subj="ruleSummaryRuleConditions"]');
     expect(ruleConditions).toBeTruthy();
-    expect(ruleConditions.find('div.euiText').text()).toEqual(`0 conditions`);
+    expect(ruleConditions.find('div.euiText').text()).toEqual('1 condition');
   });
 
   it('show rule interval with human readable value', async () => {
@@ -225,7 +225,24 @@ function mockRule(overwrite = {}): Rule {
     ruleTypeId: 'test_rule_type',
     schedule: { interval: '1s' },
     actions: [],
-    params: { name: 'test rule type name', description: 'siem description' },
+    params: {
+      name: 'test rule type name',
+      description: 'siem description',
+      criteria: [
+        {
+          comparator: '>',
+          metrics: [
+            {
+              name: 'A',
+              aggType: 'count',
+            },
+          ],
+          threshold: [100],
+          timeSize: 1,
+          timeUnit: 'm',
+        },
+      ],
+    },
     createdBy: null,
     updatedBy: null,
     apiKeyOwner: null,

diff --git a/...iggers_actions_ui/public/application/sections/rule_details/components/rule_definition.tsx b/...iggers_actions_ui/public/application/sections/rule_details/components/rule_definition.tsx
@@ -49,6 +49,8 @@ export const RuleDefinition: React.FunctionComponent<RuleDefinitionProps> = ({
 
   const [editFlyoutVisible, setEditFlyoutVisible] = useState<boolean>(false);
   const [ruleType, setRuleType] = useState<RuleType>();
+
+  const hasConditions = !!(rule?.params.criteria as any[])?.length;
   const {
     ruleTypesState: { data: ruleTypeIndex, isLoading: ruleTypesIsLoading },
   } = useLoadRuleTypesQuery({
@@ -159,28 +161,32 @@ export const RuleDefinition: React.FunctionComponent<RuleDefinitionProps> = ({
         />
       ),
     },
-    {
-      title: i18n.translate('xpack.triggersActionsUI.ruleDetails.conditionsTitle', {
-        defaultMessage: 'Conditions',
-      }),
-      description: (
-        <EuiFlexGroup
-          data-test-subj="ruleSummaryRuleConditions"
-          alignItems="center"
-          gutterSize="none"
-        >
-          <EuiFlexItem grow={false}>
-            {hasEditButton ? (
-              <EuiButtonEmpty onClick={onEditRuleClick} flush="left">
-                <EuiText size="s">{getRuleConditionsWording()}</EuiText>
-              </EuiButtonEmpty>
-            ) : (
-              <EuiText size="s">{getRuleConditionsWording()}</EuiText>
-            )}
-          </EuiFlexItem>
-        </EuiFlexGroup>
-      ),
-    },
+    ...(hasConditions
+      ? [
+          {
+            title: i18n.translate('xpack.triggersActionsUI.ruleDetails.conditionsTitle', {
+              defaultMessage: 'Conditions',
+            }),
+            description: (
+              <EuiFlexGroup
+                data-test-subj="ruleSummaryRuleConditions"
+                alignItems="center"
+                gutterSize="none"
+              >
+                <EuiFlexItem grow={false}>
+                  {hasEditButton ? (
+                    <EuiButtonEmpty onClick={onEditRuleClick} flush="left">
+                      <EuiText size="s">{getRuleConditionsWording()}</EuiText>
+                    </EuiButtonEmpty>
+                  ) : (
+                    <EuiText size="s">{getRuleConditionsWording()}</EuiText>
+                  )}
+                </EuiFlexItem>
+              </EuiFlexGroup>
+            ),
+          },
+        ]
+      : []),
     {
       title: i18n.translate('xpack.triggersActionsUI.ruleDetails.actions', {
         defaultMessage: 'Actions',