Enhance settings form with unsaved changes tracking.

[yoav-cloud]

Adds client-side tracking of whether the Cloudinary settings form differs from the state that was loaded with the page. If the user has edited trackable fields and tries to leave without saving, they get a clear warning instead of losing work silently.

cld-wp-plugin-unsaved-check.mov

What changed

Behavior

• Dirty detection — On input/change, the form serializes values for relevant fields (inputs, selects, textareas; skips hidden WordPress fields, nonces, and non-data controls) and compares against the initial snapshot.

• beforeunload — Browsers show their standard “leave site?” prompt when there are unsaved changes and the user closes the tab or navigates away in ways that fire beforeunload.

• In-app links — Clicks on normal same-window links show a confirm() with the same message so navigation inside the admin is guarded too. Modifier-key opens, target="_blank", download, javascript:, and hash-only links are left alone so common workflows are not blocked.

• Save / submit — Submitting the form clears the dirty state so the user is not warned after a deliberate save.

• Save button affordance — While dirty, real save controls get a trailing * and a cld-settings-submit-dirty class (styled with a visible outline). Only button[name="cld_submission"] (with a fallback to #submit / input[type="submit"]) is updated so other primary actions on the same form (for example disconnect) are not mislabeled.

Markup and styling

• Settings forms are tagged with data-cld-settings-form="true" (and keep cld-settings-form) in:
  • php/ui/component/class-page.php (non-tabbed page form),
  • php/templates/settings-header.php (tabbed header form),
  • ui-definitions/components/settings.php.
• cld-settings-form-has-unsaved is toggled on the form while dirty (available for future UI if needed).
  SCSS adds styling for .cld-settings-submit-dirty; built css/cloudinary.css / js/cloudinary.js are updated.

Copy

User-facing string is passed through wp.i18n.__ when available: “You have unsaved changes. If you leave this page, your changes will be lost.”