You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by ru...@apache.org on 2026/10/21 02:03:24 UTC
(superset) branch master updated: fix(table): reset default margins on the pagination list (#45365)
This is an automated email from the ASF dual-hosted git repository.
rusackas pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 836c0f3f95d fix(table): reset default margins on the pagination list (#45365)
836c0f3f95d is described below
commit 836c0f3f95d74f382c977162fd4971142643eea6
Author: Maxime Beauchemin <ma...@gmail.com>
AuthorDate: Tue Oct 20 19:03:17 2026 -0700
fix(table): reset default margins on the pagination list (#45365)
Co-authored-by: Claude Opus 5.5 <no...@anthropic.com>
Co-authored-by: Joe Li <jo...@preset.io>
---
.../plugins/plugin-chart-table/src/Styles.tsx | 4 ++
.../plugin-chart-table/test/TableChart.test.tsx | 73 ++++++++++++++++++++++
2 files changed, 77 insertions(+)
diff --git a/superset-frontend/plugins/plugin-chart-table/src/Styles.tsx b/superset-frontend/plugins/plugin-chart-table/src/Styles.tsx
index 32d25bb7e02..60857467041 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/Styles.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/src/Styles.tsx
@@ -163,6 +163,10 @@ export default styled.div`
padding: ${theme.paddingXXS}px 0px;
}
+ .dt-pagination .pagination {
+ margin: 0;
+ }
+
.dt-pagination .pagination > li {
display: inline;
margin: 0 ${theme.marginXXS}px;
diff --git a/superset-frontend/plugins/plugin-chart-table/test/TableChart.test.tsx b/superset-frontend/plugins/plugin-chart-table/test/TableChart.test.tsx
index 7ed4cd6deaf..4192e9098cb 100644
--- a/superset-frontend/plugins/plugin-chart-table/test/TableChart.test.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/test/TableChart.test.tsx
@@ -2855,6 +2855,79 @@ describe('plugin-chart-table', () => {
expect(activePage).toHaveTextContent('2');
});
+ // The pagination footer height is measured via `clientHeight` and
+ // subtracted from the scrollable body height, so the default `<ul>`
+ // margins must be reset or the body shrinks and leaves empty space.
+ test('resets the default list margins on the client-side pagination bar', () => {
+ const data30 = Array.from({ length: 30 }, (_, i) => ({
+ name: `User ${i + 1}`,
+ sum__num: (i + 1) * 100,
+ }));
+ const props = transformProps({
+ ...testData.basic,
+ rawFormData: {
+ ...testData.basic.rawFormData,
+ page_length: 10,
+ metrics: ['sum__num'],
+ groupby: ['name'],
+ },
+ queriesData: [
+ {
+ ...testData.basic.queriesData[0],
+ colnames: ['name', 'sum__num'],
+ coltypes: [GenericDataType.String, GenericDataType.Numeric],
+ data: data30,
+ },
+ ],
+ });
+
+ const { container } = render(
+ <ProviderWrapper>
+ <TableChart {...props} sticky={false} />
+ </ProviderWrapper>,
+ );
+
+ const paginationList = container.querySelector(
+ '.dt-pagination .pagination',
+ );
+ expect(paginationList).not.toBeNull();
+ const style = getComputedStyle(paginationList as HTMLElement);
+ expect(style.marginTop).toBe('0px');
+ expect(style.marginBottom).toBe('0px');
+ });
+
+ test('resets the default list margins on the server-side pagination bar', () => {
+ const props = transformProps({
+ ...testData.basic,
+ rawFormData: {
+ ...testData.basic.rawFormData,
+ server_pagination: true,
+ server_page_length: 10,
+ },
+ queriesData: [
+ testData.basic.queriesData[0],
+ {
+ ...testData.basic.queriesData[0],
+ data: [{ rowcount: 100 }],
+ },
+ ],
+ });
+
+ const { container } = render(
+ <ProviderWrapper>
+ <TableChart {...props} sticky={false} />
+ </ProviderWrapper>,
+ );
+
+ const paginationList = container.querySelector(
+ '.dt-pagination .pagination',
+ );
+ expect(paginationList).not.toBeNull();
+ const style = getComputedStyle(paginationList as HTMLElement);
+ expect(style.marginTop).toBe('0px');
+ expect(style.marginBottom).toBe('0px');
+ });
+
test('should build columnLabelToNameMap for adhoc columns with custom labels', () => {
const result = transformProps({
...testData.basic,