From 5f13300ba6261d49818947bb4ccfc9fb2face9c4 Mon Sep 17 00:00:00 2001
From: Saiyida Noor <saiyida.noorfatima@gmail.com>
Date: Wed, 6 Aug 2025 17:08:58 +0000
Subject: [PATCH 01/30] minor updates

---
 src/device/presets/devicePresetCard.tsx | 108 ++++++++---------
 src/pages/LibraCart.tsx                 |  80 ++++++-------
 src/providers/pond/devicePresetAPI.tsx  | 150 ++++++++++++++++++++++++
 src/providers/pond/pond.tsx             |   4 +-
 4 files changed, 247 insertions(+), 95 deletions(-)
 create mode 100644 src/providers/pond/devicePresetAPI.tsx

diff --git a/src/device/presets/devicePresetCard.tsx b/src/device/presets/devicePresetCard.tsx
index b01def2..2839df3 100644
--- a/src/device/presets/devicePresetCard.tsx
+++ b/src/device/presets/devicePresetCard.tsx
@@ -6,7 +6,7 @@ import {
   DialogActions,
   DialogContent,
   DialogTitle,
-  Grid,
+  Grid2 as Grid,
   InputAdornment,
   MenuItem,
   Slider,
@@ -19,7 +19,7 @@ import { DevicePreset } from "models/DevicePreset";
 import { ObjectTypeString } from "objects/ObjectDescriber";
 import { pond } from "protobuf-ts/pond";
 import { useSnackbar } from "providers";
-// import { useDevicePresetAPI } from "providers/pond/devicePresetAPI";
+import { useDevicePresetAPI } from "providers/pond/devicePresetAPI";
 import React, { useEffect, useState } from "react";
 import { getTemperatureUnit } from "utils";
 
@@ -43,7 +43,7 @@ export default function DevicePresetCard(props: Props) {
     removeCallback,
     updateCallback
   } = props;
-  // const devicePresetAPI = useDevicePresetAPI();
+  const devicePresetAPI = useDevicePresetAPI();
   const [presetName, setPresetName] = useState("");
   const [presetType, setPresetType] = useState<pond.PresetType>(1);
   const [controllerType, setControllerType] = useState<pond.ControllerType>(1);
@@ -81,22 +81,22 @@ export default function DevicePresetCard(props: Props) {
     p.settings.temperature = tempC;
     p.settings.humidity = hum;
 
-    // devicePresetAPI
-    //   .addDevicePreset(p.name, p.settings, objectKey, typestring)
-    //   .then(resp => {
-    //     //get the temp key from the preset
-    //     let temp = p.key;
-    //     //update the key in the preset with the key that came back from the add
-    //     p.key = resp.data.key;
-    //     //use the callback function passing in the preset and the temp key
-    //     if (addCallback) {
-    //       addCallback(p, temp);
-    //     }
-    //     openSnack("New preset saved");
-    //   })
-    //   .catch(err => {
-    //     openSnack("Failed to save new preset");
-    //   });
+    devicePresetAPI
+      .addDevicePreset(p.name, p.settings, objectKey, typestring)
+      .then(resp => {
+        //get the temp key from the preset
+        let temp = p.key;
+        //update the key in the preset with the key that came back from the add
+        p.key = resp.data.key;
+        //use the callback function passing in the preset and the temp key
+        if (addCallback) {
+          addCallback(p, temp);
+        }
+        openSnack("New preset saved");
+      })
+      .catch(err => {
+        openSnack("Failed to save new preset");
+      });
   };
 
   const updatePreset = () => {
@@ -108,32 +108,32 @@ export default function DevicePresetCard(props: Props) {
     newPreset.settings.temperature = tempC;
     newPreset.settings.humidity = hum;
 
-    // devicePresetAPI
-    //   .updateDevicePreset(newPreset.key, newPreset.name, newPreset.settings)
-    //   .then(resp => {
-    //     if (updateCallback) {
-    //       updateCallback(oldPreset, newPreset);
-    //     }
-    //     openSnack("Preset Updated");
-    //   })
-    //   .catch(err => {
-    //     openSnack("There was a problem updating the preset");
-    //   });
+    devicePresetAPI
+      .updateDevicePreset(newPreset.key, newPreset.name, newPreset.settings)
+      .then(resp => {
+        if (updateCallback) {
+          updateCallback(oldPreset, newPreset);
+        }
+        openSnack("Preset Updated");
+      })
+      .catch(err => {
+        openSnack("There was a problem updating the preset");
+      });
   };
 
   const removePreset = () => {
-    // devicePresetAPI
-    //   .removeDevicePreset(preset.key)
-    //   .then(resp => {
-    //     openSnack("Preset has been deleted");
-    //     setOpenDeleteConfirmation(false);
-    //     if (removeCallback) {
-    //       removeCallback(preset);
-    //     }
-    //   })
-    //   .catch(err => {
-    //     openSnack("There was a problem deleting this preset");
-    //   });
+    devicePresetAPI
+      .removeDevicePreset(preset.key)
+      .then(resp => {
+        openSnack("Preset has been deleted");
+        setOpenDeleteConfirmation(false);
+        if (removeCallback) {
+          removeCallback(preset);
+        }
+      })
+      .catch(err => {
+        openSnack("There was a problem deleting this preset");
+      });
   };
 
   const deleteConfirmation = () => {
@@ -192,7 +192,7 @@ export default function DevicePresetCard(props: Props) {
     <Card raised style={{ padding: 10, width: "100%" }}>
       {deleteConfirmation()}
       <Grid container direction="row" alignContent="center" alignItems="center">
-        <Grid item xs={12} sm={6}>
+        <Grid size={{xs:12, sm:6}}>
           <TextField
             variant="outlined"
             margin="normal"
@@ -203,7 +203,7 @@ export default function DevicePresetCard(props: Props) {
             }}
           />
         </Grid>
-        <Grid item xs={12} sm={6}>
+        <Grid size={{xs:12, sm:6}}>
           {presetType !== pond.PresetType.PRESET_TYPE_UNKNOWN &&
             controllerType !== pond.ControllerType.CONTROLLER_TYPE_UNKNOWN && (
               <Box paddingLeft={2}>
@@ -216,7 +216,7 @@ export default function DevicePresetCard(props: Props) {
               </Box>
             )}
         </Grid>
-        <Grid item xs={6}>
+        <Grid size={6}>
           {/* type */}
           <TextField
             style={{ width: "100%", marginRight: 5 }}
@@ -250,7 +250,7 @@ export default function DevicePresetCard(props: Props) {
             </MenuItem>
           </TextField>
         </Grid>
-        <Grid item xs={6}>
+        <Grid size={6}>
           {/* controller type */}
           <TextField
             style={{ width: "100%", marginLeft: 5 }}
@@ -281,7 +281,7 @@ export default function DevicePresetCard(props: Props) {
         </Grid>
         {/* temp slider */}
         {isMobile ? (
-          <Grid item xs={12}>
+          <Grid size={12}>
             <Box
               display="flex"
               alignContent="center"
@@ -338,10 +338,10 @@ export default function DevicePresetCard(props: Props) {
           </Grid>
         ) : (
           <React.Fragment>
-            <Grid item xs={2}>
+            <Grid size={2}>
               <Typography>Temperature</Typography>
             </Grid>
-            <Grid item xs={7}>
+            <Grid size={7}>
               <Box paddingRight={2}>
                 <Slider
                   //orientation="vertical"
@@ -362,7 +362,7 @@ export default function DevicePresetCard(props: Props) {
                 />
               </Box>
             </Grid>
-            <Grid item xs={3}>
+            <Grid size={3}>
               <TextField
                 style={{ width: "100%" }}
                 margin="dense"
@@ -395,7 +395,7 @@ export default function DevicePresetCard(props: Props) {
         )}
         {/* humidity slider */}
         {isMobile ? (
-          <Grid item xs={12}>
+          <Grid size={12}>
             <Box
               display="flex"
               alignContent="center"
@@ -437,10 +437,10 @@ export default function DevicePresetCard(props: Props) {
           </Grid>
         ) : (
           <React.Fragment>
-            <Grid item xs={2}>
+            <Grid size={2}>
               <Typography>Humidity</Typography>
             </Grid>
-            <Grid item xs={7}>
+            <Grid size={7}>
               <Box paddingRight={2}>
                 <Slider
                   //orientation="vertical"
@@ -456,7 +456,7 @@ export default function DevicePresetCard(props: Props) {
                 />
               </Box>
             </Grid>
-            <Grid item xs={3}>
+            <Grid size={3}>
               <TextField
                 style={{ width: "100%" }}
                 margin="dense"
diff --git a/src/pages/LibraCart.tsx b/src/pages/LibraCart.tsx
index 5fc06eb..90f47b0 100644
--- a/src/pages/LibraCart.tsx
+++ b/src/pages/LibraCart.tsx
@@ -32,9 +32,9 @@ export default function LibraCart() {
     libracartAPI
       .listAccounts(0, 0, as)
       .then(resp => {
-        let tempOrgs: Map<string, pond.JDAccount> = new Map();
+        let tempOrgs: Map<string, pond.LibraCartAccount> = new Map();
         resp.data.accounts.forEach(org => {
-          let organization = pond.JDAccount.fromObject(org);
+          let organization = pond.LibraCartAccount.fromObject(org);
           tempOrgs.set(organization.key, organization);
         });
         setOrganizations(tempOrgs);
@@ -70,40 +70,40 @@ export default function LibraCart() {
     });
   };
 
-  const fieldOptions = () => {
-    return (
-      <React.Fragment>
-        <Accordion
-          expanded={fieldAccordion}
-          onChange={(_, expanded) => {
-            setFieldAccordion(expanded);
-          }}>
-          <AccordionSummary expandIcon={<ExpandMore />}>Field Data</AccordionSummary>
-          <AccordionDetails>
-            <Grid container direction="row" spacing={2} alignItems="center" alignContent="center">
-              <Grid size={6}>
-                <FormControlLabel
-                  label="Field Boundaries"
-                  control={
-                    <Checkbox
-                      checked={dataOptions.includes(pond.DataOption.DATA_OPTION_FIELDS)}
-                      onChange={(_, checked) => {
-                        //setFields(!fields);
-                        updateOrgData(checked, pond.DataOption.DATA_OPTION_FIELDS);
-                      }}
-                    />
-                  }
-                />
-              </Grid>
-              <Grid size={6}>
-                View your data from Libra Cart on your visual Farm
-              </Grid>
-            </Grid>
-          </AccordionDetails>
-        </Accordion>
-      </React.Fragment>
-    );
-  };
+  // const fieldOptions = () => {
+  //   return (
+  //     <React.Fragment>
+  //       <Accordion
+  //         expanded={fieldAccordion}
+  //         onChange={(_, expanded) => {
+  //           setFieldAccordion(expanded);
+  //         }}>
+  //         <AccordionSummary expandIcon={<ExpandMore />}>Field Data</AccordionSummary>
+  //         <AccordionDetails>
+  //           <Grid container direction="row" spacing={2} alignItems="center" alignContent="center">
+  //             <Grid size={6}>
+  //               <FormControlLabel
+  //                 label="Field Boundaries"
+  //                 control={
+  //                   <Checkbox
+  //                     checked={dataOptions.includes(pond.DataOption.DATA_OPTION_FIELDS)}
+  //                     onChange={(_, checked) => {
+  //                       //setFields(!fields);
+  //                       updateOrgData(checked, pond.DataOption.DATA_OPTION_FIELDS);
+  //                     }}
+  //                   />
+  //                 }
+  //               />
+  //             </Grid>
+  //             <Grid size={6}>
+  //               View your data from Libra Cart 
+  //             </Grid>
+  //           </Grid>
+  //         </AccordionDetails>
+  //       </Accordion>
+  //     </React.Fragment>
+  //   );
+  // };
   return (
     <PageContainer>
       <LibraCartAccess />
@@ -117,7 +117,7 @@ export default function LibraCart() {
         <Grid>
           <Select
             //style={{ maxWidth: 110 }}
-            title="John Deer Account"
+            title="LibraCart Account"
             displayEmpty
             disableUnderline={true}
             value={currentOrg}
@@ -136,13 +136,13 @@ export default function LibraCart() {
             })}
           </Select>
         </Grid>
-        <Grid>
+        {/* <Grid>
           <Button onClick={submit} variant="contained" color="primary">
             Update
           </Button>
-        </Grid>
+        </Grid> */}
       </Grid>
-      <Box style={{ padding: 10 }}>{fieldOptions()}</Box>
+      {/* <Box style={{ padding: 10 }}>{fieldOptions()}</Box> */}
     </PageContainer>
   );
 }
diff --git a/src/providers/pond/devicePresetAPI.tsx b/src/providers/pond/devicePresetAPI.tsx
new file mode 100644
index 0000000..e24d97c
--- /dev/null
+++ b/src/providers/pond/devicePresetAPI.tsx
@@ -0,0 +1,150 @@
+import { useHTTP } from "hooks";
+import { createContext, PropsWithChildren, useContext } from "react";
+import { pond } from "protobuf-ts/pond";
+import { pondURL } from "./pond";
+import { AxiosResponse } from "axios";
+import { useGlobalState } from "providers";
+
+export interface IDevicePresetInterface {
+  //add
+  addDevicePreset: (
+    name: string,
+    settings: pond.DevicePresetSettings,
+    parentKey?: string,
+    parentTypes?: string
+  ) => Promise<AxiosResponse<pond.AddDevicePresetResponse>>;
+  //list
+  listDevicePresets: (
+    limit: number,
+    offset: number,
+    order?: "asc" | "desc",
+    orderBy?: string,
+    search?: string,
+    keys?: string[],
+    types?: string[]
+  ) => Promise<AxiosResponse<pond.ListDevicePresetResponse>>;
+  //update
+  updateDevicePreset: (
+    key: string,
+    name: string,
+    settings: pond.DevicePresetSettings
+  ) => Promise<AxiosResponse<pond.UpdateDevicePresetResponse>>;
+
+  //remove
+  removeDevicePreset: (key: string) => Promise<AxiosResponse<pond.DeleteDevicePresetResponse>>;
+
+  //get
+  getDevicePreset: (key: string) => Promise<AxiosResponse<pond.GetDevicePresetResponse>>;
+}
+
+export const DevicePresetAPIcontext = createContext<IDevicePresetInterface>(
+  {} as IDevicePresetInterface
+);
+
+interface Props {}
+
+export default function DevicePresetProvider(props: PropsWithChildren<Props>) {
+  const { children } = props;
+  const { get, del, post, put } = useHTTP();
+  const [{ as }] = useGlobalState();
+
+  //add
+  const addDevicePreset = (
+    name: string,
+    settings: pond.DevicePresetSettings,
+    parentKey?: string,
+    parentType?: string
+  ) => {
+    let key = "";
+    let type = "";
+    if (parentKey && parentType) {
+      key = "&parentKey=" + parentKey;
+      type = "&parentType=" + parentType;
+    }
+    if (as) {
+      return post<pond.AddDevicePresetResponse>(
+        pondURL("/devicePreset?name=" + name + "&as=" + as + key + type),
+        settings
+      );
+    }
+    return post<pond.AddDevicePresetResponse>(
+      pondURL("/devicePreset?name=" + name + key + type),
+      settings
+    );
+  };
+  //list
+  const listDevicePresets = (
+    limit: number,
+    offset: number,
+    order?: "asc" | "desc",
+    orderBy?: string,
+    search?: string,
+    keys?: string[],
+    types?: string[]
+  ) => {
+    let asText = "";
+    if (as) asText = "&as=" + as;
+    return get<pond.ListDevicePresetResponse>(
+      pondURL(
+        "/devicePresets?limit=" +
+          limit +
+          "&offset=" +
+          offset +
+          ("&order=" + (order ? order : "asc")) +
+          ("&by=" + (orderBy ? orderBy : "key")) +
+          (search ? "&search=" + search : "") +
+          (keys ? "&keys=" + keys.toString() : "") +
+          (types ? "&types=" + types.toString() : "") +
+          asText
+      )
+    );
+  };
+  //update
+  const updateDevicePreset = (key: string, name: string, settings: pond.DevicePresetSettings) => {
+    if (as) {
+      return put<pond.UpdateDevicePresetResponse>(
+        pondURL("/devicePreset/" + key + "?as=" + as + "&name=" + name),
+        settings
+      );
+    }
+    return put<pond.UpdateDevicePresetResponse>(
+      pondURL("/devicePreset/" + key + "?name=" + name),
+      settings
+    );
+  };
+
+  //remove
+  const removeDevicePreset = (key: string) => {
+    if (as) {
+      return del<pond.DeleteDevicePresetResponse>(pondURL("/devicePreset/" + key + "?as=" + as));
+    }
+    return del<pond.DeleteDevicePresetResponse>(pondURL("/devicePreset/" + key + "?as=" + as));
+  };
+
+  //get
+  const getDevicePreset = (key: string) => {
+    if (as) {
+      return del<pond.GetDevicePresetResponse>(pondURL("/devicePreset/" + key + "?as=" + as));
+    }
+    return del<pond.GetDevicePresetResponse>(pondURL("/devicePreset/" + key + "?as=" + as));
+  };
+  return (
+    <DevicePresetAPIcontext.Provider
+      value={{
+        //add
+        addDevicePreset,
+        //list
+        listDevicePresets,
+        //update
+        updateDevicePreset,
+        //remove
+        removeDevicePreset,
+        //get
+        getDevicePreset
+      }}>
+      {children}
+    </DevicePresetAPIcontext.Provider>
+  );
+}
+
+export const useDevicePresetAPI = () => useContext(DevicePresetAPIcontext);
diff --git a/src/providers/pond/pond.tsx b/src/providers/pond/pond.tsx
index 0efc34d..2fd7a3b 100644
--- a/src/providers/pond/pond.tsx
+++ b/src/providers/pond/pond.tsx
@@ -37,6 +37,7 @@ import KeyManagerProvider, { useKeyManagerAPI } from "./keyManagerAPI";
 import JohnDeereProvider, { useJohnDeereProxyAPI } from "./johnDeereProxyAPI";
 import LibraCartProvider, { useLibraCartProxyAPI } from "./libracartProxyAPI";
 import CNHiProvider, { useCNHiProxyAPI } from "./cnhiProxyAPI";
+import DevicePresetProvider, { useDevicePresetAPI } from "./devicePresetAPI";
 // import NoteProvider from "providers/noteAPI";
 
 export const pondURL = (partial: string, demo: boolean = false): string => {
@@ -167,5 +168,6 @@ export {
   useKeyManagerAPI,
   useJohnDeereProxyAPI,
   useCNHiProxyAPI,
-  useLibraCartProxyAPI
+  useLibraCartProxyAPI,
+  useDevicePresetAPI
 };

From efc6fb4014d275410909d1ca343c1d441ee06068 Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Wed, 13 Aug 2025 10:21:25 -0600
Subject: [PATCH 02/30] making sure to use the dev protobuf

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index b89d4cd..a7f0400 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -42,7 +42,7 @@
         "mui-tel-input": "^7.0.0",
         "notistack": "^3.0.1",
         "openweathermap-ts": "^1.2.10",
-        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#libracart",
+        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#dev",
         "query-string": "^9.2.1",
         "react": "^18.3.1",
         "react-beautiful-dnd": "^13.1.1",
@@ -10911,7 +10911,7 @@
     },
     "node_modules/protobuf-ts": {
       "version": "1.0.0",
-      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#c68c727be5b1076bbb534996a13d5e3285c6ca68",
+      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#27131a61e101761d17d533bcf3d68c68d53e5860",
       "dependencies": {
         "protobufjs": "^6.8.8"
       }
diff --git a/package.json b/package.json
index 89efa4d..88ba7d0 100644
--- a/package.json
+++ b/package.json
@@ -54,7 +54,7 @@
     "mui-tel-input": "^7.0.0",
     "notistack": "^3.0.1",
     "openweathermap-ts": "^1.2.10",
-    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#libracart",
+    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#dev",
     "query-string": "^9.2.1",
     "react": "^18.3.1",
     "react-beautiful-dnd": "^13.1.1",

From 4115495f651bdb8fd374a106c61c80a6b5eac64e Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Wed, 20 Aug 2025 16:05:41 -0600
Subject: [PATCH 03/30] expanding the json so the new scd30 co2 subtype has the
 modes in it

---
 src/component/ComponentMode.json | 39 ++++++++++++++++++++++++++++++++
 1 file changed, 39 insertions(+)

diff --git a/src/component/ComponentMode.json b/src/component/ComponentMode.json
index 16cea43..2c66a6e 100644
--- a/src/component/ComponentMode.json
+++ b/src/component/ComponentMode.json
@@ -38,6 +38,45 @@
       ]
     }
   },
+  {
+    "type": 12,
+    "subtype": 1,
+    "mode": {
+      "labelA": "Power Mode",
+      "entryA": "select",
+      "dictionaryA": [
+        {
+          "key": "High Power",
+          "value": 1,
+          "restricted": false
+        },
+        {
+          "key": "Low Power",
+          "value": 2,
+          "restricted": false
+        },
+        {
+          "key": "Calibration",
+          "value": 3,
+          "restricted": true
+        }
+      ],
+      "labelB": "Number of Averages",
+      "entryB": "number",
+      "dictionaryB": [
+        {
+          "key": "min",
+          "value": 1,
+          "restricted": false
+        },
+        {
+          "key": "max",
+          "value": 8,
+          "restricted": false
+        }
+      ]
+    }
+  },
   {
     "type": 28,
     "subtype": 0,

From 78e51ac797bda119cc98984e7049f956f08d345a Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Wed, 27 Aug 2025 16:58:49 -0600
Subject: [PATCH 04/30] fixed issue where the scan card would not appear if you
 navigate to the device page by any way other than the devices table

---
 src/pages/Device.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/Device.tsx b/src/pages/Device.tsx
index a06a173..4d7d41f 100644
--- a/src/pages/Device.tsx
+++ b/src/pages/Device.tsx
@@ -167,7 +167,7 @@ export default function DevicePage() {
   }
 
   const loadPortScan = () => {
-    deviceAPI.listFoundComponents(device.id())
+    deviceAPI.listFoundComponents(parseInt(deviceID))
       .then(resp => {
         if (resp.data.foundComponents?.i2c){
           setScannedAddresses(resp.data.foundComponents ?? undefined)

From 732b3d2ab0bc5d32dde928d3237a1ecea951d34f Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Thu, 28 Aug 2025 11:58:51 -0600
Subject: [PATCH 05/30] fixing the i2c sensors card erroring out when coming
 back to the page from support view

---
 src/device/autoDetect/DeviceScannedComponents.tsx | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/device/autoDetect/DeviceScannedComponents.tsx b/src/device/autoDetect/DeviceScannedComponents.tsx
index b4e0c9f..fbc046e 100644
--- a/src/device/autoDetect/DeviceScannedComponents.tsx
+++ b/src/device/autoDetect/DeviceScannedComponents.tsx
@@ -226,9 +226,7 @@ export default function DeviceScannedComponents(props: Props){
             <Button variant="contained" color="primary" onClick={()=>{removeScan(scannedI2C.key)}}>Clear Scan</Button>
           </Box>
           {validCompAddresses.length > 0 ? validCompAddresses.map((addr, index) => {
-            return (
-              <ScannedI2C key={index} sensorNum={index+1} addressData={addr} deviceProduct={device.settings.product} componentSelectionCallback={componentSelection} availablePositions={availablePositions.get(quack.AddressType.ADDRESS_TYPE_I2C) ?? []}/>
-            )
+              return <ScannedI2C key={index} sensorNum={index+1} addressData={addr} deviceProduct={device.settings.product} componentSelectionCallback={componentSelection} availablePositions={availablePositions.get(quack.AddressType.ADDRESS_TYPE_I2C) ?? new Map<quack.ComponentType, number[]>()}/>
           }) :
             <Box sx={{
               margin: 1,

From 58bbf07690317c8086a33db1e1870dbfefec5679 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Wed, 15 Oct 2025 13:40:13 -0600
Subject: [PATCH 06/30] thing

---
 nginx.conf | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/nginx.conf b/nginx.conf
index 1537b32..4411199 100644
--- a/nginx.conf
+++ b/nginx.conf
@@ -78,18 +78,18 @@ http {
         }
 
         # Redirect old /index.html requests to new file
-        location = /index.html {
-            return 301 /indexV2.html;
-        }
+        # location = /index.html {
+        #     return 301 /indexV2.html;
+        # }
 
         # Serve indexV2.html directly without redirect loop
-        location = /indexV2.html {
+        location = /index.html {
             root /usr/share/nginx/html;
         }
 
         # Fallback for SPA routing — all unmatched routes go to indexV2.html
         location / {
-            try_files $uri /indexV2.html;
+            try_files $uri /index.html;
         }
     }
 

From cd95f011424f935b95811f111da02e7cbabde333 Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Mon, 20 Oct 2025 14:15:38 -0600
Subject: [PATCH 07/30] getting the drager components that are using I2C to use
 the expander and not the cable id

---
 src/component/ComponentSettings.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/component/ComponentSettings.tsx b/src/component/ComponentSettings.tsx
index 44aef71..db0e5ad 100644
--- a/src/component/ComponentSettings.tsx
+++ b/src/component/ComponentSettings.tsx
@@ -518,7 +518,8 @@ export default function ComponentSettings(props: Props) {
   }
 
   const supportsExpansion = () => {
-    return (formComponent.settings.type === quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE &&
+    return ((formComponent.settings.type === quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE ||
+            formComponent.settings.type === quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE) &&
             formComponent.settings.addressType === quack.AddressType.ADDRESS_TYPE_I2C)
   }
 

From de526ddeb4ba6c7d8471551ca9ac82f1dfaca84d Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Tue, 28 Oct 2025 09:26:46 -0600
Subject: [PATCH 08/30] fix for drager voltage when it is an o2 subtype showing
 incorrectly on the chart

---
 src/pbHelpers/ComponentTypes/DragerGasDongle.ts | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/pbHelpers/ComponentTypes/DragerGasDongle.ts b/src/pbHelpers/ComponentTypes/DragerGasDongle.ts
index bec3b1e..14fcf9d 100644
--- a/src/pbHelpers/ComponentTypes/DragerGasDongle.ts
+++ b/src/pbHelpers/ComponentTypes/DragerGasDongle.ts
@@ -170,6 +170,7 @@ export function dragerGasDongle(subtype: number = 0): ComponentTypeExtension {
         let firstTime: Moment | undefined;
         let lastTime: Moment | undefined;
         let valMap: Map<number, number[]> = new Map<number, number[]>();
+        if(measurement.type === quack.MeasurementType.MEASUREMENT_TYPE_PPM){
         measurement.values.forEach((vals, i) => {
           let avgVals: Point[] = [];
           let newLineData: LineData = {
@@ -205,6 +206,14 @@ export function dragerGasDongle(subtype: number = 0): ComponentTypeExtension {
             valMap = new Map<number, number[]>();
           }
         });
+        } else {
+          chartData = simpleLineChartData(
+            quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE,
+            measurement,
+            smoothingAverages,
+            filters
+          );
+        }
       } else {
         chartData = simpleLineChartData(
           quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE,
@@ -212,6 +221,7 @@ export function dragerGasDongle(subtype: number = 0): ComponentTypeExtension {
           smoothingAverages,
           filters
         );
+        console.log(chartData)
       }
       return chartData;
     },

From 3825d56aff3912be6852b08c314a9fbf3f7c885e Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Tue, 28 Oct 2025 09:34:40 -0600
Subject: [PATCH 09/30] fix for the mV decimals on drager sensors, there
 shouldn't be any

---
 src/pbHelpers/MeasurementDescriber.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/pbHelpers/MeasurementDescriber.ts b/src/pbHelpers/MeasurementDescriber.ts
index 1fc2751..790b9a9 100644
--- a/src/pbHelpers/MeasurementDescriber.ts
+++ b/src/pbHelpers/MeasurementDescriber.ts
@@ -176,6 +176,7 @@ export class MeasurementDescriber {
           this.details.unit = "mV";
           this.details.graph = GraphType.MULTILINE;
           this.details.unit = "mV";
+          this.details.decimals = 0
           // this.details.nodeDetails = {
           //   colours: ["white", "black", "red", "blue"],
           //   labels: ["millivolt1", "millivolt2", "millivolt3", "millivolt4"]

From d255f6ada65e4f445a51bafdef57d5e568c9b994 Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Thu, 20 Nov 2025 10:29:13 -0600
Subject: [PATCH 10/30] changing the firmware version to 10 since 9 will now be
 for increasing the max conditions on interactions to 4

---
 src/models/Device.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/models/Device.ts b/src/models/Device.ts
index 1284d1b..115f199 100644
--- a/src/models/Device.ts
+++ b/src/models/Device.ts
@@ -73,11 +73,11 @@ const featureVersions: Map<string, FeatureVersionByPlatform> = new Map([
       v2Cell: "N/A",
       v2WifiS3: "N/A",
       v2CellS3: "N/A",
-      v2CellBlack: "2.1.9",
+      v2CellBlack: "2.1.10",
       v2CellGreen: "N/A",
-      v2WifiBlue: "2.1.9",
-      v2CellBlue: "2.1.9",
-      v2EthBlue: "2.1.9"
+      v2WifiBlue: "2.1.10",
+      v2CellBlue: "2.1.10",
+      v2EthBlue: "2.1.10"
     }
   ]
 ]);

From b18b84f83cdecfb388c24dcbfd4fabeed3969d20 Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Thu, 20 Nov 2025 11:26:26 -0600
Subject: [PATCH 11/30] missed the actual adding of the condition logic

---
 src/interactions/InteractionSettings.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/interactions/InteractionSettings.tsx b/src/interactions/InteractionSettings.tsx
index 2519669..87bdf98 100644
--- a/src/interactions/InteractionSettings.tsx
+++ b/src/interactions/InteractionSettings.tsx
@@ -357,7 +357,7 @@ export default function InteractionSettings(props: Props) {
   const addCondition = () => {
     let updatedInteraction = Interaction.clone(interaction);
     let updatedRawConditionValues = rawConditionValues;
-    if (numConditions < 2 && interaction.settings.source) {
+    if (numConditions < device.maxConditions() && interaction.settings.source) {
       let condition = pond.InteractionCondition.create();
       condition.measurementType = getMeasurements(
         interaction.settings.source.type

From 971355d4246a288f9294261924a2646489f5e1cc Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Fri, 19 Dec 2025 13:34:10 -0600
Subject: [PATCH 12/30] set up the new component for temp humidity

---
 package-lock.json                            |  4 +-
 package.json                                 |  2 +-
 src/pbHelpers/ComponentType.tsx              |  4 +-
 src/pbHelpers/ComponentTypes/TempHumidity.ts | 85 ++++++++++++++++++++
 src/pbHelpers/DeviceAvailability.ts          |  3 +-
 src/products/Bindapt/BindaptAvailability.ts  |  7 +-
 6 files changed, 98 insertions(+), 7 deletions(-)
 create mode 100644 src/pbHelpers/ComponentTypes/TempHumidity.ts

diff --git a/package-lock.json b/package-lock.json
index 0e25c26..91402d2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -42,7 +42,7 @@
         "mui-tel-input": "^7.0.0",
         "notistack": "^3.0.1",
         "openweathermap-ts": "^1.2.10",
-        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#staging",
+        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#hdc302_component",
         "query-string": "^9.2.1",
         "react": "^18.3.1",
         "react-beautiful-dnd": "^13.1.1",
@@ -10953,7 +10953,7 @@
     },
     "node_modules/protobuf-ts": {
       "version": "1.0.0",
-      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#3f647071f211c4552c2acc23a8ecabb6904a4156",
+      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#fd7268ad8f3bea8e6aa7f27104dcd8ccdf52de62",
       "dependencies": {
         "protobufjs": "^6.8.8"
       }
diff --git a/package.json b/package.json
index fc7a1ac..3520428 100644
--- a/package.json
+++ b/package.json
@@ -54,7 +54,7 @@
     "mui-tel-input": "^7.0.0",
     "notistack": "^3.0.1",
     "openweathermap-ts": "^1.2.10",
-    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#staging",
+    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#hdc302_component",
     "query-string": "^9.2.1",
     "react": "^18.3.1",
     "react-beautiful-dnd": "^13.1.1",
diff --git a/src/pbHelpers/ComponentType.tsx b/src/pbHelpers/ComponentType.tsx
index 03be638..25a0440 100644
--- a/src/pbHelpers/ComponentType.tsx
+++ b/src/pbHelpers/ComponentType.tsx
@@ -60,6 +60,7 @@ import { LineData, Point } from "charts/measurementCharts/MultiLineGraph";
 import moment, { Moment } from "moment";
 import { avg } from "utils";
 import { Airflow } from "./ComponentTypes/Airflow";
+import { TempHumidity } from "./ComponentTypes/TempHumidity";
 
 const COMPONENT_TYPE_MAP = new Map<quack.ComponentType, Function>([
   [quack.ComponentType.COMPONENT_TYPE_INVALID, Invalid],
@@ -96,7 +97,8 @@ const COMPONENT_TYPE_MAP = new Map<quack.ComponentType, Function>([
   [quack.ComponentType.COMPONENT_TYPE_SEN5X, Sen5x],
   [quack.ComponentType.COMPONENT_TYPE_VIBRATION_CHAIN, VibrationCable],
   [quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE, dragerGasDongle],
-  [quack.ComponentType.COMPONENT_TYPE_AIRFLOW, Airflow]
+  [quack.ComponentType.COMPONENT_TYPE_AIRFLOW, Airflow],
+  [quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY, TempHumidity]
 ]);
 
 export interface Subtype {
diff --git a/src/pbHelpers/ComponentTypes/TempHumidity.ts b/src/pbHelpers/ComponentTypes/TempHumidity.ts
new file mode 100644
index 0000000..50542ed
--- /dev/null
+++ b/src/pbHelpers/ComponentTypes/TempHumidity.ts
@@ -0,0 +1,85 @@
+import TemperatureHumidityDarkIcon from "assets/components/temperatureHumidityDark.png";
+import TemperatureHumidityLightIcon from "assets/components/temperatureHumidityLight.png";
+import { convertedUnitMeasurement } from "models/UnitMeasurement";
+import {
+  AreaChartData,
+  ComponentTypeExtension,
+  GraphFilters,
+  LineChartData,
+  simpleAreaChartData,
+  simpleLineChartData,
+  simpleMeasurements,
+  simpleSummaries,
+  Summary,
+  unitMeasurementSummaries
+} from "pbHelpers/ComponentType";
+import { describeMeasurement } from "pbHelpers/MeasurementDescriber";
+import { pond } from "protobuf-ts/pond";
+import { quack } from "protobuf-ts/quack";
+
+export function TempHumidity(subtype: number = 0): ComponentTypeExtension {
+  let temperature = describeMeasurement(
+    quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE,
+    quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY,
+    subtype
+  );
+  let humidity = describeMeasurement(
+    quack.MeasurementType.MEASUREMENT_TYPE_PERCENT,
+    quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY,
+    subtype
+  );
+  return {
+    type: quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY,
+    subtypes: [
+      {
+        key: quack.TempHumiditySubtype.TEMP_HUMIDITY_SUBTYPE_HDC302,
+        value: "TEMP_HUMIDITY_SUBTYPE_HDC302",
+        friendlyName: "HDC302"
+      }
+    ],
+    friendlyName: "Temperature/Humidity",
+    description: "Measures the temperature and humidity",
+    isController: false,
+    isSource: true,
+    isCalibratable: true,
+    addressTypes: [quack.AddressType.ADDRESS_TYPE_I2C],
+    interactionResultTypes: [],
+    states: [],
+    measurements: simpleMeasurements(temperature, humidity),
+    measurementSummary: async function(measurement: quack.Measurement): Promise<Array<Summary>> {
+      return simpleSummaries(measurement, temperature, humidity);
+    },
+    unitMeasurementSummary: (
+      measurements: convertedUnitMeasurement
+    ): Summary[] => {
+      return unitMeasurementSummaries(
+        measurements,
+        quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY,
+        subtype
+      );
+    },
+    areaChartData: (
+      measurement: pond.UnitMeasurementsForComponent,
+      smoothingAverages?: number,
+      filters?: GraphFilters
+    ): AreaChartData => {
+      return simpleAreaChartData(measurement, smoothingAverages, filters);
+    },
+    lineChartData: (
+      measurement: pond.UnitMeasurementsForComponent,
+      smoothingAverages?: number,
+      filters?: GraphFilters
+    ): LineChartData => {
+      return simpleLineChartData(
+        quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY,
+        measurement,
+        smoothingAverages,
+        filters
+      );
+    },
+    minMeasurementPeriodMs: 1000,
+    icon: (theme?: "light" | "dark"): string | undefined => {
+      return theme === "light" ? TemperatureHumidityDarkIcon : TemperatureHumidityLightIcon;
+    }
+  };
+}
diff --git a/src/pbHelpers/DeviceAvailability.ts b/src/pbHelpers/DeviceAvailability.ts
index 972c2e2..6ade54b 100644
--- a/src/pbHelpers/DeviceAvailability.ts
+++ b/src/pbHelpers/DeviceAvailability.ts
@@ -64,7 +64,8 @@ const DefaultAvailability: DeviceAvailabilityMap = new Map<quack.AddressType, De
       [quack.ComponentType.COMPONENT_TYPE_SEN5X, [0x69]],
       [quack.ComponentType.COMPONENT_TYPE_AIRFLOW, [0x6c]],
       [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]], // the address cables will use when they are plugged into the expander with V2 device only
-      [quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE, [0x6d]] 
+      [quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE, [0x6d]],
+      [quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY, [0x44]]
     ])
   ],
   [quack.AddressType.ADDRESS_TYPE_DAC, [0, 1]],
diff --git a/src/products/Bindapt/BindaptAvailability.ts b/src/products/Bindapt/BindaptAvailability.ts
index 89b3a47..2c0ce20 100644
--- a/src/products/Bindapt/BindaptAvailability.ts
+++ b/src/products/Bindapt/BindaptAvailability.ts
@@ -252,7 +252,9 @@ export const BindaptV2MonitorAvailability: DeviceAvailabilityMap = new Map<
       [quack.ComponentType.COMPONENT_TYPE_LIDAR, [0x62, 0x66, 0x10]],
       [quack.ComponentType.COMPONENT_TYPE_CO2, [0x61]],
       [quack.ComponentType.COMPONENT_TYPE_SEN5X, [0x69]],
-      [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]]
+      [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]],
+      [quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY, [0x44]]
+      
     ])
   ],
   [quack.AddressType.ADDRESS_TYPE_POWER, [0]],
@@ -285,7 +287,8 @@ export const BindaptV2AutomateAvailability: DeviceAvailabilityMap = new Map<
       [quack.ComponentType.COMPONENT_TYPE_LIDAR, [0x62, 0x66, 0x10]],
       [quack.ComponentType.COMPONENT_TYPE_CO2, [0x61]],
       [quack.ComponentType.COMPONENT_TYPE_SEN5X, [0x69]],
-      [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]]
+      [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]],      
+      [quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY, [0x44]]
     ])
   ],
   [quack.AddressType.ADDRESS_TYPE_POWER, [0]],

From da1c7af92909260f3ff08f9806009f1ed4795a24 Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Fri, 19 Dec 2025 13:40:56 -0600
Subject: [PATCH 13/30] set the offset for the temp humidity address

---
 src/pbHelpers/AddressTypes/I2C.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/pbHelpers/AddressTypes/I2C.ts b/src/pbHelpers/AddressTypes/I2C.ts
index b6bf585..d2f1733 100644
--- a/src/pbHelpers/AddressTypes/I2C.ts
+++ b/src/pbHelpers/AddressTypes/I2C.ts
@@ -18,7 +18,8 @@ export const I2C: AddressTypeExtension = {
       [quack.ComponentType.COMPONENT_TYPE_SEN5X, 0x68],
       [quack.ComponentType.COMPONENT_TYPE_AIRFLOW, 0x6b],
       [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, 0x70],
-      [quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE, 0x6c]
+      [quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE, 0x6c],
+      [quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY, 0x43]
     ]);
 
     const offset = offsets.get(componentType);

From c7c2625347887fa2dc789c24b1c4338509ffc998 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Fri, 16 Jan 2026 15:49:48 -0600
Subject: [PATCH 14/30] removing default conf file to prevent nginx issues

---
 Dockerfile | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/Dockerfile b/Dockerfile
index 47331d2..223e9d0 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,5 +1,6 @@
 # Used in the build stage of the pipeline to create a frontend docker image
 
 FROM nginx:alpine
+RUN rm /etc/nginx/conf.d/default.conf
 COPY nginx.conf /etc/nginx/nginx.conf
-COPY /build /usr/share/nginx/html
+COPY /build /usr/share/nginx/html
\ No newline at end of file

From 551d9d0810091b0908ebae3dd1906459cb879d8c Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Fri, 16 Jan 2026 16:55:00 -0600
Subject: [PATCH 15/30] got rid of indexv2 in vite config

---
 vite.config.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/vite.config.ts b/vite.config.ts
index acc8cb4..846e8b7 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -17,7 +17,7 @@ export default defineConfig({
         globPatterns: ['**/*.{js,css,html,png,jpg,svg}'], // Cache all common asset types
         maximumFileSizeToCacheInBytes: 20 * 1024 * 1024, // 20 MiB
         cleanupOutdatedCaches: true,
-        navigateFallback: "/indexV2.html",
+        navigateFallback: "/index.html",
         runtimeCaching: [
           {
             urlPattern: ({ request }) => request.destination === 'document',

From 98f688673be314d561c076fd711f3f67d9177742 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Mon, 19 Jan 2026 11:31:18 -0600
Subject: [PATCH 16/30] changed html in vite

---
 indexV2.html   | 20 --------------------
 vite.config.ts |  2 +-
 2 files changed, 1 insertion(+), 21 deletions(-)
 delete mode 100644 indexV2.html

diff --git a/indexV2.html b/indexV2.html
deleted file mode 100644
index 45dc87b..0000000
--- a/indexV2.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/x-icon" id="favicon-link" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title id="title-id">Adaptive Dashboard</title>
-    <link rel="manifest" id="manifest-link" />
-  </head>
-  <script>
-    window.CRISP_RUNTIME_CONFIG = {
-      session_merge: true
-    };
-  </script>
-  <script type="text/javascript">window.$crisp=[];window.CRISP_WEBSITE_ID="80170383-b426-43c0-8f66-8e20a05bcdce";(function(){d=document;s=d.createElement("script");s.src="https://client.crisp.chat/l.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();</script>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/app/main.tsx"></script>
-  </body>
-</html>
diff --git a/vite.config.ts b/vite.config.ts
index 846e8b7..f48db4a 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -53,7 +53,7 @@ export default defineConfig({
     target: 'esnext',
     rollupOptions: {
       input: {
-        main: path.resolve(__dirname, 'indexV2.html')
+        main: path.resolve(__dirname, 'index.html')
       }
     }
   },

From e387ef5aaf0012cbba58d36b91c18395c653e692 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Fri, 20 Feb 2026 16:04:57 -0600
Subject: [PATCH 17/30] ran npm install to fix the push

---
 package-lock.json | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index a46ad55..6ff9d7f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8306,10 +8306,12 @@
       }
     },
     "node_modules/date-fns-jalali": {
-      "version": "4.1.0-0",
-      "resolved": "https://registry.npmjs.org/date-fns-jalali/-/date-fns-jalali-4.1.0-0.tgz",
-      "integrity": "sha512-hTIP/z+t+qKwBDcmmsnmjWTduxCg+5KfdqWQvb2X/8C9+knYY6epN/pfxdDuyVlSVeFz0sM5eEfwIUQ70U4ckg==",
-      "license": "MIT"
+      "version": "4.0.0-0",
+      "resolved": "https://registry.npmjs.org/date-fns-jalali/-/date-fns-jalali-4.0.0-0.tgz",
+      "integrity": "sha512-EczB+gWceuWCRlacE4T+WmdP+BV/IUQpjQW9aBa9DNcXkKuZFv3WBDqeP2Ew+6YFBtPRRcH5U22+C6gcpwgG8A==",
+      "license": "MIT",
+      "optional": true,
+      "peer": true
     },
     "node_modules/dayjs": {
       "version": "1.11.19",
@@ -12174,6 +12176,12 @@
         "react": ">=16.8.0"
       }
     },
+    "node_modules/react-day-picker/node_modules/date-fns-jalali": {
+      "version": "4.1.0-0",
+      "resolved": "https://registry.npmjs.org/date-fns-jalali/-/date-fns-jalali-4.1.0-0.tgz",
+      "integrity": "sha512-hTIP/z+t+qKwBDcmmsnmjWTduxCg+5KfdqWQvb2X/8C9+knYY6epN/pfxdDuyVlSVeFz0sM5eEfwIUQ70U4ckg==",
+      "license": "MIT"
+    },
     "node_modules/react-dom": {
       "version": "18.3.1",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",

From 799b5889efd6c792288b7277cdcaf44b9b037fb4 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Fri, 20 Feb 2026 16:06:57 -0600
Subject: [PATCH 18/30] switched to dev proto

---
 package-lock.json | 2 +-
 package.json      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6ff9d7f..17726ba 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -43,7 +43,7 @@
         "mui-tel-input": "^7.0.0",
         "notistack": "^3.0.1",
         "openweathermap-ts": "^1.2.10",
-        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#master",
+        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#dev",
         "query-string": "^9.2.1",
         "react": "^18.3.1",
         "react-beautiful-dnd": "^13.1.1",
diff --git a/package.json b/package.json
index 7f5044c..ba69f2e 100644
--- a/package.json
+++ b/package.json
@@ -55,7 +55,7 @@
     "mui-tel-input": "^7.0.0",
     "notistack": "^3.0.1",
     "openweathermap-ts": "^1.2.10",
-    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#master",
+    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#dev",
     "query-string": "^9.2.1",
     "react": "^18.3.1",
     "react-beautiful-dnd": "^13.1.1",

From 0f87a0b840f8e042537713b6747372454b2f6351 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Mon, 16 Mar 2026 14:10:47 -0600
Subject: [PATCH 19/30] adjusting column sizes will now make the table bigger
 or smaller if it has to

---
 src/common/ResponsiveTable.tsx | 25 +++++++++++++++----------
 1 file changed, 15 insertions(+), 10 deletions(-)

diff --git a/src/common/ResponsiveTable.tsx b/src/common/ResponsiveTable.tsx
index b69589e..4c21901 100644
--- a/src/common/ResponsiveTable.tsx
+++ b/src/common/ResponsiveTable.tsx
@@ -16,8 +16,6 @@ const useStyles = makeStyles((theme: Theme) => {
     },
     tableContainer: {
       width: "100%",
-      maxWidth: "100%",
-      overflow: "hidden",
       minWidth: 0,
     },
     title: {
@@ -550,14 +548,8 @@ export default function ResponsiveTable<T extends Object>(props: Props<T>) {
     if (actualDelta > 0) {
       // Shrinking current column – give space to next column
       newWidths[index + 1] = (newWidths[index + 1] ?? 0) + actualDelta
-    } else if (actualDelta < 0) {
-      // Growing current column – take from next column only what it can give
-      const nextWidth = newWidths[index + 1] ?? 0
-      const availableFromNext = Math.max(0, nextWidth - MIN_COLUMN_WIDTH)
-      const takeFromNext = Math.min(-actualDelta, availableFromNext)
-      newWidths[index + 1] = nextWidth - takeFromNext
-      // If we couldn't take enough, the table grows (clampedWidth already applied)
     }
+    // When growing (actualDelta < 0): never shrink adjacent columns – table grows to accommodate
     setRowWidths(newWidths)
   }
 
@@ -605,7 +597,20 @@ export default function ResponsiveTable<T extends Object>(props: Props<T>) {
         </Box>
       )}
       <TableContainer sx={{ overflowX: "auto", paddingBottom: 1 }}>
-      <Table>
+      <Table
+        sx={{
+          tableLayout: "fixed",
+          width: columns && rowWidths.length > 0
+            ? (() => {
+                const colsWidth = columns.reduce(
+                  (sum, c, i) => sum + (filterList.includes(c.title) || c.hidden ? 0 : (rowWidths[i] ?? 0)),
+                  0
+                ) + (rowSelect ? 48 : 0) + (renderGutter ? 48 : 0)
+                return colsWidth > 0 ? `max(${colsWidth}px, 100%)` : "100%"
+              })()
+            : "100%",
+        }}
+      >
         <TableHead className={stickyHeader ? classes.stickyHeader : undefined}>
           {customElement && 
             <TableRow>

From 141ece8a3efff31434058e84d60968c1566a2891 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Mon, 16 Mar 2026 14:15:17 -0600
Subject: [PATCH 20/30] overlay overflow hidden so it stops affecting the
 scroll bar

---
 src/common/PulseBox.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/common/PulseBox.tsx b/src/common/PulseBox.tsx
index 2cdc5ce..90c611c 100644
--- a/src/common/PulseBox.tsx
+++ b/src/common/PulseBox.tsx
@@ -8,6 +8,7 @@ const useStyles = makeStyles((_theme: Theme) => ({
     position: 'relative',
     display: 'block', // Changed to block to respect Box margins
     width: 'fit-content', // Shrinks to child width
+    overflow: 'hidden', // Clip pulse animation so it doesn't affect parent layout
     '&::after': {
       content: '""',
       position: 'absolute',

From 62763dd2914c05578baf9ca215ba349e4f4f71fb Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Mon, 16 Mar 2026 14:24:21 -0600
Subject: [PATCH 21/30] overlay overflow hidden so it stops affecting the
 scroll bar

---
 src/common/PulseBox.tsx | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

diff --git a/src/common/PulseBox.tsx b/src/common/PulseBox.tsx
index 90c611c..f4ae696 100644
--- a/src/common/PulseBox.tsx
+++ b/src/common/PulseBox.tsx
@@ -8,7 +8,6 @@ const useStyles = makeStyles((_theme: Theme) => ({
     position: 'relative',
     display: 'block', // Changed to block to respect Box margins
     width: 'fit-content', // Shrinks to child width
-    overflow: 'hidden', // Clip pulse animation so it doesn't affect parent layout
     '&::after': {
       content: '""',
       position: 'absolute',
@@ -16,8 +15,7 @@ const useStyles = makeStyles((_theme: Theme) => ({
       left: 0,
       width: '100%',
       height: '100%',
-      border: '2px solid var(--pulse-color)',
-      borderRadius: 'inherit', // Should inherit from Box
+      borderRadius: 'inherit',
       animation: '$pulse 1.75s infinite ease-in-out',
       pointerEvents: 'none',
       boxSizing: 'border-box',
@@ -26,13 +24,13 @@ const useStyles = makeStyles((_theme: Theme) => ({
   },
   '@keyframes pulse': {
     from: {
-      transform: "scale(1)",
-      opacity: 1
+      boxShadow: '0 0 0 2px var(--pulse-color)',
+      opacity: 1,
     },
     to: {
-      transform: "scale(1.25)",
-      opacity: 0
-    }
+      boxShadow: '0 0 0 14px var(--pulse-color)',
+      opacity: 0,
+    },
   },
 }));
 

From 575c84246cb127da1bf06a1e78a8e88f11aaac8a Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Mon, 16 Mar 2026 14:41:18 -0600
Subject: [PATCH 22/30] gave the pulse box  better animation pacing so the
 colors don't change in the middle of a pulse

---
 src/common/PulseBox.tsx     | 72 +++++++++++++++++++++++--------------
 src/common/StatusDust.tsx   | 17 +--------
 src/common/StatusGas.tsx    | 17 +--------
 src/common/StatusPlenum.tsx | 18 +---------
 src/common/StatusSen5x.tsx  | 17 +--------
 5 files changed, 50 insertions(+), 91 deletions(-)

diff --git a/src/common/PulseBox.tsx b/src/common/PulseBox.tsx
index f4ae696..eb5da3d 100644
--- a/src/common/PulseBox.tsx
+++ b/src/common/PulseBox.tsx
@@ -1,56 +1,76 @@
 import { Box, BoxProps, Theme } from "@mui/material";
 import { makeStyles } from "@mui/styles";
 import classNames from "classnames";
-import { forwardRef, ReactNode } from "react";
+import { forwardRef, ReactNode, useCallback, useState } from "react";
 
 const useStyles = makeStyles((_theme: Theme) => ({
   pulseWrapper: {
     position: 'relative',
-    display: 'block', // Changed to block to respect Box margins
-    width: 'fit-content', // Shrinks to child width
-    '&::after': {
-      content: '""',
-      position: 'absolute',
-      top: 0,
-      left: 0,
-      width: '100%',
-      height: '100%',
-      borderRadius: 'inherit',
-      animation: '$pulse 1.75s infinite ease-in-out',
-      pointerEvents: 'none',
-      boxSizing: 'border-box',
-      transition: "border-color 0.35s ease-in-out",
-    },
+    display: 'block',
+    width: 'fit-content',
+  },
+  pulseRing: {
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    width: '100%',
+    height: '100%',
+    borderRadius: 'inherit',
+    pointerEvents: 'none',
+    boxSizing: 'border-box',
+    animation: '$pulse 4.4s infinite ease-in-out',
   },
   '@keyframes pulse': {
-    from: {
-      boxShadow: '0 0 0 2px var(--pulse-color)',
-      opacity: 1,
-    },
-    to: {
-      boxShadow: '0 0 0 14px var(--pulse-color)',
-      opacity: 0,
-    },
+    /* pulse, pause, pulse, pause - CONSISTENT: both pauses equal, both pulses equal */
+    /* Pulse 1 (0-42%) */
+    '0%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
+    '2%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 1 },
+    '40%': { boxShadow: '0 0 0 14px var(--pulse-color)', opacity: 0 },
+    '42%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
+    /* Pause 1 (42-50%) */
+    '50%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
+    /* Pulse 2 (50-92%) */
+    '52%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 1 },
+    '90%': { boxShadow: '0 0 0 14px var(--pulse-color)', opacity: 0 },
+    '92%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
+    /* Pause 2 (92-100%) - same length as Pause 1, color change at iteration */
+    '100%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
   },
 }));
 
 interface Props extends BoxProps {
   color: string;
+  colors?: string[];
   children: ReactNode;
   className?: string;
 }
 
 const PulseBox = forwardRef<HTMLDivElement, Props>((props, ref) => {
-  const { color, children, className, ...boxProps } = props;
+  const { color, colors: colorsProp, children, className, ...boxProps } = props;
   const classes = useStyles()
 
+  const colors = colorsProp && colorsProp.length > 0 ? colorsProp : [color];
+  const [colorIndex, setColorIndex] = useState(0);
+  const displayColor = colors[colorIndex % colors.length] ?? color;
+
+  const onAnimationIteration = useCallback(() => {
+    if (colors.length > 1) {
+      setColorIndex((i) => (i + 1) % colors.length);
+    }
+  }, [colors.length]);
+
   return (
     <Box 
       ref={ref}
       {...boxProps}
       className={classNames([classes.pulseWrapper, className])} 
-      style={{ '--pulse-color': color } as React.CSSProperties}
+      style={{ '--pulse-color': displayColor } as React.CSSProperties}
     >
+      <span
+        className={classes.pulseRing}
+        aria-hidden
+        onAnimationIteration={onAnimationIteration}
+      />
       {children}
     </Box>
   );
diff --git a/src/common/StatusDust.tsx b/src/common/StatusDust.tsx
index 4963269..c157501 100644
--- a/src/common/StatusDust.tsx
+++ b/src/common/StatusDust.tsx
@@ -57,21 +57,6 @@ export default function StatusDust(props: Props) {
   const colors = or(device.status.sen5x?.overlays.map(overlay => overlay.color), []);
   const messages = or(device.status.sen5x?.overlays.map(overlay => overlay.message), []);
 
-  const [color, setColor] = useState(colors.length > 0 ? colors[0] : "");
-  const [, setColorIndex] = useState(0)
-
-  useEffect(() => {
-    const interval = setInterval(() => {
-      setColorIndex(prevIndex => {
-        const newIndex = prevIndex >= colors.length - 1 ? 0 : prevIndex + 1;
-        setColor(colors[newIndex]); // Use the new index here
-        return newIndex;
-      });
-    }, 7500);
-    
-    return () => clearInterval(interval);
-  }, []);
-
   // const [currentIndex, setCurrentIndex] = useState(0);
 
   // Auto-cycle through measurements every 3 seconds
@@ -142,7 +127,7 @@ export default function StatusDust(props: Props) {
 
   return (
     <Tooltip title={tooltip()}>
-      <PulseBox color={color} className={classes.box} >
+      <PulseBox color={colors[0] ?? ""} colors={colors} className={classes.box} >
         <Grid2 container direction="column" >
           <Grid2 container direction="column" 
             className={`${classes.carouselItem} ${classes.active }`}
diff --git a/src/common/StatusGas.tsx b/src/common/StatusGas.tsx
index b220d96..8c63401 100644
--- a/src/common/StatusGas.tsx
+++ b/src/common/StatusGas.tsx
@@ -85,23 +85,8 @@ export default function StatusGas(props: Props) {
     messages = or(device.status[gasType]?.overlays?.map(overlay => overlay.message), []);
   }
 
-  const [color, setColor] = useState(colors.length > 0 ? colors[0] : "");
-  const [, setColorIndex] = useState(0)
-
   const gasTypes: ("o2" | "no2" | "co2" | "co" | "lel" | "h2s")[] = ["o2", "no2", "co2", "co", "lel", "h2s"]
 
-  useEffect(() => {
-    const interval = setInterval(() => {
-      setColorIndex(prevIndex => {
-        const newIndex = prevIndex >= colors.length - 1 ? 0 : prevIndex + 1;
-        setColor(colors[newIndex]); // Use the new index here
-        return newIndex;
-      });
-    }, 7500);
-    
-    return () => clearInterval(interval);
-  }, []);
-
   const [currentIndex, setCurrentIndex] = useState(0);
 
   // Auto-cycle through measurements every 5 seconds
@@ -183,7 +168,7 @@ export default function StatusGas(props: Props) {
     }
     return (
       <Tooltip title={tooltip()}>
-        <PulseBox color={color} className={gasType === "all" ? classes.boxTall : classes.box}>
+        <PulseBox color={colors[0] ?? ""} colors={colors} className={gasType === "all" ? classes.boxTall : classes.box}>
           <Grid2 container direction="column" >
             { gasType === "all" &&
               <Typography variant="body2">
diff --git a/src/common/StatusPlenum.tsx b/src/common/StatusPlenum.tsx
index 250660a..c7efef0 100644
--- a/src/common/StatusPlenum.tsx
+++ b/src/common/StatusPlenum.tsx
@@ -5,7 +5,6 @@ import { Device } from "models";
 import PulseBox from "./PulseBox";
 import RelativeTimestamp from "./RelativeTimestamp";
 import { or } from "utils";
-import { useEffect, useState } from "react";
 
 interface Props {
   device: Device;
@@ -33,21 +32,6 @@ export default function StatusPlenum(props: Props) {
   const colors = or(device.status.plenum?.overlays.map(overlay => overlay.color), []);
   const messages = or(device.status.plenum?.overlays.map(overlay => overlay.message), []);
 
-  const [color, setColor] = useState(colors.length > 0 ? colors[0] : "");
-  const [, setColorIndex] = useState(0)
-
-  useEffect(() => {
-    const interval = setInterval(() => {
-      setColorIndex(prevIndex => {
-        const newIndex = prevIndex >= colors.length - 1 ? 0 : prevIndex + 1;
-        setColor(colors[newIndex]); // Use the new index here
-        return newIndex;
-      });
-    }, 5000);
-    
-    return () => clearInterval(interval);
-  }, []);
-
   const tooltip = () => {
     if (messages.length === 0) return null
     if (messages.length < 2) return (
@@ -107,7 +91,7 @@ export default function StatusPlenum(props: Props) {
 
   return (
     <Tooltip title={tooltip()}>
-      <PulseBox color={color} className={classes.box} >
+      <PulseBox color={colors[0] ?? ""} colors={colors} className={classes.box} >
         <Grid2 container direction="column" >
           <Grid2>
             <Typography variant="body2" style={{ color: orange[700]}}>
diff --git a/src/common/StatusSen5x.tsx b/src/common/StatusSen5x.tsx
index 533fde2..4e3d316 100644
--- a/src/common/StatusSen5x.tsx
+++ b/src/common/StatusSen5x.tsx
@@ -58,21 +58,6 @@ export default function StatusSen5x(props: Props) {
   const colors = or(device.status.sen5x?.overlays.map(overlay => overlay.color), []);
   const messages = or(device.status.sen5x?.overlays.map(overlay => overlay.message), []);
 
-  const [color, setColor] = useState(colors.length > 0 ? colors[0] : "");
-  const [, setColorIndex] = useState(0)
-
-  useEffect(() => {
-    const interval = setInterval(() => {
-      setColorIndex(prevIndex => {
-        const newIndex = prevIndex >= colors.length - 1 ? 0 : prevIndex + 1;
-        setColor(colors[newIndex]); // Use the new index here
-        return newIndex;
-      });
-    }, 7500);
-    
-    return () => clearInterval(interval);
-  }, []);
-
   const [currentIndex, setCurrentIndex] = useState(0);
 
   // Auto-cycle through measurements every 5 seconds
@@ -147,7 +132,7 @@ export default function StatusSen5x(props: Props) {
 
   return (
     <Tooltip title={tooltip()}>
-      <PulseBox color={color} className={classes.box} >
+      <PulseBox color={colors[0] ?? ""} colors={colors} className={classes.box} >
         <Grid2 container direction="column" >
           <Grid2 container direction="column"
             className={`${classes.carouselItem} ${

From 834bd518c102656a07177d3f6335a85ea972fe93 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Mon, 16 Mar 2026 14:49:28 -0600
Subject: [PATCH 23/30] made the pulse box animation look nice by starting the
 pulse from behind the box that it's pulsing

---
 src/common/PulseBox.tsx | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/common/PulseBox.tsx b/src/common/PulseBox.tsx
index eb5da3d..37ae123 100644
--- a/src/common/PulseBox.tsx
+++ b/src/common/PulseBox.tsx
@@ -8,6 +8,8 @@ const useStyles = makeStyles((_theme: Theme) => ({
     position: 'relative',
     display: 'block',
     width: 'fit-content',
+    isolation: 'isolate',
+    overflow: 'visible',
   },
   pulseRing: {
     position: 'absolute',
@@ -18,23 +20,24 @@ const useStyles = makeStyles((_theme: Theme) => ({
     borderRadius: 'inherit',
     pointerEvents: 'none',
     boxSizing: 'border-box',
+    zIndex: -1,
     animation: '$pulse 4.4s infinite ease-in-out',
   },
   '@keyframes pulse': {
+    /* Start behind box, then expand out and fade */
     /* pulse, pause, pulse, pause - CONSISTENT: both pauses equal, both pulses equal */
-    /* Pulse 1 (0-42%) */
-    '0%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
-    '2%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 1 },
+    /* Pulse 1 (0-42%) - gradual fade in to soften the start */
+    '0%': { boxShadow: '0 0 0 -2px var(--pulse-color)', opacity: 1 },
     '40%': { boxShadow: '0 0 0 14px var(--pulse-color)', opacity: 0 },
-    '42%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
+    '42%': { boxShadow: '0 0 0 -2px var(--pulse-color)', opacity: 0 },
     /* Pause 1 (42-50%) */
-    '50%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
+    '50%': { boxShadow: '0 0 0 -2px var(--pulse-color)', opacity: 0 },
     /* Pulse 2 (50-92%) */
-    '52%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 1 },
+    '52%': { boxShadow: '0 0 0 -2px var(--pulse-color)', opacity: 1 },
     '90%': { boxShadow: '0 0 0 14px var(--pulse-color)', opacity: 0 },
-    '92%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
+    '92%': { boxShadow: '0 0 0 -2px var(--pulse-color)', opacity: 0 },
     /* Pause 2 (92-100%) - same length as Pause 1, color change at iteration */
-    '100%': { boxShadow: '0 0 0 2px var(--pulse-color)', opacity: 0 },
+    '100%': { boxShadow: '0 0 0 -2px var(--pulse-color)', opacity: 0 },
   },
 }));
 

From dc8b2617e6b5f93f56b3d7740753b18ab99ff5bf Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Fri, 20 Mar 2026 12:35:09 -0600
Subject: [PATCH 24/30] merge web socket changes

---
 .env                                |   3 +
 src/common/StatusDust.tsx           | 130 +++++++++----------
 src/common/StatusSen5x.tsx          | 191 ++++++++++++++--------------
 src/hooks/useDeviceStatusStreams.ts |  30 ++---
 src/hooks/useWebSocket.ts           |  30 ++---
 src/pages/Device.tsx                |  22 +++-
 src/pages/Devices.tsx               |  40 ++++++
 src/utils/getWsBaseUrl.ts           |  16 +++
 8 files changed, 262 insertions(+), 200 deletions(-)
 create mode 100644 src/utils/getWsBaseUrl.ts

diff --git a/.env b/.env
index 6e8f870..9fdc8f3 100644
--- a/.env
+++ b/.env
@@ -20,3 +20,6 @@ VITE_APP_WEBSITE_TITLE="Adaptive Dashboard"
 VITE_APP_PRIMARY_COLOUR=blue
 VITE_APP_SECONDARY_COLOUR=blueGrey
 VITE_APP_SIGNATURE_COLOUR="#323232"
+
+# Live device/component WebSocket streams (must match string "true" in code)
+VITE_ENABLE_WEBSOCKETS=true
diff --git a/src/common/StatusDust.tsx b/src/common/StatusDust.tsx
index c157501..b45e930 100644
--- a/src/common/StatusDust.tsx
+++ b/src/common/StatusDust.tsx
@@ -5,7 +5,6 @@ import { Device } from "models";
 import PulseBox from "./PulseBox";
 import RelativeTimestamp from "./RelativeTimestamp";
 import { or } from "utils";
-import { useEffect, useState } from "react";
 
 interface Props {
   device: Device;
@@ -23,56 +22,47 @@ const useStyles = makeStyles((theme: Theme) => {
       marginRight: "auto",
       margin: theme.spacing(1),
       width: theme.spacing(16),
-      height: theme.spacing(11),
+      minHeight: theme.spacing(11),
+    },
+    readingsWrapper: {
+      position: "relative",
+      width: "100%",
+      minHeight: theme.spacing(10),
     },
     carouselContainer: {
-      position: 'relative',
-      height: '40px',
-      overflow: 'hidden',
+      position: "relative",
+      height: "40px",
+      overflow: "hidden",
       textAlign: "center",
     },
     carouselItem: {
       opacity: 0,
-      transform: 'translateX(100%)',
-      transition: 'opacity 0.5s ease, transform 0.5s ease',
-      position: 'absolute',
-      width: '100%',
+      transform: "translateX(100%)",
+      transition: "opacity 0.5s ease, transform 0.5s ease",
+      position: "absolute",
+      width: "100%",
       overflow: "hidden",
-      // height: '100%',
     },
     active: {
       opacity: 1,
-      transform: 'translateX(0)',
+      transform: "translateX(0)",
     },
     inactive: {
-      transform: 'translateX(-100%)',
+      transform: "translateX(-100%)",
     },
-  })
-})
+  });
+});
 
 export default function StatusDust(props: Props) {
   const { device, showTimestamp } = props;
-  const classes = useStyles()
+  const classes = useStyles();
 
-  const colors = or(device.status.sen5x?.overlays.map(overlay => overlay.color), []);
-  const messages = or(device.status.sen5x?.overlays.map(overlay => overlay.message), []);
-
-  // const [currentIndex, setCurrentIndex] = useState(0);
-
-  // Auto-cycle through measurements every 3 seconds
-  // useEffect(() => {
-  //   const interval = setInterval(() => {
-  //     setCurrentIndex((prevIndex) => (prevIndex + 1) % 2);
-  //   }, 3000); // Adjust timing as needed (3000ms = 3s)
-
-  //   return () => clearInterval(interval); // Cleanup on unmount
-  // }, []);
+  const colors = or(device.status.sen5x?.overlays.map((overlay) => overlay.color), []);
+  const messages = or(device.status.sen5x?.overlays.map((overlay) => overlay.message), []);
 
   const tooltip = () => {
-    if (messages.length === 0) return null
-    if (messages.length < 2) return (
-      messages[0]
-    )
+    if (messages.length === 0) return null;
+    if (messages.length < 2) return messages[0];
     return (
       <Grid2 container direction={"column"}>
         <Grid2 container direction="row">
@@ -85,10 +75,10 @@ export default function StatusDust(props: Props) {
             <Grid2 key={"tooltip-overly-message-" + message} container direction="row" alignItems={"center"}>
               <Box
                 sx={{
-                  width: 10, // Size of the square
+                  width: 10,
                   height: 10,
-                  backgroundColor: colors[index], // Passed color prop
-                  borderRadius: 1, // Optional: slight rounding, remove for sharp square
+                  backgroundColor: colors[index],
+                  borderRadius: 1,
                   border: "1px solid black",
                 }}
               />
@@ -96,22 +86,20 @@ export default function StatusDust(props: Props) {
                 {message}
               </Typography>
             </Grid2>
-          )
+          );
         })}
       </Grid2>
-    )
-  }
+    );
+  };
 
   function compareTimestamps(timestamp1: string, timestamp2: string): number {
     const date1 = new Date(timestamp1);
     const date2 = new Date(timestamp2);
 
-    // Check if dates are valid
     if (isNaN(date1.getTime()) || isNaN(date2.getTime())) {
       throw new Error("Invalid RFC3339 timestamp format");
     }
 
-    // Compare using getTime() for millisecond precision
     return date1.getTime() - date2.getTime();
   }
 
@@ -119,47 +107,49 @@ export default function StatusDust(props: Props) {
     const now = new Date();
     const oneDayAgo = new Date(now.getTime() - 24 * 60 * 60 * 1000);
     if (compareTimestamps(device.status.sen5x?.timestamp, oneDayAgo.toISOString()) < 0) {
-      return null
-    } 
+      return null;
+    }
   } else {
-    return null
+    return null;
   }
 
   return (
     <Tooltip title={tooltip()}>
-      <PulseBox color={colors[0] ?? ""} colors={colors} className={classes.box} >
-        <Grid2 container direction="column" >
-          <Grid2 container direction="column" 
-            className={`${classes.carouselItem} ${classes.active }`}
-          >
-            <Grid2>
-              <Typography variant="body2" style={{ color: green[300]}}>
-                {"<1um:"} {device.status.sen5x?.dust1ug.toFixed(1)}ug/m3
-              </Typography>
-            </Grid2>
-            <Grid2>
-              <Typography variant="body2" style={{ color: green[400]}}>
-                {"<2.5um:"} {device.status.sen5x?.dust2ug.toFixed(1)}ug/m3
-              </Typography>
-            </Grid2>
-            <Grid2>
-              <Typography variant="body2" style={{ color: green[500]}}>
-                {"<4um: "}{device.status.sen5x?.dust4ug.toFixed(1)}ug/m3
-              </Typography>
-            </Grid2>
-            <Grid2>
-              <Typography variant="body2" style={{ color: green[600]}}>
-                {"<10um: "}{device.status.sen5x?.dust10ug.toFixed(1)}ug/m3
-              </Typography>
+      <PulseBox color={colors[0] ?? ""} colors={colors} className={classes.box}>
+        <Grid2 container direction="column" spacing={0.25}>
+          <Grid2 className={classes.readingsWrapper}>
+            <Grid2 container direction="column" className={`${classes.carouselItem} ${classes.active}`}>
+              <Grid2>
+                <Typography variant="body2" style={{ color: green[300] }}>
+                  {"<1um:"} {device.status.sen5x?.dust1ug.toFixed(1)}ug/m3
+                </Typography>
+              </Grid2>
+              <Grid2>
+                <Typography variant="body2" style={{ color: green[400] }}>
+                  {"<2.5um:"} {device.status.sen5x?.dust2ug.toFixed(1)}ug/m3
+                </Typography>
+              </Grid2>
+              <Grid2>
+                <Typography variant="body2" style={{ color: green[500] }}>
+                  {"<4um: "}
+                  {device.status.sen5x?.dust4ug.toFixed(1)}ug/m3
+                </Typography>
+              </Grid2>
+              <Grid2>
+                <Typography variant="body2" style={{ color: green[600] }}>
+                  {"<10um: "}
+                  {device.status.sen5x?.dust10ug.toFixed(1)}ug/m3
+                </Typography>
+              </Grid2>
             </Grid2>
           </Grid2>
           {showTimestamp && device.status.sen5x?.timestamp && (
-            <Grid2>
+            <Grid2 sx={{ pt: 0.25 }}>
               <RelativeTimestamp timestamp={device.status.sen5x.timestamp} />
             </Grid2>
           )}
         </Grid2>
       </PulseBox>
     </Tooltip>
-  )
-}
\ No newline at end of file
+  );
+}
diff --git a/src/common/StatusSen5x.tsx b/src/common/StatusSen5x.tsx
index 4e3d316..1c34214 100644
--- a/src/common/StatusSen5x.tsx
+++ b/src/common/StatusSen5x.tsx
@@ -24,60 +24,61 @@ const useStyles = makeStyles((theme: Theme) => {
       marginRight: "auto",
       margin: theme.spacing(1),
       width: theme.spacing(16),
-      height: theme.spacing(11),
+      minHeight: theme.spacing(11),
+    },
+    /** Reserves vertical space so absolute carousel slides do not overlap the timestamp below. */
+    readingsWrapper: {
+      position: "relative",
+      width: "100%",
+      minHeight: theme.spacing(10),
     },
     carouselContainer: {
-      position: 'relative',
-      height: '40px',
-      overflow: 'hidden',
+      position: "relative",
+      height: "40px",
+      overflow: "hidden",
       textAlign: "center",
     },
     carouselItem: {
       opacity: 0,
-      transform: 'translateX(100%)',
-      transition: 'opacity 0.5s ease, transform 0.5s ease',
-      position: 'absolute',
-      width: '100%',
+      transform: "translateX(100%)",
+      transition: "opacity 0.5s ease, transform 0.5s ease",
+      position: "absolute",
+      width: "100%",
       overflow: "hidden",
-      // height: '100%',
     },
     active: {
       opacity: 1,
-      transform: 'translateX(0)',
+      transform: "translateX(0)",
     },
     inactive: {
-      transform: 'translateX(-100%)',
+      transform: "translateX(-100%)",
     },
-  })
-})
+  });
+});
 
 export default function StatusSen5x(props: Props) {
   const { device, noDust, showTimestamp } = props;
-  const classes = useStyles()
-  // console.log(noDust)
-  const colors = or(device.status.sen5x?.overlays.map(overlay => overlay.color), []);
-  const messages = or(device.status.sen5x?.overlays.map(overlay => overlay.message), []);
+  const classes = useStyles();
+  const colors = or(device.status.sen5x?.overlays.map((overlay) => overlay.color), []);
+  const messages = or(device.status.sen5x?.overlays.map((overlay) => overlay.message), []);
 
   const [currentIndex, setCurrentIndex] = useState(0);
 
-  // Auto-cycle through measurements every 5 seconds
   useEffect(() => {
     if (noDust) {
-      setCurrentIndex(0)
-      return
+      setCurrentIndex(0);
+      return;
     }
     const interval = setInterval(() => {
       if (!noDust) setCurrentIndex((prevIndex) => (prevIndex + 1) % 2);
-    }, 5000); 
+    }, 5000);
 
-    return () => clearInterval(interval); // Cleanup on unmount
+    return () => clearInterval(interval);
   }, [noDust]);
 
   const tooltip = () => {
-    if (messages.length === 0) return null
-    if (messages.length < 2) return (
-      messages[0]
-    )
+    if (messages.length === 0) return null;
+    if (messages.length < 2) return messages[0];
     return (
       <Grid2 container direction={"column"}>
         <Grid2 container direction="row">
@@ -90,10 +91,10 @@ export default function StatusSen5x(props: Props) {
             <Grid2 key={"tooltip-overly-message-" + message} container direction="row" alignItems={"center"}>
               <Box
                 sx={{
-                  width: 10, // Size of the square
+                  width: 10,
                   height: 10,
-                  backgroundColor: colors[index], // Passed color prop
-                  borderRadius: 1, // Optional: slight rounding, remove for sharp square
+                  backgroundColor: colors[index],
+                  borderRadius: 1,
                   border: "1px solid black",
                 }}
               />
@@ -101,22 +102,20 @@ export default function StatusSen5x(props: Props) {
                 {message}
               </Typography>
             </Grid2>
-          )
+          );
         })}
       </Grid2>
-    )
-  }
+    );
+  };
 
   function compareTimestamps(timestamp1: string, timestamp2: string): number {
     const date1 = new Date(timestamp1);
     const date2 = new Date(timestamp2);
 
-    // Check if dates are valid
     if (isNaN(date1.getTime()) || isNaN(date2.getTime())) {
       throw new Error("Invalid RFC3339 timestamp format");
     }
 
-    // Compare using getTime() for millisecond precision
     return date1.getTime() - date2.getTime();
   }
 
@@ -124,76 +123,82 @@ export default function StatusSen5x(props: Props) {
     const now = new Date();
     const oneDayAgo = new Date(now.getTime() - 24 * 60 * 60 * 1000);
     if (compareTimestamps(device.status.sen5x?.timestamp, oneDayAgo.toISOString()) < 0) {
-      return null
-    } 
+      return null;
+    }
   } else {
-    return null
+    return null;
   }
 
   return (
     <Tooltip title={tooltip()}>
-      <PulseBox color={colors[0] ?? ""} colors={colors} className={classes.box} >
-        <Grid2 container direction="column" >
-          <Grid2 container direction="column"
-            className={`${classes.carouselItem} ${
-              0 === currentIndex ? classes.active : classes.inactive
-            }`}
-          >
-            <Grid2>
-              <Typography variant="body2" style={{ color: orange[700]}}>
-                Temp: {device.status.sen5x?.temperature.toFixed(1)}°C
-              </Typography>
-            </Grid2>
-            <Grid2>
-              <Typography variant="body2" style={{ color: blue[700]}}>
-                Humidity: {device.status.sen5x?.humidity.toFixed(1)}%
-              </Typography>
-            </Grid2>
-            <Grid2>
-              <Typography variant="body2" style={{ color: blue[300]}}>
-                Voc: {device.status.sen5x?.voc.toFixed(1)}%
-              </Typography>
-            </Grid2>
-            <Grid2>
-              <Typography variant="body2" style={{ color: blue[400]}}>
-                Nox: {device.status.sen5x?.nox.toFixed(1)}%
-              </Typography>
+      <PulseBox color={colors[0] ?? ""} colors={colors} className={classes.box}>
+        <Grid2 container direction="column" spacing={0.25}>
+          <Grid2 className={classes.readingsWrapper}>
+            <Grid2
+              container
+              direction="column"
+              className={`${classes.carouselItem} ${0 === currentIndex ? classes.active : classes.inactive}`}
+            >
+              <Grid2>
+                <Typography variant="body2" style={{ color: orange[700] }}>
+                  Temp: {device.status.sen5x?.temperature.toFixed(1)}°C
+                </Typography>
+              </Grid2>
+              <Grid2>
+                <Typography variant="body2" style={{ color: blue[700] }}>
+                  Humidity: {device.status.sen5x?.humidity.toFixed(1)}%
+                </Typography>
+              </Grid2>
+              <Grid2>
+                <Typography variant="body2" style={{ color: blue[300] }}>
+                  Voc: {device.status.sen5x?.voc.toFixed(1)}%
+                </Typography>
+              </Grid2>
+              <Grid2>
+                <Typography variant="body2" style={{ color: blue[400] }}>
+                  Nox: {device.status.sen5x?.nox.toFixed(1)}%
+                </Typography>
+              </Grid2>
             </Grid2>
+
+            {!noDust && (
+              <Grid2
+                container
+                direction="column"
+                className={`${classes.carouselItem} ${1 === currentIndex ? classes.active : classes.inactive}`}
+              >
+                <Grid2>
+                  <Typography variant="body2" style={{ color: green[300] }}>
+                    {"<1um:"} {device.status.sen5x?.dust1ug.toFixed(1)}ug/m3
+                  </Typography>
+                </Grid2>
+                <Grid2>
+                  <Typography variant="body2" style={{ color: green[400] }}>
+                    {"<2.5um:"} {device.status.sen5x?.dust2ug.toFixed(1)}ug/m3
+                  </Typography>
+                </Grid2>
+                <Grid2>
+                  <Typography variant="body2" style={{ color: green[500] }}>
+                    {"<4um: "}
+                    {device.status.sen5x?.dust4ug.toFixed(1)}ug/m3
+                  </Typography>
+                </Grid2>
+                <Grid2>
+                  <Typography variant="body2" style={{ color: green[600] }}>
+                    {"<10um: "}
+                    {device.status.sen5x?.dust10ug.toFixed(1)}ug/m3
+                  </Typography>
+                </Grid2>
+              </Grid2>
+            )}
           </Grid2>
-          
-          {!noDust && <Grid2 container direction="column" 
-            className={`${classes.carouselItem} ${
-              1 === currentIndex ? classes.active : classes.inactive
-            }`}
-          >
-            <Grid2>
-              <Typography variant="body2" style={{ color: green[300]}}>
-                {"<1um:"} {device.status.sen5x?.dust1ug.toFixed(1)}ug/m3
-              </Typography>
-            </Grid2>
-            <Grid2>
-              <Typography variant="body2" style={{ color: green[400]}}>
-                {"<2.5um:"} {device.status.sen5x?.dust2ug.toFixed(1)}ug/m3
-              </Typography>
-            </Grid2>
-            <Grid2>
-              <Typography variant="body2" style={{ color: green[500]}}>
-                {"<4um: "}{device.status.sen5x?.dust4ug.toFixed(1)}ug/m3
-              </Typography>
-            </Grid2>
-            <Grid2>
-              <Typography variant="body2" style={{ color: green[600]}}>
-                {"<10um: "}{device.status.sen5x?.dust10ug.toFixed(1)}ug/m3
-              </Typography>
-            </Grid2>
-          </Grid2>}
           {showTimestamp && device.status.sen5x?.timestamp && (
-            <Grid2>
+            <Grid2 sx={{ pt: 0.25 }}>
               <RelativeTimestamp timestamp={device.status.sen5x.timestamp} />
             </Grid2>
           )}
         </Grid2>
       </PulseBox>
     </Tooltip>
-  )
-}
\ No newline at end of file
+  );
+}
diff --git a/src/hooks/useDeviceStatusStreams.ts b/src/hooks/useDeviceStatusStreams.ts
index 5c38058..d04d663 100644
--- a/src/hooks/useDeviceStatusStreams.ts
+++ b/src/hooks/useDeviceStatusStreams.ts
@@ -1,22 +1,10 @@
 import { pond } from "protobuf-ts/pond";
 import { useEffect, useRef, useCallback, useMemo } from "react";
+import { getWsBaseUrl } from "utils/getWsBaseUrl";
 
 /** Off by default to reduce server load; set VITE_ENABLE_WEBSOCKETS=true to enable live streams. */
 const WEBSOCKETS_ENABLED = import.meta.env.VITE_ENABLE_WEBSOCKETS === "true";
 
-/**
- * Derives the WebSocket base URL from VITE_APP_API_URL.
- * Matches the logic in useWebSocket.ts.
- */
-function getWsBaseUrl(): string {
-  const apiUrl = import.meta.env.VITE_APP_API_URL;
-  if (apiUrl) {
-    return apiUrl.replace(/^http/, "ws");
-  }
-  const protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
-  return `${protocol}//${window.location.host}`;
-}
-
 export interface UseDeviceStatusStreamsOptions {
   /** Device IDs to stream status for (e.g. from the visible devices list) */
   deviceIds: string[];
@@ -24,6 +12,12 @@ export interface UseDeviceStatusStreamsOptions {
   onStatusUpdate: (deviceId: string, status: pond.DeviceStatus) => void;
   /** Auth token passed as ?token= query param */
   token?: string;
+  /** Same as REST/listDevices (?keys=) — required when listing under a context path or group tab */
+  keys?: string[];
+  /** Same as REST (?types=) */
+  types?: string[];
+  /** View-as / impersonation (?as=), same as device list when not already team-first in URL */
+  as?: string;
   /** Whether the connections should be active. Default true. */
   enabled?: boolean;
 }
@@ -34,7 +28,7 @@ export interface UseDeviceStatusStreamsOptions {
  * Readings (plenum, sen5x, co, co2, no2, o2, etc.) stream in real time.
  */
 export function useDeviceStatusStreams(options: UseDeviceStatusStreamsOptions) {
-  const { deviceIds, onStatusUpdate, token, enabled = true } = options;
+  const { deviceIds, onStatusUpdate, token, keys, types, as, enabled = true } = options;
 
   const onStatusUpdateRef = useRef(onStatusUpdate);
   onStatusUpdateRef.current = onStatusUpdate;
@@ -49,8 +43,12 @@ export function useDeviceStatusStreams(options: UseDeviceStatusStreamsOptions) {
 
       const params = new URLSearchParams();
       params.set("token", token);
+      if (keys?.length) params.set("keys", keys.toString());
+      if (types?.length) params.set("types", types.toString());
+      if (as) params.set("as", as);
 
-      const path = `/live/devices/${deviceId}/status`;
+      // Match useWebSocket / pond routes: /v1/live/devices/:id/status
+      const path = `/v1/live/devices/${deviceId}/status`;
       const url = `${getWsBaseUrl()}${path}?${params.toString()}`;
       const ws = new WebSocket(url);
       wsMapRef.current.set(deviceId, ws);
@@ -91,7 +89,7 @@ export function useDeviceStatusStreams(options: UseDeviceStatusStreamsOptions) {
         reconnectTimeoutsRef.current.set(deviceId, timeout);
       };
     },
-    [token]
+    [token, keys?.join(), types?.join(), as]
   );
 
   // Normalize for stable comparison: same set of IDs = same string regardless of order
diff --git a/src/hooks/useWebSocket.ts b/src/hooks/useWebSocket.ts
index ff6092c..9945f2d 100644
--- a/src/hooks/useWebSocket.ts
+++ b/src/hooks/useWebSocket.ts
@@ -1,24 +1,11 @@
 import { useEffect, useRef, useCallback } from "react";
+import { getWsBaseUrl } from "utils/getWsBaseUrl";
 
 /** Off by default to reduce server load; set VITE_ENABLE_WEBSOCKETS=true to enable live streams. */
 const WEBSOCKETS_ENABLED = import.meta.env.VITE_ENABLE_WEBSOCKETS === "true";
 
-/**
- * Derives the WebSocket base URL from VITE_APP_API_URL.
- * e.g. "https://api.brandxtech.ca" -> "wss://api.brandxtech.ca"
- * Falls back to current page host for local dev.
- */
-function getWsBaseUrl(): string {
-  const apiUrl = import.meta.env.VITE_APP_API_URL;
-  if (apiUrl) {
-    return apiUrl.replace(/^http/, "ws");
-  }
-  const protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
-  return `${protocol}//${window.location.host}`;
-}
-
 interface UseWebSocketOptions<T> {
-  /** The API path, e.g. "/v1/live/devices/123/components" */
+  /** The API path including /v1, e.g. "/v1/live/devices/123/components" */
   path: string;
   /** Transform the raw MessageEvent into your domain type */
   parse: (event: MessageEvent) => T;
@@ -28,6 +15,12 @@ interface UseWebSocketOptions<T> {
   token?: string;
   /** Minimum seconds between updates, passed as ?rate= to the backend */
   rate?: number;
+  /** Context keys, same as REST device APIs (?keys=) */
+  keys?: string[];
+  /** Context types, same as REST device APIs (?types=) */
+  types?: string[];
+  /** Impersonation / team view key, same as REST (?as=) */
+  as?: string;
   /** Whether the connection should be active. Default true. */
   enabled?: boolean;
 }
@@ -44,7 +37,7 @@ interface UseWebSocketOptions<T> {
  *   });
  */
 export function useWebSocket<T>(options: UseWebSocketOptions<T>) {
-  const { path, parse, onMessage, token, rate = 0, enabled = true } = options;
+  const { path, parse, onMessage, token, rate = 0, keys, types, as, enabled = true } = options;
 
   // Keep latest callbacks in refs so reconnects don't use stale closures
   const onMessageRef = useRef(onMessage);
@@ -62,6 +55,9 @@ export function useWebSocket<T>(options: UseWebSocketOptions<T>) {
     const params = new URLSearchParams();
     params.set("token", token);
     if (rate > 0) params.set("rate", rate.toString());
+    if (keys?.length) params.set("keys", keys.toString());
+    if (types?.length) params.set("types", types.toString());
+    if (as) params.set("as", as);
 
     const url = `${getWsBaseUrl()}${path}?${params.toString()}`;
     const ws = new WebSocket(url);
@@ -100,7 +96,7 @@ export function useWebSocket<T>(options: UseWebSocketOptions<T>) {
       console.debug(`[ws] reconnecting in ${delay}ms...`);
       reconnectTimeoutRef.current = setTimeout(connect, delay);
     };
-  }, [path, token, rate]);
+  }, [path, token, rate, keys?.join(), types?.join(), as]);
 
   useEffect(() => {
     if (!WEBSOCKETS_ENABLED || !enabled || !token) {
diff --git a/src/pages/Device.tsx b/src/pages/Device.tsx
index db9914e..6dd2623 100644
--- a/src/pages/Device.tsx
+++ b/src/pages/Device.tsx
@@ -3,7 +3,7 @@ import Grid from '@mui/material/Grid2';
 import { Component, Device, Interaction, User } from "models";
 import { getContextKeys, getContextTypes } from "pbHelpers/Context";
 import { useDeviceAPI, useGlobalState, useSnackbar } from "providers";
-import { useEffect, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import { useLocation, useParams } from "react-router-dom";
 import PageContainer from "./PageContainer";
 import { useHTTP, useMobile } from "hooks";
@@ -38,7 +38,7 @@ export default function DevicePage() {
   const isMobile = useMobile()
   const deviceID = useParams<{ deviceID: string }>()?.deviceID ?? "";
   const groupID = useParams<{ groupID: string }>()?.groupID ?? "";
-  const { state } = useLocation();
+  const { state, pathname: locationPathname } = useLocation();
   const [{ as, team, user }] = useGlobalState()
   // console.log(state)
   const [device, setDevice] = useState<Device>(state?.device ? Device.create(state.device) : Device.create())
@@ -68,6 +68,14 @@ export default function DevicePage() {
 
   const { token } = useHTTP();
 
+  const liveContextKeys = useMemo(() => getContextKeys(), [locationPathname]);
+  const liveContextTypes = useMemo(() => getContextTypes(), [locationPathname]);
+  /** Matches getDevicePageData: omit ?as= when first context type is "team". */
+  const liveAs =
+    as && !(liveContextTypes.length > 0 && liveContextTypes[0] === "team")
+      ? as
+      : undefined;
+
   const loadDevice = () => {
     if (loading) return
     if (state?.devicePageData) {
@@ -173,7 +181,7 @@ export default function DevicePage() {
   // When the backend receives a new reading and updates a component,
   // this fires and updates the component in state without a page refresh.
   useWebSocket<{ key: string; component: Component } | null>({
-    path: `/live/devices/${deviceID}/components`,
+    path: `/v1/live/devices/${deviceID}/components`,
     parse: (e) => {
       try {
         const raw = JSON.parse(e.data);
@@ -197,6 +205,9 @@ export default function DevicePage() {
         return updated;
       });
     },
+    keys: liveContextKeys,
+    types: liveContextTypes,
+    as: liveAs,
     token,
     enabled: !!deviceID,
   });
@@ -204,7 +215,7 @@ export default function DevicePage() {
   // --- Real-time device updates (optional) ---
   // Updates device-level info (name, status, lastActive, etc.)
   useWebSocket<Device | null>({
-    path: `/live/devices/${deviceID}`,
+    path: `/v1/live/devices/${deviceID}`,
     parse: (e) => {
       try {
         const raw = JSON.parse(e.data);
@@ -223,6 +234,9 @@ export default function DevicePage() {
       if (!updatedDevice) return;
       setDevice(updatedDevice);
     },
+    keys: liveContextKeys,
+    types: liveContextTypes,
+    as: liveAs,
     token,
     enabled: !!deviceID,
   });
diff --git a/src/pages/Devices.tsx b/src/pages/Devices.tsx
index 0a6b9af..ea31e7f 100644
--- a/src/pages/Devices.tsx
+++ b/src/pages/Devices.tsx
@@ -264,10 +264,50 @@ export default function Devices() {
     )
   }, [])
 
+  /** Same context chain as deviceAPI.list / GetContext on the backend (path + group tab + ?as=). */
+  const statusStreamKeys = useMemo(() => {
+    if (tab !== "all") {
+      const g = groups[parseInt(tab)]
+      if (g) {
+        const keys = [...getContextKeys()]
+        keys.push(g.id().toString())
+        return keys
+      }
+    }
+    return getContextKeys()
+  }, [tab, groups, location.pathname])
+
+  const statusStreamTypes = useMemo(() => {
+    if (tab !== "all") {
+      const g = groups[parseInt(tab)]
+      if (g) {
+        const types = [...getContextTypes()]
+        types.push("group")
+        return types
+      }
+    }
+    return getContextTypes()
+  }, [tab, groups, location.pathname])
+
+  /** Match Device page / getDevicePageData: omit ?as= when URL context already starts with team. */
+  const statusStreamAs = useMemo(() => {
+    const types =
+      tab !== "all" && groups[parseInt(tab)]
+        ? [...getContextTypes(), "group"]
+        : getContextTypes()
+    if (as && !(types.length > 0 && types[0] === "team")) {
+      return as
+    }
+    return undefined
+  }, [as, tab, groups, location.pathname])
+
   useDeviceStatusStreams({
     deviceIds,
     onStatusUpdate: handleStatusUpdate,
     token,
+    keys: statusStreamKeys,
+    types: statusStreamTypes,
+    as: statusStreamAs,
     enabled: devices.length > 0 && !!token,
   })
 
diff --git a/src/utils/getWsBaseUrl.ts b/src/utils/getWsBaseUrl.ts
new file mode 100644
index 0000000..331b78a
--- /dev/null
+++ b/src/utils/getWsBaseUrl.ts
@@ -0,0 +1,16 @@
+/**
+ * Origin for Pond WebSocket URLs.
+ *
+ * VITE_APP_API_URL usually ends with /v1 (same base axios uses for REST). WS paths are
+ * written as /v1/live/..., so we strip a trailing /v1 from the env URL to avoid /v1/v1/.
+ */
+export function getWsBaseUrl(): string {
+  const apiUrl = import.meta.env.VITE_APP_API_URL;
+  if (apiUrl) {
+    let ws = apiUrl.replace(/^http/, "ws");
+    ws = ws.replace(/\/v1\/?$/, "");
+    return ws.replace(/\/$/, "") || ws;
+  }
+  const protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
+  return `${protocol}//${window.location.host}`;
+}

From 55a8c12a719488c04c61e59dc38be7154d23c1d7 Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Tue, 21 Apr 2026 16:11:43 -0600
Subject: [PATCH 25/30] for got to save the device availability

---
 src/pbHelpers/DeviceAvailability.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/pbHelpers/DeviceAvailability.ts b/src/pbHelpers/DeviceAvailability.ts
index 6ade54b..e365075 100644
--- a/src/pbHelpers/DeviceAvailability.ts
+++ b/src/pbHelpers/DeviceAvailability.ts
@@ -65,7 +65,8 @@ const DefaultAvailability: DeviceAvailabilityMap = new Map<quack.AddressType, De
       [quack.ComponentType.COMPONENT_TYPE_AIRFLOW, [0x6c]],
       [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]], // the address cables will use when they are plugged into the expander with V2 device only
       [quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE, [0x6d]],
-      [quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY, [0x44]]
+      [quack.ComponentType.COMPONENT_TYPE_TEMP_HUMIDITY, [0x44]],
+      [quack.ComponentType.COMPONENT_TYPE_ANALOG_PRESSURE, [0x6e]]
     ])
   ],
   [quack.AddressType.ADDRESS_TYPE_DAC, [0, 1]],

From 572d1001f8d1ae381ef55dfe1a0f3c530b27940d Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Fri, 12 Jun 2026 15:00:45 -0600
Subject: [PATCH 26/30] proto update

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index f7f3159..eb5437c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -43,7 +43,7 @@
         "mui-tel-input": "^7.0.0",
         "notistack": "^3.0.1",
         "openweathermap-ts": "^1.2.10",
-        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#staging",
+        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#dev",
         "query-string": "^9.2.1",
         "react": "^18.3.1",
         "react-beautiful-dnd": "^13.1.1",
@@ -11294,7 +11294,7 @@
     },
     "node_modules/protobuf-ts": {
       "version": "1.0.0",
-      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#6d889de1a42adf590373ff932823e5e697634c6a",
+      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#807316f6e3473e9416e2366c6081d5a93245d9d9",
       "dependencies": {
         "protobufjs": "^6.8.8"
       }
diff --git a/package.json b/package.json
index 6305212..8298502 100644
--- a/package.json
+++ b/package.json
@@ -56,7 +56,7 @@
     "mui-tel-input": "^7.0.0",
     "notistack": "^3.0.1",
     "openweathermap-ts": "^1.2.10",
-    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#staging",
+    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#dev",
     "query-string": "^9.2.1",
     "react": "^18.3.1",
     "react-beautiful-dnd": "^13.1.1",

From 935ee2c587a8fa8e184184f8461d9db698635c4e Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Wed, 17 Jun 2026 16:30:18 -0600
Subject: [PATCH 27/30] updated dev proto

---
 package-lock.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index eb5437c..310c9a8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11294,7 +11294,7 @@
     },
     "node_modules/protobuf-ts": {
       "version": "1.0.0",
-      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#807316f6e3473e9416e2366c6081d5a93245d9d9",
+      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#0221c17a31b72f7be26ab873ac0e58dc401343ed",
       "dependencies": {
         "protobufjs": "^6.8.8"
       }

From d69d8b38f5a9729374c79f2bc5aea59104bd3a8d Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Fri, 19 Jun 2026 13:25:12 -0600
Subject: [PATCH 28/30] set up the new component types

---
 package-lock.json                             |  4 +-
 package.json                                  |  2 +-
 src/pbHelpers/ComponentType.tsx               | 11 ++-
 src/pbHelpers/ComponentTypes/AmbientI2C.ts    | 79 +++++++++++++++++
 .../ComponentTypes/AmbientOnewire.ts          | 79 +++++++++++++++++
 src/pbHelpers/ComponentTypes/Plenum.ts        | 84 +++++++++++++++++++
 src/pbHelpers/ComponentTypes/index.ts         |  3 +
 src/pbHelpers/DeviceAvailability.ts           |  3 +-
 src/products/Bindapt/BindaptAvailability.ts   |  6 +-
 src/user/ObjectUsers.tsx                      |  1 +
 10 files changed, 264 insertions(+), 8 deletions(-)
 create mode 100644 src/pbHelpers/ComponentTypes/AmbientI2C.ts
 create mode 100644 src/pbHelpers/ComponentTypes/AmbientOnewire.ts
 create mode 100644 src/pbHelpers/ComponentTypes/Plenum.ts

diff --git a/package-lock.json b/package-lock.json
index a6c8aad..b39e4d5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -46,7 +46,7 @@
         "mui-tel-input": "^7.0.0",
         "notistack": "^3.0.1",
         "openweathermap-ts": "^1.2.10",
-        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#sendgrid_whitelabel",
+        "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#plenum_ambient_component",
         "query-string": "^9.2.1",
         "react": "^18.3.1",
         "react-beautiful-dnd": "^13.1.1",
@@ -11752,7 +11752,7 @@
     },
     "node_modules/protobuf-ts": {
       "version": "1.0.0",
-      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#9c0f668d4a56b8216dd71a44c3110a818aaf3541",
+      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#1a3b63d5a2f4c9165642d994c842abecc3f3bffc",
       "dependencies": {
         "protobufjs": "^6.8.8"
       }
diff --git a/package.json b/package.json
index 1fb2505..a1891d0 100644
--- a/package.json
+++ b/package.json
@@ -59,7 +59,7 @@
     "mui-tel-input": "^7.0.0",
     "notistack": "^3.0.1",
     "openweathermap-ts": "^1.2.10",
-    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#sendgrid_whitelabel",
+    "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#plenum_ambient_component",
     "query-string": "^9.2.1",
     "react": "^18.3.1",
     "react-beautiful-dnd": "^13.1.1",
diff --git a/src/pbHelpers/ComponentType.tsx b/src/pbHelpers/ComponentType.tsx
index 047c852..e526858 100644
--- a/src/pbHelpers/ComponentType.tsx
+++ b/src/pbHelpers/ComponentType.tsx
@@ -39,7 +39,10 @@ import {
   Voltage,
   VPD,
   Weight,
-  CapacitorCable
+  CapacitorCable,
+  Plenum,
+  AmbientOnewire,
+  AmbientI2C
 } from "pbHelpers/ComponentTypes";
 //import { multilineGrainCableData } from "pbHelpers/ComponentTypes/GrainCable";
 //import { multilineCapCableData } from "./ComponentTypes/CapacitorCable";
@@ -96,7 +99,11 @@ const COMPONENT_TYPE_MAP = new Map<quack.ComponentType, Function>([
   [quack.ComponentType.COMPONENT_TYPE_SEN5X, Sen5x],
   [quack.ComponentType.COMPONENT_TYPE_VIBRATION_CHAIN, VibrationCable],
   [quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE, dragerGasDongle],
-  [quack.ComponentType.COMPONENT_TYPE_AIRFLOW, Airflow]
+  [quack.ComponentType.COMPONENT_TYPE_AIRFLOW, Airflow],
+  [quack.ComponentType.COMPONENT_TYPE_PLENUM, Plenum],
+  [quack.ComponentType.COMPONENT_TYPE_AMBIENT_ONEWIRE, AmbientOnewire],
+  [quack.ComponentType.COMPONENT_TYPE_AMBIENT_I2C, AmbientI2C],
+
 ]);
 
 export interface Subtype {
diff --git a/src/pbHelpers/ComponentTypes/AmbientI2C.ts b/src/pbHelpers/ComponentTypes/AmbientI2C.ts
new file mode 100644
index 0000000..7a2cbf9
--- /dev/null
+++ b/src/pbHelpers/ComponentTypes/AmbientI2C.ts
@@ -0,0 +1,79 @@
+import TemperatureHumidityDarkIcon from "assets/components/temperatureHumidityDark.png";
+import TemperatureHumidityLightIcon from "assets/components/temperatureHumidityLight.png";
+import { convertedUnitMeasurement } from "models/UnitMeasurement";
+import {
+  AreaChartData,
+  ComponentTypeExtension,
+  GraphFilters,
+  LineChartData,
+  simpleAreaChartData,
+  simpleLineChartData,
+  simpleMeasurements,
+  simpleSummaries,
+  Summary,
+  unitMeasurementSummaries
+} from "pbHelpers/ComponentType";
+import { describeMeasurement } from "pbHelpers/MeasurementDescriber";
+import { pond } from "protobuf-ts/pond";
+import { quack } from "protobuf-ts/quack";
+
+export function AmbientI2C(subtype: number = 0): ComponentTypeExtension {
+  let temperature = describeMeasurement(
+    quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE,
+    quack.ComponentType.COMPONENT_TYPE_AMBIENT_I2C,
+    subtype
+  );
+  let humidity = describeMeasurement(
+    quack.MeasurementType.MEASUREMENT_TYPE_PERCENT,
+    quack.ComponentType.COMPONENT_TYPE_AMBIENT_I2C,
+    subtype
+  );
+  return {
+    type: quack.ComponentType.COMPONENT_TYPE_AMBIENT_I2C,
+    subtypes: [],
+    friendlyName: "Ambient I2C",
+    description: "Measures temperature and humidity",
+    isController: false,
+    isSource: true,
+    isCalibratable: true,
+    addressTypes: [quack.AddressType.ADDRESS_TYPE_I2C],
+    interactionResultTypes: [],
+    states: [],
+    measurements: simpleMeasurements(temperature, humidity),
+    measurementSummary: async function(measurement: quack.Measurement): Promise<Array<Summary>> {
+      return simpleSummaries(measurement, temperature, humidity);
+    },
+    unitMeasurementSummary: (
+      measurements: convertedUnitMeasurement
+    ): Summary[] => {
+      return unitMeasurementSummaries(
+        measurements,
+        quack.ComponentType.COMPONENT_TYPE_AMBIENT_I2C,
+        subtype
+      );
+    },
+    areaChartData: (
+      measurement: pond.UnitMeasurementsForComponent,
+      smoothingAverages?: number,
+      filters?: GraphFilters
+    ): AreaChartData => {
+      return simpleAreaChartData(measurement, smoothingAverages, filters);
+    },
+    lineChartData: (
+      measurement: pond.UnitMeasurementsForComponent,
+      smoothingAverages?: number,
+      filters?: GraphFilters
+    ): LineChartData => {
+      return simpleLineChartData(
+        quack.ComponentType.COMPONENT_TYPE_AMBIENT_I2C,
+        measurement,
+        smoothingAverages,
+        filters
+      );
+    },
+    minMeasurementPeriodMs: 1000,
+    icon: (theme?: "light" | "dark"): string | undefined => {
+      return theme === "light" ? TemperatureHumidityDarkIcon : TemperatureHumidityLightIcon;
+    }
+  };
+}
diff --git a/src/pbHelpers/ComponentTypes/AmbientOnewire.ts b/src/pbHelpers/ComponentTypes/AmbientOnewire.ts
new file mode 100644
index 0000000..4fd394a
--- /dev/null
+++ b/src/pbHelpers/ComponentTypes/AmbientOnewire.ts
@@ -0,0 +1,79 @@
+import TemperatureHumidityDarkIcon from "assets/components/temperatureHumidityDark.png";
+import TemperatureHumidityLightIcon from "assets/components/temperatureHumidityLight.png";
+import { convertedUnitMeasurement } from "models/UnitMeasurement";
+import {
+  AreaChartData,
+  ComponentTypeExtension,
+  GraphFilters,
+  LineChartData,
+  simpleAreaChartData,
+  simpleLineChartData,
+  simpleMeasurements,
+  simpleSummaries,
+  Summary,
+  unitMeasurementSummaries
+} from "pbHelpers/ComponentType";
+import { describeMeasurement } from "pbHelpers/MeasurementDescriber";
+import { pond } from "protobuf-ts/pond";
+import { quack } from "protobuf-ts/quack";
+
+export function AmbientOnewire(subtype: number = 0): ComponentTypeExtension {
+  let temperature = describeMeasurement(
+    quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE,
+    quack.ComponentType.COMPONENT_TYPE_AMBIENT_ONEWIRE,
+    subtype
+  );
+  let humidity = describeMeasurement(
+    quack.MeasurementType.MEASUREMENT_TYPE_PERCENT,
+    quack.ComponentType.COMPONENT_TYPE_AMBIENT_ONEWIRE,
+    subtype
+  );
+  return {
+    type: quack.ComponentType.COMPONENT_TYPE_AMBIENT_ONEWIRE,
+    subtypes: [],
+    friendlyName: "Onewire Ambient",
+    description: "Measures temperature and humidity",
+    isController: false,
+    isSource: true,
+    isCalibratable: true,
+    addressTypes: [quack.AddressType.ADDRESS_TYPE_CONFIGURABLE_PIN_ARRAY],
+    interactionResultTypes: [],
+    states: [],
+    measurements: simpleMeasurements(temperature, humidity),
+    measurementSummary: async function(measurement: quack.Measurement): Promise<Array<Summary>> {
+      return simpleSummaries(measurement, temperature, humidity);
+    },
+    unitMeasurementSummary: (
+      measurements: convertedUnitMeasurement
+    ): Summary[] => {
+      return unitMeasurementSummaries(
+        measurements,
+        quack.ComponentType.COMPONENT_TYPE_AMBIENT_ONEWIRE,
+        subtype
+      );
+    },
+    areaChartData: (
+      measurement: pond.UnitMeasurementsForComponent,
+      smoothingAverages?: number,
+      filters?: GraphFilters
+    ): AreaChartData => {
+      return simpleAreaChartData(measurement, smoothingAverages, filters);
+    },
+    lineChartData: (
+      measurement: pond.UnitMeasurementsForComponent,
+      smoothingAverages?: number,
+      filters?: GraphFilters
+    ): LineChartData => {
+      return simpleLineChartData(
+        quack.ComponentType.COMPONENT_TYPE_AMBIENT_ONEWIRE,
+        measurement,
+        smoothingAverages,
+        filters
+      );
+    },
+    minMeasurementPeriodMs: 1000,
+    icon: (theme?: "light" | "dark"): string | undefined => {
+      return theme === "light" ? TemperatureHumidityDarkIcon : TemperatureHumidityLightIcon;
+    }
+  };
+}
diff --git a/src/pbHelpers/ComponentTypes/Plenum.ts b/src/pbHelpers/ComponentTypes/Plenum.ts
new file mode 100644
index 0000000..687d6fd
--- /dev/null
+++ b/src/pbHelpers/ComponentTypes/Plenum.ts
@@ -0,0 +1,84 @@
+import TemperatureHumidityDarkIcon from "assets/components/temperatureHumidityDark.png";
+import TemperatureHumidityLightIcon from "assets/components/temperatureHumidityLight.png";
+import { convertedUnitMeasurement } from "models/UnitMeasurement";
+import {
+  AreaChartData,
+  ComponentTypeExtension,
+  GraphFilters,
+  LineChartData,
+  simpleAreaChartData,
+  simpleLineChartData,
+  simpleMeasurements,
+  simpleSummaries,
+  Summary,
+  unitMeasurementSummaries
+} from "pbHelpers/ComponentType";
+import { describeMeasurement } from "pbHelpers/MeasurementDescriber";
+import { pond } from "protobuf-ts/pond";
+import { quack } from "protobuf-ts/quack";
+
+export function Plenum(subtype: number = 0): ComponentTypeExtension {
+  let temperature = describeMeasurement(
+    quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE,
+    quack.ComponentType.COMPONENT_TYPE_PLENUM,
+    subtype
+  );
+  let humidity = describeMeasurement(
+    quack.MeasurementType.MEASUREMENT_TYPE_PERCENT,
+    quack.ComponentType.COMPONENT_TYPE_PLENUM,
+    subtype
+  );
+  let pressure = describeMeasurement(
+    quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE,
+    quack.ComponentType.COMPONENT_TYPE_PLENUM,
+    subtype
+  );
+  return {
+    type: quack.ComponentType.COMPONENT_TYPE_PLENUM,
+    subtypes: [],
+    friendlyName: "Plenum",
+    description: "Measures temperature, humidity and pressure",
+    isController: false,
+    isSource: true,
+    isCalibratable: true,
+    addressTypes: [quack.AddressType.ADDRESS_TYPE_CONFIGURABLE_PIN_ARRAY],
+    interactionResultTypes: [],
+    states: [],
+    measurements: simpleMeasurements(temperature, humidity, pressure),
+    measurementSummary: async function(measurement: quack.Measurement): Promise<Array<Summary>> {
+      return simpleSummaries(measurement, temperature, humidity, pressure);
+    },
+    unitMeasurementSummary: (
+      measurements: convertedUnitMeasurement
+    ): Summary[] => {
+      return unitMeasurementSummaries(
+        measurements,
+        quack.ComponentType.COMPONENT_TYPE_PLENUM,
+        subtype
+      );
+    },
+    areaChartData: (
+      measurement: pond.UnitMeasurementsForComponent,
+      smoothingAverages?: number,
+      filters?: GraphFilters
+    ): AreaChartData => {
+      return simpleAreaChartData(measurement, smoothingAverages, filters);
+    },
+    lineChartData: (
+      measurement: pond.UnitMeasurementsForComponent,
+      smoothingAverages?: number,
+      filters?: GraphFilters
+    ): LineChartData => {
+      return simpleLineChartData(
+        quack.ComponentType.COMPONENT_TYPE_PLENUM,
+        measurement,
+        smoothingAverages,
+        filters
+      );
+    },
+    minMeasurementPeriodMs: 1000,
+    icon: (theme?: "light" | "dark"): string | undefined => {
+      return theme === "light" ? TemperatureHumidityDarkIcon : TemperatureHumidityLightIcon;
+    }
+  };
+}
diff --git a/src/pbHelpers/ComponentTypes/index.ts b/src/pbHelpers/ComponentTypes/index.ts
index 349bbbe..ba5912d 100644
--- a/src/pbHelpers/ComponentTypes/index.ts
+++ b/src/pbHelpers/ComponentTypes/index.ts
@@ -29,3 +29,6 @@ export * from "./Voltage";
 export * from "./VPD";
 export * from "./Weight";
 export * from "./CapacitorCable";
+export * from "./Plenum";
+export * from "./AmbientOnewire";
+export * from "./AmbientI2C";
diff --git a/src/pbHelpers/DeviceAvailability.ts b/src/pbHelpers/DeviceAvailability.ts
index 972c2e2..a7d747e 100644
--- a/src/pbHelpers/DeviceAvailability.ts
+++ b/src/pbHelpers/DeviceAvailability.ts
@@ -64,7 +64,8 @@ const DefaultAvailability: DeviceAvailabilityMap = new Map<quack.AddressType, De
       [quack.ComponentType.COMPONENT_TYPE_SEN5X, [0x69]],
       [quack.ComponentType.COMPONENT_TYPE_AIRFLOW, [0x6c]],
       [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]], // the address cables will use when they are plugged into the expander with V2 device only
-      [quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE, [0x6d]] 
+      [quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE, [0x6d]],
+      [quack.ComponentType.COMPONENT_TYPE_AMBIENT_I2C, [0x44]]
     ])
   ],
   [quack.AddressType.ADDRESS_TYPE_DAC, [0, 1]],
diff --git a/src/products/Bindapt/BindaptAvailability.ts b/src/products/Bindapt/BindaptAvailability.ts
index 89b3a47..4925878 100644
--- a/src/products/Bindapt/BindaptAvailability.ts
+++ b/src/products/Bindapt/BindaptAvailability.ts
@@ -252,7 +252,8 @@ export const BindaptV2MonitorAvailability: DeviceAvailabilityMap = new Map<
       [quack.ComponentType.COMPONENT_TYPE_LIDAR, [0x62, 0x66, 0x10]],
       [quack.ComponentType.COMPONENT_TYPE_CO2, [0x61]],
       [quack.ComponentType.COMPONENT_TYPE_SEN5X, [0x69]],
-      [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]]
+      [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]],
+      [quack.ComponentType.COMPONENT_TYPE_AMBIENT_I2C, [0x44]]
     ])
   ],
   [quack.AddressType.ADDRESS_TYPE_POWER, [0]],
@@ -285,7 +286,8 @@ export const BindaptV2AutomateAvailability: DeviceAvailabilityMap = new Map<
       [quack.ComponentType.COMPONENT_TYPE_LIDAR, [0x62, 0x66, 0x10]],
       [quack.ComponentType.COMPONENT_TYPE_CO2, [0x61]],
       [quack.ComponentType.COMPONENT_TYPE_SEN5X, [0x69]],
-      [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]]
+      [quack.ComponentType.COMPONENT_TYPE_GRAIN_CABLE, [0x71]],
+      [quack.ComponentType.COMPONENT_TYPE_AMBIENT_I2C, [0x44]]
     ])
   ],
   [quack.AddressType.ADDRESS_TYPE_POWER, [0]],
diff --git a/src/user/ObjectUsers.tsx b/src/user/ObjectUsers.tsx
index 4facea6..ce28936 100644
--- a/src/user/ObjectUsers.tsx
+++ b/src/user/ObjectUsers.tsx
@@ -169,6 +169,7 @@ export default function ObjectUsers(props: Props) {
     userAPI
       .listObjectUsers(scope)
       .then((response: any) => {
+        console.log(response)
         let rUsers: User[] = [];
         or(response.data, { users: [] }).users.forEach((user: any) => {
           rUsers.push(User.any(user));

From f99f30a15eec57e566812ff10976aae288207311 Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Fri, 19 Jun 2026 13:43:14 -0600
Subject: [PATCH 29/30] protobuf update

---
 package-lock.json               | 2 +-
 src/pbHelpers/ComponentType.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 03cb147..103cc12 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11752,7 +11752,7 @@
     },
     "node_modules/protobuf-ts": {
       "version": "1.0.0",
-      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#807316f6e3473e9416e2366c6081d5a93245d9d9",
+      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#37cd2eecd9e83d9ec7cf351965351b13a3b930f7",
       "dependencies": {
         "protobufjs": "^6.8.8"
       }
diff --git a/src/pbHelpers/ComponentType.tsx b/src/pbHelpers/ComponentType.tsx
index 7b6cba7..2d8c5c0 100644
--- a/src/pbHelpers/ComponentType.tsx
+++ b/src/pbHelpers/ComponentType.tsx
@@ -40,7 +40,7 @@ import {
   VPD,
   Weight,
   CapacitorCable,
-  AnalogPressure
+  AnalogPressure,
   Plenum,
   AmbientOnewire,
   AmbientI2C

From 9216d5ee273b18134d1d0980a1f40bccebef4992 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Thu, 9 Jul 2026 13:42:36 -0600
Subject: [PATCH 30/30] updated dev protobuf

---
 package-lock.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index fca6997..003dafa 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11803,7 +11803,7 @@
     },
     "node_modules/protobuf-ts": {
       "version": "1.0.0",
-      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#37cd2eecd9e83d9ec7cf351965351b13a3b930f7",
+      "resolved": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#e61049af5dd297179d5a88650cf40edb2eef8b4d",
       "dependencies": {
         "protobufjs": "^6.8.8"
       }