Revert name change from selectedTheme to selectedThemeSettings (#9273)

hassio/src/hassio-main.ts

@@ -103,27 +103,25 @@ export class HassioMain extends SupervisorBaseElement {
 
   private _applyTheme() {
     let themeName: string;
-    let themeSettings:
+    let themeSettings: Partial<HomeAssistant["selectedTheme"]> | undefined;
-      | Partial<HomeAssistant["selectedThemeSettings"]>
-      | undefined;
 
     if (atLeastVersion(this.hass.config.version, 0, 114)) {
       themeName =
-        this.hass.selectedThemeSettings?.theme ||
+        this.hass.selectedTheme?.theme ||
         (this.hass.themes.darkMode && this.hass.themes.default_dark_theme
           ? this.hass.themes.default_dark_theme!
           : this.hass.themes.default_theme);
 
-      themeSettings = this.hass.selectedThemeSettings;
+      themeSettings = this.hass.selectedTheme;
       if (themeSettings?.dark === undefined) {
         themeSettings = {
-          ...this.hass.selectedThemeSettings,
+          ...this.hass.selectedTheme,
           dark: this.hass.themes.darkMode,
         };
       }
     } else {
       themeName =
-        ((this.hass.selectedThemeSettings as unknown) as string) ||
+        ((this.hass.selectedTheme as unknown) as string) ||
         this.hass.themes.default_theme;
     }
 

src/common/dom/apply_themes_on_element.ts

@@ -31,7 +31,7 @@ export const applyThemesOnElement = (
   element,
   themes: HomeAssistant["themes"],
   selectedTheme?: string,
-  themeSettings?: Partial<HomeAssistant["selectedThemeSettings"]>
+  themeSettings?: Partial<HomeAssistant["selectedTheme"]>
 ) => {
   let cacheKey = selectedTheme;
   let themeRules: Partial<ThemeVars> = {};

src/fake_data/provide_hass.ts

@@ -277,7 +277,7 @@ export const provideHass = (
     mockTheme(theme) {
       invalidateThemeCache();
       hass().updateHass({
-        selectedThemeSettings: { theme: theme ? "mock" : "default" },
+        selectedTheme: { theme: theme ? "mock" : "default" },
         themes: {
           ...hass().themes,
           themes: {
@@ -285,11 +285,11 @@ export const provideHass = (
           },
         },
       });
-      const { themes, selectedThemeSettings } = hass();
+      const { themes, selectedTheme } = hass();
       applyThemesOnElement(
         document.documentElement,
         themes,
-        selectedThemeSettings!.theme
+        selectedTheme!.theme
       );
     },
 

src/layouts/supervisor-error-screen.ts

@@ -81,27 +81,25 @@ class SupervisorErrorScreen extends LitElement {
 
   private _applyTheme() {
     let themeName: string;
-    let themeSettings:
+    let themeSettings: Partial<HomeAssistant["selectedTheme"]> | undefined;
-      | Partial<HomeAssistant["selectedThemeSettings"]>
-      | undefined;
 
     if (atLeastVersion(this.hass.config.version, 0, 114)) {
       themeName =
-        this.hass.selectedThemeSettings?.theme ||
+        this.hass.selectedTheme?.theme ||
         (this.hass.themes.darkMode && this.hass.themes.default_dark_theme
           ? this.hass.themes.default_dark_theme!
           : this.hass.themes.default_theme);
 
-      themeSettings = this.hass.selectedThemeSettings;
+      themeSettings = this.hass.selectedTheme;
       if (themeName === "default" && themeSettings?.dark === undefined) {
         themeSettings = {
-          ...this.hass.selectedThemeSettings,
+          ...this.hass.selectedTheme,
           dark: this.hass.themes.darkMode,
         };
       }
     } else {
       themeName =
-        ((this.hass.selectedThemeSettings as unknown) as string) ||
+        ((this.hass.selectedTheme as unknown) as string) ||
         this.hass.themes.default_theme;
     }
 

src/panels/lovelace/views/hui-view.ts

@@ -152,7 +152,7 @@ export class HUIView extends ReactiveElement {
       changedProperties.has("hass") &&
       (!oldHass ||
         this.hass.themes !== oldHass.themes ||
-        this.hass.selectedThemeSettings !== oldHass.selectedThemeSettings)
+        this.hass.selectedTheme !== oldHass.selectedTheme)
     ) {
       applyThemesOnElement(this, this.hass.themes, this._viewConfigTheme);
     }

src/panels/profile/ha-pick-theme-row.ts

@@ -41,9 +41,9 @@ export class HaPickThemeRow extends LitElement {
     const hasThemes =
       this.hass.themes.themes && Object.keys(this.hass.themes.themes).length;
     const curTheme =
-      this.hass.selectedThemeSettings?.theme || this.hass.themes.default_theme;
+      this.hass.selectedTheme?.theme || this.hass.themes.default_theme;
 
-    const themeSettings = this.hass.selectedThemeSettings;
+    const themeSettings = this.hass.selectedTheme;
 
     return html`
       <ha-settings-row .narrow=${this.narrow}>
@@ -162,8 +162,7 @@ export class HaPickThemeRow extends LitElement {
       (!oldHass || oldHass.themes.themes !== this.hass.themes.themes);
     const selectedThemeChanged =
       changedProperties.has("hass") &&
-      (!oldHass ||
+      (!oldHass || oldHass.selectedTheme !== this.hass.selectedTheme);
-        oldHass.selectedThemeSettings !== this.hass.selectedThemeSettings);
 
     if (themesChanged) {
       this._themeNames = ["Backend-selected", "default"].concat(
@@ -173,16 +172,16 @@ export class HaPickThemeRow extends LitElement {
 
     if (selectedThemeChanged) {
       if (
-        this.hass.selectedThemeSettings &&
+        this.hass.selectedTheme &&
-        this._themeNames.indexOf(this.hass.selectedThemeSettings.theme) > 0
+        this._themeNames.indexOf(this.hass.selectedTheme.theme) > 0
       ) {
         this._selectedThemeIndex = this._themeNames.indexOf(
-          this.hass.selectedThemeSettings.theme
+          this.hass.selectedTheme.theme
         );
         this._selectedTheme = this.hass.themes.themes[
-          this.hass.selectedThemeSettings.theme
+          this.hass.selectedTheme.theme
         ];
-      } else if (!this.hass.selectedThemeSettings) {
+      } else if (!this.hass.selectedTheme) {
         this._selectedThemeIndex = 0;
       }
     }
@@ -220,7 +219,7 @@ export class HaPickThemeRow extends LitElement {
   private _handleThemeSelection(ev: CustomEvent) {
     const theme = ev.detail.item.theme;
     if (theme === "Backend-selected") {
-      if (this.hass.selectedThemeSettings?.theme) {
+      if (this.hass.selectedTheme?.theme) {
         fireEvent(this, "settheme", {
           theme: "",
           primaryColor: undefined,

src/state/connection-mixin.ts

@@ -39,7 +39,7 @@ export const connectionMixin = <T extends Constructor<HassBaseEl>>(
         states: null as any,
         config: null as any,
         themes: null as any,
-        selectedThemeSettings: null,
+        selectedTheme: null,
         panels: null as any,
         services: null as any,
         user: null as any,

src/state/themes-mixin.ts

@@ -11,10 +11,10 @@ import { HassBaseEl } from "./hass-base-mixin";
 declare global {
   // for add event listener
   interface HTMLElementEventMap {
-    settheme: HASSDomEvent<Partial<HomeAssistant["selectedThemeSettings"]>>;
+    settheme: HASSDomEvent<Partial<HomeAssistant["selectedTheme"]>>;
   }
   interface HASSDomEvents {
-    settheme: Partial<HomeAssistant["selectedThemeSettings"]>;
+    settheme: Partial<HomeAssistant["selectedTheme"]>;
   }
 }
 
@@ -28,8 +28,8 @@ export default <T extends Constructor<HassBaseEl>>(superClass: T) =>
       super.firstUpdated(changedProps);
       this.addEventListener("settheme", (ev) => {
         this._updateHass({
-          selectedThemeSettings: {
+          selectedTheme: {
-            ...this.hass!.selectedThemeSettings!,
+            ...this.hass!.selectedTheme!,
             ...ev.detail,
           },
         });
@@ -68,8 +68,8 @@ export default <T extends Constructor<HassBaseEl>>(superClass: T) =>
         return;
       }
 
-      let themeSettings: Partial<HomeAssistant["selectedThemeSettings"]> = this
+      let themeSettings: Partial<HomeAssistant["selectedTheme"]> = this.hass!
-        .hass!.selectedThemeSettings;
+        .selectedTheme;
 
       const themeName =
         themeSettings?.theme ||
@@ -89,7 +89,7 @@ export default <T extends Constructor<HassBaseEl>>(superClass: T) =>
         darkMode = false;
       }
 
-      themeSettings = { ...this.hass.selectedThemeSettings, dark: darkMode };
+      themeSettings = { ...this.hass.selectedTheme, dark: darkMode };
 
       applyThemesOnElement(
         document.documentElement,

src/types.ts

@@ -194,7 +194,7 @@ export interface HomeAssistant {
   services: HassServices;
   config: HassConfig;
   themes: Themes;
-  selectedThemeSettings: ThemeSettings | null;
+  selectedTheme: ThemeSettings | null;
   panels: Panels;
   panelUrl: string;
   // i18n

src/util/ha-pref-storage.ts

@@ -2,16 +2,13 @@ import { HomeAssistant } from "../types";
 
 const STORED_STATE = [
   "dockedSidebar",
-  "selectedThemeSettings",
+  "selectedTheme",
   "selectedLanguage",
   "vibrate",
   "suspendWhenHidden",
   "enableShortcuts",
   "defaultPanel",
 ];
-// Deprecated states will be loaded once so that the values can be migrated to other states if required,
-// but during the next state storing, the deprecated keys will be removed.
-const STORED_STATE_DEPRECATED = ["selectedTheme"];
 const STORAGE = window.localStorage || {};
 
 export function storeState(hass: HomeAssistant) {
@@ -20,9 +17,6 @@ export function storeState(hass: HomeAssistant) {
       const value = hass[key];
       STORAGE[key] = JSON.stringify(value === undefined ? null : value);
     });
-    STORED_STATE_DEPRECATED.forEach((key) => {
-      if (key in STORAGE) delete STORAGE[key];
-    });
   } catch (err) {
     // Safari throws exception in private mode
   }
@@ -31,17 +25,13 @@ export function storeState(hass: HomeAssistant) {
 export function getState() {
   const state = {};
 
-  STORED_STATE.concat(STORED_STATE_DEPRECATED).forEach((key) => {
+  STORED_STATE.forEach((key) => {
     if (key in STORAGE) {
       let value = JSON.parse(STORAGE[key]);
       // selectedTheme went from string to object on 20200718
       if (key === "selectedTheme" && typeof value === "string") {
         value = { theme: value };
       }
-      // selectedTheme was renamed to selectedThemeSettings on 20210207
-      if (key === "selectedTheme") {
-        key = "selectedThemeSettings";
-      }
       // dockedSidebar went from boolean to enum on 20190720
       if (key === "dockedSidebar" && typeof value === "boolean") {
         value = value ? "docked" : "auto";