Merge pull request #11033 from home-assistant/dev

package.json

@@ -102,7 +102,7 @@
     "fuse.js": "^6.0.0",
     "google-timezones-json": "^1.0.2",
     "hls.js": "^1.0.11",
-    "home-assistant-js-websocket": "^5.12.0",
+    "home-assistant-js-websocket": "^6.0.0",
     "idb-keyval": "^5.1.3",
     "intl-messageformat": "^9.9.1",
     "js-yaml": "^4.1.0",

setup.py

@@ -2,7 +2,7 @@ from setuptools import setup, find_packages
 
 setup(
     name="home-assistant-frontend",
-    version="20211220.0",
+    version="20211227.0",
     description="The Home Assistant frontend",
     url="https://github.com/home-assistant/frontend",
     author="The Home Assistant Authors",

src/components/ha-gauge.ts

@@ -8,6 +8,10 @@ import { FrontendLocaleData } from "../data/translation";
 import { getValueInPercentage, normalize } from "../util/calculate";
 import { isSafari } from "../util/is_safari";
 
+// Safari version 15.2 and up behaves differently than other Safari versions.
+// https://github.com/home-assistant/frontend/issues/10766
+const isSafari152 = isSafari && /Version\/15\.[^0-1]/.test(navigator.userAgent);
+
 const getAngle = (value: number, min: number, max: number) => {
   const percentage = getValueInPercentage(normalize(value, min, max), min, max);
   return (percentage * 180) / 100;
@@ -113,7 +117,9 @@ export class Gauge extends LitElement {
                     : undefined
                 )}
                 transform=${ifDefined(
-                  isSafari ? `rotate(${this._angle} 50 50)` : undefined
+                  isSafari
+                    ? `rotate(${this._angle}${isSafari152 ? "" : " 50 50"})`
+                    : undefined
                 )}
               >
               `
@@ -126,7 +132,9 @@ export class Gauge extends LitElement {
                     : undefined
                 )}
                 transform=${ifDefined(
-                  isSafari ? `rotate(${this._angle} 50 50)` : undefined
+                  isSafari
+                    ? `rotate(${this._angle}${isSafari152 ? "" : " 50 50"})`
+                    : undefined
                 )}
               >`
         }

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>`
+    );
   }
 }
 

src/panels/config/server_control/ha-config-server-control.ts

@@ -5,7 +5,6 @@ import "@polymer/paper-input/paper-input";
 import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import { componentsWithService } from "../../../common/config/components_with_service";
-import { isComponentLoaded } from "../../../common/config/is_component_loaded";
 import "../../../components/buttons/ha-call-service-button";
 import "../../../components/ha-card";
 import { checkCoreConfig } from "../../../data/core";
@@ -158,20 +157,6 @@ export class HaConfigServerControl extends LitElement {
                   "ui.panel.config.server_control.section.server_management.restart"
                 )}
               </ha-call-service-button>
-              ${!isComponentLoaded(this.hass, "hassio")
-                ? html`<ha-call-service-button
-                    class="warning"
-                    .hass=${this.hass}
-                    domain="homeassistant"
-                    service="stop"
-                    confirmation=${this.hass.localize(
-                      "ui.panel.config.server_control.section.server_management.confirm_stop"
-                    )}
-                    >${this.hass.localize(
-                      "ui.panel.config.server_control.section.server_management.stop"
-                    )}
-                  </ha-call-service-button>`
-                : ""}
             </div>
           </ha-card>
 

src/translations/en.json

@@ -1419,7 +1419,7 @@
         },
         "server_control": {
           "caption": "Server Controls",
-          "description": "Restart and stop the Home Assistant server",
+          "description": "Validate and restart the Home Assistant server",
           "section": {
             "validation": {
               "heading": "Configuration validation",

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);
   }
 };

yarn.lock

@@ -9113,7 +9113,7 @@ fsevents@^1.2.7:
     gulp-rename: ^2.0.0
     gulp-zopfli-green: ^3.0.1
     hls.js: ^1.0.11
-    home-assistant-js-websocket: ^5.12.0
+    home-assistant-js-websocket: ^6.0.0
     html-minifier: ^4.0.0
     husky: ^1.3.1
     idb-keyval: ^5.1.3
@@ -9184,10 +9184,10 @@ fsevents@^1.2.7:
   languageName: unknown
   linkType: soft
 
-"home-assistant-js-websocket@npm:^5.12.0":
-  version: 5.12.0
-  resolution: "home-assistant-js-websocket@npm:5.12.0"
-  checksum: 62171c10e55e3245c9a4fc77dbd2641f234a66b4e3d0adaf8c4364c567473555dbf34f3d737bf3f31e92f2a198051b57f2782fd71f8406784693e64496809501
+"home-assistant-js-websocket@npm:^6.0.0":
+  version: 6.0.0
+  resolution: "home-assistant-js-websocket@npm:6.0.0"
+  checksum: fef904210f66e180457ac2ae003fd29a0613179d3f8e5bb3f37aaaf0d5708a86ed071feb0d3bbf7268fdf454acec49539c8e9c0100ef159a711fcc98fd78cb14
   languageName: node
   linkType: hard