fix: Misaligned global controls in Table chart

[kgabryje]

SUMMARY

Pagination, search and time comparison controls in Table chart were misaligned and had weird spacings.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before:

After:

TESTING INSTRUCTIONS

1. Open a table chart in Explore
2. Enable server pagination, search and time comparison
3. Verify that the controls in the chart are well aligned

ADDITIONAL INFORMATION

• Has associated issue:
• Required feature flags:
• Changes UI
• Includes DB Migration (follow approval process in SIP-59)
  • Migration is atomic, supports rollback & is backwards-compatible
  • Confirm DB migration upgrade and downgrade tested
  • Runtime estimates and downtime expectations provided
• Introduces new feature or API
• Removes existing feature or API

[Copilot]

Pull Request Overview

This PR fixes misaligned global controls in the Table chart by restructuring the layout and removing inconsistent sizing properties. The changes improve visual alignment of pagination, search, and time comparison controls.

• Simplified layout structure by removing Bootstrap grid classes and replacing with consistent spacing components
• Removed hardcoded size attributes that caused inconsistent control sizing
• Reorganized the time comparison dropdown positioning within the main control flow

Reviewed Changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.

File	Description
TableChart.tsx	Removes size="small" attribute from search input to maintain consistent sizing
DataTable.tsx	Restructures global controls layout by removing Bootstrap grid classes and reorganizing component positioning

[Copilot]

The conditional rendering structure creates asymmetric layout. When searchInput is falsy, pagination controls won't be rendered at all since they're now nested inside the searchInput condition. Consider restructuring to ensure pagination controls are always available when hasPagination is true, regardless of search input state.

[kgabryje]

fixed

[korbit-ai]

I've completed my review and didn't find any issues.

Files scanned

​

File Path	Reviewed
superset-frontend/plugins/plugin-chart-table/src/DataTable/DataTable.tsx	✅
superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx	✅

Explore our documentation to understand the languages and file types we support and the files we ignore.

Check out our docs on how you can make Korbit work best for you and your team.

Loving Korbit!? Share us on LinkedIn Reddit and X

[msyavuz]

LGTM! Needs a ci run though