refactor: simplify state retrieval (ulic75#10)

DBT85 · May 2, 2022 · babdc7a · babdc7a
1 parent adf4d15
commit babdc7a
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 20 deletions.
diff --git a/src/power-distribution-card.ts b/src/power-distribution-card.ts
@@ -8,6 +8,7 @@ import {
   mdiBatteryLow,
   mdiBatteryMedium,
   mdiBatteryOutline,
+  mdiBatteryUnknown,
   mdiHome,
   mdiSolarPower,
   mdiTransmissionTower,
@@ -17,7 +18,7 @@ import { css, html, LitElement, svg, TemplateResult } from "lit";
 import { customElement, property, query, state } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
 import { PowerDistributionCardConfig } from "./power-distribution-card-config.js";
-import { roundValue } from "./utils.js";
+import { coerceNumber, roundValue } from "./utils.js";
 
 const CIRCLE_CIRCUMFERENCE = 238.76104;
 const MAX_FLOW_RATE = 6;
@@ -54,6 +55,11 @@ export class PowerDistributionCard extends LitElement {
     return max - (value / total) * (max - min);
   };
 
+  private getEntityState = (entity: string | undefined): number | null => {
+    if (entity === undefined) return null;
+    return coerceNumber(this.hass.states[entity].state, null);
+  };
+
   protected render(): TemplateResult {
     if (!this._config || !this.hass) {
       return html``;
@@ -63,25 +69,22 @@ export class PowerDistributionCard extends LitElement {
     const hasSolarProduction = this._config.entities.solar !== undefined;
     const hasReturnToGrid = true;
 
-    const batteryState = this._config.entities.battery
-      ? +this.hass.states[this._config.entities.battery].state
-      : 0;
-    const batteryChargeState = this._config.entities.battery_charge
-      ? +this.hass.states[this._config.entities.battery_charge].state
-      : 0;
-    const gridState = this._config.entities.grid
-      ? +this.hass.states[this._config.entities.grid].state
-      : 0;
-    const solarState = this._config.entities.solar
-      ? +this.hass.states[this._config.entities.solar].state
-      : 0;
+    const batteryState = this.getEntityState(this._config.entities.battery);
+    const batteryChargeState = this.getEntityState(
+      this._config.entities.battery_charge
+    );
+    const gridState = this.getEntityState(this._config.entities.grid);
+    const solarState = this.getEntityState(this._config.entities.solar);
 
-    const solarToGrid = roundValue(Math.abs(Math.min(gridState, 0)), 1);
-    const batteryToHome = roundValue(Math.max(batteryState, 0), 1);
-    const gridToHome = roundValue(Math.max(gridState, 0), 1);
-    const solarToBattery = roundValue(Math.abs(Math.min(batteryState, 0)), 1);
+    const solarToGrid = roundValue(Math.abs(Math.min(gridState ?? 0, 0)), 1);
+    const batteryToHome = roundValue(Math.max(batteryState ?? 0, 0), 1);
+    const gridToHome = roundValue(Math.max(gridState ?? 0, 0), 1);
+    const solarToBattery = roundValue(
+      Math.abs(Math.min(batteryState ?? 0, 0)),
+      1
+    );
     const solarToHome =
-      roundValue(solarState, 1) - solarToGrid - solarToBattery;
+      roundValue(solarState ?? 0, 1) - solarToGrid - solarToBattery;
 
     const homeConsumption = batteryToHome + gridToHome + solarToHome;
     const totalConsumption = homeConsumption + solarToBattery + solarToGrid;
@@ -101,7 +104,9 @@ export class PowerDistributionCard extends LitElement {
       CIRCLE_CIRCUMFERENCE * (gridToHome / homeConsumption);
 
     let batteryIcon = mdiBatteryHigh;
-    if (batteryChargeState <= 72 && batteryChargeState > 44) {
+    if (batteryChargeState === null) {
+      batteryIcon = mdiBatteryUnknown;
+    } else if (batteryChargeState <= 72 && batteryChargeState > 44) {
       batteryIcon = mdiBatteryMedium;
     } else if (batteryChargeState <= 44 && batteryChargeState > 16) {
       batteryIcon = mdiBatteryLow;
@@ -247,7 +252,7 @@ export class PowerDistributionCard extends LitElement {
               >
             </div>
           </div>
-          ${hasBattery
+          ${hasBattery && batteryChargeState !== null
             ? html`<div class="row">
                 <div class="spacer"></div>
                 <div class="circle-container battery">

diff --git a/src/utils.ts b/src/utils.ts
@@ -1,4 +1,19 @@
+/* eslint-disable no-redeclare */
+export function coerceNumber(value: any): number;
+export function coerceNumber<D>(value: any, fallback: D): number | D;
+export function coerceNumber(value: any, fallbackValue = 0) {
+  return _isNumberValue(value) ? Number(value) : fallbackValue;
+}
+
 export const roundValue = (value: number, decimalPlaces: number): number => {
   const factorOfTen = 10 ** decimalPlaces;
   return Math.round(value * factorOfTen) / factorOfTen;
 };
+
+export function _isNumberValue(value: any): boolean {
+  // parseFloat(value) handles most of the cases we're interested in (it treats null, empty string,
+  // and other non-number values as NaN, where Number just uses 0) but it considers the string
+  // '123hello' to be a valid number. Therefore we also check if Number(value) is NaN.
+  // eslint-disable-next-line no-restricted-globals
+  return !isNaN(parseFloat(value as any)) && !isNaN(Number(value));
+}