IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

UI: No interactive table pagination controls for rows < page size (#82109)

Browse Source
This commit is contained in:
Gilles De Mey
2024-02-07 17:13:05 +01:00
committed by GitHub
parent 3ad860a63c
commit e77ec26897
2 changed files with 18 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
packages/grafana-ui/src/components/InteractiveTable/InteractiveTable.test.tsx
View File

@@ -117,15 +117,28 @@ describe('InteractiveTable', () => {
expect(screen.queryByRole('button', { name: /previous/i })).not.toBeInTheDocument();
});
it('renders pagination controls if pageSize is set', () => {
it('renders pagination controls if pageSize is set and more items than page size', () => {
const columns: Array<Column<TableData>> = [{ id: 'id', header: 'ID' }];
const data: TableData[] = [{ id: '1', value: '1', country: 'Sweden' }];
render(<InteractiveTable columns={columns} data={data} getRowId={getRowId} pageSize={10} />);
const data: TableData[] = [
{ id: '1', value: '1', country: 'Sweden' },
{ id: '2', value: '2', country: 'Belgium' },
];
render(<InteractiveTable columns={columns} data={data} getRowId={getRowId} pageSize={1} />);
expect(screen.getByRole('button', { name: /next/i })).toBeInTheDocument();
expect(screen.getByRole('button', { name: /previous/i })).toBeInTheDocument();
});
it('does not render pagination controls if pageSize is set and fewer items than page size', () => {
const columns: Array<Column<TableData>> = [{ id: 'id', header: 'ID' }];
const data: TableData[] = [{ id: '1', value: '1', country: 'Sweden' }];
render(<InteractiveTable columns={columns} data={data} getRowId={getRowId} pageSize={10} />);
expect(screen.queryByRole('button', { name: /next/i })).not.toBeInTheDocument();
expect(screen.queryByRole('button', { name: /previous/i })).not.toBeInTheDocument();
});
});
describe('headerTooltip', () => {
it('does not render tooltips if headerTooltips is not set', () => {
const columns: Array<Column<TableData>> = [{ id: 'id', header: 'ID' }];

3
packages/grafana-ui/src/components/InteractiveTable/InteractiveTable.tsx
View File

@@ -179,7 +179,8 @@ export function InteractiveTable<TableData extends object>({
const tableHooks: Array<PluginHook<TableData>> = [useSortBy, useExpanded];
const paginationEnabled = pageSize > 0;
const multiplePages = data.length > pageSize;
const paginationEnabled = pageSize > 0 && multiplePages;
if (paginationEnabled) {
tableHooks.push(usePagination);