Use new improved save dialog when leaving script editor dirty (#23862)

* Use new improved save dialog when leaving script editor dirty

* Fix url

src/panels/config/script/ha-script-editor.ts

@@ -452,7 +452,7 @@ export class HaScriptEditor extends SubscribeMixin(
           )}
           .disabled=${this._saving}
           extended
-          @click=${this._saveScript}
+          @click=${this._handleSave}
         >
           <ha-svg-icon slot="icon" .path=${mdiContentSave}></ha-svg-icon>
         </ha-fab>
@@ -707,22 +707,50 @@ export class HaScriptEditor extends SubscribeMixin(
   }
 
   private async _confirmUnsavedChanged(): Promise<boolean> {
-    if (this._dirty) {
+    if (!this._dirty) {
-      return showConfirmationDialog(this, {
-        title: this.hass!.localize(
-          "ui.panel.config.automation.editor.unsaved_confirm_title"
-        ),
-        text: this.hass!.localize(
-          "ui.panel.config.automation.editor.unsaved_confirm_text"
-        ),
-        confirmText: this.hass!.localize("ui.common.leave"),
-        dismissText: this.hass!.localize("ui.common.stay"),
-        destructive: true,
-      });
-    }
       return true;
     }
 
+    return new Promise<boolean>((resolve) => {
+      showAutomationSaveDialog(this, {
+        config: this._config!,
+        domain: "script",
+        updateConfig: async (config, entityRegistryUpdate) => {
+          this._config = config;
+          this._entityRegistryUpdate = entityRegistryUpdate;
+          this._dirty = true;
+          this.requestUpdate();
+
+          const id = this.scriptId || String(Date.now());
+          try {
+            await this._saveScript(id);
+          } catch (_err: any) {
+            this.requestUpdate();
+            resolve(false);
+            return;
+          }
+
+          resolve(true);
+        },
+        onClose: () => resolve(false),
+        onDiscard: () => resolve(true),
+        entityRegistryUpdate: this._entityRegistryUpdate,
+        entityRegistryEntry: this._registryEntry,
+        title: this.hass.localize(
+          this.scriptId
+            ? "ui.panel.config.script.editor.leave.unsaved_confirm_title"
+            : "ui.panel.config.script.editor.leave.unsaved_new_title"
+        ),
+        description: this.hass.localize(
+          this.scriptId
+            ? "ui.panel.config.script.editor.leave.unsaved_confirm_text"
+            : "ui.panel.config.script.editor.leave.unsaved_new_text"
+        ),
+        hideInputs: this.scriptId !== null,
+      });
+    });
+  }
+
   private _backTapped = async () => {
     const result = await this._confirmUnsavedChanged();
     if (result) {
@@ -877,7 +905,7 @@ export class HaScriptEditor extends SubscribeMixin(
     });
   }
 
-  private async _saveScript(): Promise<void> {
+  private async _handleSave() {
     if (this._yamlErrors) {
       showToast(this, {
         message: this._yamlErrors,
@@ -894,6 +922,13 @@ export class HaScriptEditor extends SubscribeMixin(
     }
     const id = this.scriptId || this._entityId || Date.now();
 
+    await this._saveScript(id);
+    if (!this.scriptId) {
+      navigate(`/config/script/edit/${id}`, { replace: true });
+    }
+  }
+
+  private async _saveScript(id): Promise<void> {
     this._saving = true;
 
     let entityRegPromise: Promise<EntityRegistryEntry> | undefined;
@@ -962,10 +997,6 @@ export class HaScriptEditor extends SubscribeMixin(
       }
 
       this._dirty = false;
-
-      if (!this.scriptId) {
-        navigate(`/config/script/edit/${id}`, { replace: true });
-      }
     } catch (errors: any) {
       this._errors = errors.body?.message || errors.error || errors.body;
       showToast(this, {
@@ -979,7 +1010,7 @@ export class HaScriptEditor extends SubscribeMixin(
 
   protected supportedShortcuts(): SupportedShortcuts {
     return {
-      s: () => this._saveScript(),
+      s: () => this._handleSave(),
     };
   }
 

src/translations/en.json

@@ -4398,7 +4398,13 @@
             "save_script": "Save script",
             "sequence": "Sequence",
             "sequence_sentence": "The sequence of actions of this script.",
-            "link_available_actions": "Learn more about available actions."
+            "link_available_actions": "Learn more about available actions.",
+            "leave": {
+              "unsaved_new_title": "Save new script?",
+              "unsaved_new_text": "You can save your changes, or delete this script. You can't undo this action.",
+              "unsaved_confirm_title": "Save changes?",
+              "unsaved_confirm_text": "You have made some changes in this script. You can save these changes, or discard them and leave. You can't undo this action."
+            }
           },
           "trace": {
             "edit_script": "Edit script"