From 359ddbf2845a86f6d73aa0702a00ab001e551adc Mon Sep 17 00:00:00 2001 From: Zack Arnett Date: Tue, 22 Sep 2020 20:28:26 -0500 Subject: [PATCH] continued updates --- src/data/cloud.ts | 1 + .../config/dashboard/ha-config-dashboard.ts | 450 +++++++++++------- src/translations/en.json | 2 + 3 files changed, 293 insertions(+), 160 deletions(-) diff --git a/src/data/cloud.ts b/src/data/cloud.ts index e261805f50..9b35d3171c 100644 --- a/src/data/cloud.ts +++ b/src/data/cloud.ts @@ -58,6 +58,7 @@ export type CloudStatus = CloudStatusBase | CloudStatusLoggedIn; export interface SubscriptionInfo { human_description: string; + provider: string; } export interface CloudWebhook { diff --git a/src/panels/config/dashboard/ha-config-dashboard.ts b/src/panels/config/dashboard/ha-config-dashboard.ts index 334ee0c822..9d6a5756de 100644 --- a/src/panels/config/dashboard/ha-config-dashboard.ts +++ b/src/panels/config/dashboard/ha-config-dashboard.ts @@ -17,6 +17,7 @@ import { } from "lit-element"; import memoizeOne from "memoize-one"; import { formatDateTime } from "../../../common/datetime/format_date_time"; +import { listenMediaQuery } from "../../../common/dom/media_query"; import { computeStateDomain } from "../../../common/entity/compute_state_domain"; import { caseInsensitiveCompare, @@ -27,7 +28,13 @@ import "../../../components/ha-icon-next"; import "../../../components/ha-menu-button"; import "../../../components/user/ha-person-badge"; import { AutomationEntity } from "../../../data/automation"; -import { CloudStatus } from "../../../data/cloud"; +import { + CloudStatus, + CloudStatusLoggedIn, + fetchCloudStatus, + fetchCloudSubscriptionInfo, + SubscriptionInfo, +} from "../../../data/cloud"; import { ConfigEntry, getConfigEntries } from "../../../data/config_entries"; import { DeviceRegistryEntry, @@ -45,6 +52,7 @@ import { } from "../../../data/lovelace"; import { fetchPersons, Person } from "../../../data/person"; import { fetchTags, Tag } from "../../../data/tag"; +import { fetchWebhooks, Webhook } from "../../../data/webhook"; import "../../../layouts/ha-app-layout"; import { haStyle } from "../../../resources/styles"; import { HomeAssistant } from "../../../types"; @@ -60,11 +68,11 @@ class HaConfigDashboard extends LitElement { @property({ type: Boolean, reflect: true }) public narrow!: boolean; - @property() public isWide!: boolean; + @property({ type: Boolean }) public isWide!: boolean; - @property() public cloudStatus?: CloudStatus; + @property({ attribute: false }) public cloudStatus?: CloudStatus; - @property() public showAdvanced!: boolean; + @property({ type: Boolean }) public showAdvanced!: boolean; @internalProperty() private _persons?: Person[]; @@ -80,13 +88,34 @@ class HaConfigDashboard extends LitElement { @internalProperty() private _dashboards: LovelaceDashboard[] = []; - @internalProperty() private _width: number; + @internalProperty() private _veryWide = false; - @internalProperty() private mqls?: MediaQueryList[]; + @internalProperty() private _cloudStatus?: CloudStatus; + + @internalProperty() private _subscription?: SubscriptionInfo; + + @internalProperty() private _localHooks?: Webhook[]; + + private _listeners: Array<() => void> = []; + + public connectedCallback() { + super.connectedCallback(); + this._listeners.push( + listenMediaQuery("(min-width: 1525px)", (matches) => { + this._veryWide = matches; + }) + ); + } + + public disconnectedCallback() { + super.disconnectedCallback(); + while (this._listeners.length) { + this._listeners.pop()!(); + } + } protected render(): TemplateResult { - const integrationsToShow = - this._width === 4 ? 6 : this._width === 3 ? 4 : this.narrow ? 2 : 6; + const integrationsToShow = this._veryWide ? 6 : this.narrow ? 2 : 4; return html` @@ -116,18 +145,37 @@ class HaConfigDashboard extends LitElement { )}
- Manage Persons, Users & Zones + + Manage Persons, Users & Zones +
Cloud
-
zackbarett@hey.com
+ ${this._cloudStatus && "email" in this._cloudStatus + ? html` +
+ ${this._cloudStatus.email} +
+ ` + : ""}
Remote UI - Connected + ${this._cloudStatus && + "remote_connected" in this._cloudStatus + ? this._cloudStatus?.remote_connected + ? this.hass.localize( + "ui.panel.config.cloud.account.connected" + ) + : this.hass.localize( + "ui.panel.config.cloud.account.not_connected" + ) + : ""} Google Assistant - Enabled + ${this._cloudStatus && + (this._cloudStatus as CloudStatusLoggedIn).prefs + .google_enabled + ? this.hass.localize("ui.panel.config.cloud.enabled") + : this.hass.localize( + "ui.panel.config.cloud.disabled" + )} Amazon Alexa - Disabled + ${this._cloudStatus && + (this._cloudStatus as CloudStatusLoggedIn).prefs + .alexa_enabled + ? this.hass.localize("ui.panel.config.cloud.enabled") + : this.hass.localize( + "ui.panel.config.cloud.disabled" + )} Webhooks - 3 active + ${this._localHooks?.length} active
- Manage Cloud Services + + Manage Cloud Services
- - Location Settings - Unit system, timezone, etc - - - - Server Control - Stop and Start Home Assistant - - - - Logs - Server Logs - - - - Add-ons - Manage Addons - - - - About - Info about the server - - + + + Location Settings + Unit system, timezone, etc + + + + + + Server Control + Stop and Start Home Assistant + + + + + + Logs + Server Logs + + + + + + + Customizations + Manage Customizations + + + + + + About + Info about the server + + +
- Manage Server + + Manage Server +
@@ -281,103 +362,126 @@ class HaConfigDashboard extends LitElement { })}
- Manage integrations + + Manage integrations +
${this._getAutomations(this.hass.states).map( (automation) => html` - - ${automation.attributes.friendly_name} - ${this.hass.localize( - "ui.card.automation.last_triggered" - )}: - ${automation.attributes.last_triggered - ? formatDateTime( - new Date(automation.attributes.last_triggered), - this.hass.language - ) - : this.hass.localize( - "ui.components.relative_time.never" - )} - - - + + + ${automation.attributes.friendly_name} + ${this.hass.localize( + "ui.card.automation.last_triggered" + )}: + ${automation.attributes.last_triggered + ? formatDateTime( + new Date(automation.attributes.last_triggered), + this.hass.language + ) + : this.hass.localize( + "ui.components.relative_time.never" + )} + + + + ` )}
- Manage Automations + + Manage Automations +
${this._getScripts(this.hass.states).map( (script) => html` - - ${script.attributes.friendly_name} - ${this.hass.localize( - "ui.card.automation.last_triggered" - )}: - ${script.attributes.last_triggered - ? formatDateTime( - new Date(script.attributes.last_triggered), - this.hass.language - ) - : this.hass.localize( - "ui.components.relative_time.never" - )} - - - + + + ${script.attributes.friendly_name} + ${this.hass.localize( + "ui.card.automation.last_triggered" + )}: + ${script.attributes.last_triggered + ? formatDateTime( + new Date(script.attributes.last_triggered), + this.hass.language + ) + : this.hass.localize( + "ui.components.relative_time.never" + )} + + + + ` )}
- Manage Scripts + + Manage Scripts +
${this._getScenes(this.hass.states).map( (scene) => html` - - ${scene.attributes.friendly_name} - ${this.hass.localize( - "ui.card.automation.last_triggered" - )}: - ${scene.attributes.last_triggered - ? formatDateTime( - new Date(scene.attributes.last_triggered), - this.hass.language - ) - : this.hass.localize( - "ui.components.relative_time.never" - )} - - - + + + ${scene.attributes.friendly_name} + ${this.hass.localize( + "ui.card.automation.last_triggered" + )}: + ${scene.attributes.last_triggered + ? formatDateTime( + new Date(scene.attributes.last_triggered), + this.hass.language + ) + : this.hass.localize( + "ui.components.relative_time.never" + )} + + + + ` )}
- Manage Scenes + + Manage Scenes +
@@ -399,17 +503,19 @@ class HaConfigDashboard extends LitElement { "ui.components.relative_time.never" )} + - ` )}
- Manage Helpers + + Manage Helpers +
@@ -435,17 +541,19 @@ class HaConfigDashboard extends LitElement { "ui.panel.config.tags.never_scanned" )} + - ` )}
- Manage Tags + + Manage Tags +
+ - ` )}
- Manage Lovelace Dashboards & Resources + + Manage Lovelace Dashboards & Resources +
@@ -491,26 +603,40 @@ class HaConfigDashboard extends LitElement { this._fetchIntegrationData(); this._fetchTags(); this._fetchDasboards(); + this._fetchSubscriptionInfo(); + this._updateCloudStatus(); + this._fetchWebhooks(); subscribeEntityRegistry(this.hass.connection, (entries) => { this._entityRegistryEntries = entries; }); subscribeDeviceRegistry(this.hass.connection, (entries) => { this._deviceRegistryEntries = entries; }); - this.mqls = [300, 600, 900, 1525].map((width) => { - const mql = matchMedia(`(min-width: ${width}px)`); - mql.addEventListener("change", () => { - this._width = this.mqls!.reduce( - (cols, _mql) => cols + Number(_mql.matches), - 0 - ); - }); - return mql; - }); - this._width = this.mqls!.reduce( - (cols, _mql) => cols + Number(_mql.matches), - 0 - ); + } + + private async _fetchSubscriptionInfo() { + this._subscription = await fetchCloudSubscriptionInfo(this.hass); + if ( + this._subscription.provider && + this.cloudStatus && + this.cloudStatus.cloud !== "connected" + ) { + this._updateCloudStatus(); + } + } + + private async _updateCloudStatus() { + this._cloudStatus = await fetchCloudStatus(this.hass); + + if (this._cloudStatus.cloud === "connecting") { + setTimeout(() => this._updateCloudStatus(), 5000); + } + } + + private async _fetchWebhooks() { + this._localHooks = this.hass!.config.components.includes("webhook") + ? await fetchWebhooks(this.hass!) + : []; } private async _fetchPersonData() { @@ -785,6 +911,10 @@ class HaConfigDashboard extends LitElement { line-height: 1.2; } + .config-link { + text-decoration: none; + } + .meta-icon { color: var(--secondary-text-color); } diff --git a/src/translations/en.json b/src/translations/en.json index a6080f9359..c5d7195733 100755 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -1321,6 +1321,8 @@ "description_login": "Logged in as {email}", "description_not_login": "Not logged in", "description_features": "Control away from home, integrate with Alexa and Google Assistant.", + "enabled": "Enabled", + "disabled": "Disabled", "login": { "title": "Cloud Login", "introduction": "Home Assistant Cloud provides you with a secure remote connection to your instance while away from home. It also allows you to connect with cloud-only services: Amazon Alexa and Google Assistant.",