mirror of
https://github.com/home-assistant/frontend
synced 2024-08-30 01:56:15 +02:00
Google Entities updates (#3237)
* Match Google Expose default with backend for when no config value set * Allow toggling domains
This commit is contained in:
parent
be4dd5b20b
commit
be6b25f5be
97
src/dialogs/domain-toggler/dialog-domain-toggler.ts
Normal file
97
src/dialogs/domain-toggler/dialog-domain-toggler.ts
Normal file
@ -0,0 +1,97 @@
|
|||||||
|
import {
|
||||||
|
customElement,
|
||||||
|
LitElement,
|
||||||
|
property,
|
||||||
|
CSSResultArray,
|
||||||
|
css,
|
||||||
|
TemplateResult,
|
||||||
|
html,
|
||||||
|
} from "lit-element";
|
||||||
|
import "../../components/dialog/ha-paper-dialog";
|
||||||
|
import { HomeAssistant } from "../../types";
|
||||||
|
import { HaDomainTogglerDialogParams } from "./show-dialog-domain-toggler";
|
||||||
|
import { PolymerChangedEvent } from "../../polymer-types";
|
||||||
|
import { haStyleDialog } from "../../resources/styles";
|
||||||
|
|
||||||
|
@customElement("dialog-domain-toggler")
|
||||||
|
class DomainTogglerDialog extends LitElement {
|
||||||
|
public hass!: HomeAssistant;
|
||||||
|
@property() private _params?: HaDomainTogglerDialogParams;
|
||||||
|
|
||||||
|
public async showDialog(params: HaDomainTogglerDialogParams): Promise<void> {
|
||||||
|
this._params = params;
|
||||||
|
}
|
||||||
|
|
||||||
|
protected render(): TemplateResult | void {
|
||||||
|
if (!this._params) {
|
||||||
|
return html``;
|
||||||
|
}
|
||||||
|
|
||||||
|
const domains = this._params.domains
|
||||||
|
.map((domain) => [this.hass.localize(`domain.${domain}`), domain])
|
||||||
|
.sort();
|
||||||
|
|
||||||
|
return html`
|
||||||
|
<ha-paper-dialog
|
||||||
|
with-backdrop
|
||||||
|
opened
|
||||||
|
@opened-changed=${this._openedChanged}
|
||||||
|
>
|
||||||
|
<h2>Toggle Domains</h2>
|
||||||
|
<div>
|
||||||
|
${domains.map(
|
||||||
|
(domain) =>
|
||||||
|
html`
|
||||||
|
<div>${domain[0]}</div>
|
||||||
|
<mwc-button .domain=${domain[1]} @click=${this._handleOff}>
|
||||||
|
${this.hass.localize("state.default.off")}
|
||||||
|
</mwc-button>
|
||||||
|
<mwc-button .domain=${domain[1]} @click=${this._handleOn}>
|
||||||
|
${this.hass.localize("state.default.on")}
|
||||||
|
</mwc-button>
|
||||||
|
`
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</ha-paper-dialog>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
private _openedChanged(ev: PolymerChangedEvent<boolean>): void {
|
||||||
|
// Closed dialog by clicking on the overlay
|
||||||
|
if (!ev.detail.value) {
|
||||||
|
this._params = undefined;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private _handleOff(ev) {
|
||||||
|
this._params!.toggleDomain(ev.currentTarget.domain, false);
|
||||||
|
ev.currentTarget.blur();
|
||||||
|
}
|
||||||
|
|
||||||
|
private _handleOn(ev) {
|
||||||
|
this._params!.toggleDomain(ev.currentTarget.domain, true);
|
||||||
|
ev.currentTarget.blur();
|
||||||
|
}
|
||||||
|
|
||||||
|
static get styles(): CSSResultArray {
|
||||||
|
return [
|
||||||
|
haStyleDialog,
|
||||||
|
css`
|
||||||
|
ha-paper-dialog {
|
||||||
|
max-width: 500px;
|
||||||
|
}
|
||||||
|
div {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: auto auto auto;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
`,
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
declare global {
|
||||||
|
interface HTMLElementTagNameMap {
|
||||||
|
"dialog-domain-toggler": DomainTogglerDialog;
|
||||||
|
}
|
||||||
|
}
|
20
src/dialogs/domain-toggler/show-dialog-domain-toggler.ts
Normal file
20
src/dialogs/domain-toggler/show-dialog-domain-toggler.ts
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
import { fireEvent } from "../../common/dom/fire_event";
|
||||||
|
|
||||||
|
export interface HaDomainTogglerDialogParams {
|
||||||
|
domains: string[];
|
||||||
|
toggleDomain: (domain: string, turnOn: boolean) => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const loadDomainTogglerDialog = () =>
|
||||||
|
import(/* webpackChunkName: "dialog-domain-toggler" */ "./dialog-domain-toggler");
|
||||||
|
|
||||||
|
export const showDomainTogglerDialog = (
|
||||||
|
element: HTMLElement,
|
||||||
|
dialogParams: HaDomainTogglerDialogParams
|
||||||
|
): void => {
|
||||||
|
fireEvent(element, "show-dialog", {
|
||||||
|
dialogTag: "dialog-domain-toggler",
|
||||||
|
dialogImport: loadDomainTogglerDialog,
|
||||||
|
dialogParams,
|
||||||
|
});
|
||||||
|
};
|
@ -8,6 +8,7 @@ import {
|
|||||||
property,
|
property,
|
||||||
} from "lit-element";
|
} from "lit-element";
|
||||||
import "@polymer/paper-toggle-button";
|
import "@polymer/paper-toggle-button";
|
||||||
|
import "@polymer/paper-icon-button";
|
||||||
import "../../../layouts/hass-subpage";
|
import "../../../layouts/hass-subpage";
|
||||||
import "../../../layouts/hass-loading-screen";
|
import "../../../layouts/hass-loading-screen";
|
||||||
import "../../../components/ha-card";
|
import "../../../components/ha-card";
|
||||||
@ -33,12 +34,21 @@ import computeStateName from "../../../common/entity/compute_state_name";
|
|||||||
import { fireEvent } from "../../../common/dom/fire_event";
|
import { fireEvent } from "../../../common/dom/fire_event";
|
||||||
import { showToast } from "../../../util/toast";
|
import { showToast } from "../../../util/toast";
|
||||||
import { PolymerChangedEvent } from "../../../polymer-types";
|
import { PolymerChangedEvent } from "../../../polymer-types";
|
||||||
|
import { showDomainTogglerDialog } from "../../../dialogs/domain-toggler/show-dialog-domain-toggler";
|
||||||
|
import computeDomain from "../../../common/entity/compute_domain";
|
||||||
|
|
||||||
|
const DEFAULT_CONFIG_EXPOSE = true;
|
||||||
|
|
||||||
|
const configIsExposed = (config: GoogleEntityConfig) =>
|
||||||
|
config.should_expose === undefined
|
||||||
|
? DEFAULT_CONFIG_EXPOSE
|
||||||
|
: config.should_expose;
|
||||||
|
|
||||||
@customElement("ha-config-cloud-google-assistant")
|
@customElement("ha-config-cloud-google-assistant")
|
||||||
class CloudGoogleAssistant extends LitElement {
|
class CloudGoogleAssistant extends LitElement {
|
||||||
@property() public hass!: HomeAssistant;
|
@property() public hass!: HomeAssistant;
|
||||||
@property() public cloudStatus!: CloudStatusLoggedIn;
|
@property() public cloudStatus!: CloudStatusLoggedIn;
|
||||||
@property() public isWide!: boolean;
|
@property() public narrow!: boolean;
|
||||||
@property() private _entities?: GoogleEntity[];
|
@property() private _entities?: GoogleEntity[];
|
||||||
@property()
|
@property()
|
||||||
private _entityConfigs: CloudPreferences["google_entity_configs"] = {};
|
private _entityConfigs: CloudPreferences["google_entity_configs"] = {};
|
||||||
@ -69,7 +79,7 @@ class CloudGoogleAssistant extends LitElement {
|
|||||||
const stateObj = this.hass.states[entity.entity_id];
|
const stateObj = this.hass.states[entity.entity_id];
|
||||||
const config = this._entityConfigs[entity.entity_id] || {};
|
const config = this._entityConfigs[entity.entity_id] || {};
|
||||||
const isExposed = emptyFilter
|
const isExposed = emptyFilter
|
||||||
? Boolean(config.should_expose)
|
? configIsExposed(config)
|
||||||
: filterFunc(entity.entity_id);
|
: filterFunc(entity.entity_id);
|
||||||
if (isExposed) {
|
if (isExposed) {
|
||||||
selected++;
|
selected++;
|
||||||
@ -114,7 +124,18 @@ class CloudGoogleAssistant extends LitElement {
|
|||||||
|
|
||||||
return html`
|
return html`
|
||||||
<hass-subpage header="Google Assistant">
|
<hass-subpage header="Google Assistant">
|
||||||
<span slot="toolbar-icon">${selected} selected</span>
|
<span slot="toolbar-icon">
|
||||||
|
${selected}${!this.narrow
|
||||||
|
? html`
|
||||||
|
selected
|
||||||
|
`
|
||||||
|
: ""}
|
||||||
|
</span>
|
||||||
|
<paper-icon-button
|
||||||
|
slot="toolbar-icon"
|
||||||
|
icon="hass:tune"
|
||||||
|
@click=${this._openDomainToggler}
|
||||||
|
></paper-icon-button>
|
||||||
${!emptyFilter
|
${!emptyFilter
|
||||||
? html`
|
? html`
|
||||||
<div class="banner">
|
<div class="banner">
|
||||||
@ -164,9 +185,11 @@ class CloudGoogleAssistant extends LitElement {
|
|||||||
private async _exposeChanged(ev: PolymerChangedEvent<boolean>) {
|
private async _exposeChanged(ev: PolymerChangedEvent<boolean>) {
|
||||||
const entityId = (ev.currentTarget as any).entityId;
|
const entityId = (ev.currentTarget as any).entityId;
|
||||||
const newExposed = ev.detail.value;
|
const newExposed = ev.detail.value;
|
||||||
const curExposed = Boolean(
|
await this._updateExposed(entityId, newExposed);
|
||||||
(this._entityConfigs[entityId] || {}).should_expose
|
}
|
||||||
);
|
|
||||||
|
private async _updateExposed(entityId: string, newExposed: boolean) {
|
||||||
|
const curExposed = configIsExposed(this._entityConfigs[entityId] || {});
|
||||||
if (newExposed === curExposed) {
|
if (newExposed === curExposed) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@ -203,6 +226,21 @@ class CloudGoogleAssistant extends LitElement {
|
|||||||
this._ensureStatusReload();
|
this._ensureStatusReload();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private _openDomainToggler() {
|
||||||
|
showDomainTogglerDialog(this, {
|
||||||
|
domains: this._entities!.map((entity) =>
|
||||||
|
computeDomain(entity.entity_id)
|
||||||
|
).filter((value, idx, self) => self.indexOf(value) === idx),
|
||||||
|
toggleDomain: (domain, turnOn) => {
|
||||||
|
this._entities!.forEach((entity) => {
|
||||||
|
if (computeDomain(entity.entity_id) === domain) {
|
||||||
|
this._updateExposed(entity.entity_id, turnOn);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
private _ensureStatusReload() {
|
private _ensureStatusReload() {
|
||||||
if (this._popstateReloadStatusAttached) {
|
if (this._popstateReloadStatusAttached) {
|
||||||
return;
|
return;
|
||||||
|
@ -18,6 +18,7 @@ const NOT_LOGGED_IN_URLS = ["login", "register", "forgot-password"];
|
|||||||
class HaConfigCloud extends HassRouterPage {
|
class HaConfigCloud extends HassRouterPage {
|
||||||
@property() public hass!: HomeAssistant;
|
@property() public hass!: HomeAssistant;
|
||||||
@property() public isWide!: boolean;
|
@property() public isWide!: boolean;
|
||||||
|
@property() public narrow!: boolean;
|
||||||
@property() public route!: Route;
|
@property() public route!: Route;
|
||||||
@property() public cloudStatus!: CloudStatus;
|
@property() public cloudStatus!: CloudStatus;
|
||||||
|
|
||||||
@ -125,6 +126,7 @@ class HaConfigCloud extends HassRouterPage {
|
|||||||
el.hass = this.hass;
|
el.hass = this.hass;
|
||||||
el.email = this._loginEmail;
|
el.email = this._loginEmail;
|
||||||
el.isWide = this.isWide;
|
el.isWide = this.isWide;
|
||||||
|
el.narrow = this.narrow;
|
||||||
el.cloudStatus = this.cloudStatus;
|
el.cloudStatus = this.cloudStatus;
|
||||||
el.flashMessage = this._flashMessage;
|
el.flashMessage = this._flashMessage;
|
||||||
}
|
}
|
||||||
|
@ -9,6 +9,7 @@ import { HassRouterPage, RouterOptions } from "../../layouts/hass-router-page";
|
|||||||
@customElement("ha-panel-config")
|
@customElement("ha-panel-config")
|
||||||
class HaPanelConfig extends HassRouterPage {
|
class HaPanelConfig extends HassRouterPage {
|
||||||
@property() public hass!: HomeAssistant;
|
@property() public hass!: HomeAssistant;
|
||||||
|
@property() public narrow!: boolean;
|
||||||
@property() public _wideSidebar: boolean = false;
|
@property() public _wideSidebar: boolean = false;
|
||||||
@property() public _wide: boolean = false;
|
@property() public _wide: boolean = false;
|
||||||
|
|
||||||
@ -124,6 +125,7 @@ class HaPanelConfig extends HassRouterPage {
|
|||||||
el.route = this.routeTail;
|
el.route = this.routeTail;
|
||||||
el.hass = this.hass;
|
el.hass = this.hass;
|
||||||
el.isWide = this.hass.dockedSidebar ? this._wideSidebar : this._wide;
|
el.isWide = this.hass.dockedSidebar ? this._wideSidebar : this._wide;
|
||||||
|
el.narrow = this.narrow;
|
||||||
el.cloudStatus = this._cloudStatus;
|
el.cloudStatus = this._cloudStatus;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user