Fix default themes (#9290)

* Fix default themes

* Simplify pick theme row
This commit is contained in:
Bram Kragten 2021-05-29 05:02:28 +02:00 committed by GitHub
parent 0419c1a41f
commit 4f60a92b92
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 11 additions and 56 deletions

View File

@ -244,9 +244,6 @@ class HassioRegistriesDialog extends LitElement {
mwc-list-item span[slot="secondary"] {
color: var(--secondary-text-color);
}
ha-paper-dropdown-menu {
display: block;
}
`,
];
}

View File

@ -150,9 +150,6 @@ class HassioRepositoriesDialog extends LitElement {
mwc-button {
margin-left: 8px;
}
ha-paper-dropdown-menu {
display: block;
}
ha-circular-progress {
display: block;
margin: 32px;

View File

@ -4,7 +4,6 @@ import {
fetchDeviceActions,
localizeDeviceAutomationAction,
} from "../../data/device_automation";
import "../ha-paper-dropdown-menu";
import { HaDeviceAutomationPicker } from "./ha-device-automation-picker";
@customElement("ha-device-action-picker")

View File

@ -4,7 +4,6 @@ import {
fetchDeviceConditions,
localizeDeviceAutomationCondition,
} from "../../data/device_automation";
import "../ha-paper-dropdown-menu";
import { HaDeviceAutomationPicker } from "./ha-device-automation-picker";
@customElement("ha-device-condition-picker")

View File

@ -4,7 +4,6 @@ import {
fetchDeviceTriggers,
localizeDeviceAutomationTrigger,
} from "../../data/device_automation";
import "../ha-paper-dropdown-menu";
import { HaDeviceAutomationPicker } from "./ha-device-automation-picker";
@customElement("ha-device-trigger-picker")

View File

@ -45,7 +45,6 @@ import "../ha-button-menu";
import "../ha-card";
import "../ha-circular-progress";
import "../ha-fab";
import "../ha-paper-dropdown-menu";
import "../ha-svg-icon";
declare global {

View File

@ -6,7 +6,7 @@ import { TagTrigger } from "../../../../../data/automation";
import { fetchTags, Tag } from "../../../../../data/tag";
import { HomeAssistant } from "../../../../../types";
import { TriggerElement } from "../ha-automation-trigger-row";
import "../../../../../components/ha-paper-dropdown-menu";
@customElement("ha-automation-trigger-tag")
export class HaTagTrigger extends LitElement implements TriggerElement {
@property({ attribute: false }) public hass!: HomeAssistant;

View File

@ -193,9 +193,6 @@ class HaInputNumberForm extends LitElement {
.form {
color: var(--primary-text-color);
}
ha-paper-dropdown-menu {
display: block;
}
`,
];
}

View File

@ -196,9 +196,6 @@ class HaInputSelectForm extends LitElement {
mwc-button {
margin-left: 8px;
}
ha-paper-dropdown-menu {
display: block;
}
`,
];
}

View File

@ -179,9 +179,6 @@ class HaInputTextForm extends LitElement {
.row {
padding: 16px 0;
}
ha-paper-dropdown-menu {
display: block;
}
`,
];
}

View File

@ -5,7 +5,6 @@ import "@polymer/paper-listbox/paper-listbox";
import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
import { customElement, property } from "lit/decorators";
import { fireEvent } from "../../../../common/dom/fire_event";
import "../../../../components/ha-paper-dropdown-menu";
import "../../../../components/ha-svg-icon";
import type { LovelaceConfig } from "../../../../data/lovelace";
import type { HomeAssistant } from "../../../../types";

View File

@ -17,7 +17,6 @@ import "../../components/ha-paper-dropdown-menu";
import "../../components/ha-radio";
import type { HaRadio } from "../../components/ha-radio";
import "../../components/ha-settings-row";
import { Theme } from "../../data/ws-themes";
import {
DEFAULT_PRIMARY_COLOR,
DEFAULT_ACCENT_COLOR,
@ -33,10 +32,6 @@ export class HaPickThemeRow extends LitElement {
@state() _themeNames: string[] = [];
@state() _selectedThemeIndex = 0;
@state() _selectedTheme?: Theme;
protected render(): TemplateResult {
const hasThemes =
this.hass.themes.themes && Object.keys(this.hass.themes.themes).length;
@ -72,7 +67,8 @@ export class HaPickThemeRow extends LitElement {
>
<paper-listbox
slot="dropdown-content"
.selected=${this._selectedThemeIndex}
.selected=${this.hass.selectedTheme?.theme || "Backend-selected"}
attr-for-selected="theme"
@iron-select=${this._handleThemeSelection}
>
${this._themeNames.map(
@ -81,8 +77,7 @@ export class HaPickThemeRow extends LitElement {
</paper-listbox>
</ha-paper-dropdown-menu>
</ha-settings-row>
${curTheme === "default" ||
(this._selectedTheme && this._supportsModeSelection(this._selectedTheme))
${curTheme === "default" || this._supportsModeSelection(curTheme)
? html` <div class="inputs">
<ha-formfield
.label=${this.hass.localize(
@ -155,36 +150,17 @@ export class HaPickThemeRow extends LitElement {
`;
}
protected updated(changedProperties: PropertyValues) {
public willUpdate(changedProperties: PropertyValues) {
const oldHass = changedProperties.get("hass") as undefined | HomeAssistant;
const themesChanged =
changedProperties.has("hass") &&
(!oldHass || oldHass.themes.themes !== this.hass.themes.themes);
const selectedThemeChanged =
changedProperties.has("hass") &&
(!oldHass || oldHass.selectedTheme !== this.hass.selectedTheme);
if (themesChanged) {
this._themeNames = ["Backend-selected", "default"].concat(
Object.keys(this.hass.themes.themes).sort()
);
}
if (selectedThemeChanged) {
if (
this.hass.selectedTheme &&
this._themeNames.indexOf(this.hass.selectedTheme.theme) > 0
) {
this._selectedThemeIndex = this._themeNames.indexOf(
this.hass.selectedTheme.theme
);
this._selectedTheme = this.hass.themes.themes[
this.hass.selectedTheme.theme
];
} else if (!this.hass.selectedTheme) {
this._selectedThemeIndex = 0;
}
}
}
private _handleColorChange(ev: CustomEvent) {
@ -199,8 +175,8 @@ export class HaPickThemeRow extends LitElement {
});
}
private _supportsModeSelection(theme: Theme): boolean {
return theme.modes?.light !== undefined && theme.modes?.dark !== undefined;
private _supportsModeSelection(themeName: string): boolean {
return "modes" in this.hass.themes.themes[themeName];
}
private _handleDarkMode(ev: CustomEvent) {

View File

@ -74,16 +74,15 @@ export default <T extends Constructor<HassBaseEl>>(superClass: T) =>
const themeName =
themeSettings?.theme ||
(darkPreferred && this.hass.themes.default_dark_theme
? this.hass.themes.default_dark_theme!
? this.hass.themes.default_dark_theme
: this.hass.themes.default_theme);
let darkMode =
themeSettings?.dark === undefined ? darkPreferred : themeSettings?.dark;
const selectedTheme =
themeSettings?.theme !== undefined
? this.hass.themes.themes[themeSettings.theme]
: undefined;
const selectedTheme = themeName
? this.hass.themes.themes[themeName]
: undefined;
if (selectedTheme && darkMode && !selectedTheme.modes) {
darkMode = false;