anishtilekar opened a new pull request, #43472:
URL: https://github.com/apache/superset/pull/43472

   ### SUMMARY
   In the **Drill to detail** modal, `VirtualTable` (used by `DrillDetailPane`) 
renders its header as a plain antd `<thead>` inside a `<table>`, separate from 
the `react-window` `Grid` that renders the body rows. Column widths for both 
are derived from the same measured container width.
   
   When the current page's rows are tall enough to need vertical scrolling, the 
Grid's own scrollbar eats into the body's visible column width, but the header 
isn't shrunk to match, so header cells drift out of alignment with their data 
columns (and can appear clipped/truncated). This is the same class of bug 
already fixed for the non-virtualized table's sticky header in `useSticky.tsx` 
(#36190, #36891, #42573), but `VirtualTable.tsx` uses a completely different 
header/body split and wasn't covered by those fixes.
   
   This PR reserves the scrollbar's width when sizing columns whenever the 
current page's row count would overflow the visible height, so the header and 
the Grid's columns stay in sync - mirroring the approach used in 
`useSticky.tsx`.
   
   ### BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
   N/A - the bug only reproduces with a live scrollable dataset; see 
reproduction steps in the linked issue.
   
   ### TESTING INSTRUCTIONS
   1. Open a dashboard or Explore view with a chart that supports Drill to 
detail.
   2. Right-click a data point (or use the chart menu) -> **Drill to detail**.
   3. With enough columns/rows that the modal table needs to scroll vertically, 
confirm the column headers line up with their data cells.
   4. `npx jest 
packages/superset-ui-core/src/components/Table/VirtualTable.test.tsx 
packages/superset-ui-core/src/components/Table/utils/getScrollBarSize.test.ts` 
from `superset-frontend/`.
   
   ### ADDITIONAL INFORMATION
   - [x] Has associated issue: Fixes #43383
   - [ ] Required feature flags:
   - [x] Changes UI
   - [ ] Includes DB Migration
   - [ ] Introduces new feature or API
   - [ ] Removes existing feature or API


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to