From 9e52b7ca60fd9891da6d07c67f89f97ae6f497ee Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 2 Jun 2025 17:47:21 -0400
Subject: tweaks to tablebox to show bottom line of bottom row

---
 src/client/views/nodes/DataVizBox/components/TableBox.tsx | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

(limited to 'src/client/views/nodes/DataVizBox/components')

diff --git a/src/client/views/nodes/DataVizBox/components/TableBox.tsx b/src/client/views/nodes/DataVizBox/components/TableBox.tsx
index 21bef3426..60f1f2d58 100644
--- a/src/client/views/nodes/DataVizBox/components/TableBox.tsx
+++ b/src/client/views/nodes/DataVizBox/components/TableBox.tsx
@@ -111,6 +111,7 @@ export class TableBox extends ObservableReactComponent<TableBoxProps> {
     @action handleScroll = () => {
         if (!this._props.docView?.()?.ContentDiv?.hidden) {
             this._scrollTop = this._containerRef?.scrollTop ?? 0;
+            console.log('scrollTop', this._scrollTop, this.startID * Number(DATA_VIZ_TABLE_ROW_HEIGHT));
         }
     };
     @action
@@ -400,13 +401,12 @@ export class TableBox extends ObservableReactComponent<TableBoxProps> {
                                     this._tableHeight = r?.getBoundingClientRect().height ?? 0;
                                 }
                             })}>
-                            {/* <div style={{ height: this.startID * Number(DATA_VIZ_TABLE_ROW_HEIGHT) }} /> */}
                             <thead>
-                                <tr style={{ height: this.startID * Number(DATA_VIZ_TABLE_ROW_HEIGHT) }}></tr>
+                                <tr style={{ height: this.startID * Number(DATA_VIZ_TABLE_ROW_HEIGHT) }} />
                                 <tr>
-                                    {this.columns.map(col => (
+                                    {this.columns.map((col, i) => (
                                         <th
-                                            key={this.columns.indexOf(col)}
+                                            key={i}
                                             style={{
                                                 color:
                                                     this._props.axes.slice().reverse().lastElement() === col
@@ -457,23 +457,22 @@ export class TableBox extends ObservableReactComponent<TableBoxProps> {
                                                             : '',
                                                 border: rowId === this._props.specHighlightedRow ? `solid 3px ${Colors.MEDIUM_BLUE}` : '',
                                             }}>
-                                            {this.columns.map(col => {
+                                            {this.columns.map((col, i) => {
                                                 let colSelected = false;
                                                 if (this._props.axes.length > 2) colSelected = this._props.axes[0] === col || this._props.axes[1] === col || this._props.axes[2] === col;
                                                 else if (this._props.axes.length > 1) colSelected = this._props.axes[0] === col || this._props.axes[1] === col;
                                                 else if (this._props.axes.length > 0) colSelected = this._props.axes[0] === col;
                                                 if (this._props.titleCol === col) colSelected = true;
                                                 return (
-                                                    <td key={this.columns.indexOf(col)} style={{ border: colSelected ? '3px solid black' : '1px solid black', fontWeight: colSelected ? 'bolder' : 'normal' }}>
+                                                    <td key={i} style={{ border: (colSelected ? '3' : '1') + 'px solid black', fontWeight: colSelected ? 'bolder' : 'normal' }}>
                                                         <div className="tableBox-cell">{this._props.records[rowId][col] as string | number}</div>
                                                     </td>
                                                 );
                                             })}
                                         </tr>
                                     ))}
-                                <tr style={{ height: (this._tableDataIds.length - this.endID) * Number(DATA_VIZ_TABLE_ROW_HEIGHT) }}></tr>
+                                <tr style={{ display: this._tableDataIds.length - this.endID ? undefined : 'none', height: (this._tableDataIds.length - this.endID) * Number(DATA_VIZ_TABLE_ROW_HEIGHT) }} />
                             </tbody>
-                            {/* <div style={{ height: (this._tableDataIds.length - this.endID) * Number(DATA_VIZ_TABLE_ROW_HEIGHT) }} /> */}
                         </table>
                     </div>
                 </div>
-- 
cgit v1.2.3-70-g09d2