From 4cc8549227e829c9454f80b4983c0d4b6c31e7d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Maxime=20M=C3=A9riouma-Caron?=
 <meriouma@users.noreply.github.com>
Date: Wed, 11 Dec 2024 21:37:27 -0500
Subject: [PATCH] fixup! fixup! fixup! feat(Table): support providing selected
 rows to sync with external model

---
 packages/react/src/components/table/table.tsx |  4 +-
 .../src/components/table/utils/table-utils.ts | 57 +++++++------------
 packages/react/src/utils/object.ts            | 46 ---------------
 3 files changed, 24 insertions(+), 83 deletions(-)
 delete mode 100644 packages/react/src/utils/object.ts

diff --git a/packages/react/src/components/table/table.tsx b/packages/react/src/components/table/table.tsx
index 10a2da988..e4bde6edf 100644
--- a/packages/react/src/components/table/table.tsx
+++ b/packages/react/src/components/table/table.tsx
@@ -17,7 +17,6 @@ import { Fragment, ReactElement, useEffect, useMemo, useRef, useState } from 're
 import styled from 'styled-components';
 import { useTranslation } from '../../i18n/use-translation';
 import { devConsole } from '../../utils/dev-console';
-import { isEqual } from '../../utils/object';
 import { v4 as uuid } from '../../utils/uuid';
 import { IconButton } from '../buttons';
 import { Checkbox } from '../checkbox/checkbox';
@@ -27,6 +26,7 @@ import { TableFooter } from './table-footer';
 import { TableHeader } from './table-header';
 import { StyledTableRow, TableRow } from './table-row';
 import { TableColumn, TableData } from './types';
+import { isSameRowSelectionState } from './utils/table-utils';
 
 type RowSize = 'small' | 'medium' | 'large';
 
@@ -479,7 +479,7 @@ export const Table = <T extends object>({
             return acc;
         }, {} satisfies RowSelectionState);
 
-        if (!isEqual(currentRowSelection, newSelection)) {
+        if (!isSameRowSelectionState(currentRowSelection, newSelection)) {
             setRowSelection(newSelection);
         }
         setPreviousSelectedRows(selectedRows);
diff --git a/packages/react/src/components/table/utils/table-utils.ts b/packages/react/src/components/table/utils/table-utils.ts
index 8528635ae..cf89113cd 100644
--- a/packages/react/src/components/table/utils/table-utils.ts
+++ b/packages/react/src/components/table/utils/table-utils.ts
@@ -1,4 +1,25 @@
-import { Column } from '@tanstack/react-table';
+import { type Column, type RowSelectionState } from '@tanstack/react-table';
+
+export function isSameRowSelectionState(obj1: RowSelectionState, obj2: RowSelectionState): boolean {
+    if (obj1 === obj2) {
+        return true;
+    }
+
+    const keys1 = Object.keys(obj1);
+    const keys2 = Object.keys(obj2);
+    if (keys1.length !== keys2.length) {
+        return false;
+    }
+
+    for (let i = 0; i < keys1.length; i++) {
+        const key = keys1[i];
+        if (obj1[key] !== obj2[key]) {
+            return false;
+        }
+    }
+
+    return true;
+}
 
 export function calculateStickyColumns(
     stickyColumns: boolean[],
@@ -32,40 +53,6 @@ export function calculateStickyHeader(
     });
 }
 
-export function calculateStickyFooter(
-    stickyColumns: boolean[],
-    footerCells: NodeListOf<HTMLTableCellElement>,
-): void {
-    Array.from(footerCells).forEach((footerCell, index) => {
-        footerCell.style.setProperty('bottom', '0px');
-        footerCell.style.setProperty('z-index', stickyColumns[index] ? '5' : '4');
-    });
-}
-
-export function calculateStickyPosition(
-    stickyColumns: boolean[],
-    stickyHeader: boolean,
-    stickyFooter: boolean,
-    tableRef: React.RefObject<HTMLTableElement>,
-): void {
-    if (tableRef.current === null) {
-        return;
-    }
-    const headerCells = tableRef.current.querySelectorAll('th');
-    const rows = tableRef.current.querySelectorAll<HTMLTableRowElement>('tbody > tr');
-    const footerCells = tableRef.current.querySelector('tfoot')?.querySelectorAll('td');
-
-    calculateStickyColumns(stickyColumns, headerCells, rows);
-
-    if (stickyHeader) {
-        calculateStickyHeader(stickyColumns, headerCells);
-    }
-
-    if (stickyFooter && footerCells !== null && footerCells !== undefined) {
-        calculateStickyFooter(stickyColumns, footerCells);
-    }
-}
-
 export function isAGroupColumn<TData, TValue>(column: Column<TData, TValue>): boolean {
     return column.columns.length > 0;
 }
diff --git a/packages/react/src/utils/object.ts b/packages/react/src/utils/object.ts
deleted file mode 100644
index 92063d51d..000000000
--- a/packages/react/src/utils/object.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-function hasKey<K extends PropertyKey>(obj: unknown, key: K): obj is { [key in K]: unknown } {
-    return Object.prototype.hasOwnProperty.call(obj, key);
-}
-
-export function isEqual(obj1: unknown, obj2: unknown): boolean {
-    if (obj1 === obj2) {
-        return true;
-    }
-
-    if (obj1 === null || obj2 === null || typeof obj1 === 'undefined' || typeof obj2 === 'undefined') {
-        return false;
-    }
-
-    if (typeof obj1 !== typeof obj2) {
-        return false;
-    }
-
-    if (typeof obj1 !== 'object') {
-        return obj1 === obj2;
-    }
-
-    if (Array.isArray(obj1) && Array.isArray(obj2)) {
-        if (obj1.length !== obj2.length) {
-            return false;
-        }
-        for (let i = 0; i < obj1.length; i++) {
-            if (!isEqual(obj1[i], obj2[i])) {
-                return false;
-            }
-        }
-        return true;
-    }
-
-    const keys1 = Object.keys(obj1);
-    const keys2 = Object.keys(obj2);
-    if (keys1.length !== keys2.length || !keys1.every((key) => keys2.includes(key))) {
-        return false;
-    }
-    for (let i = 0; i < keys1.length; i++) {
-        const key = keys1[i];
-        if (!hasKey(obj2, key) || !hasKey(obj1, key) || !isEqual(obj1[key], obj2[key])) {
-            return false;
-        }
-    }
-    return true;
-}