Show toast on successfull save (#3576)

* Show toast on successfull save

We need to make a list of places where this could benefit the user experience.

* Helper method

* Rename

src/panels/config/users/ha-user-editor.ts

@@ -23,6 +23,7 @@ import {
   SYSTEM_GROUP_ID_USER,
   SYSTEM_GROUP_ID_ADMIN,
 } from "../../../data/user";
+import { showSaveSuccessToast } from "../../../util/toast-saved-success";
 
 declare global {
   interface HASSDomEvents {
@@ -150,6 +151,7 @@ class HaUserEditor extends LitElement {
       await updateUser(this.hass!, this.user!.id, {
         group_ids: [newGroup],
       });
+      showSaveSuccessToast(this, this.hass!);
       fireEvent(this, "reload-users");
     } catch (err) {
       alert(`Group update failed: ${err.message}`);

src/translations/en.json

@@ -493,7 +493,8 @@
     "common": {
       "loading": "Loading",
       "cancel": "Cancel",
-      "save": "Save"
+      "save": "Save",
+      "successfully_saved": "Successfully saved"
     },
     "components": {
       "entity": {

src/util/toast-saved-success.ts

@@ -0,0 +1,7 @@
+import { showToast } from "./toast";
+import { HomeAssistant } from "../types";
+
+export const showSaveSuccessToast = (el: HTMLElement, hass: HomeAssistant) =>
+  showToast(el, {
+    message: hass!.localize("ui.common.successfully_saved"),
+  });