diff --git a/superset-frontend/packages/superset-ui-core/src/components/TableView/TableView.tsx b/superset-frontend/packages/superset-ui-core/src/components/TableView/TableView.tsx index a74526a186b..09d3b4056fe 100644 --- a/superset-frontend/packages/superset-ui-core/src/components/TableView/TableView.tsx +++ b/superset-frontend/packages/superset-ui-core/src/components/TableView/TableView.tsx @@ -198,6 +198,9 @@ const RawTableView = ({ [scrollTopOnPagination, handleScrollToTop, gotoPage], ); + const pageSize = initialPageSize ?? DEFAULT_PAGE_SIZE; + const pageCount = Math.ceil(data.length / pageSize); + const paginationProps = useMemo(() => { if (!withPagination) { return { @@ -211,7 +214,7 @@ const RawTableView = ({ if (serverPagination) { return { pageIndex, - pageSize: initialPageSize ?? DEFAULT_PAGE_SIZE, + pageSize, totalCount, onPageChange: handlePageChange, }; @@ -219,7 +222,7 @@ const RawTableView = ({ return { pageIndex, - pageSize: initialPageSize ?? DEFAULT_PAGE_SIZE, + pageSize, totalCount: data.length, onPageChange: handlePageChange, }; @@ -227,7 +230,7 @@ const RawTableView = ({ withPagination, serverPagination, pageIndex, - initialPageSize, + pageSize, totalCount, data.length, handlePageChange, @@ -251,9 +254,7 @@ const RawTableView = ({ }, [initialState.sortBy, onServerPagination, serverPagination, sortBy]); // Reset to first page when current page exceeds available pages - // (e.g., when filtering reduces the data below the current page) - const pageSize = initialPageSize ?? DEFAULT_PAGE_SIZE; - const pageCount = Math.ceil(data.length / pageSize); + // (e.g., when filtering reduces the data below the current page). useEffect(() => { if ( withPagination && diff --git a/superset-frontend/src/explore/components/DataTablesPane/test/SingleQueryResultPane.test.tsx b/superset-frontend/src/explore/components/DataTablesPane/test/SingleQueryResultPane.test.tsx index 17981ffeb25..a92ea662a7c 100644 --- a/superset-frontend/src/explore/components/DataTablesPane/test/SingleQueryResultPane.test.tsx +++ b/superset-frontend/src/explore/components/DataTablesPane/test/SingleQueryResultPane.test.tsx @@ -36,9 +36,12 @@ const mockData: Record[] = Array.from( ); const defaultProps = { - // Note: The SingleQueryResultPaneProp type expects Record[][] - // but useFilteredTableData and useTableColumns actually work with Record[] - // This type mismatch exists in the codebase - cast through unknown to satisfy TypeScript + // Note: SingleQueryResultPaneProp.data is typed as Record[][] + // (chunked rows), but useFilteredTableData and useTableColumns actually + // work with the flat Record[] shape that the consumers below + // pass in. The double-cast through unknown is the workaround until the + // type is reconciled with how the hooks actually consume the data. + // TODO: fix SingleQueryResultPaneProp.data type to match the flat shape. data: mockData as unknown as Record[][], colnames: ['id', 'name', 'category'], coltypes: [ @@ -75,14 +78,15 @@ test('SingleQueryResultPane renders table and filters data', async () => { }); test('SingleQueryResultPane renders TableView correctly', () => { - const { container } = render(, { + render(, { useTheme: true, useRedux: true, }); - // Verify TableView is rendered - const tableView = container.querySelector('.table-condensed'); - expect(tableView).toBeInTheDocument(); + // Verify TableView is rendered. Use the data-test attribute on + // TableCollection rather than the .table-condensed antd className, + // which is internal and may change. + expect(screen.getByTestId('listview-table')).toBeInTheDocument(); }); test('SingleQueryResultPane resets pagination when filter reduces data below current page', async () => {