Add safe mode support (#4908)

* Add safe mode support

* Lint

* Fix type in demo

package.json

@@ -85,7 +85,7 @@
     "fuse.js": "^3.4.4",
     "google-timezones-json": "^1.0.2",
     "hls.js": "^0.12.4",
-    "home-assistant-js-websocket": "^4.4.0",
+    "home-assistant-js-websocket": "4.4.1",
     "intl-messageformat": "^2.2.0",
     "js-yaml": "^3.13.1",
     "leaflet": "^1.4.0",

src/fake_data/demo_config.ts

@@ -17,4 +17,5 @@ export const demoConfig: HassConfig = {
   version: "DEMO",
   whitelist_external_dirs: [],
   config_source: "storage",
+  safe_mode: false,
 };

src/panels/config/areas/dialog-area-registry-detail.ts

@@ -6,6 +6,7 @@ import {
   TemplateResult,
   property,
 } from "lit-element";
+import "@material/mwc-button";
 import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
 import "@polymer/paper-input/paper-input";
 

src/panels/lovelace/cards/hui-safe-mode-card.ts

@@ -0,0 +1,70 @@
+import {
+  html,
+  LitElement,
+  TemplateResult,
+  customElement,
+  css,
+  CSSResult,
+  property,
+} from "lit-element";
+import "@material/mwc-button";
+
+import "../../../components/ha-card";
+
+import { LovelaceCard } from "../types";
+import { HomeAssistant } from "../../../types";
+
+@customElement("hui-safe-mode-card")
+export class HuiSafeModeCard extends LitElement implements LovelaceCard {
+  @property() public hass?: HomeAssistant;
+
+  public getCardSize(): number {
+    return 3;
+  }
+
+  public setConfig(_config: any): void {
+    // No config necessary.
+  }
+
+  protected render(): TemplateResult {
+    return html`
+      <ha-card
+        .header=${this.hass!.localize(
+          "ui.panel.lovelace.cards.safe-mode.header"
+        )}
+      >
+        <div class="card-content">
+          ${this.hass!.localize(
+            "ui.panel.lovelace.cards.safe-mode.description"
+          )}
+        </div>
+        <div class="card-actions">
+          <a href="/developer-tools/logs">
+            <mwc-button>
+              ${this.hass!.localize(
+                "ui.panel.lovelace.cards.safe-mode.show_errors"
+              )}
+            </mwc-button>
+          </a>
+        </div>
+      </ha-card>
+    `;
+  }
+
+  static get styles(): CSSResult {
+    return css`
+      ha-card {
+        --ha-card-header-color: var(--primary-color);
+      }
+      .card-actions a {
+        text-decoration: none;
+      }
+    `;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "hui-safe-mode-card": HuiSafeModeCard;
+  }
+}

src/panels/lovelace/common/generate-lovelace-config.ts

@@ -404,6 +404,17 @@ export const generateLovelaceConfigFromData = async (
   entities: HassEntities,
   localize: LocalizeFunc
 ): Promise<LovelaceConfig> => {
+  if (config.safe_mode) {
+    return {
+      title: config.location_name,
+      views: [
+        {
+          cards: [{ type: "safe-mode" }],
+        },
+      ],
+    };
+  }
+
   const viewEntities = extractViews(entities);
 
   const views = viewEntities.map((viewEntity: GroupEntity) => {
@@ -461,11 +472,8 @@ export const generateLovelaceConfigFromData = async (
 
   // User has no entities
   if (views.length === 1 && views[0].cards!.length === 0) {
-    import(
-      /* webpackChunkName: "hui-empty-state-card" */ "../cards/hui-empty-state-card"
-    );
     views[0].cards!.push({
-      type: "custom:hui-empty-state-card",
+      type: "empty-state",
     });
   }
 

src/panels/lovelace/create-element/create-card-element.ts

@@ -31,11 +31,13 @@ const ALWAYS_LOADED_TYPES = new Set([
 
 const LAZY_LOAD_TYPES = {
   "alarm-panel": () => import("../cards/hui-alarm-panel-card"),
+  "empty-state": () => import("../cards/hui-empty-state-card"),
   "entity-filter": () => import("../cards/hui-entity-filter-card"),
   "picture-elements": () => import("../cards/hui-picture-elements-card"),
   "picture-entity": () => import("../cards/hui-picture-entity-card"),
   "picture-glance": () => import("../cards/hui-picture-glance-card"),
   "plant-status": () => import("../cards/hui-plant-status-card"),
+  "safe-mode": () => import("../cards/hui-safe-mode-card"),
   "shopping-list": () => import("../cards/hui-shopping-list-card"),
   conditional: () => import("../cards/hui-conditional-card"),
   gauge: () => import("../cards/hui-gauge-card"),

src/panels/lovelace/hui-root.ts

@@ -226,7 +226,8 @@ class HUIRoot extends LitElement {
                             </paper-item>
                           `
                         : ""}
-                      ${this.hass!.user!.is_admin
+                      ${this.hass!.user!.is_admin &&
+                      !this.hass!.config.safe_mode
                         ? html`
                             <paper-item
                               aria-label=${this.hass!.localize(

src/translations/en.json

@@ -1709,6 +1709,11 @@
             "toggle": "Toggle {name}",
             "call_service": "Call service {name}",
             "more_info": "Show more-info: {name}"
+          },
+          "safe-mode": {
+            "header": "Safe Mode Activated",
+            "description": "Home Assistant ran into trouble while loading your configuration and is now running in safe mode. Take a look at the error log to see what went wrong.",
+            "show_errors": "Show errors"
           }
         },
         "unused_entities": {

yarn.lock

@@ -7545,10 +7545,10 @@ hoek@6.x.x:
   resolved "https://registry.yarnpkg.com/hoek/-/hoek-6.1.3.tgz#73b7d33952e01fe27a38b0457294b79dd8da242c"
   integrity sha512-YXXAAhmF9zpQbC7LEcREFtXfGq5K1fmd+4PHkBq8NUqmzW3G+Dq10bI/i0KucLRwss3YYFQ0fSfoxBZYiGUqtQ==
 
-home-assistant-js-websocket@^4.4.0:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/home-assistant-js-websocket/-/home-assistant-js-websocket-4.4.0.tgz#676229112a2357b054ec26ed0f186940757bc826"
-  integrity sha512-B/7nDtlVv3Cz0PVteGjmpGI+Ksw+9Lf4VOM+dlMG1LErCH9uOJlLQV7vswx+7bzeGMuB9YeRDb64lqjoR0zpPg==
+home-assistant-js-websocket@4.4.1:
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/home-assistant-js-websocket/-/home-assistant-js-websocket-4.4.1.tgz#609943ee5a3e6ec0673b69a6df0c29b86e0d57bf"
+  integrity sha512-UXVn8rryoL4R9OCdFd04O2J7o1mM1WZIGQpZBVXMIinE9kn6tbkP3JkBGvTPh8mc6JmO3finoxH4ZtZgS+lbHQ==
 
 homedir-polyfill@^1.0.1:
   version "1.0.3"