Handle no operation mode (#1901)

* Handle no operation mode

* Upgrade HAWS so we can use correct types

* Lint

package.json

@@ -73,7 +73,7 @@
     "es6-object-assign": "^1.1.0",
     "eslint-import-resolver-webpack": "^0.10.1",
     "fecha": "^2.3.3",
-    "home-assistant-js-websocket": "^3.1.4",
+    "home-assistant-js-websocket": "^3.1.5",
     "intl-messageformat": "^2.2.0",
     "jquery": "^3.3.1",
     "js-yaml": "^3.12.0",

src/panels/lovelace/cards/hui-thermostat-card.ts

@@ -6,7 +6,7 @@ import "../../../components/ha-card.js";
 import "../../../components/ha-icon.js";
 import { roundSliderStyle } from "../../../resources/jquery.roundslider";
 
-import { HomeAssistant } from "../../../types.js";
+import { HomeAssistant, ClimateEntity } from "../../../types.js";
 import { hassLocalizeLitMixin } from "../../../mixins/lit-localize-mixin";
 import { LovelaceCard, LovelaceConfig } from "../types.js";
 import computeStateName from "../../../common/entity/compute_state_name.js";
@@ -65,10 +65,10 @@ export class HuiThermostatCard extends hassLocalizeLitMixin(LitElement)
     if (!this.hass || !this.config) {
       return html``;
     }
-    const stateObj = this.hass.states[this.config.entity];
+    const stateObj = this.hass.states[this.config.entity] as ClimateEntity;
     const broadCard = this.clientWidth > 390;
-    const mode = modeIcons[stateObj.attributes.operation_mode]
-      ? stateObj.attributes.operation_mode
+    const mode = modeIcons[stateObj.attributes.operation_mode || ""]
+      ? stateObj.attributes.operation_mode!
       : "unknown-mode";
     return html`
       ${this.renderStyle()}
@@ -97,7 +97,7 @@ export class HuiThermostatCard extends hassLocalizeLitMixin(LitElement)
               `state.climate.${stateObj.state}`
             )}</div>
             <div class="modes">
-              ${stateObj.attributes.operation_list.map((modeItem) =>
+              ${(stateObj.attributes.operation_list || []).map((modeItem) =>
                 this._renderIcon(modeItem, mode)
               )}
             </div>
@@ -118,7 +118,7 @@ export class HuiThermostatCard extends hassLocalizeLitMixin(LitElement)
   }
 
   protected firstUpdated() {
-    const stateObj = this.hass!.states[this.config!.entity];
+    const stateObj = this.hass!.states[this.config!.entity] as ClimateEntity;
 
     const _sliderType =
       stateObj.attributes.target_temp_low &&
@@ -138,16 +138,24 @@ export class HuiThermostatCard extends hassLocalizeLitMixin(LitElement)
   }
 
   protected updated() {
-    const attrs = this.hass!.states[this.config!.entity].attributes;
+    const stateObj = this.hass!.states[this.config!.entity] as ClimateEntity;
 
     let sliderValue;
     let uiValue;
 
-    if (attrs.target_temp_low && attrs.target_temp_high) {
-      sliderValue = `${attrs.target_temp_low}, ${attrs.target_temp_high}`;
-      uiValue = formatTemp([attrs.target_temp_low, attrs.target_temp_high]);
+    if (
+      stateObj.attributes.target_temp_low &&
+      stateObj.attributes.target_temp_high
+    ) {
+      sliderValue = `${stateObj.attributes.target_temp_low}, ${
+        stateObj.attributes.target_temp_high
+      }`;
+      uiValue = formatTemp([
+        stateObj.attributes.target_temp_low,
+        stateObj.attributes.target_temp_high,
+      ]);
     } else {
-      sliderValue = uiValue = attrs.temperature;
+      sliderValue = uiValue = stateObj.attributes.temperature;
     }
 
     jQuery("#thermostat", this.shadowRoot).roundSlider({
@@ -307,7 +315,7 @@ export class HuiThermostatCard extends hassLocalizeLitMixin(LitElement)
   }
 
   private _setTemperature(e) {
-    const stateObj = this.hass!.states[this.config!.entity];
+    const stateObj = this.hass!.states[this.config!.entity] as ClimateEntity;
     if (
       stateObj.attributes.target_temp_low &&
       stateObj.attributes.target_temp_high

src/types.ts

@@ -4,6 +4,8 @@ import {
   Auth,
   Connection,
   MessageBase,
+  HassEntityBase,
+  HassEntityAttributeBase,
 } from "home-assistant-js-websocket";
 
 export interface Credential {
@@ -85,3 +87,27 @@ export interface HomeAssistant {
   sendWS: (msg: MessageBase) => Promise<void>;
   callWS: <T>(msg: MessageBase) => Promise<T>;
 }
+
+export type ClimateEntity = HassEntityBase & {
+  attributes: HassEntityAttributeBase & {
+    current_temperature: number;
+    min_temp: number;
+    max_temp: number;
+    temperature: number;
+    target_temp_step?: number;
+    target_temp_high?: number;
+    target_temp_low?: number;
+    target_humidity?: number;
+    target_humidity_low?: number;
+    target_humidity_high?: number;
+    fan_mode?: string;
+    fan_list?: string[];
+    operation_mode?: string;
+    operation_list?: string[];
+    hold_mode?: string;
+    swing_mode?: string;
+    swing_list?: string[];
+    away_mode?: "on" | "off";
+    aux_heat?: "on" | "off";
+  };
+};

yarn.lock

@@ -8114,10 +8114,10 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/hoek/-/hoek-4.2.1.tgz#9634502aa12c445dd5a7c5734b572bb8738aacbb"
   integrity sha512-QLg82fGkfnJ/4iy1xZ81/9SIJiq1NGFUMGs6ParyjBZr6jW2Ufj/snDqTHixNlHdPNwN2RLVD0Pi3igeK9+JfA==
 
-home-assistant-js-websocket@^3.1.4:
-  version "3.1.4"
-  resolved "https://registry.yarnpkg.com/home-assistant-js-websocket/-/home-assistant-js-websocket-3.1.4.tgz#4ff338a51d272650db96cd5c67aa05878ef234a4"
-  integrity sha512-lkAglJ04ja98awHPqI09On8v1wHr0/QmjLYlPGC6LWF7HBMAtYMasQ2mPEb5nLLZrD0DroxNVQK2owlRy3+NOQ==
+home-assistant-js-websocket@^3.1.5:
+  version "3.1.5"
+  resolved "https://registry.yarnpkg.com/home-assistant-js-websocket/-/home-assistant-js-websocket-3.1.5.tgz#56358660bbccb5f24e16f9197bbad12739f9b756"
+  integrity sha512-BlANSkA9ob6wlUJCYS26n1tfMla+aJzB2rhhXSFi0iiTtWWfuOlcSOw8pxjeWhh1I9oAcbQ4qxhB7Np1EXG+Og==
 
 home-or-tmp@^2.0.0:
   version "2.0.0"