Merge pull request #9060 from home-assistant/dev

20210430.0

.eslintrc.json

@@ -4,8 +4,7 @@
     "plugin:@typescript-eslint/recommended",
     "plugin:wc/recommended",
     "plugin:lit/recommended",
-    "prettier",
+    "prettier"
-    "prettier/@typescript-eslint"
   ],
   "parser": "@typescript-eslint/parser",
   "parserOptions": {
@@ -85,6 +84,25 @@
     "@typescript-eslint/explicit-function-return-type": 0,
     "@typescript-eslint/explicit-module-boundary-types": 0,
     "@typescript-eslint/no-shadow": ["error"],
+    "@typescript-eslint/naming-convention": [
+      0,
+      {
+        "selector": "default",
+        "format": ["camelCase", "snake_case"],
+        "leadingUnderscore": "allow",
+        "trailingUnderscore": "allow"
+      },
+      {
+        "selector": ["variable"],
+        "format": ["camelCase", "snake_case", "UPPER_CASE"],
+        "leadingUnderscore": "allow",
+        "trailingUnderscore": "allow"
+      },
+      {
+        "selector": "typeLike",
+        "format": ["PascalCase"]
+      }
+    ],
     "lit/attribute-value-entities": 0
   },
   "plugins": ["disable", "import", "lit", "prettier", "@typescript-eslint"],

.github/workflows/ci.yaml

@@ -37,9 +37,11 @@ jobs:
       - name: Build resources
         run: ./node_modules/.bin/gulp gen-icons-json build-translations gather-gallery-demos
       - name: Run eslint
-        run: ./node_modules/.bin/eslint '{**/src,src}/**/*.{js,ts,html}' --ignore-path .gitignore
+        run: yarn run lint:eslint
       - name: Run tsc
-        run: ./node_modules/.bin/tsc
+        run: yarn run lint:types
+      - name: Run prettier
+        run: yarn run lint:prettier
   test:
     runs-on: ubuntu-latest
     steps:

cast/src/launcher/layout/hc-cast.ts

@@ -54,9 +54,7 @@ class HcCast extends LitElement {
     const error =
       this.castManager.castState === "NO_DEVICES_AVAILABLE"
         ? html`
-            <p>
+            <p>There were no suitable Chromecast devices to cast to found.</p>
-              There were no suitable Chromecast devices to cast to found.
-            </p>
           `
         : undefined;
 

cast/src/launcher/layout/hc-connect.ts

@@ -86,9 +86,7 @@ export class HcConnect extends LitElement {
           </div>
           <div class="card-actions">
             <a href="/">
-              <mwc-button>
+              <mwc-button> Retry </mwc-button>
-                Retry
-              </mwc-button>
             </a>
             <div class="spacer"></div>
             <mwc-button @click=${this._handleLogout}>Log out</mwc-button>

demo/src/stubs/translations.ts

@@ -3,8 +3,6 @@ import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 export const mockTranslations = (hass: MockHomeAssistant) => {
   hass.mockWS(
     "frontend/get_translations",
-    (/* msg: {language: string, category: string} */) => {
+    (/* msg: {language: string, category: string} */) => ({ resources: {} })
-      return { resources: {} };
-    }
   );
 };

gallery/src/demos/demo-hui-alarm-panel-card.ts

@@ -93,4 +93,8 @@ class DemoAlarmPanelEntity extends LitElement {
   }
 }
 
-customElements.define("demo-hui-alarm-panel-card", DemoAlarmPanelEntity);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-alarm-panel-card": DemoAlarmPanelEntity;
+  }
+}

gallery/src/demos/demo-hui-conditional-card.ts

@@ -75,4 +75,8 @@ class DemoConditional extends LitElement {
   }
 }
 
-customElements.define("demo-hui-conditional-card", DemoConditional);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-conditional-card": DemoConditional;
+  }
+}

gallery/src/demos/demo-hui-entities-card.ts

@@ -239,4 +239,8 @@ class DemoEntities extends LitElement {
   }
 }
 
-customElements.define("demo-hui-entities-card", DemoEntities);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-entities-card": DemoEntities;
+  }
+}

gallery/src/demos/demo-hui-entity-button-card.ts

@@ -91,4 +91,8 @@ class DemoButtonEntity extends LitElement {
   }
 }
 
-customElements.define("demo-hui-entity-button-card", DemoButtonEntity);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-entity-button-card": DemoButtonEntity;
+  }
+}

gallery/src/demos/demo-hui-entity-filter-card.ts

@@ -132,4 +132,8 @@ class DemoEntityFilter extends LitElement {
   }
 }
 
-customElements.define("demo-hui-entity-filter-card", DemoEntityFilter);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-entity-filter-card": DemoEntityFilter;
+  }
+}

gallery/src/demos/demo-hui-gauge-card.ts

@@ -129,4 +129,8 @@ class DemoGaugeEntity extends LitElement {
   }
 }
 
-customElements.define("demo-hui-gauge-card", DemoGaugeEntity);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-gauge-card": DemoGaugeEntity;
+  }
+}

gallery/src/demos/demo-hui-glance-card.ts

@@ -186,7 +186,7 @@ const CONFIGS = [
       name:
     - light.kitchen_lights
     - entity: lock.kitchen_door
-      name: 
+      name:
     - light.ceiling_lights
     `,
   },
@@ -194,7 +194,7 @@ const CONFIGS = [
     heading: "Custom tap action",
     config: `
 - type: glance
-  columns: 4  
+  columns: 4
   entities:
     - entity: lock.kitchen_door
       name: Custom
@@ -232,4 +232,8 @@ class DemoGlanceEntity extends LitElement {
   }
 }
 
-customElements.define("demo-hui-glance-card", DemoGlanceEntity);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-glance-card": DemoGlanceEntity;
+  }
+}

gallery/src/demos/demo-hui-grid-and-stack-card.ts

@@ -108,6 +108,7 @@ const CONFIGS = [
     heading: "Columns 4",
     config: `
 - type: grid
+  columns: 4
   cards:
     - type: entity
       entity: light.kitchen_lights
@@ -142,6 +143,15 @@ const CONFIGS = [
     entity: light.kitchen_lights
     `,
   },
+  {
+    heading: "Size for single card",
+    config: `
+- type: grid
+  cards:
+  - type: entity
+    entity: light.kitchen_lights
+    `,
+  },
 
   {
     heading: "Vertical Stack",

gallery/src/demos/demo-hui-iframe-card.ts

@@ -42,4 +42,8 @@ class DemoIframe extends LitElement {
   }
 }
 
-customElements.define("demo-hui-iframe-card", DemoIframe);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-iframe-card": DemoIframe;
+  }
+}

gallery/src/demos/demo-hui-light-card.ts

@@ -85,4 +85,8 @@ class DemoLightEntity extends LitElement {
   }
 }
 
-customElements.define("demo-hui-light-card", DemoLightEntity);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-light-card": DemoLightEntity;
+  }
+}

gallery/src/demos/demo-hui-map-card.ts

@@ -183,4 +183,8 @@ class DemoMap extends LitElement {
   }
 }
 
-customElements.define("demo-hui-map-card", DemoMap);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-map-card": DemoMap;
+  }
+}

gallery/src/demos/demo-hui-markdown-card.ts

@@ -276,4 +276,8 @@ class DemoMarkdown extends LitElement {
   }
 }
 
-customElements.define("demo-hui-markdown-card", DemoMarkdown);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-markdown-card": DemoMarkdown;
+  }
+}

gallery/src/demos/demo-hui-media-control-card.ts

@@ -180,4 +180,8 @@ class DemoHuiMediaControlCard extends LitElement {
   }
 }
 
-customElements.define("demo-hui-media-control-card", DemoHuiMediaControlCard);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-media-control-card": DemoHuiMediaControlCard;
+  }
+}

gallery/src/demos/demo-hui-media-player-rows.ts

@@ -77,4 +77,8 @@ class DemoHuiMediaPlayerRow extends LitElement {
   }
 }
 
-customElements.define("demo-hui-media-player-row", DemoHuiMediaPlayerRow);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-media-player-row": DemoHuiMediaPlayerRow;
+  }
+}

gallery/src/demos/demo-hui-picture-elements-card.ts

@@ -147,4 +147,8 @@ class DemoPictureElements extends LitElement {
   }
 }
 
-customElements.define("demo-hui-picture-elements-card", DemoPictureElements);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-picture-elements-card": DemoPictureElements;
+  }
+}

gallery/src/demos/demo-hui-picture-entity-card.ts

@@ -102,4 +102,8 @@ class DemoPictureEntity extends LitElement {
   }
 }
 
-customElements.define("demo-hui-picture-entity-card", DemoPictureEntity);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-picture-entity-card": DemoPictureEntity;
+  }
+}

gallery/src/demos/demo-hui-picture-glance-card.ts

@@ -143,4 +143,8 @@ class DemoPictureGlance extends LitElement {
   }
 }
 
-customElements.define("demo-hui-picture-glance-card", DemoPictureGlance);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-picture-glance-card": DemoPictureGlance;
+  }
+}

gallery/src/demos/demo-hui-plant-card.ts

@@ -52,4 +52,8 @@ export class DemoPlantEntity extends LitElement {
   }
 }
 
-customElements.define("demo-hui-plant-card", DemoPlantEntity);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-plant-card": DemoPlantEntity;
+  }
+}

gallery/src/demos/demo-hui-shopping-list-card.ts

@@ -48,4 +48,8 @@ class DemoShoppingListEntity extends LitElement {
   }
 }
 
