diff --git a/src/components/TableModule/ReactTableModule.tsx b/src/components/TableModule/ReactTableModule.tsx
index d3662a7c..313dddf9 100644
--- a/src/components/TableModule/ReactTableModule.tsx
+++ b/src/components/TableModule/ReactTableModule.tsx
@@ -53,6 +53,8 @@ export const ReactTableModule = React.memo(
columns = config.map(mapTableConfigToColumnDef);
}
+ console.log('columns', columns);
+
const table = useReactTable({
data,
columns,
@@ -62,7 +64,7 @@ export const ReactTableModule = React.memo(
state,
});
- const headings = table.getHeaderGroups()[0].headers;
+ const headers = table.getHeaderGroups()[0].headers;
return (
))}
@@ -101,7 +103,7 @@ export const ReactTableModule = React.memo(
rowRole={rowRole}
maxCellWidth={maxCellWidth}
row={row}
- headingsLength={headings?.length}
+ headingsLength={headers?.length}
cells={row.getVisibleCells()}
rowClickLabel={rowClickLabel}
/>
@@ -113,7 +115,7 @@ export const ReactTableModule = React.memo(
>
|
diff --git a/src/components/TableModule/TableHeaderCell.tsx b/src/components/TableModule/TableHeaderCell.tsx
index 7a1cd282..5cd89417 100644
--- a/src/components/TableModule/TableHeaderCell.tsx
+++ b/src/components/TableModule/TableHeaderCell.tsx
@@ -1,5 +1,7 @@
import clsx from 'clsx';
import * as React from 'react';
+
+import { flexRender } from '@tanstack/react-table';
import { ChevronDown } from '@lifeomic/chromicons';
import { makeStyles } from '../../styles/index';
import { GetClasses } from '../../typeUtils';
@@ -157,7 +159,11 @@ export const TableHeaderCell: React.FC = ({
style={{ left: left }}
{...rootProps}
>
- {header.content ? header.content(header) : header.label}
+ {header.column
+ ? flexRender(header.column.columnDef.header, header.getContext())
+ : header.content
+ ? header.content(header)
+ : header.label}
{/* We aren't actively sorting this column, but we want to display a "peek" icon so they know they can sort it */}
{(!sortDirection || !isSorting) && canSort && (
| Array;
+ cells: Array;
rowActions?: TableModuleProps['rowActions'];
rowClickLabel?: TableModuleProps['rowClickLabel'];
stickyCols?: Array;
diff --git a/src/components/TableModule/types.ts b/src/components/TableModule/types.ts
index 54eba04a..eab15c73 100644
--- a/src/components/TableModule/types.ts
+++ b/src/components/TableModule/types.ts
@@ -1,3 +1,4 @@
+import { Cell, Header } from '@tanstack/react-table';
/**
* @description A default interface for capturing the different
* "sortDirection" options.
@@ -26,14 +27,16 @@ export interface TableSortClickProps extends TableSortDirection {
header: TableHeader;
}
-export interface TableHeader extends TableAlignOptions {
+export interface TableHeader extends TableAlignOptions, Header {
label?: string;
content?(header: TableHeader): any;
onSort?(sort: TableSortClickProps): any;
className?: string;
}
-export interface TableCell- extends TableAlignOptions {
+export interface TableCell
-
+ extends TableAlignOptions,
+ Cell {
valuePath?: string;
content?(cell: Item): any;
className?: string;
|