updated the component and device api's to have as be a parameter for the function

src/pages/Bin.tsx

@@ -414,7 +414,7 @@ export default function Bin(props: Props) {
   const reLoadSingleComponent = (componentKey: string) => {
     let dev = componentDevices.get(componentKey);
     if (dev) {
-      componentAPI.get(dev, componentKey).then(resp => {
+      componentAPI.get(dev, componentKey, undefined, undefined, as).then(resp => {
         let compMap = components;
         let comp = Component.any(resp.data);
         compMap.set(comp.key(), comp);

src/pages/Device.tsx

@@ -54,7 +54,7 @@ export default function DevicePage() {
     // console.log("load device page data")
     if (loading) return
     setLoading(true)
-    deviceAPI.getPageData(deviceID, getContextKeys(), getContextTypes()).then(resp => {
+    deviceAPI.getPageData(deviceID, getContextKeys(), getContextTypes(), as).then(resp => {
       let device = Device.any(resp.data.device)
       // console.log(resp.data.device)
       setDevice(device)
@@ -143,13 +143,13 @@ export default function DevicePage() {
 
   useEffect(() => {
     loadDevice()
-  }, [deviceID])
+  }, [deviceID, as])
 
   const toggleNotificationPreference = () => {
     let updatedPreferences = cloneDeep(preferences);
     updatedPreferences.notify = !preferences.notify;
     deviceAPI
-      .updatePreferences(deviceID, updatedPreferences, getContextKeys(), getContextTypes())
+      .updatePreferences(deviceID, updatedPreferences, getContextKeys(), getContextTypes(), as)
       .then(() => setPreferences(updatedPreferences))
       .catch(() => {
         snackbar.error(

src/pages/DeviceComponent.tsx

@@ -166,7 +166,8 @@ export default function DeviceComponent() {
         false,
         getContextKeys(),
         getContextTypes(),
-        showErrors
+        showErrors,
+        as
       )
       .then(resp => {
         if (resp.data.measurements) {
@@ -179,7 +180,7 @@ export default function DeviceComponent() {
       .finally(() => {
         setSampling(false);
       });
-  }, [componentAPI, deviceID, componentID, user, startDate, endDate, showErrors]);
+  }, [componentAPI, deviceID, componentID, user, startDate, endDate, showErrors, as]);
 
   useEffect(() => {
     if (live.current && liveSamples) {
@@ -206,7 +207,7 @@ export default function DeviceComponent() {
     if (user.settings.id === "") return;
     setLoadingInitial(true);
     deviceAPI
-      .get(deviceID, false, getContextKeys().slice(0, -1), getContextTypes().slice(0, -1))
+      .get(deviceID, false, getContextKeys().slice(0, -1), getContextTypes().slice(0, -1), as)
       .then((response: any) => {
         const rDevice = Device.any(response.data);
         setDevice(rDevice);
@@ -215,10 +216,11 @@ export default function DeviceComponent() {
           false,
           getContextKeys(),
           getContextTypes(),
-          true
+          true,
+          as
         );
         let userPromise = userAPI.getUser(user.settings.id, deviceScope(deviceID.toString()));
-        let prefPromise = deviceAPI.listDeviceComponentPreferences(deviceID, getContextKeys().slice(0, -1), getContextTypes().slice(0, -1));
+        let prefPromise = deviceAPI.listDeviceComponentPreferences(deviceID, getContextKeys().slice(0, -1), getContextTypes().slice(0, -1), as);
         Promise.all([componentsPromise, userPromise, prefPromise])
           .then((responses: any) => {
             const rawComponents: Array<any> = or(responses[0].data.components, []).sort(
@@ -427,7 +429,8 @@ export default function DeviceComponent() {
       undefined,
       getContextKeys(),
       getContextTypes(),
-      showErrors
+      showErrors,
+      as
     )
     .then(response => {
       let total: number = response.data.total ? response.data.total : 0;
@@ -458,7 +461,7 @@ export default function DeviceComponent() {
 
   useEffect(() => {
     load()
-  }, [page, pageSize])
+  }, [page, pageSize, as])
 
   const columns = (): Column<convertedUnitMeasurement>[] => {
     return [

src/pages/DeviceHistory.tsx

@@ -10,6 +10,7 @@ import { useEffect, useState } from "react";
 import { useParams } from "react-router";
 import DeviceHistory from "device/DeviceHistory";
 import { makeStyles } from "@mui/styles";
+import { useGlobalState } from "providers";
 
 const useStyles = makeStyles((theme: Theme) => {
   return ({
@@ -24,6 +25,7 @@ interface Props {}
 export default function DeviceHistoryPage(_props: Props) {
   const classes = useStyles();
   const { error } = useSnackbar();
+  const [{as}] = useGlobalState();
   const deviceAPI = useDeviceAPI();
   const deviceID = useParams<{ deviceID: string }>()?.deviceID ?? "";
   const [device, setDevice] = useState(Device.any({ settings: { deviceId: deviceID } }));
@@ -32,7 +34,7 @@ export default function DeviceHistoryPage(_props: Props) {
   useEffect(() => {
     (async function load() {
       await deviceAPI
-        .get(deviceID)
+        .get(deviceID, undefined, undefined, undefined, as)
         .then((response: any) => {
           setDevice(Device.any(response.data));
         })

src/pages/Devices.tsx

@@ -212,6 +212,7 @@ export default function Devices() {
       getTypes(),
       fieldContains,
       search,
+      as
     ).then(resp => {
       let newDevices: Device[] = []
       resp.data.devices.forEach(device => {

src/pages/Group.tsx

@@ -4,7 +4,7 @@ import { Device, Group } from "models"
 import { useEffect, useState } from "react"
 import { useLocation, useNavigate, useParams } from "react-router-dom";
 import PageContainer from "./PageContainer";
-import { useDeviceAPI, useGroupAPI } from "providers";
+import { useDeviceAPI, useGlobalState, useGroupAPI } from "providers";
 import GroupActions from "group/GroupActions";
 import { pond } from "protobuf-ts/pond";
 import { getContextKeys, getContextTypes } from "pbHelpers/Context";
@@ -66,6 +66,7 @@ export default function GroupPage() {
   
   const groupID = parseInt(useParams<{ groupID: string }>()?.groupID ?? "0");
   const { state } = useLocation();
+  const [{as}] = useGlobalState();
   const [group, setGroup] = useState<Group>(state?.group ? Group.create(state.group) : Group.create())
   const [loadingGroup, setLoadingGroup] = useState(false)
   const [loadingDevices, setLoadingDevices] = useState(false)
@@ -131,7 +132,10 @@ export default function GroupPage() {
       undefined,
       undefined,
       getKeys(),
-      getTypes()
+      getTypes(),
+      undefined,
+      undefined,
+      as
     ).then(resp => {
       let newDevices: Device[] = [];
       resp.data.devices.forEach(device => {

src/pages/Heater.tsx

@@ -166,7 +166,10 @@ export default function Heater() {
             true,
             true,
             [heaterID],
-            ["objectHeater"]
+            ["objectHeater"],
+            undefined,
+            undefined,
+            as
           )
           .then(resp => {
             setLoadingDevs(false);
@@ -185,7 +188,7 @@ export default function Heater() {
           });
       }
     }
-  }, [location, heaterAPI, heaterID, deviceAPI]); //eslint-disable-line react-hooks/exhaustive-deps
+  }, [location, heaterAPI, heaterID, deviceAPI, as]); //eslint-disable-line react-hooks/exhaustive-deps
 
   const disconnectDisplayDevice = () => {
     if (displayDevice) {