diff --git a/src/components/InfiniteTable/InfiniteTable.tsx b/src/components/InfiniteTable/InfiniteTable.tsx index f786125..753099f 100644 --- a/src/components/InfiniteTable/InfiniteTable.tsx +++ b/src/components/InfiniteTable/InfiniteTable.tsx @@ -45,6 +45,8 @@ export type InfiniteTableProps = Omit< totalRows: number; allRowSelectedMode?: boolean; onAllRowSelectedModeChange?: (allRowSelectedMode: boolean) => void; + footer?: React.ReactNode; + footerHeight?: number; }; export type InfiniteTableRef = { @@ -59,7 +61,7 @@ const InfiniteTableComp = forwardRef( columns: columnsProps, onRowDoubleClick, onRowSelectionChange, - height, + height: heightProps = 600, onRowStyle, onColumnChanged: onColumnsChangedProps, onGetColumnsState, @@ -69,6 +71,8 @@ const InfiniteTableComp = forwardRef( totalRows, onAllRowSelectedModeChange, allRowSelectedMode: allRowSelectedModeProps, + footer, + footerHeight = 50, } = props; const gridRef = useRef(null); @@ -77,6 +81,8 @@ const InfiniteTableComp = forwardRef( const columnsPersistedStateRef = useRef(); const containerRef = useRef(null); const columnChangeListenerReady = useRef(false); + const totalHeight = footer ? heightProps + footerHeight : heightProps; + const tableHeight = footer ? heightProps - footerHeight : heightProps; const { autoSizeColumnsIfNecessary } = useAutoFitColumns({ gridRef, @@ -271,37 +277,46 @@ const InfiniteTableComp = forwardRef( return (
- +
+ +
+ {footer &&
{footer}
}
); }, diff --git a/src/components/InfiniteTable/useRowSelection.ts b/src/components/InfiniteTable/useRowSelection.ts index fef9718..6d402b5 100644 --- a/src/components/InfiniteTable/useRowSelection.ts +++ b/src/components/InfiniteTable/useRowSelection.ts @@ -78,12 +78,6 @@ export const useRowSelection = ({ }, 1000); }, [allRowSelectedMode, internalSelectedRowKeys.length, totalRows, gridRef]); - useEffect(() => { - return () => { - timeoutRef.current && clearTimeout(timeoutRef.current); - }; - }, [onHeaderCheckboxChange]); - const onSelectionChanged = useCallback( (event: { api: { getSelectedNodes: () => any } }) => { if (allRowSelectedModeLock.current) { diff --git a/src/stories/InfiniteTable.stories.tsx b/src/stories/InfiniteTable.stories.tsx index d56fb5a..d84170a 100644 --- a/src/stories/InfiniteTable.stories.tsx +++ b/src/stories/InfiniteTable.stories.tsx @@ -87,6 +87,7 @@ export const HeavyTable = (): React.ReactElement => { const columnsState = localStorage.getItem("columnsState"); return columnsState ? JSON.parse(columnsState) : undefined; }} + footer={

This is a footer

} /> );