New dialogs for the profile (#5780)

src/panels/profile/ha-long-lived-access-tokens-card.js

@@ -5,7 +5,11 @@ import { PolymerElement } from "@polymer/polymer/polymer-element";
 import { formatDateTime } from "../../common/datetime/format_date_time";
 import "../../components/ha-card";
 import "../../components/ha-icon-button";
-import { showAlertDialog } from "../../dialogs/generic/show-dialog-box";
+import {
+  showAlertDialog,
+  showPromptDialog,
+  showConfirmationDialog,
+} from "../../dialogs/generic/show-dialog-box";
 import { EventsMixin } from "../../mixins/events-mixin";
 import LocalizeMixin from "../../mixins/localize-mixin";
 import "../../resources/ha-style";
@@ -102,9 +106,11 @@ class HaLongLivedTokens extends LocalizeMixin(EventsMixin(PolymerElement)) {
   }
 
   async _handleCreate() {
-    const name = prompt(
+    const name = await showPromptDialog(this, {
-      this.localize("ui.panel.profile.long_lived_access_tokens.prompt_name")
+      text: this.localize(
-    );
+        "ui.panel.profile.long_lived_access_tokens.prompt_name"
+      ),
+    });
     if (!name) return;
     try {
       const token = await this.hass.callWS({
@@ -112,12 +118,13 @@ class HaLongLivedTokens extends LocalizeMixin(EventsMixin(PolymerElement)) {
         lifespan: 3650,
         client_name: name,
       });
-      prompt(
+      await showPromptDialog(this, {
-        this.localize(
+        title: name,
+        text: this.localize(
           "ui.panel.profile.long_lived_access_tokens.prompt_copy_token"
         ),
-        token
+        defaultValue: token,
-      );
+      });
       this.fire("hass-refresh-tokens");
     } catch (err) {
       // eslint-disable-next-line
@@ -131,21 +138,22 @@ class HaLongLivedTokens extends LocalizeMixin(EventsMixin(PolymerElement)) {
   }
 
   async _handleDelete(ev) {
+    const token = ev.model.item;
     if (
-      !confirm(
+      !(await showConfirmationDialog(this, {
-        this.localize(
+        text: this.localize(
           "ui.panel.profile.long_lived_access_tokens.confirm_delete",
           "name",
-          ev.model.item.client_name
+          token.client_name
-        )
+        ),
-      )
+      }))
     ) {
       return;
     }
     try {
       await this.hass.callWS({
         type: "auth/delete_refresh_token",
-        refresh_token_id: ev.model.item.id,
+        refresh_token_id: token.id,
       });
       this.fire("hass-refresh-tokens");
     } catch (err) {

src/panels/profile/ha-mfa-modules-card.js

@@ -7,6 +7,7 @@ import { PolymerElement } from "@polymer/polymer/polymer-element";
 import "../../components/ha-card";
 import { EventsMixin } from "../../mixins/events-mixin";
 import LocalizeMixin from "../../mixins/localize-mixin";
+import { showConfirmationDialog } from "../../dialogs/generic/show-dialog-box";
 import "../../resources/ha-style";
 
 let registeredDialog = false;
@@ -98,20 +99,21 @@ class HaMfaModulesCard extends EventsMixin(LocalizeMixin(PolymerElement)) {
     });
   }
 
-  _disable(ev) {
+  async _disable(ev) {
+    const mfamodule = ev.model.module;
     if (
-      !confirm(
+      !(await showConfirmationDialog(this, {
-        this.localize(
+        text: this.localize(
           "ui.panel.profile.mfa.confirm_disable",
           "name",
-          ev.model.module.name
+          mfamodule.name
-        )
+        ),
-      )
+      }))
     ) {
       return;
     }
 
-    const mfaModuleId = ev.model.module.id;
+    const mfaModuleId = mfamodule.id;
 
     this.hass
       .callWS({

src/panels/profile/ha-refresh-tokens-card.js

@@ -7,6 +7,10 @@ import { formatDateTime } from "../../common/datetime/format_date_time";
 import "../../components/ha-card";
 import { EventsMixin } from "../../mixins/events-mixin";
 import LocalizeMixin from "../../mixins/localize-mixin";
+import {
+  showAlertDialog,
+  showConfirmationDialog,
+} from "../../dialogs/generic/show-dialog-box";
 import "./ha-settings-row";
 
 /*
@@ -91,27 +95,30 @@ class HaRefreshTokens extends LocalizeMixin(EventsMixin(PolymerElement)) {
   }
 
   async _handleDelete(ev) {
+    const token = ev.model.item;
     if (
-      !confirm(
+      !(await showConfirmationDialog(this, {
-        this.localize(
+        text: this.localize(
           "ui.panel.profile.refresh_tokens.confirm_delete",
           "name",
-          ev.model.item.client_id
+          token.client_id
-        )
+        ),
-      )
+      }))
     ) {
       return;
     }
     try {
       await this.hass.callWS({
         type: "auth/delete_refresh_token",
-        refresh_token_id: ev.model.item.id,
+        refresh_token_id: token.id,
       });
       this.fire("hass-refresh-tokens");
     } catch (err) {
       // eslint-disable-next-line
       console.error(err);
-      alert(this.localize("ui.panel.profile.refresh_tokens.delete_failed"));
+     showAlertDialog(this, {
+        text: this.localize("ui.panel.profile.refresh_tokens.delete_failed"),
+      });
     }
   }
 }