-customElements.define("demo-hui-shopping-list-card", DemoShoppingListEntity);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-shopping-list-card": DemoShoppingListEntity;
+  }
+}

gallery/src/demos/demo-hui-thermostat-card.ts

@@ -96,4 +96,8 @@ class DemoThermostatEntity extends LitElement {
   }
 }
 
-customElements.define("demo-hui-thermostat-card", DemoThermostatEntity);
+declare global {
+  interface HTMLElementTagNameMap {
+    "demo-hui-thermostat-card": DemoThermostatEntity;
+  }
+}

gallery/src/demos/demo-integration-card.ts

@@ -61,6 +61,9 @@ const nameAsDomainEntry = createConfigEntry("ESPHome");
 const longNameEntry = createConfigEntry(
   "Entry with a super long name that is going to the next line"
 );
+const longNonBreakingNameEntry = createConfigEntry(
+  "EntryWithASuperLongNameThatDoesNotBreak"
+);
 const configPanelEntry = createConfigEntry("Config Panel", {
   domain: "mqtt",
   localized_domain_name: "MQTT",
@@ -141,6 +144,7 @@ const configEntries: Array<{
   { items: [optionsFlowEntry] },
   { items: [nameAsDomainEntry] },
   { items: [longNameEntry] },
+  { items: [longNonBreakingNameEntry] },
   { items: [setupErrorEntry] },
   { items: [migrationErrorEntry] },
   { items: [setupRetryEntry] },
@@ -154,6 +158,7 @@ const configEntries: Array<{
       setupErrorEntry,
       migrationErrorEntry,
       longNameEntry,
+      longNonBreakingNameEntry,
       setupRetryEntry,
       failedUnloadEntry,
       notLoadedEntry,

hassio/src/addon-store/hassio-addon-repository.ts

@@ -47,9 +47,7 @@ class HassioAddonRepositoryEl extends LitElement {
     const repo = this.repo;
     let _addons = this.addons;
     if (!this.hass.userData?.showAdvanced) {
-      _addons = _addons.filter((addon) => {
+      _addons = _addons.filter((addon) => !addon.advanced);
-        return !addon.advanced;
-      });
     }
     const addons = this._getAddons(_addons, this.filter);
 
@@ -68,9 +66,7 @@ class HassioAddonRepositoryEl extends LitElement {
     }
     return html`
       <div class="content">
-        <h1>
+        <h1>${repo.name}</h1>
-          ${repo.name}
-        </h1>
         <div class="card-group">
           ${addons.map(
             (addon) => html`

hassio/src/addon-store/hassio-addon-store.ts

@@ -86,9 +86,7 @@ class HassioAddonStore extends LitElement {
         main-page
         supervisor
       >
-        <span slot="header">
+        <span slot="header"> ${this.supervisor.localize("panel.store")} </span>
-          ${this.supervisor.localize("panel.store")}
-        </span>
         <ha-button-menu
           corner="BOTTOM_START"
           slot="toolbar-icon"
@@ -154,8 +152,8 @@ class HassioAddonStore extends LitElement {
       repositories: HassioAddonRepository[],
       addons: HassioAddonInfo[],
       filter?: string
-    ) => {
+    ) =>
-      return repositories.sort(sortRepos).map((repo) => {
+      repositories.sort(sortRepos).map((repo) => {
         const filteredAddons = addons.filter(
           (addon) => addon.repository === repo.slug
         );
@@ -171,8 +169,7 @@ class HassioAddonStore extends LitElement {
               ></hassio-addon-repository>
             `
           : html``;
-      });
+      })
-    }
   );
 
   private _handleAction(ev: CustomEvent<ActionDetail>) {

hassio/src/addon-view/config/hassio-addon-audio.ts

@@ -69,13 +69,13 @@ class HassioAddonAudio extends LitElement {
               .selected=${this._selectedInput!}
             >
               ${this._inputDevices &&
-              this._inputDevices.map((item) => {
+              this._inputDevices.map(
-                return html`
+                (item) => html`
                   <paper-item device=${item.device || ""}>
                     ${item.name}
                   </paper-item>
-                `;
+                `
-              })}
+              )}
             </paper-listbox>
           </paper-dropdown-menu>
           <paper-dropdown-menu
@@ -90,13 +90,13 @@ class HassioAddonAudio extends LitElement {
               .selected=${this._selectedOutput!}
             >
               ${this._outputDevices &&
-              this._outputDevices.map((item) => {
+              this._outputDevices.map(
-                return html`
+                (item) => html`
                   <paper-item device=${item.device || ""}
                     >${item.name}</paper-item
                   >
-                `;
+                `
-              })}
+              )}
             </paper-listbox>
           </paper-dropdown-menu>
         </div>

hassio/src/addon-view/config/hassio-addon-config.ts

@@ -65,19 +65,15 @@ class HassioAddonConfig extends LitElement {
 
   @query("ha-yaml-editor") private _editor?: HaYamlEditor;
 
-  public computeLabel = (entry: HaFormSchema): string => {
+  public computeLabel = (entry: HaFormSchema): string =>
-    return (
+    this.addon.translations[this.hass.language]?.configuration?.[entry.name]
-      this.addon.translations[this.hass.language]?.configuration?.[entry.name]
+      ?.name ||
-        ?.name ||
+    this.addon.translations.en?.configuration?.[entry.name].name ||
-      this.addon.translations.en?.configuration?.[entry.name].name ||
+    entry.name;
-      entry.name
-    );
-  };
 
   private _filteredShchema = memoizeOne(
-    (options: Record<string, unknown>, schema: HaFormSchema[]) => {
+    (options: Record<string, unknown>, schema: HaFormSchema[]) =>
-      return schema.filter((entry) => entry.name in options || entry.required);
+      schema.filter((entry) => entry.name in options || entry.required)
-    }
   );
 
   protected render(): TemplateResult {

hassio/src/addon-view/config/hassio-addon-network.ts

@@ -79,12 +79,10 @@ class HassioAddonNetwork extends LitElement {
                     "addon.configuration.network.host"
                   )}
                 </th>
-                <th>
+                <th>${this.supervisor.localize("common.description")}</th>
-                  ${this.supervisor.localize("common.description")}
-                </th>
               </tr>
-              ${this._config!.map((item) => {
+              ${this._config!.map(
-                return html`
+                (item) => html`
                   <tr>
                     <td>${item.container}</td>
                     <td>
@@ -100,8 +98,8 @@ class HassioAddonNetwork extends LitElement {
                     </td>
                     <td>${this._computeDescription(item)}</td>
                   </tr>
-                `;
+                `
-              })}
+              )}
             </tbody>
           </table>
         </div>
@@ -124,25 +122,20 @@ class HassioAddonNetwork extends LitElement {
     }
   }
 
-  private _computeDescription = (item: NetworkItem): string => {
+  private _computeDescription = (item: NetworkItem): string =>
-    return (
+    this.addon.translations[this.hass.language]?.network?.[item.container]
-      this.addon.translations[this.hass.language]?.network?.[item.container]
+      ?.description ||
-        ?.description ||
+    this.addon.translations.en?.network?.[item.container]?.description ||
-      this.addon.translations.en?.network?.[item.container]?.description ||
+    item.description;
-      item.description
-    );
-  };
 
   private _setNetworkConfig(): void {
     const network = this.addon.network || {};
     const description = this.addon.network_description || {};
-    const items: NetworkItem[] = Object.keys(network).map((key) => {
+    const items: NetworkItem[] = Object.keys(network).map((key) => ({
-      return {
+      container: key,
-        container: key,
+      host: network[key],
-        host: network[key],
+      description: description[key],
-        description: description[key],
+    }));
-      };
-    });
     this._config = items.sort((a, b) => (a.container > b.container ? 1 : -1));
   }
 

hassio/src/addon-view/info/hassio-addon-info.ts

@@ -566,9 +566,7 @@ class HassioAddonInfo extends LitElement {
                       <span slot="heading">
                         ${this.supervisor.localize("addon.dashboard.hostname")}
                       </span>
-                      <code slot="description">
+                      <code slot="description"> ${this.addon.hostname} </code>
-                        ${this.addon.hostname}
-                      </code>
                     </ha-settings-row>
                     ${metrics.map(
                       (metric) =>
@@ -997,7 +995,7 @@ class HassioAddonInfo extends LitElement {
         addons: [this.addon.slug],
         homeassistant: false,
       },
-      updateHandler: async () => await this._updateAddon(),
+      updateHandler: async () => this._updateAddon(),
     });
   }
 

hassio/src/components/hassio-card-content.ts

@@ -56,13 +56,13 @@ class HassioCardContent extends LitElement {
             ></ha-svg-icon>
           `}
       <div>
-        <div class="title">
+        <div class="title">${this.title}</div>
-          ${this.title}
-        </div>
         <div class="addition">
           ${this.description}
-          ${/* treat as available when undefined */
+          ${
-          this.available === false ? " (Not available)" : ""}
+            /* treat as available when undefined */
+            this.available === false ? " (Not available)" : ""
+          }
           ${this.datetime
             ? html`
                 <ha-relative-time

hassio/src/components/supervisor-metric.ts

@@ -23,13 +23,9 @@ class SupervisorMetric extends LitElement {
   protected render(): TemplateResult {
     const roundedValue = roundWithOneDecimal(this.value);
     return html`<ha-settings-row>
-      <span slot="heading">
+      <span slot="heading"> ${this.description} </span>
-        ${this.description}
-      </span>
       <div slot="description" .title=${this.tooltip ?? ""}>
-        <span class="value">
+        <span class="value"> ${roundedValue} % </span>
-          ${roundedValue} %
-        </span>
         <ha-bar
           class="${classMap({
             "target-warning": roundedValue > 50,

hassio/src/dashboard/hassio-update.ts

@@ -40,9 +40,8 @@ import { HomeAssistant } from "../../../src/types";
 import { showDialogSupervisorUpdate } from "../dialogs/update/show-dialog-update";
 import { hassioStyle } from "../resources/hassio-style";
 
-const computeVersion = (key: string, version: string): string => {
+const computeVersion = (key: string, version: string): string =>
-  return key === "os" ? version : `${key}-${version}`;
+  key === "os" ? version : `${key}-${version}`;
-};
 
 @customElement("hassio-update")
 export class HassioUpdate extends LitElement {
@@ -50,11 +49,12 @@ export class HassioUpdate extends LitElement {
 
   @property({ attribute: false }) public supervisor!: Supervisor;
 
-  private _pendingUpdates = memoizeOne((supervisor: Supervisor): number => {
+  private _pendingUpdates = memoizeOne(
-    return Object.keys(supervisor).filter(
+    (supervisor: Supervisor): number =>
-      (value) => supervisor[value].update_available
+      Object.keys(supervisor).filter(
-    ).length;
+        (value) => supervisor[value].update_available
-  });
+      ).length
+  );
 
   protected render(): TemplateResult {
     if (!this.supervisor) {

hassio/src/dialogs/network/dialog-hassio-network.ts

@@ -47,7 +47,8 @@ import { HassioNetworkDialogParams } from "./show-dialog-network";
 const IP_VERSIONS = ["ipv4", "ipv6"];
 
 @customElement("dialog-hassio-network")
-export class DialogHassioNetwork extends LitElement
+export class DialogHassioNetwork
+  extends LitElement
   implements HassDialog<HassioNetworkDialogParams> {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
@@ -76,9 +77,9 @@ export class DialogHassioNetwork extends LitElement
     this._dirty = false;
     this._curTabIndex = 0;
     this.supervisor = params.supervisor;
-    this._interfaces = params.supervisor.network.interfaces.sort((a, b) => {
+    this._interfaces = params.supervisor.network.interfaces.sort((a, b) =>
-      return a.primary > b.primary ? -1 : 1;
+      a.primary > b.primary ? -1 : 1
-    });
+    );
     this._interface = { ...this._interfaces[this._curTabIndex] };
 
     await this.updateComplete;

hassio/src/dialogs/registries/dialog-hassio-registries.ts

@@ -108,8 +108,8 @@ class HassioRegistriesDialog extends LitElement {
                 </mwc-button>
               `
             : html`${this._registries?.length
-                  ? this._registries.map((entry) => {
+                  ? this._registries.map(
-                      return html`
+                      (entry) => html`
                         <mwc-list-item class="option" hasMeta twoline>
                           <span>${entry.registry}</span>
                           <span slot="secondary"
@@ -129,8 +129,8 @@ class HassioRegistriesDialog extends LitElement {
                             <ha-svg-icon .path=${mdiDelete}></ha-svg-icon>
                           </mwc-icon-button>
                         </mwc-list-item>
-                      `;
+                      `
-                    })
+                    )
                   : html`
                       <mwc-list-item>
                         <span

hassio/src/dialogs/repositories/dialog-hassio-repositories.ts

@@ -87,8 +87,8 @@ class HassioRepositoriesDialog extends LitElement {
         ${this._error ? html`<div class="error">${this._error}</div>` : ""}
         <div class="form">
           ${repositories.length
-            ? repositories.map((repo) => {
+            ? repositories.map(
-                return html`
+                (repo) => html`
                   <paper-item class="option">
                     <paper-item-body three-line>
                       <div>${repo.name}</div>
@@ -105,13 +105,9 @@ class HassioRepositoriesDialog extends LitElement {
                       <ha-svg-icon .path=${mdiDelete}></ha-svg-icon>
                     </mwc-icon-button>
                   </paper-item>
-                `;
+                `
-              })
+              )
-            : html`
+            : html` <paper-item> No repositories </paper-item> `}
-                <paper-item>
-                  No repositories
-                </paper-item>
-              `}
           <div class="layout horizontal bottom">
             <paper-input
               class="flex-auto"
@@ -207,9 +203,7 @@ class HassioRepositoriesDialog extends LitElement {
     }
     this._prosessing = true;
     const repositories = this._filteredRepositories(this._repositories!);
-    const newRepositories = repositories.map((repo) => {
+    const newRepositories = repositories.map((repo) => repo.source);
-      return repo.source;
-    });
     newRepositories.push(input.value);
 
     try {
@@ -228,19 +222,13 @@ class HassioRepositoriesDialog extends LitElement {
   private async _removeRepository(ev: Event) {
     const slug = (ev.currentTarget as any).slug;
     const repositories = this._filteredRepositories(this._repositories!);
-    const repository = repositories.find((repo) => {
+    const repository = repositories.find((repo) => repo.slug === slug);
-      return repo.slug === slug;
-    });
     if (!repository) {
       return;
     }
     const newRepositories = repositories
-      .map((repo) => {
+      .map((repo) => repo.source)
-        return repo.source;
+      .filter((repo) => repo !== repository.source);
-      })
-      .filter((repo) => {
-        return repo !== repository.source;
-      });
 
     try {
       await setSupervisorOption(this.hass, {

hassio/src/dialogs/snapshot/dialog-hassio-snapshot-upload.ts

@@ -18,7 +18,8 @@ import "../../components/hassio-upload-snapshot";
 import { HassioSnapshotUploadDialogParams } from "./show-dialog-snapshot-upload";
 
 @customElement("dialog-hassio-snapshot-upload")
-export class DialogHassioSnapshotUpload extends LitElement
+export class DialogHassioSnapshotUpload
+  extends LitElement
   implements HassDialog<HassioSnapshotUploadDialogParams> {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
@@ -57,9 +58,7 @@ export class DialogHassioSnapshotUpload extends LitElement
       >
         <div slot="heading">
           <ha-header-bar>
-            <span slot="title">
+            <span slot="title"> Upload snapshot </span>
-              Upload snapshot
-            </span>
             <mwc-icon-button slot="actionItems" dialogAction="cancel">
               <ha-svg-icon .path=${mdiClose}></ha-svg-icon>
             </mwc-icon-button>

hassio/src/dialogs/snapshot/dialog-hassio-snapshot.ts

@@ -53,14 +53,13 @@ const _computeFolders = (folders) => {
   return list;
 };
 
-const _computeAddons = (addons) => {
+const _computeAddons = (addons) =>
-  return addons.map((addon) => ({
+  addons.map((addon) => ({
     slug: addon.slug,
     name: addon.name,
     version: addon.version,
     checked: true,
   }));
-};
 
 interface AddonItem {
   slug: string;
@@ -122,9 +121,7 @@ class HassioSnapshotDialog extends LitElement {
       <ha-dialog open @closing=${this._closeDialog} .heading=${true}>
         <div slot="heading">
           <ha-header-bar>
-            <span slot="title">
+            <span slot="title"> ${this._computeName} </span>
-              ${this._computeName}
-            </span>
             <mwc-icon-button slot="actionItems" dialogAction="cancel">
               <ha-svg-icon .path=${mdiClose}></ha-svg-icon>
             </mwc-icon-button>
@@ -152,8 +149,8 @@ class HassioSnapshotDialog extends LitElement {
           ? html`
               <div>Folders:</div>
               <paper-dialog-scrollable class="no-margin-top">
-                ${this._folders.map((item) => {
+                ${this._folders.map(
-                  return html`
+                  (item) => html`
                     <paper-checkbox
                       .checked=${item.checked}
                       @change="${(ev: Event) =>
@@ -164,8 +161,8 @@ class HassioSnapshotDialog extends LitElement {
                     >
                       ${item.name}
                     </paper-checkbox>
-                  `;
+                  `
-                })}
+                )}
               </paper-dialog-scrollable>
             `
           : ""}
@@ -173,8 +170,8 @@ class HassioSnapshotDialog extends LitElement {
           ? html`
               <div>Add-on:</div>
               <paper-dialog-scrollable class="no-margin-top">
-                ${this._addons.map((item) => {
+                ${this._addons.map(
-                  return html`
+                  (item) => html`
                     <paper-checkbox
                       .checked=${item.checked}
                       @change="${(ev: Event) =>
@@ -185,8 +182,8 @@ class HassioSnapshotDialog extends LitElement {
                     >
                       ${item.name}
                     </paper-checkbox>
-                  `;
+                  `
-                })}
+                )}
               </paper-dialog-scrollable>
             `
           : ""}

hassio/src/snapshots/hassio-snapshots.ts

@@ -132,9 +132,7 @@ class HassioSnapshots extends LitElement {
         </ha-button-menu>
 
         <div class="content">
-          <h1>
+          <h1>${this.supervisor.localize("snapshot.create_snapshot")}</h1>
-            ${this.supervisor.localize("snapshot.create_snapshot")}
-          </h1>
           <p class="description">
             ${this.supervisor.localize("snapshot.description")}
           </p>

hassio/src/system/hassio-core-info.ts

@@ -178,7 +178,7 @@ class HassioCoreInfo extends LitElement {
         folders: ["homeassistant"],
         homeassistant: true,
       },
-      updateHandler: async () => await this._updateCore(),
+      updateHandler: async () => this._updateCore(),
     });
   }
 

hassio/src/system/hassio-host-info.ts

@@ -97,9 +97,7 @@ class HassioHostInfo extends LitElement {
                   <span slot="heading">
                     ${this.supervisor.localize("system.host.ip_address")}
                   </span>
-                  <span slot="description">
+                  <span slot="description"> ${primaryIpAddress} </span>
-                    ${primaryIpAddress}
-                  </span>
                   <mwc-button
                     .label=${this.supervisor.localize("system.host.change")}
                     @click=${this._changeNetworkClicked}

hassio/src/system/hassio-supervisor-info.ts

@@ -264,9 +264,7 @@ class HassioSupervisorInfo extends LitElement {
         title: this.supervisor.localize("system.supervisor.warning"),
         text: html`${this.supervisor.localize("system.supervisor.beta_warning")}
           <br />
-          <b>
+          <b> ${this.supervisor.localize("system.supervisor.beta_backup")} </b>
-            ${this.supervisor.localize("system.supervisor.beta_backup")}
-          </b>
           <br /><br />
           ${this.supervisor.localize("system.supervisor.beta_release_items")}
           <ul>

hassio/src/system/hassio-supervisor-log.ts

@@ -87,13 +87,13 @@ class HassioSupervisorLog extends LitElement {
                   attr-for-selected="provider"
                   .selected=${this._selectedLogProvider}
                 >
-                  ${logProviders.map((provider) => {
+                  ${logProviders.map(
-                    return html`
+                    (provider) => html`
                       <paper-item provider=${provider.key}>
                         ${provider.name}
                       </paper-item>
-                    `;
+                    `
-                  })}
+                  )}
                 </paper-listbox>
               </paper-dropdown-menu>
             `

hassio/src/system/hassio-system.ts

@@ -39,9 +39,7 @@ class HassioSystem extends LitElement {
         main-page
         supervisor
       >
-        <span slot="header">
+        <span slot="header"> ${this.supervisor.localize("panel.system")} </span>
-          ${this.supervisor.localize("panel.system")}
-        </span>
         <div class="content">
           <div class="card-group">
             <hassio-core-info

package.json

@@ -14,10 +14,10 @@
     "format:prettier": "prettier \"**/src/**/*.{js,ts,json,css,md}\" --write",
     "lint:types": "tsc",
     "lint:lit": "lit-analyzer \"**/src/**/*.ts\" --format markdown --outFile result.md",
-    "lint": "npm run lint:eslint && npm run lint:prettier && npm run lint:types",
+    "lint": "yarn run lint:eslint && yarn run lint:prettier && yarn run lint:types",
-    "format": "npm run format:eslint && npm run format:prettier",
+    "format": "yarn run format:eslint && yarn run format:prettier",
     "mocha": "node_modules/.bin/ts-mocha -p test-mocha/tsconfig.test.json --opts test-mocha/mocha.opts",
-    "test": "npm run lint && npm run mocha"
+    "test": "yarn run lint && yarn run mocha"
   },
   "author": "Paulus Schoutsen <Paulus@PaulusSchoutsen.nl> (http://paulusschoutsen.nl)",
   "license": "Apache-2.0",
@@ -116,7 +116,7 @@
     "leaflet": "^1.4.0",
     "leaflet-draw": "^1.0.4",
     "lit-element": "^2.4.0",
-    "lit-html": "^1.3.0",
+    "lit-html": "^1.4.0",
     "lit-virtualizer": "^0.4.2",
     "marked": "2.0.0",
     "mdn-polyfills": "^5.16.0",
@@ -147,17 +147,17 @@
     "xss": "^1.0.6"
   },
   "devDependencies": {
-    "@babel/core": "^7.11.6",
+    "@babel/core": "^7.14.0",
-    "@babel/plugin-external-helpers": "^7.10.4",
+    "@babel/plugin-external-helpers": "^7.12.13",
-    "@babel/plugin-proposal-class-properties": "^7.10.4",
+    "@babel/plugin-proposal-class-properties": "^7.13.0",
-    "@babel/plugin-proposal-decorators": "^7.10.5",
+    "@babel/plugin-proposal-decorators": "^7.13.15",
-    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.10.4",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.13.8",
-    "@babel/plugin-proposal-object-rest-spread": "^7.11.0",
+    "@babel/plugin-proposal-object-rest-spread": "^7.13.8",
-    "@babel/plugin-proposal-optional-chaining": "^7.11.0",
+    "@babel/plugin-proposal-optional-chaining": "^7.13.12",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@babel/plugin-syntax-import-meta": "^7.10.4",
-    "@babel/preset-env": "^7.11.5",
+    "@babel/preset-env": "^7.14.0",
-    "@babel/preset-typescript": "^7.10.4",
+    "@babel/preset-typescript": "^7.13.0",
     "@koa/cors": "^3.1.0",
     "@open-wc/dev-server-hmr": "^0.0.2",
     "@rollup/plugin-babel": "^5.2.1",
@@ -177,23 +177,23 @@
     "@types/resize-observer-browser": "^0.1.3",
     "@types/sortablejs": "^1.10.6",
     "@types/webspeechapi": "^0.0.29",
-    "@typescript-eslint/eslint-plugin": "^4.4.0",
+    "@typescript-eslint/eslint-plugin": "^4.22.0",
-    "@typescript-eslint/parser": "^4.4.0",
+    "@typescript-eslint/parser": "^4.22.0",
     "@web/dev-server": "^0.0.24",
     "@web/dev-server-rollup": "^0.2.11",
     "babel-loader": "^8.1.0",
     "chai": "^4.2.0",
     "cpx": "^1.5.0",
     "del": "^4.0.0",
-    "eslint": "^6.8.0",
+    "eslint": "^7.25.0",
-    "eslint-config-airbnb-typescript": "^7.2.1",
+    "eslint-config-airbnb-typescript": "^12.3.1",
-    "eslint-config-prettier": "^6.10.1",
+    "eslint-config-prettier": "^8.3.0",
     "eslint-import-resolver-webpack": "^0.13.0",
     "eslint-plugin-disable": "^2.0.1",
-    "eslint-plugin-import": "^2.20.2",
+    "eslint-plugin-import": "^2.22.1",
-    "eslint-plugin-lit": "^1.2.0",
+    "eslint-plugin-lit": "^1.3.0",
-    "eslint-plugin-prettier": "^3.1.3",
+    "eslint-plugin-prettier": "^3.4.0",
-    "eslint-plugin-wc": "^1.2.0",
+    "eslint-plugin-wc": "^1.3.0",
     "fancy-log": "^1.3.3",
     "fs-extra": "^7.0.1",
     "gulp": "^4.0.0",
@@ -241,7 +241,7 @@
   "resolutions": {
     "@webcomponents/webcomponentsjs": "^2.2.10",
     "@polymer/polymer": "3.1.0",
-    "lit-html": "1.3.0",
+    "lit-html": "1.4.0",
     "lit-element": "2.4.0"
   },
   "main": "src/home-assistant.js",

setup.py

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

src/auth/ha-auth-flow.ts

@@ -38,11 +38,7 @@ class HaAuthFlow extends litLocalizeLiteMixin(LitElement) {
   @internalProperty() private _errorMessage?: string;
 
   protected render() {
-    return html`
+    return html` <form>${this._renderForm()}</form> `;
-      <form>
-        ${this._renderForm()}
-      </form>
-    `;
   }
 
   protected firstUpdated(changedProps: PropertyValues) {

src/common/color/convert-color.ts

@@ -17,9 +17,8 @@ export const hex2rgb = (hex: string): [number, number, number] => {
   ];
 };
 
-export const rgb2hex = (rgb: [number, number, number]): string => {
+export const rgb2hex = (rgb: [number, number, number]): string =>
-  return `#${rgb_hex(rgb[0])}${rgb_hex(rgb[1])}${rgb_hex(rgb[2])}`;
+  `#${rgb_hex(rgb[0])}${rgb_hex(rgb[1])}${rgb_hex(rgb[2])}`;
-};
 
 // Conversion between LAB, XYZ and RGB from https://github.com/gka/chroma.js
 // Copyright (c) 2011-2019, Gregor Aisch
@@ -49,13 +48,10 @@ const xyz_lab = (t: number) => {
   return t / t2 + t0;
 };
 
-const xyz_rgb = (r: number) => {
+const xyz_rgb = (r: number) =>
-  return 255 * (r <= 0.00304 ? 12.92 * r : 1.055 * r ** (1 / 2.4) - 0.055);
+  255 * (r <= 0.00304 ? 12.92 * r : 1.055 * r ** (1 / 2.4) - 0.055);
-};
 
-const lab_xyz = (t: number) => {
+const lab_xyz = (t: number) => (t > t1 ? t * t * t : t2 * (t - t0));
-  return t > t1 ? t * t * t : t2 * (t - t0);
-};
 
 // Conversions between RGB and LAB
 
@@ -114,6 +110,5 @@ export const rgb2hsv = (
   return [60 * (h < 0 ? h + 6 : h), v && c / v, v];
 };
 
-export const rgb2hs = (rgb: [number, number, number]): [number, number] => {
+export const rgb2hs = (rgb: [number, number, number]): [number, number] =>
-  return rgb2hsv(rgb).slice(0, 2) as [number, number];
+  rgb2hsv(rgb).slice(0, 2) as [number, number];
-};

src/common/color/lab.ts

@@ -4,13 +4,9 @@
 export const labDarken = (
   lab: [number, number, number],
   amount = 1
-): [number, number, number] => {
+): [number, number, number] => [lab[0] - 18 * amount, lab[1], lab[2]];
-  return [lab[0] - 18 * amount, lab[1], lab[2]];
-};
 
 export const labBrighten = (
   lab: [number, number, number],
   amount = 1
-): [number, number, number] => {
+): [number, number, number] => labDarken(lab, -amount);
-  return labDarken(lab, -amount);
-};

src/common/config/can_show_page.ts

@@ -2,12 +2,9 @@ import { PageNavigation } from "../../layouts/hass-tabs-subpage";
 import { HomeAssistant } from "../../types";
 import { isComponentLoaded } from "./is_component_loaded";
 
-export const canShowPage = (hass: HomeAssistant, page: PageNavigation) => {
+export const canShowPage = (hass: HomeAssistant, page: PageNavigation) =>
-  return (
+  (isCore(page) || isLoadedIntegration(hass, page)) &&
-    (isCore(page) || isLoadedIntegration(hass, page)) &&
+  !hideAdvancedPage(hass, page);
-    !hideAdvancedPage(hass, page)
-  );
-};
 
 const isLoadedIntegration = (hass: HomeAssistant, page: PageNavigation) =>
   !page.component || isComponentLoaded(hass, page.component);

src/common/decorators/local-storage.ts

@@ -86,70 +86,63 @@ export const LocalStorage = (
   storageKey?: string,
   property?: boolean,
   propertyOptions?: PropertyDeclaration
-): any => {
+): any => (clsElement: ClassElement) => {
-  return (clsElement: ClassElement) => {
+  const key = String(clsElement.key);
-    const key = String(clsElement.key);
+  storageKey = storageKey || String(clsElement.key);
-    storageKey = storageKey || String(clsElement.key);
+  const initVal = clsElement.initializer ? clsElement.initializer() : undefined;
-    const initVal = clsElement.initializer
-      ? clsElement.initializer()
-      : undefined;
 
-    storage.addFromStorage(storageKey);
+  storage.addFromStorage(storageKey);
 
-    const subscribe = (el: UpdatingElement): UnsubscribeFunc =>
+  const subscribe = (el: UpdatingElement): UnsubscribeFunc =>
-      storage.subscribeChanges(storageKey!, (oldValue) => {
+    storage.subscribeChanges(storageKey!, (oldValue) => {
-        el.requestUpdate(clsElement.key, oldValue);
+      el.requestUpdate(clsElement.key, oldValue);
-      });
+    });
 
-    const getValue = (): any => {
+  const getValue = (): any =>
-      return storage.hasKey(storageKey!)
+    storage.hasKey(storageKey!) ? storage.getValue(storageKey!) : initVal;
-        ? storage.getValue(storageKey!)
-        : initVal;
-    };
 
-    const setValue = (el: UpdatingElement, value: any) => {
+  const setValue = (el: UpdatingElement, value: any) => {
-      let oldValue: unknown | undefined;
+    let oldValue: unknown | undefined;
-      if (property) {
+    if (property) {
-        oldValue = getValue();
+      oldValue = getValue();
-      }
+    }
-      storage.setValue(storageKey!, value);
+    storage.setValue(storageKey!, value);
-      if (property) {
+    if (property) {
-        el.requestUpdate(clsElement.key, oldValue);
+      el.requestUpdate(clsElement.key, oldValue);
-      }
+    }
-    };
+  };
 
-    return {
+  return {
-      kind: "method",
+    kind: "method",
-      placement: "prototype",
+    placement: "prototype",
-      key: clsElement.key,
+    key: clsElement.key,
-      descriptor: {
+    descriptor: {
-        set(this: UpdatingElement, value: unknown) {
+      set(this: UpdatingElement, value: unknown) {
-          setValue(this, value);
+        setValue(this, value);
-        },
-        get() {
-          return getValue();
-        },
-        enumerable: true,
-        configurable: true,
       },
-      finisher(cls: typeof UpdatingElement) {
+      get() {
-        if (property) {
+        return getValue();
-          const connectedCallback = cls.prototype.connectedCallback;
-          const disconnectedCallback = cls.prototype.disconnectedCallback;
-          cls.prototype.connectedCallback = function () {
-            connectedCallback.call(this);
-            this[`__unbsubLocalStorage${key}`] = subscribe(this);
-          };
-          cls.prototype.disconnectedCallback = function () {
-            disconnectedCallback.call(this);
-            this[`__unbsubLocalStorage${key}`]();
-          };
-          cls.createProperty(clsElement.key, {
-            noAccessor: true,
-            ...propertyOptions,
-          });
-        }
       },
-    };
+      enumerable: true,
+      configurable: true,
+    },
+    finisher(cls: typeof UpdatingElement) {
+      if (property) {
+        const connectedCallback = cls.prototype.connectedCallback;
+        const disconnectedCallback = cls.prototype.disconnectedCallback;
+        cls.prototype.connectedCallback = function () {
+          connectedCallback.call(this);
+          this[`__unbsubLocalStorage${key}`] = subscribe(this);
+        };
+        cls.prototype.disconnectedCallback = function () {
+          disconnectedCallback.call(this);
+          this[`__unbsubLocalStorage${key}`]();
+        };
+        cls.createProperty(clsElement.key, {
+          noAccessor: true,
+          ...propertyOptions,
+        });
+      }
+    },
   };
 };

src/common/decorators/restore-scroll.ts

@@ -1,33 +1,33 @@
 import type { LitElement } from "lit-element";
 import type { ClassElement } from "../../types";
 
-export const restoreScroll = (selector: string): any => {
+export const restoreScroll = (selector: string): any => (
-  return (element: ClassElement) => ({
+  element: ClassElement
-    kind: "method",
+) => ({
-    placement: "prototype",
+  kind: "method",
-    key: element.key,
+  placement: "prototype",
-    descriptor: {
+  key: element.key,
-      set(this: LitElement, value: number) {
+  descriptor: {
-        this[`__${String(element.key)}`] = value;
+    set(this: LitElement, value: number) {
-      },
+      this[`__${String(element.key)}`] = value;
-      get(this: LitElement) {
-        return this[`__${String(element.key)}`];
-      },
-      enumerable: true,
-      configurable: true,
     },
-    finisher(cls: typeof LitElement) {
+    get(this: LitElement) {
-      const connectedCallback = cls.prototype.connectedCallback;
+      return this[`__${String(element.key)}`];
-      cls.prototype.connectedCallback = function () {
+    },
-        connectedCallback.call(this);
+    enumerable: true,
-        if (this[element.key]) {
+    configurable: true,
-          const target = this.renderRoot.querySelector(selector);
+  },
-          if (!target) {
+  finisher(cls: typeof LitElement) {
-            return;
+    const connectedCallback = cls.prototype.connectedCallback;
-          }
+    cls.prototype.connectedCallback = function () {
-          target.scrollTop = this[element.key];
+      connectedCallback.call(this);
+      if (this[element.key]) {
+        const target = this.renderRoot.querySelector(selector);
+        if (!target) {
+          return;
         }
-      };
+        target.scrollTop = this[element.key];
-    },
+      }
-  });
+    };
-};
+  },
+});

src/common/dom/load_resource.ts

@@ -1,13 +1,9 @@
 // Load a resource and get a promise when loading done.
 // From: https://davidwalsh.name/javascript-loader
 
-const _load = (
+const _load = (tag: "link" | "script" | "img", url: string, type?: "module") =>
-  tag: "link" | "script" | "img",
-  url: string,
-  type?: "module"
-) => {
   // This promise will be used by Promise.all to determine success or failure
-  return new Promise((resolve, reject) => {
+  new Promise((resolve, reject) => {
     const element = document.createElement(tag);
     let attr = "src";
     let parent = "body";
@@ -35,8 +31,6 @@ const _load = (
     element[attr] = url;
     document[parent].appendChild(element);
   });
-};
-
 export const loadCSS = (url: string) => _load("link", url);
 export const loadJS = (url: string) => _load("script", url);
 export const loadImg = (url: string) => _load("img", url);

src/common/dom/setup-leaflet-map.ts

@@ -48,8 +48,8 @@ export const replaceTileLayer = (
 const createTileLayer = (
   leaflet: LeafletModuleType,
   darkMode: boolean
-): TileLayer => {
+): TileLayer =>
-  return leaflet.tileLayer(
+  leaflet.tileLayer(
     `https://{s}.basemaps.cartocdn.com/${
       darkMode ? "dark_all" : "light_all"
     }/{z}/{x}/{y}${leaflet.Browser.retina ? "@2x.png" : ".png"}`,
@@ -61,4 +61,3 @@ const createTileLayer = (
       maxZoom: 20,
     }
   );
-};

src/common/entity/compute_domain.ts

@@ -1,3 +1,2 @@
-export const computeDomain = (entityId: string): string => {
+export const computeDomain = (entityId: string): string =>
-  return entityId.substr(0, entityId.indexOf("."));
+  entityId.substr(0, entityId.indexOf("."));
-};

src/common/entity/compute_object_id.ts

@@ -1,4 +1,3 @@
 /** Compute the object ID of a state. */
-export const computeObjectId = (entityId: string): string => {
+export const computeObjectId = (entityId: string): string =>
-  return entityId.substr(entityId.indexOf(".") + 1);
+  entityId.substr(entityId.indexOf(".") + 1);
-};

src/common/entity/compute_state_domain.ts

@@ -1,6 +1,5 @@
 import { HassEntity } from "home-assistant-js-websocket";
 import { computeDomain } from "./compute_domain";
 
-export const computeStateDomain = (stateObj: HassEntity) => {
+export const computeStateDomain = (stateObj: HassEntity) =>
-  return computeDomain(stateObj.entity_id);
+  computeDomain(stateObj.entity_id);
-};

src/common/entity/compute_state_name.ts

@@ -1,8 +1,7 @@
 import { HassEntity } from "home-assistant-js-websocket";
 import { computeObjectId } from "./compute_object_id";
 
-export const computeStateName = (stateObj: HassEntity): string => {
+export const computeStateName = (stateObj: HassEntity): string =>
-  return stateObj.attributes.friendly_name === undefined
+  stateObj.attributes.friendly_name === undefined
     ? computeObjectId(stateObj.entity_id).replace(/_/g, " ")
     : stateObj.attributes.friendly_name || "";
-};

src/common/entity/has_location.ts

@@ -1,7 +1,4 @@
 import { HassEntity } from "home-assistant-js-websocket";
 
-export const hasLocation = (stateObj: HassEntity) => {
+export const hasLocation = (stateObj: HassEntity) =>
-  return (
+  "latitude" in stateObj.attributes && "longitude" in stateObj.attributes;
-    "latitude" in stateObj.attributes && "longitude" in stateObj.attributes
-  );
-};

src/common/entity/supports-feature.ts

@@ -3,7 +3,6 @@ import { HassEntity } from "home-assistant-js-websocket";
 export const supportsFeature = (
   stateObj: HassEntity,
   feature: number
-): boolean => {
+): boolean =>
   // eslint-disable-next-line no-bitwise
-  return (stateObj.attributes.supported_features! & feature) !== 0;
+  (stateObj.attributes.supported_features! & feature) !== 0;
-};

src/common/image/extract_color.ts

@@ -119,6 +119,7 @@ export const extractColors = (url: string, downsampleColors = 16) =>
     colorCount: downsampleColors,
   })
     .getPalette()
-    .then(({ foreground, background }) => {
+    .then(({ foreground, background }) => ({
-      return { background: background!, foreground: foreground! };
+      background: background!,
-    });
+      foreground: foreground!,
+    }));

src/common/string/filter/sequence-matching.ts

@@ -71,8 +71,8 @@ type FuzzyFilterSort = <T extends ScorableTextItem>(
   items: T[]
 ) => T[];
 
-export const fuzzyFilterSort: FuzzyFilterSort = (filter, items) => {
+export const fuzzyFilterSort: FuzzyFilterSort = (filter, items) =>
-  return items
+  items
     .map((item) => {
       item.score = fuzzySequentialMatch(filter, item);
       return item;
@@ -81,4 +81,3 @@ export const fuzzyFilterSort: FuzzyFilterSort = (filter, items) => {
     .sort(({ score: scoreA = 0 }, { score: scoreB = 0 }) =>
       scoreA > scoreB ? -1 : scoreA < scoreB ? 1 : 0
     );
-};

src/common/util/render-status.ts

@@ -2,8 +2,7 @@ export const afterNextRender = (cb: (value: unknown) => void): void => {
   requestAnimationFrame(() => setTimeout(cb, 0));
 };
 
-export const nextRender = () => {
+export const nextRender = () =>
-  return new Promise((resolve) => {
+  new Promise((resolve) => {
     afterNextRender(resolve);
   });
-};

src/components/data-table/ha-data-table.ts

@@ -485,9 +485,7 @@ export class HaDataTable extends LitElement {
       data: DataTableRowData[],
       columns: SortableColumnContainer,
       filter: string
-    ): Promise<DataTableRowData[]> => {
+    ): Promise<DataTableRowData[]> => filterData(data, columns, filter)
-      return filterData(data, columns, filter);
-    }
   );
 
   private _handleHeaderClick(ev: Event) {

src/components/data-table/sort-filter.ts

@@ -1,13 +1,13 @@
-import { wrap } from "comlink";
+import { Remote, wrap } from "comlink";
-import type { api } from "./sort_filter_worker";
+import type { Api } from "./sort_filter_worker";
 
-type FilterDataType = api["filterData"];
+type FilterDataType = Api["filterData"];
 type FilterDataParamTypes = Parameters<FilterDataType>;
 
-type SortDataType = api["sortData"];
+type SortDataType = Api["sortData"];
 type SortDataParamTypes = Parameters<SortDataType>;
 
-let worker: any | undefined;
+let worker: Remote<Api> | undefined;
 
 export const filterData = async (
   data: FilterDataParamTypes[0],
@@ -18,7 +18,7 @@ export const filterData = async (
     worker = wrap(new Worker(new URL("./sort_filter_worker", import.meta.url)));
   }
 
-  return await worker.filterData(data, columns, filter);
+  return worker.filterData(data, columns, filter);
 };
 
 export const sortData = async (
@@ -31,5 +31,5 @@ export const sortData = async (
     worker = wrap(new Worker(new URL("./sort_filter_worker", import.meta.url)));
   }
 
-  return await worker.sortData(data, columns, direction, sortColumn);
+  return worker.sortData(data, columns, direction, sortColumn);
 };

src/components/data-table/sort_filter_worker.ts

@@ -14,8 +14,8 @@ const filterData = (
   filter: string
 ) => {
   filter = filter.toUpperCase();
-  return data.filter((row) => {
+  return data.filter((row) =>
-    return Object.entries(columns).some((columnEntry) => {
+    Object.entries(columns).some((columnEntry) => {
       const [key, column] = columnEntry;
       if (column.filterable) {
         if (
@@ -27,8 +27,8 @@ const filterData = (
         }
       }
       return false;
-    });
+    })
-  });
+  );
 };
 
 const sortData = (
@@ -80,6 +80,6 @@ const api = {
   sortData,
 };
 
-export type api = typeof api;
+export type Api = typeof api;
 
 expose(api);

src/components/device/ha-device-automation-picker.ts

@@ -64,12 +64,8 @@ export abstract class HaDeviceAutomationPicker<
   private _createNoAutomation: (deviceId?: string) => T;
 
   constructor(
-    localizeDeviceAutomation: HaDeviceAutomationPicker<
+    localizeDeviceAutomation: HaDeviceAutomationPicker<T>["_localizeDeviceAutomation"],
-      T
+    fetchDeviceAutomations: HaDeviceAutomationPicker<T>["_fetchDeviceAutomations"],
-    >["_localizeDeviceAutomation"],
-    fetchDeviceAutomations: HaDeviceAutomationPicker<
-      T
-    >["_fetchDeviceAutomations"],
     createNoAutomation: HaDeviceAutomationPicker<T>["_createNoAutomation"]
   ) {
     super();

src/components/device/ha-device-condition-picker.ts

@@ -8,9 +8,7 @@ import "../ha-paper-dropdown-menu";
 import { HaDeviceAutomationPicker } from "./ha-device-automation-picker";
 
 @customElement("ha-device-condition-picker")
-class HaDeviceConditionPicker extends HaDeviceAutomationPicker<
+class HaDeviceConditionPicker extends HaDeviceAutomationPicker<DeviceCondition> {
-  DeviceCondition
-> {
   protected get NO_AUTOMATION_TEXT() {
     return this.hass.localize(
       "ui.panel.config.devices.automation.conditions.no_conditions"

src/components/device/ha-device-picker.ts

@@ -212,19 +212,17 @@ export class HaDevicePicker extends SubscribeMixin(LitElement) {
         );
       }
 
-      const outputDevices = inputDevices.map((device) => {
+      const outputDevices = inputDevices.map((device) => ({
-        return {
+        id: device.id,
-          id: device.id,
+        name: computeDeviceName(
-          name: computeDeviceName(
+          device,
-            device,
+          this.hass,
-            this.hass,
+          deviceEntityLookup[device.id]
-            deviceEntityLookup[device.id]
+        ),
-          ),
+        area: device.area_id
-          area: device.area_id
+          ? areaLookup[device.area_id].name
-            ? areaLookup[device.area_id].name
+          : this.hass.localize("ui.components.device-picker.no_area"),
-            : this.hass.localize("ui.components.device-picker.no_area"),
+      }));
-        };
-      });
       if (!outputDevices.length) {
         return [
           {

src/components/dialog/ha-paper-dialog.ts

@@ -4,9 +4,9 @@ import { mixinBehaviors } from "@polymer/polymer/lib/legacy/class";
 import type { Constructor } from "../../types";
 import { HaIronFocusablesHelper } from "./ha-iron-focusables-helper";
 
-const paperDialogClass = customElements.get("paper-dialog") as Constructor<
+const paperDialogClass = customElements.get(
-  PaperDialogElement
+  "paper-dialog"
->;
+) as Constructor<PaperDialogElement>;
 
 // behavior that will override existing iron-overlay-behavior and call the fixed implementation
 const haTabFixBehaviorImpl = {

src/components/ha-analytics.ts

@@ -57,9 +57,7 @@ export class HaAnalytics extends LitElement {
           >
           </ha-checkbox>
         </span>
-        <span slot="heading" data-for="base">
+        <span slot="heading" data-for="base"> Basic analytics </span>
-          Basic analytics
-        </span>
         <span slot="description" data-for="base">
           This includes information about your system.
         </span>
@@ -101,9 +99,7 @@ export class HaAnalytics extends LitElement {
           >
           </ha-checkbox>
         </span>
-        <span slot="heading" data-for="diagnostics">
+        <span slot="heading" data-for="diagnostics"> Diagnostics </span>
-          Diagnostics
-        </span>
         <span slot="description" data-for="diagnostics">
           Share crash reports when unexpected errors occur.
         </span>

src/components/ha-area-picker.ts

@@ -391,11 +391,9 @@ export class HaAreaPicker extends SubscribeMixin(LitElement) {
     `;
   }
 
-  private _area = memoizeOne((areaId: string):
+  private _area = memoizeOne((areaId: string): AreaRegistryEntry | undefined =>
-    | AreaRegistryEntry
+    this._areas?.find((area) => area.area_id === areaId)
-    | undefined => {
+  );
-    return this._areas?.find((area) => area.area_id === areaId);
-  });
 
   private _clearValue(ev: Event) {
     ev.stopPropagation();

src/components/ha-attributes.ts

@@ -36,12 +36,8 @@ class HaAttributes extends LitElement {
         ).map(
           (attribute) => html`
             <div class="data-entry">
-              <div class="key">
+              <div class="key">${formatAttributeName(attribute)}</div>
-                ${formatAttributeName(attribute)}
+              <div class="value">${this.formatAttribute(attribute)}</div>
-              </div>
-              <div class="value">
-                ${this.formatAttribute(attribute)}
-              </div>
             </div>
           `
         )}
@@ -92,9 +88,9 @@ class HaAttributes extends LitElement {
     if (!this.stateObj) {
       return [];
     }
-    return Object.keys(this.stateObj.attributes).filter((key) => {
+    return Object.keys(this.stateObj.attributes).filter(
-      return filtersArray.indexOf(key) === -1;
+      (key) => filtersArray.indexOf(key) === -1
-    });
+    );
   }
 
   private formatAttribute(attribute: string): string | TemplateResult {

src/components/ha-code-editor.ts

@@ -124,10 +124,6 @@ export class HaCodeEditor extends UpdatingElement {
       }
     </style>`;
 
-    const container = document.createElement("span");
-
-    shadowRoot.appendChild(container);
-
     this.codemirror = new this._loadedCodeMirror.EditorView({
       state: this._loadedCodeMirror.EditorState.create({
         doc: this._value,
@@ -160,7 +156,7 @@ export class HaCodeEditor extends UpdatingElement {
         ],
       }),
       root: shadowRoot,
-      parent: container,
+      parent: shadowRoot,
     });
   }
 

src/components/ha-date-input.ts

@@ -45,16 +45,13 @@ const i18n = {
   clear: "Clear",
   today: "Today",
   cancel: "Cancel",
-  formatTitle: (monthName, fullYear) => {
+  formatTitle: (monthName, fullYear) => monthName + " " + fullYear,
-    return monthName + " " + fullYear;
+  formatDate: (d: { day: number; month: number; year: number }) =>
-  },
+    [
-  formatDate: (d: { day: number; month: number; year: number }) => {
-    return [
       ("0000" + String(d.year)).slice(-4),
       ("0" + String(d.month + 1)).slice(-2),
       ("0" + String(d.day)).slice(-2),
-    ].join("-");
+    ].join("-"),
-  },
   parseDate: (text: string) => {
     const parts = text.split("-");
     const today = new Date();

src/components/ha-date-range-picker.ts

@@ -88,9 +88,7 @@ export class HaDateRangePicker extends LitElement {
             >
               <mwc-list @action=${this._setDateRange} activatable>
                 ${Object.keys(this.ranges).map(
-                  (name) => html`<mwc-list-item>
+                  (name) => html`<mwc-list-item> ${name} </mwc-list-item>`
-                    ${name}
-                  </mwc-list-item>`
                 )}
               </mwc-list>
             </div>`

src/components/ha-dialog.ts

@@ -28,9 +28,7 @@ export class HaDialog extends MwcDialog {
   }
 
   protected renderHeading() {
-    return html`<slot name="heading">
+    return html`<slot name="heading"> ${super.renderHeading()} </slot>`;
-      ${super.renderHeading()}
-    </slot>`;
   }
 
   protected static get styles(): CSSResult[] {

src/components/ha-file-upload.ts

@@ -79,9 +79,7 @@ export class HaFileUpload extends LitElement {
                   dragged: this._drag,
                 })}
               >
-                <label for="input" slot="label">
+                <label for="input" slot="label"> ${this.label} </label>
-                  ${this.label}
-                </label>
                 <iron-input slot="input">
                   <input
                     id="input"

src/components/ha-form/ha-form-multi_select.ts

@@ -80,20 +80,22 @@ export class HaFormMultiSelect extends LitElement implements HaFormElement {
           @selected-items-changed=${this._valueChanged}
           @iron-select=${this._onSelect}
         >
-          ${// TS doesn't work with union array types https://github.com/microsoft/TypeScript/issues/36390
+          ${
-          // @ts-ignore
+            // TS doesn't work with union array types https://github.com/microsoft/TypeScript/issues/36390
-          options.map((item: string | [string, string]) => {
+            // @ts-ignore
-            const value = this._optionValue(item);
+            options.map((item: string | [string, string]) => {
-            return html`
+              const value = this._optionValue(item);
-              <paper-icon-item .itemValue=${value}>
+              return html`
-                <paper-checkbox
+                <paper-icon-item .itemValue=${value}>
-                  .checked=${data.includes(value)}
+                  <paper-checkbox
-                  slot="item-icon"
+                    .checked=${data.includes(value)}
-                ></paper-checkbox>
+                    slot="item-icon"
-                ${this._optionLabel(item)}
+                  ></paper-checkbox>
-              </paper-icon-item>
+                  ${this._optionLabel(item)}
-            `;
+                </paper-icon-item>
-          })}
+              `;
+            })
+          }
         </paper-listbox>
       </paper-menu-button>
     `;

src/components/ha-form/ha-form-select.ts

@@ -41,15 +41,17 @@ export class HaFormSelect extends LitElement implements HaFormElement {
           .selected=${this.data}
           @selected-item-changed=${this._valueChanged}
         >
-          ${// TS doesn't work with union array types https://github.com/microsoft/TypeScript/issues/36390
+          ${
-          // @ts-ignore
+            // TS doesn't work with union array types https://github.com/microsoft/TypeScript/issues/36390
-          this.schema.options!.map(
+            // @ts-ignore
-            (item: string | [string, string]) => html`
+            this.schema.options!.map(
-              <paper-item .itemValue=${this._optionValue(item)}>
+              (item: string | [string, string]) => html`
-                ${this._optionLabel(item)}
+                <paper-item .itemValue=${this._optionValue(item)}>
-              </paper-item>
+                  ${this._optionLabel(item)}
-            `
+                </paper-item>
-          )}
+              `
+            )
+          }
         </paper-listbox>
       </ha-paper-dropdown-menu>
     `;

src/components/ha-formfield.ts

@@ -4,9 +4,9 @@ import { style } from "@material/mwc-formfield/mwc-formfield-css";
 import { css, CSSResult, customElement } from "lit-element";
 import { Constructor } from "../types";
 
-const MwcFormfield = customElements.get("mwc-formfield") as Constructor<
+const MwcFormfield = customElements.get(
-  Formfield
+  "mwc-formfield"
->;
+) as Constructor<Formfield>;
 
 @customElement("ha-formfield")
 export class HaFormfield extends MwcFormfield {

src/components/ha-selector/ha-selector-select.ts

@@ -36,9 +36,7 @@ export class HaSelectSelector extends LitElement {
       >
         ${this.selector.select.options.map(
           (item: string) => html`
-            <paper-item .itemValue=${item}>
+            <paper-item .itemValue=${item}> ${item} </paper-item>
-              ${item}
-            </paper-item>
           `
         )}
       </paper-listbox>

src/components/ha-service-control.ts

@@ -140,13 +140,11 @@ export class HaServiceControl extends LitElement {
 
     const fields = Object.entries(
       serviceDomains[domain][serviceName].fields
-    ).map(([key, value]) => {
+    ).map(([key, value]) => ({
-      return {
+      key,
-        key,
+      ...value,
-        ...value,
+      selector: value.selector as Selector | undefined,
-        selector: value.selector as Selector | undefined,
+    }));
-      };
-    });
     return {
       ...serviceDomains[domain][serviceName],
       fields,

src/components/ha-tabs.ts

@@ -5,9 +5,9 @@ import type { PaperTabsElement } from "@polymer/paper-tabs/paper-tabs";
 import { customElement } from "lit-element";
 import { Constructor } from "../types";
 
-const PaperTabs = customElements.get("paper-tabs") as Constructor<
+const PaperTabs = customElements.get(
-  PaperTabsElement
+  "paper-tabs"
->;
+) as Constructor<PaperTabsElement>;
 
 let subTemplate: HTMLTemplateElement;
 

src/components/ha-toast.ts

@@ -2,9 +2,9 @@ import "@polymer/paper-toast/paper-toast";
 import type { PaperToastElement } from "@polymer/paper-toast/paper-toast";
 import type { Constructor } from "../types";
 
-const PaperToast = customElements.get("paper-toast") as Constructor<
+const PaperToast = customElements.get(
-  PaperToastElement
+  "paper-toast"
->;
+) as Constructor<PaperToastElement>;
 
 export class HaToast extends PaperToast {
   private _resizeListener?: (obj: { matches: boolean }) => unknown;

src/components/media-player/ha-media-player-browse.ts

@@ -122,9 +122,7 @@ export class HaMediaPlayerBrowse extends LitElement {
         });
       } else {
         return html`
-          <div class="container">
+          <div class="container">${this._renderError(this._error)}</div>
-            ${this._renderError(this._error)}
-          </div>
         `;
       }
     }
@@ -202,13 +200,7 @@ export class HaMediaPlayerBrowse extends LitElement {
                   `
                 : ""}
               <h1 class="title">${currentItem.title}</h1>
-              ${subtitle
+              ${subtitle ? html` <h2 class="subtitle">${subtitle}</h2> ` : ""}
-                ? html`
-                    <h2 class="subtitle">
-                      ${subtitle}
-                    </h2>
-                  `
-                : ""}
             </div>
             ${currentItem.can_play && (!currentItem.thumbnail || !this._narrow)
               ? html`
@@ -247,9 +239,7 @@ export class HaMediaPlayerBrowse extends LitElement {
       <div class="content" @scroll=${this._scroll} @touchmove=${this._scroll}>
         ${this._error
           ? html`
-              <div class="container">
+              <div class="container">${this._renderError(this._error)}</div>
-                ${this._renderError(this._error)}
-              </div>
             `
           : currentItem.children?.length
           ? childrenMediaClass.layout === "grid"

src/data/automation_i18n.ts

@@ -1,8 +1,7 @@
 import { Trigger, Condition } from "./automation";
 
-export const describeTrigger = (trigger: Trigger) => {
+export const describeTrigger = (trigger: Trigger) =>
-  return `${trigger.platform} trigger`;
+  `${trigger.platform} trigger`;
-};
 
 export const describeCondition = (condition: Condition) => {
   if (condition.alias) {

src/data/bootstrap_integrations.ts

@@ -6,11 +6,12 @@ export const subscribeBootstrapIntegrations = (
   hass: HomeAssistant,
   callback: (message: BootstrapIntegrationsTimings) => void
 ) => {
-  const unsubProm = hass.connection.subscribeMessage<
+  const unsubProm = hass.connection.subscribeMessage<BootstrapIntegrationsTimings>(
-    BootstrapIntegrationsTimings
+    (message) => callback(message),
-  >((message) => callback(message), {
+    {
-    type: "subscribe_bootstrap_integrations",
+      type: "subscribe_bootstrap_integrations",
-  });
+    }
+  );
 
   return unsubProm;
 };

src/data/calendar.ts

@@ -74,8 +74,8 @@ const getCalendarDate = (dateObj: any): string | undefined => {
   return undefined;
 };
 
-export const getCalendars = (hass: HomeAssistant): Calendar[] => {
+export const getCalendars = (hass: HomeAssistant): Calendar[] =>
-  return Object.keys(hass.states)
+  Object.keys(hass.states)
     .filter((eid) => computeDomain(eid) === "calendar")
     .sort()
     .map((eid, idx) => ({
@@ -83,4 +83,3 @@ export const getCalendars = (hass: HomeAssistant): Calendar[] => {
       name: computeStateName(hass.states[eid]),
       backgroundColor: `#${HA_COLOR_PALETTE[idx % HA_COLOR_PALETTE.length]}`,
     }));
-};

src/data/device_registry.ts

@@ -48,14 +48,11 @@ export const computeDeviceName = (
   device: DeviceRegistryEntry,
   hass: HomeAssistant,
   entities?: EntityRegistryEntry[] | string[]
-) => {
+) =>
-  return (
+  device.name_by_user ||
-    device.name_by_user ||
+  device.name ||
-    device.name ||
+  (entities && fallbackDeviceName(hass, entities)) ||
-    (entities && fallbackDeviceName(hass, entities)) ||
+  hass.localize("ui.panel.config.devices.unnamed_device");
-    hass.localize("ui.panel.config.devices.unnamed_device")
-  );
-};
 
 export const devicesInArea = (devices: DeviceRegistryEntry[], areaId: string) =>
   devices.filter((device) => device.area_id === areaId);

src/data/discovery.ts

@@ -9,9 +9,7 @@ export interface DiscoveryInformation {
   version: string;
 }
 
-export const fetchDiscoveryInformation = async (): Promise<
+export const fetchDiscoveryInformation = async (): Promise<DiscoveryInformation> => {
-  DiscoveryInformation
-> => {
   const response = await fetch("/api/discovery_info", { method: "GET" });
-  return await response.json();
+  return response.json();
 };

src/data/hassio/addon.ts

@@ -135,7 +135,7 @@ export const fetchHassioAddonsInfo = async (
   hass: HomeAssistant
 ): Promise<HassioAddonsInfo> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/addons",
       method: "get",
@@ -152,7 +152,7 @@ export const fetchHassioAddonInfo = async (
   slug: string
 ): Promise<HassioAddonDetails> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: `/addons/${slug}/info`,
       method: "get",
@@ -170,23 +170,15 @@ export const fetchHassioAddonInfo = async (
 export const fetchHassioAddonChangelog = async (
   hass: HomeAssistant,
   slug: string
-) => {
+) => hass.callApi<string>("GET", `hassio/addons/${slug}/changelog`);
-  return hass.callApi<string>("GET", `hassio/addons/${slug}/changelog`);
-};
 
-export const fetchHassioAddonLogs = async (
+export const fetchHassioAddonLogs = async (hass: HomeAssistant, slug: string) =>
-  hass: HomeAssistant,
+  hass.callApi<string>("GET", `hassio/addons/${slug}/logs`);
-  slug: string
-) => {
-  return hass.callApi<string>("GET", `hassio/addons/${slug}/logs`);
-};
 
 export const fetchHassioAddonDocumentation = async (
   hass: HomeAssistant,
   slug: string
-) => {
+) => hass.callApi<string>("GET", `hassio/addons/${slug}/documentation`);
-  return hass.callApi<string>("GET", `hassio/addons/${slug}/documentation`);
-};
 
 export const setHassioAddonOption = async (
   hass: HomeAssistant,
@@ -215,7 +207,7 @@ export const validateHassioAddonOption = async (
   slug: string
 ): Promise<{ message: string; valid: boolean }> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: `/addons/${slug}/options/validate`,
       method: "post",
@@ -232,7 +224,7 @@ export const validateHassioAddonOption = async (
 
 export const startHassioAddon = async (hass: HomeAssistant, slug: string) => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: `/addons/${slug}/start`,
       method: "post",
@@ -245,7 +237,7 @@ export const startHassioAddon = async (hass: HomeAssistant, slug: string) => {
 
 export const stopHassioAddon = async (hass: HomeAssistant, slug: string) => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: `/addons/${slug}/stop`,
       method: "post",

src/data/hassio/common.ts

@@ -20,13 +20,12 @@ export interface HassioStats {
 export const hassioApiResultExtractor = <T>(response: HassioResponse<T>) =>
   response.data;
 
-export const extractApiErrorMessage = (error: any): string => {
+export const extractApiErrorMessage = (error: any): string =>
-  return typeof error === "object"
+  typeof error === "object"
     ? typeof error.body === "object"
       ? error.body.message || "Unknown error, see supervisor logs"
       : error.body || error.message || "Unknown error, see supervisor logs"
     : error;
-};
 
 const ignoredStatusCodes = new Set([502, 503, 504]);
 
@@ -50,7 +49,7 @@ export const fetchHassioStats = async (
   container: string
 ): Promise<HassioStats> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: `/${container}/stats`,
       method: "get",

src/data/hassio/docker.ts

@@ -10,7 +10,7 @@ export const fetchHassioDockerRegistries = async (
   hass: HomeAssistant
 ): Promise<HassioDockerRegistries> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: `/docker/registries`,
       method: "get",

src/data/hassio/hardware.ts

@@ -26,7 +26,7 @@ export const fetchHassioHardwareAudio = async (
   hass: HomeAssistant
 ): Promise<HassioHardwareAudioList> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: `/hardware/audio`,
       method: "get",
@@ -45,7 +45,7 @@ export const fetchHassioHardwareInfo = async (
   hass: HomeAssistant
 ): Promise<HassioHardwareInfo> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: `/hardware/info`,
       method: "get",

src/data/hassio/host.ts

@@ -28,7 +28,7 @@ export const fetchHassioHostInfo = async (
   hass: HomeAssistant
 ): Promise<HassioHostInfo> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/host/info",
       method: "get",
@@ -46,7 +46,7 @@ export const fetchHassioHassOsInfo = async (
   hass: HomeAssistant
 ): Promise<HassioHassOSInfo> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/os/info",
       method: "get",
@@ -63,7 +63,7 @@ export const fetchHassioHassOsInfo = async (
 
 export const rebootHost = async (hass: HomeAssistant) => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/host/reboot",
       method: "post",
@@ -76,7 +76,7 @@ export const rebootHost = async (hass: HomeAssistant) => {
 
 export const shutdownHost = async (hass: HomeAssistant) => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/host/shutdown",
       method: "post",
@@ -89,7 +89,7 @@ export const shutdownHost = async (hass: HomeAssistant) => {
 
 export const updateOS = async (hass: HomeAssistant) => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/os/update",
       method: "post",
@@ -102,7 +102,7 @@ export const updateOS = async (hass: HomeAssistant) => {
 
 export const configSyncOS = async (hass: HomeAssistant) => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/os/config/sync",
       method: "post",
@@ -115,7 +115,7 @@ export const configSyncOS = async (hass: HomeAssistant) => {
 
 export const changeHostOptions = async (hass: HomeAssistant, options: any) => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/host/options",
       method: "post",

src/data/hassio/network.ts

@@ -56,7 +56,7 @@ export const fetchNetworkInfo = async (
   hass: HomeAssistant
 ): Promise<NetworkInfo> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/network/info",
       method: "get",
@@ -99,7 +99,7 @@ export const accesspointScan = async (
   network_interface: string
 ): Promise<AccessPoints> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: `/network/interface/${network_interface}/accesspoints`,
       method: "get",

src/data/hassio/resolution.ts

@@ -13,7 +13,7 @@ export const fetchHassioResolution = async (
   hass: HomeAssistant
 ): Promise<HassioResolution> => {
   if (atLeastVersion(hass.config.version, 2021, 2, 4)) {
-    return await hass.callWS({
+    return hass.callWS({
       type: "supervisor/api",
       endpoint: "/resolution/info",
       method: "get",