From a4f7caef8129df9fab082e42967e1350ec7e2e3c Mon Sep 17 00:00:00 2001
From: Paulus Schoutsen <paulus@paulusschoutsen.nl>
Date: Thu, 11 May 2017 21:52:14 -0700
Subject: [PATCH] Show errors on dashboard when something went wrong.

https://www.pivotaltracker.com/story/show/145310923
---
 panels/hassio/dashboard/hassio-hass-info.html | 26 +++++++++++++++++
 panels/hassio/dashboard/hassio-host-info.html | 28 +++++++++++++++++++
 .../dashboard/hassio-supervisor-info.html     | 28 +++++++++++++++++++
 3 files changed, 82 insertions(+)

diff --git a/panels/hassio/dashboard/hassio-hass-info.html b/panels/hassio/dashboard/hassio-hass-info.html
index bf0ce8fc49..c6dcb762c2 100644
--- a/panels/hassio/dashboard/hassio-hass-info.html
+++ b/panels/hassio/dashboard/hassio-hass-info.html
@@ -16,6 +16,10 @@
     .info td:nth-child(2) {
       text-align: right;
     }
+    .errors {
+      color: var(--google-red-500);
+      margin-top: 16px;
+    }
   </style>
   <template>
     <paper-card heading="Home Assistant">
@@ -30,6 +34,9 @@
             <td>[[data.last_version]]</td>
           </tr>
         </table>
+        <template is='dom-if' if='[[errors]]'>
+          <div class='errors'>Error: [[errors]]</div>
+        </template>
       </div>
       <div class="card-actions">
         <template is='dom-if' if='[[computeUpdateAvailable(data)]]'>
@@ -63,6 +70,25 @@ Polymer({
     },
   },
 
+  listeners: {
+    'hass-api-called': 'apiCalled',
+  },
+
+  apiCalled: function (ev) {
+    if (ev.detail.success) {
+      this.errors = null;
+      return;
+    }
+
+    var response = ev.detail.response;
+
+    if (typeof response.body === 'object') {
+      this.errors = response.body.message || 'Unknown error';
+    } else {
+      this.errors = response.body;
+    }
+  },
+
   computeUpdateAvailable: function (data) {
     return data.version !== data.last_version;
   },
diff --git a/panels/hassio/dashboard/hassio-host-info.html b/panels/hassio/dashboard/hassio-host-info.html
index 6770c594b2..b54afecbac 100644
--- a/panels/hassio/dashboard/hassio-host-info.html
+++ b/panels/hassio/dashboard/hassio-host-info.html
@@ -15,6 +15,10 @@
     .info td:nth-child(2) {
       text-align: right;
     }
+    .errors {
+      color: var(--google-red-500);
+      margin-top: 16px;
+    }
   </style>
   <template>
     <paper-card heading="Host OS">
@@ -41,6 +45,9 @@
             <td>[[data.last_version]]</td>
           </tr>
         </table>
+        <template is='dom-if' if='[[errors]]'>
+          <div class='errors'>Error: [[errors]]</div>
+        </template>
       </div>
       <div class="card-actions">
         <template is='dom-if' if='[[computeUpdateAvailable(data)]]'>
@@ -74,6 +81,27 @@ Polymer({
       type: Object,
       value: {},
     },
+
+    errors: String,
+  },
+
+  listeners: {
+    'hass-api-called': 'apiCalled',
+  },
+
+  apiCalled: function (ev) {
+    if (ev.detail.success) {
+      this.errors = null;
+      return;
+    }
+
+    var response = ev.detail.response;
+
+    if (typeof response.body === 'object') {
+      this.errors = response.body.message || 'Unknown error';
+    } else {
+      this.errors = response.body;
+    }
   },
 
   computeUpdateAvailable: function (data) {
diff --git a/panels/hassio/dashboard/hassio-supervisor-info.html b/panels/hassio/dashboard/hassio-supervisor-info.html
index c26c3c944f..3277d9d551 100644
--- a/panels/hassio/dashboard/hassio-supervisor-info.html
+++ b/panels/hassio/dashboard/hassio-supervisor-info.html
@@ -15,6 +15,10 @@
     .info td:nth-child(2) {
       text-align: right;
     }
+    .errors {
+      color: var(--google-red-500);
+      margin-top: 16px;
+    }
   </style>
   <template>
     <paper-card heading="Supervisor">
@@ -33,6 +37,9 @@
             <td>[[data.last_version]]</td>
           </tr>
         </table>
+        <template is='dom-if' if='[[errors]]'>
+          <div class='errors'>Error: [[errors]]</div>
+        </template>
       </div>
       <div class="card-actions">
         <paper-button on-tap='supervisorLogsTapped'>View logs</paper-button>
@@ -65,6 +72,27 @@ Polymer({
       type: Object,
       value: {},
     },
+
+    errors: String,
+  },
+
+  listeners: {
+    'hass-api-called': 'apiCalled',
+  },
+
+  apiCalled: function (ev) {
+    if (ev.detail.success) {
+      this.errors = null;
+      return;
+    }
+
+    var response = ev.detail.response;
+
+    if (typeof response.body === 'object') {
+      this.errors = response.body.message || 'Unknown error';
+    } else {
+      this.errors = response.body;
+    }
   },
 
   computeUpdateAvailable: function (data) {