From 3e062ba673984896a23ad4a91c1952a054ba47bd Mon Sep 17 00:00:00 2001
From: Paulus Schoutsen <balloob@gmail.com>
Date: Mon, 27 Dec 2021 02:43:38 -0800
Subject: [PATCH] Show error screen when connection fails (#11030)

---
 src/layouts/home-assistant.ts | 52 ++++++++++++++---------------------
 src/util/launch-screen.ts     |  4 +--
 2 files changed, 22 insertions(+), 34 deletions(-)

diff --git a/src/layouts/home-assistant.ts b/src/layouts/home-assistant.ts
index e3bf2f9d8b..c6070d520c 100644
--- a/src/layouts/home-assistant.ts
+++ b/src/layouts/home-assistant.ts
@@ -34,8 +34,6 @@ const panelUrl = (path: string) => {
 export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
   @state() private _route: Route;
 
-  @state() private _error = false;
-
   private _panelUrl: string;
 
   private _haVersion?: string;
@@ -44,8 +42,6 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
 
   private _visiblePromiseResolve?: () => void;
 
-  private _visibleLaunchScreen = true;
-
   constructor() {
     super();
     const path = curPath();
@@ -62,27 +58,22 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
     this._panelUrl = panelUrl(path);
   }
 
-  protected render() {
-    if (this._isHassComplete() && this.hass) {
-      return html`
-        <home-assistant-main
-          .hass=${this.hass}
-          .route=${this._route}
-        ></home-assistant-main>
-      `;
-    }
-
-    return "";
+  protected renderHass() {
+    return html`
+      <home-assistant-main
+        .hass=${this.hass}
+        .route=${this._route}
+      ></home-assistant-main>
+    `;
   }
 
   update(changedProps) {
-    super.update(changedProps);
-
-    // Remove launch screen if main gui is loaded
-    if (this._isHassComplete() && this._visibleLaunchScreen) {
-      this._visibleLaunchScreen = false;
+    if (this.hass?.states && this.hass.config && this.hass.services) {
+      this.render = this.renderHass;
+      this.update = super.update;
       removeLaunchScreen();
     }
+    super.update(changedProps);
   }
 
   protected firstUpdated(changedProps) {
@@ -129,10 +120,9 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
     });
 
     // Render launch screen info box (loading data / error message)
-    if (!this._isHassComplete() && this._visibleLaunchScreen) {
-      renderLaunchScreenInfoBox(
-        html`<ha-init-page .error=${this._error}></ha-init-page>`
-      );
+    // if Home Assistant is not loaded yet.
+    if (this.render !== this.renderHass) {
+      this._renderInitInfo(false);
     }
   }
 
@@ -188,7 +178,7 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
       if (window.hassConnection) {
         result = await window.hassConnection;
       } else {
-        // In the edge case that
+        // In the edge case that core.ts loads before app.ts
         result = await new Promise((resolve) => {
           window.hassConnectionReady = resolve;
         });
@@ -198,7 +188,7 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
       this._haVersion = conn.haVersion;
       this.initializeHass(auth, conn);
     } catch (err: any) {
-      this._error = true;
+      this._renderInitInfo(true);
     }
   }
 
@@ -255,12 +245,10 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
     }
   }
 
-  private _isHassComplete(): boolean {
-    if (this.hass?.states && this.hass.config && this.hass.services) {
-      return true;
-    }
-
-    return false;
+  private _renderInitInfo(error: boolean) {
+    renderLaunchScreenInfoBox(
+      html`<ha-init-page .error=${error}></ha-init-page>`
+    );
   }
 }
 
diff --git a/src/util/launch-screen.ts b/src/util/launch-screen.ts
index eb873a65db..965732d470 100644
--- a/src/util/launch-screen.ts
+++ b/src/util/launch-screen.ts
@@ -7,9 +7,9 @@ export const removeLaunchScreen = () => {
   }
 };
 
-export const renderLaunchScreenInfoBox = (element: TemplateResult) => {
+export const renderLaunchScreenInfoBox = (content: TemplateResult) => {
   const infoBoxElement = document.getElementById("ha-launch-screen-info-box");
   if (infoBoxElement) {
-    render(element, infoBoxElement);
+    render(content, infoBoxElement);
   }
 };