fix: sorting not working with memoised rows

DATATR-1763 Signed-off-by: Jonathan Perchoc <[email protected]>
ovh · Dec 16, 2024 · 878f3d5 · 878f3d5
1 parent 14ef407
commit 878f3d5
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 7 deletions.
diff --git a/packages/manager/apps/pci-databases-analytics/src/components/data-table/DataTable.tsx b/packages/manager/apps/pci-databases-analytics/src/components/data-table/DataTable.tsx
@@ -22,7 +22,7 @@ interface DatatableProps<TData> {
 export function DataTable<TData>({
   renderRowExpansion,
 }: DatatableProps<TData>) {
-  const { table, globalFilter, columnFilters, data } = useDataTableContext();
+  const { table, rows } = useDataTableContext();
   const { t } = useTranslation('pci-databases-analytics/components/data-table');
   const [expandedRows, setExpandedRows] = useState<Record<string, boolean>>({});
 
@@ -33,12 +33,6 @@ export function DataTable<TData>({
     }));
   };
 
-  const rows = useMemo(() => table.getRowModel()?.rows, [
-    table,
-    globalFilter,
-    columnFilters.filters,
-    data,
-  ]);
   const headerGroups = table.getHeaderGroups();
   return (
     <Table>

diff --git a/packages/manager/apps/pci-databases-analytics/src/components/data-table/DataTableContext.tsx b/packages/manager/apps/pci-databases-analytics/src/components/data-table/DataTableContext.tsx
@@ -1,5 +1,6 @@
 import {
   ColumnDef,
+  Row,
   SortingState,
   Table,
   getCoreRowModel,
@@ -31,6 +32,8 @@ interface DataTableContextValue<TData> {
   globalFilter: string;
   data: TData[];
   filteredData: TData[];
+  sorting: SortingState;
+  rows: Row<TData>[];
 }
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -76,14 +79,26 @@ export function DataTableProvider<TData, TValue>({
     },
     globalFilterFn: 'auto',
   });
+
+  const rows = useMemo(() => table.getRowModel()?.rows, [
+    table,
+    globalFilter,
+    columnFilters.filters,
+    data,
+    sorting,
+  ]);
+
   const contextValue: DataTableContextValue<TData> = {
     table,
     filtersDefinition,
     columnFilters,
     globalFilter,
     data,
     filteredData,
+    sorting,
+    rows,
   };
+
   return (
     <DataTableContext.Provider value={contextValue}>
       {children || (