getting the firmware list so i know what to upgrade to, upgrade button won't display if firmwares are not yet loaded

src/device/UpgradeDevice.tsx

@@ -17,7 +17,7 @@ import {
 // import { createStyles, makeStyles, Theme } from "@material-ui/core/styles";
 import UpdateIcon from "@mui/icons-material/Update";
 import { useDeviceAPI, useFirmwareAPI, usePrevious, useSnackbar } from "hooks";
-import { Device, latestFirmwareVersion, Upgrade } from "models";
+import { Device, Firmware, latestFirmwareVersion, Upgrade } from "models";
 import moment from "moment";
 import { getContextKeys, getContextTypes } from "pbHelpers/Context";
 import { useGlobalState } from "providers";
@@ -50,14 +50,16 @@ export default function UpgradeDevice(props: Props) {
   const deviceAPI = useDeviceAPI();
   const { success, error } = useSnackbar();
   const firmwareAPI = useFirmwareAPI();
-  const [{ firmware }] = useGlobalState();
+  // const [{ firmware }] = useGlobalState();
-  const prevFirmware = usePrevious(firmware);
   const { device } = props;
   const prevDevice = usePrevious(device);
   const [open, setOpen] = useState<boolean>(false);
   const prevOpen = usePrevious(open);
   const [upgrade, setUpgrade] = useState<Upgrade>(Upgrade.create());
   const [gettingStatus, setGettingStatus] = useState(0);
+  const [firmware, setFirmware] = useState<Map<string, Firmware>>(new Map())
+  const [firmwareLoading, setFirmwareLoading] = useState(false)
+  const prevFirmware = usePrevious(firmware);
 
   const progress = useCallback(() => {
     return upgrade.status.progress;
@@ -75,11 +77,32 @@ export default function UpgradeDevice(props: Props) {
     );
   };
 
+  useEffect(() => {
+    if (firmwareLoading) return
+    // if (firmware.size > 0) return
+    setFirmwareLoading(true)
+    firmwareAPI.getAllLatestFirmware().then(resp => {
+      let versions: Map<string, Firmware> = new Map();
+      if (resp && resp.data && resp.data.firmware) {
+        resp.data.firmware.forEach((raw: any) => {
+          let firmware = Firmware.any(raw);
+          let key = firmware.settings.platform + ":" + firmware.settings.channel;
+          versions.set(key, firmware);
+        });
+      }
+      // dispatch({ key: "firmware", value: versions });
+      setFirmware(versions)
+    }).finally(() => {
+      setFirmwareLoading(false)
+    })
+  }, [])
+
   const upgradeVersion = () => {
     return upgrade.settings.version;
   };
 
   const available = () => {
+    if (firmware.size < 1) return false
     return currentFirmware() !== latestFirmware();
   };
 

src/models/Firmware.ts

@@ -8,6 +8,8 @@ export function latestFirmwareVersion(
   channel: pond.UpgradeChannel
 ): string {
   const firmware = versions.get(platform + ":" + channel);
+  // console.log(platform + ":" + channel)
+  // console.log(versions)
   if (firmware) {
     return firmware.settings.version;
   }