responsive columns can now be a column type or a function the returns the type

src/common/ResponsiveTable.tsx

@@ -69,7 +69,7 @@ export interface Column<T> {
 
 interface Props<T> {
   rows: T[],
-  columns?: Column<T>[],
+  columns?: Column<T>[] | (() => Column<T>[]),
   title?: string | JSX.Element;
   subtitle?: string | JSX.Element;
   total: number,
@@ -103,7 +103,7 @@ export default function ResponsiveTable<T extends Object>(props: Props<T>) {
     setSearchText, 
     isLoading,
     multiGutter,
-    columns,
+    // columns,
     rowsPerPageOptions,
     noDataMessage,
     renderMobile,
@@ -112,6 +112,7 @@ export default function ResponsiveTable<T extends Object>(props: Props<T>) {
     actions
   } = props
   const classes = useStyles();
+  const columns = typeof(props.columns) === "function" ? props.columns() : props.columns
 
   const isMobile = useMobile()
 

src/group/GroupActions.tsx

@@ -24,6 +24,7 @@ import RemoveSelfFromObject from "user/RemoveSelfFromObject";
 import ShareObject from "user/ShareObject";
 import { isOffline } from "utils/environment";
 import { makeStyles } from "@mui/styles";
+import ObjectTeams from "teams/ObjectTeams";
 
 // const useStyles = makeStyles((theme: Theme) => {
 //   // const isMobile = useMobile()
@@ -166,14 +167,14 @@ export default function GroupActions(props: Props) {
           closeDialogCallback={() => setUsersOpen(false)}
           refreshCallback={refreshCallback}
         />
-        {/* <ObjectTeams
+        <ObjectTeams
           scope={groupScope(key)}
           label={label}
           permissions={permissions}
           isDialogOpen={teamsOpen}
           closeDialogCallback={() => setTeamsOpen(false)}
           refreshCallback={refreshCallback}
-        /> */}
+        />
         <RemoveSelfFromObject
           scope={groupScope(key)}
           label={label}

src/pages/Devices.tsx

@@ -303,15 +303,15 @@ export default function Devices() {
         render: (device: Device) => {
           if (device.status.plenum?.temperature) {
             return (
-              <Grid2 container direction="column" margin={1} marginLeft={2}>
+              <Grid2 container direction="column" marginLeft={2}>
                 <Grid2>
                   <Typography variant="body2" style={{ color: orange[300]}}>
-                    {device.status.plenum.temperature}°C
+                    {device.status.plenum.temperature.toFixed(1)}°C
                   </Typography>
                 </Grid2>
                 <Grid2>
                   <Typography variant="body2" color="info">
-                    {device.status.plenum.humidity}%
+                    {device.status.plenum.humidity.toFixed(1)}%
                   </Typography>
                 </Grid2>
               </Grid2>
@@ -405,7 +405,7 @@ export default function Devices() {
                 </Typography>
               </Grid2>
               <Grid2 >
-                <Typography marginRight={1}>
+                <Typography style={{ marginRight: 6 }}>
                   {", "}
                 </Typography>
               </Grid2>
@@ -454,8 +454,8 @@ export default function Devices() {
         title={<SmartBreadcrumb prependPaths={getGroup() && ["groups", getGroup().id().toString()]} groupName={getGroup() && getGroup().name()} paddingBottom={1}/>}
         subtitle={subtitle()}
         rows={devices}
-        renderGutter={gutter}
+        renderGutter={ isMobile ? gutter : undefined }
-        columns={columns()}
+        columns={columns}
         renderMobile={mobile}
         total={total}
         pageSize={limit}

src/pages/Group.tsx

@@ -117,9 +117,6 @@ export default function GroupPage() {
 
 
   const loadDevices = () => {
-    console.log(getContextKeys())
-    console.log(getContextTypes())
-    console.log(limit)
     setLoadingDevices(true)
     deviceAPI.list(
       limit, 
@@ -136,7 +133,6 @@ export default function GroupPage() {
       getKeys(),
       getTypes()
     ).then(resp => {
-      console.log(resp.data)
       let newDevices: Device[] = [];
       resp.data.devices.forEach(device => {
         newDevices.push(Device.create(device))