diff --git a/src/data/cloud.ts b/src/data/cloud.ts index bef3f50b85..582ff12115 100644 --- a/src/data/cloud.ts +++ b/src/data/cloud.ts @@ -1,4 +1,51 @@ import { HomeAssistant } from "../types"; +import { Webhook } from "./webhook"; + +export interface EntityFilter { + include_domains: string[]; + include_entities: string[]; + exclude_domains: string[]; + exclude_entities: string[]; +} +interface CloudStatusBase { + logged_in: boolean; + cloud: "disconnected" | "connecting" | "connected"; +} + +interface CertificateInformation { + common_name: string; + expire_date: string; + fingerprint: string; +} + +export type CloudStatusLoggedIn = CloudStatusBase & { + email: string; + google_entities: EntityFilter; + google_domains: string[]; + alexa_entities: EntityFilter; + alexa_domains: string[]; + prefs: { + google_enabled: boolean; + alexa_enabled: boolean; + google_allow_unlock: boolean; + cloudhooks: { [webhookId: string]: CloudWebhook }; + }; + remote_domain: string | undefined; + remote_connected: boolean; + remote_certificate: undefined | CertificateInformation; +}; + +export type CloudStatus = CloudStatusBase | CloudStatusLoggedIn; + +export interface SubscriptionInfo { + human_description: string; +} + +export interface WebhookDialogParams { + webhook: Webhook; + cloudhook: CloudWebhook; + disableHook: () => void; +} export interface CloudWebhook { webhook_id: string; @@ -28,3 +75,19 @@ export const disconnectCloudRemote = (hass: HomeAssistant) => hass.callWS({ type: "cloud/remote/disconnect", }); + +export const fetchCloudSubscriptionInfo = (hass: HomeAssistant) => + hass.callWS({ type: "cloud/subscription" }); + +export const updateCloudPref = ( + hass: HomeAssistant, + prefs: { + google_enabled?: boolean; + alexa_enabled?: boolean; + google_allow_unlock?: boolean; + } +) => + hass.callWS({ + type: "cloud/update_prefs", + ...prefs, + }); diff --git a/src/dialogs/more-info/controls/more-info-camera.ts b/src/dialogs/more-info/controls/more-info-camera.ts index a7a7097997..04155c2cc4 100644 --- a/src/dialogs/more-info/controls/more-info-camera.ts +++ b/src/dialogs/more-info/controls/more-info-camera.ts @@ -46,7 +46,8 @@ class MoreInfoCamera extends UpdatingElement { return; } // tslint:disable-next-line - const Hls = ((await import("hls.js")) as any).default as HLSModule; + const Hls = ((await import(/* webpackChunkName: "hls.js" */ "hls.js")) as any) + .default as HLSModule; if (Hls.isSupported()) { try { diff --git a/src/panels/config/cloud/cloud-alexa-pref.ts b/src/panels/config/cloud/cloud-alexa-pref.ts index 22b9d31d51..5bb49a9c3a 100644 --- a/src/panels/config/cloud/cloud-alexa-pref.ts +++ b/src/panels/config/cloud/cloud-alexa-pref.ts @@ -3,6 +3,8 @@ import { LitElement, PropertyDeclarations, TemplateResult, + CSSResult, + css, } from "lit-element"; import "@material/mwc-button"; import "@polymer/paper-card/paper-card"; @@ -12,9 +14,8 @@ import { PaperToggleButtonElement } from "@polymer/paper-toggle-button/paper-tog import { fireEvent } from "../../../common/dom/fire_event"; import { HomeAssistant } from "../../../types"; -import { updatePref } from "./data"; -import { CloudStatusLoggedIn } from "./types"; import "./cloud-exposed-entities"; +import { CloudStatusLoggedIn, updateCloudPref } from "../../../data/cloud"; export class CloudAlexaPref extends LitElement { public hass?: HomeAssistant; @@ -35,7 +36,6 @@ export class CloudAlexaPref extends LitElement { const enabled = this.cloudStatus!.prefs.alexa_enabled; return html` - ${this.renderStyle()}
  • Config documentation @@ -80,25 +80,23 @@ export class CloudAlexaPref extends LitElement { private async _toggleChanged(ev) { const toggle = ev.target as PaperToggleButtonElement; try { - await updatePref(this.hass!, { alexa_enabled: toggle.checked! }); + await updateCloudPref(this.hass!, { alexa_enabled: toggle.checked! }); fireEvent(this, "ha-refresh-cloud-status"); } catch (err) { toggle.checked = !toggle.checked; } } - private renderStyle(): TemplateResult { - return html` - + static get styles(): CSSResult { + return css` + a { + color: var(--primary-color); + } + paper-card > paper-toggle-button { + position: absolute; + right: 8px; + top: 16px; + } `; } } diff --git a/src/panels/config/cloud/cloud-google-pref.ts b/src/panels/config/cloud/cloud-google-pref.ts index a621ca0b8d..6dc830d850 100644 --- a/src/panels/config/cloud/cloud-google-pref.ts +++ b/src/panels/config/cloud/cloud-google-pref.ts @@ -3,6 +3,8 @@ import { LitElement, PropertyDeclarations, TemplateResult, + CSSResult, + css, } from "lit-element"; import "@material/mwc-button"; import "@polymer/paper-card/paper-card"; @@ -13,9 +15,8 @@ import "../../../components/buttons/ha-call-api-button"; import { fireEvent } from "../../../common/dom/fire_event"; import { HomeAssistant } from "../../../types"; -import { updatePref } from "./data"; -import { CloudStatusLoggedIn } from "./types"; import "./cloud-exposed-entities"; +import { CloudStatusLoggedIn, updateCloudPref } from "../../../data/cloud"; export class CloudGooglePref extends LitElement { public hass?: HomeAssistant; @@ -36,7 +37,6 @@ export class CloudGooglePref extends LitElement { const { google_enabled, google_allow_unlock } = this.cloudStatus.prefs; return html` - ${this.renderStyle()}
  • Config documentation @@ -103,37 +103,35 @@ export class CloudGooglePref extends LitElement { private async _toggleChanged(ev) { const toggle = ev.target as PaperToggleButtonElement; try { - await updatePref(this.hass!, { [toggle.id]: toggle.checked! }); + await updateCloudPref(this.hass!, { [toggle.id]: toggle.checked! }); fireEvent(this, "ha-refresh-cloud-status"); } catch (err) { toggle.checked = !toggle.checked; } } - private renderStyle(): TemplateResult { - return html` - + static get styles(): CSSResult { + return css` + a { + color: var(--primary-color); + } + paper-card > paper-toggle-button { + position: absolute; + right: 8px; + top: 16px; + } + ha-call-api-button { + color: var(--primary-color); + font-weight: 500; + } + .unlock { + display: flex; + flex-direction: row; + padding-top: 16px; + } + .unlock > div { + flex: 1; + } `; } } diff --git a/src/panels/config/cloud/cloud-remote-pref.ts b/src/panels/config/cloud/cloud-remote-pref.ts new file mode 100644 index 0000000000..c364af1dd5 --- /dev/null +++ b/src/panels/config/cloud/cloud-remote-pref.ts @@ -0,0 +1,148 @@ +import { + html, + LitElement, + PropertyDeclarations, + TemplateResult, + customElement, + CSSResult, + css, +} from "lit-element"; +import "@material/mwc-button"; +import "@polymer/paper-card/paper-card"; +import "@polymer/paper-toggle-button/paper-toggle-button"; +import "@polymer/paper-item/paper-item-body"; +// tslint:disable-next-line +import { PaperToggleButtonElement } from "@polymer/paper-toggle-button/paper-toggle-button"; +import "../../../components/buttons/ha-call-api-button"; + +import { fireEvent } from "../../../common/dom/fire_event"; +import { HomeAssistant } from "../../../types"; +import { + connectCloudRemote, + disconnectCloudRemote, + CloudStatusLoggedIn, +} from "../../../data/cloud"; +import format_date_time from "../../../common/datetime/format_date_time"; + +@customElement("cloud-remote-pref") +export class CloudRemotePref extends LitElement { + public hass?: HomeAssistant; + public cloudStatus?: CloudStatusLoggedIn; + + static get properties(): PropertyDeclarations { + return { + hass: {}, + cloudStatus: {}, + }; + } + + protected render(): TemplateResult | void { + if (!this.cloudStatus) { + return html``; + } + + const { + remote_connected, + remote_domain, + remote_certificate, + } = this.cloudStatus; + + return html` + + +
    + Home Assistant Cloud provides you with a secure remote connection to + your instance while away from home. Your instance + ${remote_connected ? "is" : "will be"} available at + + https://${remote_domain}. + ${!remote_certificate + ? "" + : html` +
    + + Certificate expiration date +
    Will be automatically renewed
    +     +
    + ${format_date_time( + new Date(remote_certificate.expire_date), + this.hass!.language + )} +
    +
    +
    + + Certificate fingerprint + +
    + ${remote_certificate.fingerprint} +
    +
    + `} +
    +
    + + Learn how it works + +
    + + `; + } + + private async _toggleChanged(ev) { + const toggle = ev.target as PaperToggleButtonElement; + + try { + if (toggle.checked) { + await connectCloudRemote(this.hass!); + } else { + await disconnectCloudRemote(this.hass!); + } + fireEvent(this, "ha-refresh-cloud-status"); + } catch (err) { + toggle.checked = !toggle.checked; + } + } + + static get styles(): CSSResult { + return css` + .data-row { + display: flex; + } + .data-value { + padding: 16px 0; + } + a { + color: var(--primary-color); + } + paper-card > paper-toggle-button { + position: absolute; + right: 8px; + top: 16px; + } + ha-call-api-button { + color: var(--primary-color); + font-weight: 500; + } + .unlock { + display: flex; + flex-direction: row; + padding-top: 16px; + } + .unlock > div { + flex: 1; + } + `; + } +} + +declare global { + interface HTMLElementTagNameMap { + "cloud-remote-pref": CloudRemotePref; + } +} diff --git a/src/panels/config/cloud/data.ts b/src/panels/config/cloud/data.ts deleted file mode 100644 index adf98229f9..0000000000 --- a/src/panels/config/cloud/data.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { HomeAssistant } from "../../../types"; -import { SubscriptionInfo } from "./types"; - -export const fetchSubscriptionInfo = (hass: HomeAssistant) => - hass.callWS({ type: "cloud/subscription" }); - -export const updatePref = ( - hass: HomeAssistant, - prefs: { - google_enabled?: boolean; - alexa_enabled?: boolean; - google_allow_unlock?: boolean; - } -) => - hass.callWS({ - type: "cloud/update_prefs", - ...prefs, - }); diff --git a/src/panels/config/cloud/ha-config-cloud-account.js b/src/panels/config/cloud/ha-config-cloud-account.js index eac39d2837..d6c004a1b3 100644 --- a/src/panels/config/cloud/ha-config-cloud-account.js +++ b/src/panels/config/cloud/ha-config-cloud-account.js @@ -16,11 +16,10 @@ import formatDateTime from "../../../common/datetime/format_date_time"; import EventsMixin from "../../../mixins/events-mixin"; import LocalizeMixin from "../../../mixins/localize-mixin"; import { fireEvent } from "../../../common/dom/fire_event"; - -import { fetchSubscriptionInfo } from "./data"; +import { fetchCloudSubscriptionInfo } from "../../../data/cloud"; import "./cloud-alexa-pref"; import "./cloud-google-pref"; -import { connectCloudRemote, disconnectCloudRemote } from "../../../data/cloud"; +import "./cloud-remote-pref"; let registeredWebhookDialog = false; @@ -98,25 +97,6 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
    [[cloudStatus.cloud]]
    - -
    Manage Account
    + + Home Assistant Cloud

    - Home Assistant Cloud allow you to remotely and securely control - your instance away from home. It also allows you to connect with - cloud-only services like Amazon Alexa and Google Assistant. + 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.

    This service is run by our partner diff --git a/src/panels/config/cloud/ha-config-cloud-register.js b/src/panels/config/cloud/ha-config-cloud-register.js index be9bfdea6d..b387e18d01 100644 --- a/src/panels/config/cloud/ha-config-cloud-register.js +++ b/src/panels/config/cloud/ha-config-cloud-register.js @@ -66,7 +66,7 @@ class HaConfigCloudRegister extends EventsMixin(PolymerElement) { The trial will give you access to all the benefits of Home Assistant Cloud, including:

      -
    • Control Home Assistant away from home
      • +
    • Control of Home Assistant away from home
    • Integration with Google Assistant
    • Integration with Amazon Alexa
    • Easy integration with webhook-based apps like OwnTracks
      • diff --git a/src/panels/config/cloud/types.ts b/src/panels/config/cloud/types.ts deleted file mode 100644 index 80affe7d3f..0000000000 --- a/src/panels/config/cloud/types.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { CloudWebhook } from "../../../data/cloud"; -import { Webhook } from "../../../data/webhook"; - -export interface EntityFilter { - include_domains: string[]; - include_entities: string[]; - exclude_domains: string[]; - exclude_entities: string[]; -} -interface CloudStatusBase { - logged_in: boolean; - cloud: "disconnected" | "connecting" | "connected"; -} - -export type CloudStatusLoggedIn = CloudStatusBase & { - email: string; - google_entities: EntityFilter; - google_domains: string[]; - alexa_entities: EntityFilter; - alexa_domains: string[]; - prefs: { - google_enabled: boolean; - alexa_enabled: boolean; - google_allow_unlock: boolean; - cloudhooks: { [webhookId: string]: CloudWebhook }; - }; -}; - -export type CloudStatus = CloudStatusBase | CloudStatusLoggedIn; - -export interface SubscriptionInfo { - human_description: string; -} - -export interface WebhookDialogParams { - webhook: Webhook; - cloudhook: CloudWebhook; - disableHook: () => void; -}