Add disabled state to save button on all settings tabs

[adrianduffell]

In #47316, we disable the save button on the site visibility tab until a change is made. This is a follow-up to apply the same behavior to all settings tabs.

Acceptance Criteria

• If the tab has a "Save changes" button, disable on initial page load.
• When a field changes, the button should cease being disabled.
• Create a GitHub Discussion to advise about the behavior change.
• Create an internal call for testing.
• Add a developer advisory about the change for the WooCommerce release

[adrianduffell]

When a field changes, the button should cease being disabled.

I think we could use a variation of the logic to show the exit confirmation (seen in #46573). However, we'll need to ensure custom input UIs also trigger a change.

The shipping settings seems to already have this behavior already, however the local pickup settings is missing it:

local.pickup.settings.mov

[psealock]

@adrianduffell Here is an interesting case. On the Payments screen, you can toggle on/off various payment options. This interaction kicks off an Ajax request where the setting is saved. Technically, once toggled there is no need to click Save. However, we are introducing a weird concept here because the merchant may not know that and the Save button is disabled. I suppose this issue existed already, but now may be more apparent if merchant believe they can't save. I suppose we could enable the Save button on toggle interaction, but now we are suggesting the merchant needs to click Save. What do you reckon?

[adrianduffell]

Here is an interesting case.

@psealock Hmm, that's a tricky one 🤔 I wonder if it is viable to remove the save button on this altogether? I feel like the presence of it makes the ajax save unexpected. However, it looks like the save button is still needed to persist the changes to the sort order (made using drag and drop). If the save button is removed, there would need to be an ajax save for this too.

Perhaps the solution is to disable the save button, but show a snackbar when a payment option is toggled. It could say <payment option> successfully <enabled / disabled>, e.g. Cash on delivery disabled successfully. Hopefully that would help to inform the user about the ajax saves and clue them in why the save button is still disabled?

[adrianduffell]

show a snackbar when a payment option is toggled

Thinking about it more, it's probably difficult to use the gutenberg snackbar component from jQuery 🫠 As an alternative, a regular notice could maybe do the trick. Something like: