From b7c2354b834368f45fd0bd8b78955deb3f7b6e1f Mon Sep 17 00:00:00 2001
From: csawatzky <chris@adaptiveagriculture.ca>
Date: Mon, 17 Mar 2025 11:58:59 -0600
Subject: [PATCH] updated the diff history and responsive table to allow hidden
 on the columns and to put the history data in the gutter on the mobile/drawer
 view

---
 src/common/DiffHistory.tsx     | 15 ++++++++++++++-
 src/common/ResponsiveTable.tsx |  5 +++--
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/common/DiffHistory.tsx b/src/common/DiffHistory.tsx
index 206140e..25113db 100644
--- a/src/common/DiffHistory.tsx
+++ b/src/common/DiffHistory.tsx
@@ -444,7 +444,7 @@ export default function DiffHistory(props: Props) {
     {
       title: "Summary",
       cellStyle: cellStyle,
-      // hidden: isMobile || drawer,
+      hidden: isMobile || drawer,
       render: row => (
         <Summary
           variant="inline"
@@ -473,6 +473,19 @@ export default function DiffHistory(props: Props) {
     <ResponsiveTable<RowData>
       title={showTitle ? name + " History" : undefined}
       rows={data} 
+      renderGutter={((row) => (
+        <Summary
+          variant="inline"
+          kind={kind}
+          changes={row.changes}
+          before={row.before}
+          after={row.after}
+          diff={row.diff}
+          translateKey={translateKey}
+          translateValue={translateValue}
+          type={row.type}
+        />
+      ))}
       columns={columns()}
       total={0} 
       pageSize={0} 
diff --git a/src/common/ResponsiveTable.tsx b/src/common/ResponsiveTable.tsx
index 83567ba..e4d3184 100644
--- a/src/common/ResponsiveTable.tsx
+++ b/src/common/ResponsiveTable.tsx
@@ -64,6 +64,7 @@ const useStyles = makeStyles((theme: Theme) => {
 export interface Column<T> {
   title: string;
   cellStyle?: SxProps<Theme>;
+  hidden?: boolean;
   render: (row: T) => JSX.Element;
 }
 
@@ -401,7 +402,7 @@ export default function ResponsiveTable<T extends Object>(props: Props<T>) {
             { renderGutter && <TableCell></TableCell>}
             { columns ?
               columns.map((column, index) => {
-                if (filterList.includes(column.title)) return null
+                if (filterList.includes(column.title) || column.hidden) return null
                 return (
                   <TableCell key={"header-cell-"+index}>
                     {column.title}
@@ -449,7 +450,7 @@ export default function ResponsiveTable<T extends Object>(props: Props<T>) {
                     }
                     {columns ? 
                       columns.map((column, j) => {
-                        if (filterList.includes(column.title)) return null
+                        if (filterList.includes(column.title) || column.hidden) return null
                         if (column.render) return (
                           <TableCell key={"row-"+index+"cell-"+j} sx={column.cellStyle ? column.cellStyle : {padding: 0}}>
                             {column.render(row)}