Cloud remote (#2916)

* Add cloud management

* Update text

src/data/cloud.ts

@@ -18,3 +18,13 @@ export const deleteCloudhook = (hass: HomeAssistant, webhookId: string) =>
     type: "cloud/cloudhook/delete",
     webhook_id: webhookId,
   });
+
+export const connectCloudRemote = (hass: HomeAssistant) =>
+  hass.callWS({
+    type: "cloud/remote/connect",
+  });
+
+export const disconnectCloudRemote = (hass: HomeAssistant) =>
+  hass.callWS({
+    type: "cloud/remote/disconnect",
+  });

src/panels/config/cloud/ha-config-cloud-account.js

@@ -20,6 +20,7 @@ import { fireEvent } from "../../../common/dom/fire_event";
 import { fetchSubscriptionInfo } from "./data";
 import "./cloud-alexa-pref";
 import "./cloud-google-pref";
+import { connectCloudRemote, disconnectCloudRemote } from "../../../data/cloud";
 
 let registeredWebhookDialog = false;
 
@@ -66,6 +67,9 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
           text-transform: capitalize;
           padding: 16px;
         }
+        a {
+          color: var(--primary-color);
+        }
       </style>
       <hass-subpage header="Home Assistant Cloud">
         <div class="content">
@@ -83,7 +87,7 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
               <div class="account-row">
                 <paper-item-body two-line="">
                   [[cloudStatus.email]]
-                  <div secondary="" class="wrap">
+                  <div secondary class="wrap">
                     [[_formatSubscription(_subscription)]]
                   </div>
                 </paper-item-body>
@@ -94,6 +98,25 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
                 <div class="status">[[cloudStatus.cloud]]</div>
               </div>
 
+              <div class="account-row">
+                <paper-item-body two-line>
+                  Remote Access
+                  <div class="secondary">
+                    <a
+                      href="https://[[cloudStatus.remote_domain]]"
+                      target="_blank"
+                      >[[cloudStatus.remote_domain]]</a
+                    >
+                  </div>
+                </paper-item-body>
+                <div class="status">
+                  <paper-toggle-button
+                    checked="[[cloudStatus.remote_connected]]"
+                    on-change="_remoteChanged"
+                  ></paper-toggle-button>
+                </div>
+              </div>
+
               <div class="card-actions">
                 <a href="https://account.nabucasa.com" target="_blank"
                   ><mwc-button>Manage Account</mwc-button></a
@@ -172,6 +195,22 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
     }
   }
 
+  async _remoteChanged(ev) {
+    const toggle = ev.target;
+
+    try {
+      this.cloudStatus = toggle.checked
+        ? await connectCloudRemote(this.hass)
+        : await disconnectCloudRemote(this.hass);
+    } catch (err) {
+      toggle.checked = !toggle.checked;
+    }
+  }
+
+  _computeRemoteConnected(connected) {
+    return connected ? "Connected" : "Not Connected";
+  }
+
   async _fetchSubscriptionInfo() {
     this._subscription = await fetchSubscriptionInfo(this.hass);
     if (

src/panels/config/cloud/ha-config-cloud-login.js

@@ -74,8 +74,9 @@ class HaConfigCloudLogin extends NavigateMixin(EventsMixin(PolymerElement)) {
             <span slot="header">Home Assistant Cloud</span>
             <div slot="introduction">
               <p>
-                Home Assistant Cloud connects your local instance securely to
-                cloud-only services Amazon Alexa and Google Assistant.
+                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.
               </p>
               <p>
                 This service is run by our partner

src/panels/config/cloud/ha-config-cloud-register.js

@@ -66,8 +66,10 @@ class HaConfigCloudRegister extends EventsMixin(PolymerElement) {
               The trial will give you access to all the benefits of Home Assistant Cloud, including:
             </p>
             <ul>
+              <li>Control Home Assistant away from home</li>
               <li>Integration with Google Assistant</li>
               <li>Integration with Amazon Alexa</li>
+              <li>Easy integration with webhook-based apps like OwnTracks</li>
             </ul>
             <p>
               This service is run by our partner <a href='https://www.nabucasa.com' target='_blank'>Nabu&nbsp;Casa,&nbsp;Inc</a>, a company founded by the founders of Home Assistant and Hass.io.