From 47d50194c5c873a7963dad7704158b023914cc64 Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Thu, 3 Apr 2025 15:43:07 -0600
Subject: [PATCH] restore functionality of the table

---
 src/pages/Heaters.tsx | 107 +++++++++++++++---------------------------
 1 file changed, 39 insertions(+), 68 deletions(-)

diff --git a/src/pages/Heaters.tsx b/src/pages/Heaters.tsx
index 01dcb3d..b7eb35e 100644
--- a/src/pages/Heaters.tsx
+++ b/src/pages/Heaters.tsx
@@ -1,6 +1,6 @@
-import { List } from "@mui/material";
+import { List, Typography } from "@mui/material";
 import DeviceLinkDrawer from "common/DeviceLinkDrawer";
-import ResponsiveTable from "common/ResponsiveTable";
+import ResponsiveTable, { Column } from "common/ResponsiveTable";
 //import { getTableIcons } from "common/ResponsiveTable";
 import { useMobile } from "hooks";
 //import MaterialTable from "material-table";
@@ -51,78 +51,49 @@ export default function Heaters() {
     navigate(path, {state: { heater: heater, devices: devices}})
   };
 
+  const columns = (): Column<pond.ObjectHeaterData>[] => {
+    return [
+      {
+        title: "Heater",
+        render: row => (<Typography>{row.heater?.name}</Typography>)
+      },
+      {
+        title: "Site",
+        render: row => (<Typography>{row.site?.settings?.siteName}</Typography>)
+      },
+      {
+        title: "Make",
+        render: row => (<Typography>{row.heater?.settings?.make}</Typography>)
+      },
+      {
+        title: "Model",
+        render: row => (<Typography>{row.heater?.settings?.model}</Typography>)
+      },
+      {
+        title: "Device",
+        render: row => {
+          let display: string | number | undefined = "No Device Found"      
+          if (row.devices.length > 0) {
+            if (row.devices[0].device?.settings?.name) {
+              display = row.devices[0].device?.settings?.name;
+                } else {
+                  display = row.devices[0].device?.settings?.deviceId;
+                }
+          }
+          return (<Typography>{display}</Typography>)
+        }
+      }
+    ]
+  }
+
   const desktopTable = () => {
-    // return (
-    //   <MaterialTable
-    //     columns={[
-    //       {
-    //         title: "Heater",
-    //         field: "heater.name",
-    //         headerStyle: {
-    //           fontWeight: 650,
-    //           fontSize: 20
-    //         }
-    //       },
-    //       {
-    //         title: "Site",
-    //         field: "site.settings.siteName",
-    //         headerStyle: {
-    //           fontWeight: 650,
-    //           fontSize: 20
-    //         }
-    //       },
-    //       {
-    //         title: "Make",
-    //         field: "heater.settings.make",
-    //         headerStyle: {
-    //           fontWeight: 650,
-    //           fontSize: 20
-    //         }
-    //       },
-    //       {
-    //         title: "Model",
-    //         field: "heater.settings.model",
-    //         headerStyle: {
-    //           fontWeight: 650,
-    //           fontSize: 20
-    //         }
-    //       },
-    //       {
-    //         title: "Device",
-    //         headerStyle: {
-    //           fontWeight: 650,
-    //           fontSize: 20
-    //         },
-    //         render: rowData => {
-    //           if (rowData.devices.length > 0) {
-    //             if (rowData.devices[0].device?.settings?.name) {
-    //               return rowData.devices[0].device?.settings?.name;
-    //             } else {
-    //               return rowData.devices[0].device?.settings?.deviceId;
-    //             }
-    //           } else {
-    //             return "No Device Found";
-    //           }
-    //         }
-    //       }
-    //     ]}
-    //     data={heaters}
-    //     icons={getTableIcons()}
-    //     onRowClick={(_, heaterData) => {
-    //       heaterData && goToHeater(ObjectHeater.any(heaterData.heater), heaterData.devices);
-    //     }}
-    //     title={"Heaters"}
-    //     options={{
-    //       pageSize: 10
-    //     }}
-    //   />
-    // );
     return (
-      <ResponsiveTable 
+      <ResponsiveTable<pond.ObjectHeaterData>
         page={tablePage}
         pageSize={pageSize}
         total={total}
         rows={heaters}
+        columns={columns}
         setPage={(page)=>{setTablePage(page)}}
         handleRowsPerPageChange={()=>{}}
       />