[9.2] [ResponseOps][Rules] Save button in settings flyout should remain disabled until settings are modified (#241238) (#241321)

# Backport

This will backport the following commits from `main` to `9.2`:
- [[ResponseOps][Rules] Save button in settings flyout should remain
disabled until settings are modified
(#241238)](#241238)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Georgiana-Andreea
Onoleață","email":"[email protected]"},"sourceCommit":{"committedDate":"2025-10-30T15:31:03Z","message":"[ResponseOps][Rules]
Save button in settings flyout should remain disabled until settings are
modified (#241238)\n\nCloses
https://github.com/elastic/kibana/issues/238586\n\n## Summary\n\n- Fixed
the save button enabled/disabled state in `Rules
Settings\nFlyout`\n\n**Problem**: the save button was enabled on flyout
open, even when no\nchanges were made\n\n**Solution**:\n- updated the
enable/disable logic to include `hasFlappingChanged`
and\n`hasQueryDelayChanged` ensuring the save button is disabled until
the\nuser changes at least one setting.\n- updated the
`useResettableState` hook so that loading initial values\nresets the
`hasChanged` flag to `false`\n\n---------\n\nCo-authored-by: Antonio
<[email protected]>","sha":"5f1c7f3249446eaaf46ca8e818fab8513a9f1878","branchLabelMapping":{"^v9.3.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","Team:ResponseOps","backport:version","v9.3.0","v8.19.7","v9.1.7","v9.2.1"],"title":"[ResponseOps][Rules]
Save button in settings flyout should remain disabled until settings are
modified","number":241238,"url":"https://github.com/elastic/kibana/pull/241238","mergeCommit":{"message":"[ResponseOps][Rules]
Save button in settings flyout should remain disabled until settings are
modified (#241238)\n\nCloses
https://github.com/elastic/kibana/issues/238586\n\n## Summary\n\n- Fixed
the save button enabled/disabled state in `Rules
Settings\nFlyout`\n\n**Problem**: the save button was enabled on flyout
open, even when no\nchanges were made\n\n**Solution**:\n- updated the
enable/disable logic to include `hasFlappingChanged`
and\n`hasQueryDelayChanged` ensuring the save button is disabled until
the\nuser changes at least one setting.\n- updated the
`useResettableState` hook so that loading initial values\nresets the
`hasChanged` flag to `false`\n\n---------\n\nCo-authored-by: Antonio
<[email protected]>","sha":"5f1c7f3249446eaaf46ca8e818fab8513a9f1878"}},"sourceBranch":"main","suggestedTargetBranches":["8.19","9.1","9.2"],"targetPullRequestStates":[{"branch":"main","label":"v9.3.0","branchLabelMappingKey":"^v9.3.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/241238","number":241238,"mergeCommit":{"message":"[ResponseOps][Rules]
Save button in settings flyout should remain disabled until settings are
modified (#241238)\n\nCloses
https://github.com/elastic/kibana/issues/238586\n\n## Summary\n\n- Fixed
the save button enabled/disabled state in `Rules
Settings\nFlyout`\n\n**Problem**: the save button was enabled on flyout
open, even when no\nchanges were made\n\n**Solution**:\n- updated the
enable/disable logic to include `hasFlappingChanged`
and\n`hasQueryDelayChanged` ensuring the save button is disabled until
the\nuser changes at least one setting.\n- updated the
`useResettableState` hook so that loading initial values\nresets the
`hasChanged` flag to `false`\n\n---------\n\nCo-authored-by: Antonio
<[email protected]>","sha":"5f1c7f3249446eaaf46ca8e818fab8513a9f1878"}},{"branch":"8.19","label":"v8.19.7","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"9.1","label":"v9.1.7","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"9.2","label":"v9.2.1","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Georgiana-Andreea Onoleață <[email protected]>
Co-authored-by: Antonio <[email protected]>

Author: 3 people

x-pack/platform/plugins/shared/triggers_actions_ui/public/application/components/rules_setting/rules_settings_flyout.test.tsx

@@ -509,4 +509,17 @@ describe('rules_settings_flyout', () => {
 
     expect(result.queryByTestId('alert-delete-open-modal-button')).toBe(null);
   });
+
+  test('save button is disabled on initial load and enabled when user changes a setting', async () => {
+    render(<RulesSettingsFlyoutWithProviders {...flyoutProps} />);
+    await waitForFlyoutLoad();
+
+    const saveButton = screen.getByTestId('rulesSettingsFlyoutSaveButton');
+    expect(saveButton).toBeDisabled();
+
+    const lookBackWindowInput = screen.getByTestId('lookBackWindowRangeInput');
+    fireEvent.change(lookBackWindowInput, { target: { value: 20 } });
+
+    expect(saveButton).not.toBeDisabled();
+  });
 });

x-pack/platform/plugins/shared/triggers_actions_ui/public/application/components/rules_setting/rules_settings_flyout.tsx

@@ -80,8 +80,12 @@ const useResettableState: <T>(
   };
   const updateValue = (next: typeof value, shouldUpdateInitialValue = false) => {
     setValue(next);
-    setHasChanged(true);
-    if (shouldUpdateInitialValue) initialValueRef.current = next;
+    if (shouldUpdateInitialValue) {
+      initialValueRef.current = next;
+      setHasChanged(false);
+    } else {
+      setHasChanged(true);
+    }
   };
   return [value, hasChanged, updateValue, reset];
 };
@@ -172,6 +176,10 @@ export const RulesSettingsFlyout = memo((props: RulesSettingsFlyoutProps) => {
   const canShowQueryDelaySettings = readQueryDelaySettingsUI;
   const canShowAlertDeleteSettings = readAlertDeleteSettingsUI;
 
+  const isChanged = hasFlappingChanged || hasQueryDelayChanged;
+  const hasMinimumWritePermissions = canWriteFlappingSettings || canWriteQueryDelaySettings;
+  const shouldDisableSaveButton = !isChanged || !hasMinimumWritePermissions;
+
   const handleSettingsChange = (
     setting: keyof RulesSettingsProperties,
     key: keyof RulesSettingsFlappingProperties | keyof RulesSettingsQueryDelayProperties,
@@ -324,7 +332,7 @@ export const RulesSettingsFlyout = memo((props: RulesSettingsFlyoutProps) => {
               fill
               data-test-subj="rulesSettingsFlyoutSaveButton"
               onClick={handleSave}
-              disabled={!canWriteFlappingSettings && !canWriteQueryDelaySettings}
+              disabled={shouldDisableSaveButton}
             >
               <FormattedMessage
                 id="xpack.triggersActionsUI.rulesSettings.flyout.saveButton"