feat(ota): add a warning icon to OTA page for battery devices when battery is too low to safely run an update (#2478)

* feat: add a danger icon to OTA page for battery devices when battery is too low to run an update

* style: run pretty

* fix: replace red circle danger icon with yellow triangle warning one

---------

Co-authored-by: Ricc68 <ricc68@local>

Author: Ricc68

src/components/ota-page/index.tsx

@@ -13,6 +13,7 @@ import { ModelLink, OTALink, VendorLink } from '../vendor-links/vendor-links';
 import { useTranslation, WithTranslation, withTranslation } from 'react-i18next';
 import { Column } from 'react-table';
 import { Table } from '../grid/ReactTableCom';
+import PowerSourceOTA from '../power-source/powerSourceOTA';
 import cx from 'classnames';
 
 type OtaRowProps = {
@@ -59,6 +60,7 @@ const StateCell: FunctionComponent<OtaRowProps & OtaApi> = (props) => {
                     >
                         <i className={cx('fa', 'fa-clock')} />
                     </Button>
+                    <PowerSourceOTA device={device} deviceState={state} />
                 </div>
             );
         case 'scheduled':

src/components/power-source/powerSourceOTA.tsx

@@ -0,0 +1,54 @@
+import React, { Fragment, FunctionComponent } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Device, DeviceState } from '../../types';
+import style from './style.module.css';
+import type { PowerSource } from '../../types';
+
+interface PowerSourceOTAProps {
+    device?: Device;
+    deviceState?: DeviceState;
+}
+
+const PowerSourceOTA: FunctionComponent<PowerSourceOTAProps> = ({ device, deviceState, ...rest }) => {
+    const { t } = useTranslation('ota');
+    let source: PowerSource | undefined = undefined;
+
+    if (device !== undefined) {
+        source = device.power_source;
+    }
+
+    if (source !== 'Battery') {
+        return null;
+    }
+
+    let batteryPercent: number | undefined = undefined;
+    let batteryState: string | undefined = undefined;
+    let batteryLow: boolean | undefined = undefined;
+
+    if (deviceState !== undefined) {
+        if (deviceState?.battery !== undefined) {
+            batteryPercent = deviceState.battery as number;
+        }
+        if (deviceState?.battery_state !== undefined) {
+            batteryState = deviceState.battery_state as string;
+        }
+        if (deviceState?.battery_low !== undefined) {
+            batteryLow = deviceState.battery_low as boolean;
+        }
+    }
+
+    // Some devices do not use the standardized feature `battery` to report power level.
+    if (
+        (batteryPercent !== undefined && batteryPercent <= 50) ||
+        (batteryState !== undefined && batteryState === 'low') ||
+        (batteryLow !== undefined && batteryLow === true)
+    ) {
+        return (
+            <Fragment>
+                <i title={t('ota:battery_low_upd')} className="fa fa-triangle-exclamation text-warning ms-2" />
+            </Fragment>
+        );
+    }
+};
+
+export default PowerSourceOTA;

src/i18n/locales/en.json

@@ -2577,6 +2577,7 @@
     "touchlink": "Touchlink"
   },
   "ota": {
+    "battery_low_upd": "The firmware update may fail if the batteries are not replaced",
     "check": "Check for new updates",
     "check_all": "Check all",
     "empty_ota_message": "You don't have any devices that support OTA",

ws-messages/onConnect.json

@@ -1407,7 +1407,7 @@
                 },
                 "friendly_name": "0xbc33acfffe17628b",
                 "ieee_address": "0xbc33acfffe17628b",
-                "interview_state": "FAILED",
+                "interview_state": "SUCCESSFUL",
                 "manufacturer": "IKEA of Sweden",
                 "model_id": "TRADFRI on/off switch",
                 "network_address": 25249,
@@ -2010,7 +2010,7 @@
                             "value_on": true
                         }
                     ],
-                    "supports_ota": false,
+                    "supports_ota": true,
                     "vendor": "Xiaomi"
                 },
                 "endpoints": {
@@ -2327,7 +2327,7 @@
                             "type": "numeric"
                         }
                     ],
-                    "supports_ota": false,
+                    "supports_ota": true,
                     "vendor": "Xiaomi"
                 },
                 "endpoints": {
@@ -2596,7 +2596,7 @@
                             "type": "numeric"
                         }
                     ],
-                    "supports_ota": false,
+                    "supports_ota": true,
                     "vendor": "Xiaomi"
                 },
                 "endpoints": {
@@ -8652,7 +8652,7 @@
         "topic": "bridge/extensions"
     },
     {
-        "payload": "offline",
+        "payload": "online",
         "topic": "0xbc33acfffe17628b/availability"
     },
     {
@@ -8707,7 +8707,13 @@
     },
     {
         "payload": {
-            "last_seen": "2022-04-15T16:33:53+08:00"
+	    "battery": 45,
+            "last_seen": "2022-04-15T16:33:53+08:00",
+            "update": {
+                "installed_version": 65552,
+                "latest_version": 16777233,
+                "state": "available"
+	    }
         },
         "topic": "0xbc33acfffe17628b"
     },
@@ -8748,7 +8754,12 @@
             "battery": 100,
             "last_seen": "2022-05-16T20:46:44+08:00",
             "linkquality": 66,
-            "voltage": 3042
+            "voltage": 3042,
+            "update": {
+                "installed_version": 65552,
+                "latest_version": 16777233,
+                "state": "available"
+            }
         },
         "topic": "0x00158d000224154d"
     },
@@ -8780,12 +8791,17 @@
     },
     {
         "payload": {
-            "battery": 100,
+            "battery": 65,
             "humidity": 65.59,
             "last_seen": "2022-05-16T20:37:54+08:00",
             "linkquality": 90,
             "temperature": 25.84,
-            "voltage": 3035
+            "voltage": 3035,
+            "update": {
+                "installed_version": 65552,
+                "latest_version": 16777233,
+                "state": "available"
+            }
         },
         "topic": "livingroom/temp_humidity"
     },
@@ -8811,13 +8827,19 @@
     },
     {
         "payload": {
-            "battery": 0,
+            "battery": 5,
             "humidity": 59.96,
             "last_seen": "2022-05-16T21:06:04+08:00",
+            "state": "ON",
             "linkquality": 12,
             "pressure": 1009.8,
             "temperature": 32.9,
-            "voltage": 2815
+            "voltage": 2815,
+            "update": {
+                "installed_version": 65552,
+                "latest_version": 16777233,
+                "state": "available"
+            }
         },
         "topic": "0x00158d0004866f11"
     },