Add infinite table defaults

This commit is contained in:
jeffvli 2023-01-06 18:24:31 -08:00
parent b569ec31ae
commit 9b1f4e7154
4 changed files with 9 additions and 88 deletions

View file

@ -407,11 +407,15 @@ export const VirtualTable = forwardRef(
<AgGridReact
ref={mergedRef}
animateRows
maintainColumnOrder
suppressContextMenu
suppressCopyRowsToClipboard
suppressMoveWhenRowDragging
suppressPaginationPanel
suppressScrollOnNewData
blockLoadDebounceMillis={200}
cacheBlockSize={300}
cacheOverflowSize={1}
defaultColDef={defaultColumnDefs}
enableCellChangeFlash={false}
headerHeight={36}

View file

@ -77,14 +77,6 @@ export const AlbumListContent = ({ gridRef, tableRef }: AlbumListContentProps) =
[page.table.columns],
);
const defaultColumnDefs: ColDef = useMemo(() => {
return {
lockPinned: true,
lockVisible: true,
resizable: true,
};
}, []);
const onTableReady = useCallback(
(params: GridReadyEvent) => {
const dataSource: IDatasource = {
@ -141,12 +133,6 @@ export const AlbumListContent = ({ gridRef, tableRef }: AlbumListContentProps) =
[isPaginationEnabled, pagination.currentPage, pagination.itemsPerPage, setPagination],
);
const handleTableSizeChange = () => {
if (page.table.autoFit) {
tableRef?.current?.api.sizeColumnsToFit();
}
};
const handleTableColumnChange = useCallback(() => {
const { columnApi } = tableRef?.current || {};
const columnsOrder = columnApi?.getAllGridColumns();
@ -350,34 +336,22 @@ export const AlbumListContent = ({ gridRef, tableRef }: AlbumListContentProps) =
key={`table-${page.display}-${page.table.rowHeight}-${server?.id}`}
ref={tableRef}
alwaysShowHorizontalScroll
animateRows
maintainColumnOrder
suppressCopyRowsToClipboard
suppressMoveWhenRowDragging
suppressPaginationPanel
suppressRowDrag
suppressScrollOnNewData
autoFitColumns={page.table.autoFit}
blockLoadDebounceMillis={200}
cacheBlockSize={500}
cacheOverflowSize={1}
columnDefs={columnDefs}
defaultColDef={defaultColumnDefs}
enableCellChangeFlash={false}
getRowId={(data) => data.data.id}
infiniteInitialRowCount={checkAlbumList.data?.totalRecordCount || 100}
infiniteInitialRowCount={checkAlbumList.data?.totalRecordCount || 1}
pagination={isPaginationEnabled}
paginationAutoPageSize={isPaginationEnabled}
paginationPageSize={page.table.pagination.itemsPerPage || 100}
rowBuffer={20}
rowHeight={page.table.rowHeight || 40}
rowModelType="infinite"
rowSelection="multiple"
onBodyScrollEnd={handleTableScroll}
onCellContextMenu={handleContextMenu}
onColumnMoved={handleTableColumnChange}
onColumnResized={debouncedTableColumnChange}
onGridReady={onTableReady}
onGridSizeChanged={handleTableSizeChange}
onPaginationChanged={onTablePaginationChanged}
onRowDoubleClicked={handleRowDoubleClick}
/>

View file

@ -82,14 +82,6 @@ export const AlbumArtistListContent = ({ gridRef, tableRef }: AlbumArtistListCon
[page.table.columns],
);
const defaultColumnDefs: ColDef = useMemo(() => {
return {
lockPinned: true,
lockVisible: true,
resizable: true,
};
}, []);
const onTableReady = useCallback(
(params: GridReadyEvent) => {
const dataSource: IDatasource = {
@ -150,12 +142,6 @@ export const AlbumArtistListContent = ({ gridRef, tableRef }: AlbumArtistListCon
[isPaginationEnabled, pagination.currentPage, pagination.itemsPerPage, setPagination],
);
const handleTableSizeChange = () => {
if (page.table.autoFit) {
tableRef?.current?.api.sizeColumnsToFit();
}
};
const handleTableColumnChange = useCallback(() => {
const { columnApi } = tableRef?.current || {};
const columnsOrder = columnApi?.getAllGridColumns();
@ -331,34 +317,20 @@ export const AlbumArtistListContent = ({ gridRef, tableRef }: AlbumArtistListCon
key={`table-${page.display}-${page.table.rowHeight}-${server?.id}`}
ref={tableRef}
alwaysShowHorizontalScroll
animateRows
maintainColumnOrder
suppressCopyRowsToClipboard
suppressMoveWhenRowDragging
suppressPaginationPanel
suppressRowDrag
suppressScrollOnNewData
blockLoadDebounceMillis={200}
cacheBlockSize={500}
cacheOverflowSize={1}
autoFitColumns={page.table.autoFit}
columnDefs={columnDefs}
defaultColDef={defaultColumnDefs}
enableCellChangeFlash={false}
getRowId={(data) => data.data.id}
infiniteInitialRowCount={checkAlbumArtistList.data?.totalRecordCount || 100}
infiniteInitialRowCount={checkAlbumArtistList.data?.totalRecordCount || 1}
pagination={isPaginationEnabled}
paginationAutoPageSize={isPaginationEnabled}
paginationPageSize={page.table.pagination.itemsPerPage || 100}
rowBuffer={20}
rowHeight={page.table.rowHeight || 40}
rowModelType="infinite"
rowSelection="multiple"
onBodyScrollEnd={handleTableScroll}
onCellContextMenu={handleContextMenu}
onColumnMoved={handleTableColumnChange}
onColumnResized={debouncedTableColumnChange}
onGridReady={onTableReady}
onGridSizeChanged={handleTableSizeChange}
onPaginationChanged={onTablePaginationChanged}
onRowDoubleClicked={handleRowDoubleClick}
/>

View file

@ -81,14 +81,6 @@ export const PlaylistDetailSongListContent = ({ tableRef }: PlaylistDetailConten
[page.table.columns],
);
const defaultColumnDefs: ColDef = useMemo(() => {
return {
lockPinned: true,
lockVisible: true,
resizable: true,
};
}, []);
const onGridReady = useCallback(
(params: GridReadyEvent) => {
const dataSource: IDatasource = {
@ -153,12 +145,6 @@ export const PlaylistDetailSongListContent = ({ tableRef }: PlaylistDetailConten
],
);
const handleGridSizeChange = () => {
if (page.table.autoFit) {
tableRef?.current?.api.sizeColumnsToFit();
}
};
const handleColumnChange = useCallback(() => {
const { columnApi } = tableRef?.current || {};
const columnsOrder = columnApi?.getAllGridColumns();
@ -230,34 +216,19 @@ export const PlaylistDetailSongListContent = ({ tableRef }: PlaylistDetailConten
key={`table-${page.display}-${page.table.rowHeight}-${server?.id}`}
ref={tableRef}
alwaysShowHorizontalScroll
animateRows
maintainColumnOrder
suppressCopyRowsToClipboard
suppressMoveWhenRowDragging
suppressPaginationPanel
suppressRowDrag
suppressScrollOnNewData
blockLoadDebounceMillis={200}
cacheBlockSize={500}
cacheOverflowSize={1}
columnDefs={columnDefs}
defaultColDef={defaultColumnDefs}
enableCellChangeFlash={false}
getRowId={(data) => data.data.uniqueId}
infiniteInitialRowCount={checkPlaylistList.data?.totalRecordCount || 100}
infiniteInitialRowCount={checkPlaylistList.data?.totalRecordCount || 1}
pagination={isPaginationEnabled}
paginationAutoPageSize={isPaginationEnabled}
paginationPageSize={pagination.itemsPerPage || 100}
rowBuffer={20}
rowHeight={page.table.rowHeight || 40}
rowModelType="infinite"
rowSelection="multiple"
onBodyScrollEnd={handleScroll}
onCellContextMenu={handleContextMenu}
onColumnMoved={handleColumnChange}
onColumnResized={debouncedColumnChange}
onGridReady={onGridReady}
onGridSizeChanged={handleGridSizeChange}
onPaginationChanged={onPaginationChanged}
onRowDoubleClicked={handleRowDoubleClick}
/>