Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(sqllab): Replace margin style by gap on query results #24772

Conversation

justinpark
Copy link
Member

SUMMARY

The horizontal scrollbar in query results has been cut off due to the top margin. There's a bunch of redundant margin for adjustment which makes this kind of overflow hidden regression.
This commit replaces this margins by the upper wrapper's gap as well as removing the antd style overrides.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

After:

Screenshot 2023-07-21 at 1 14 32 PM

Before:

Screenshot 2023-07-21 at 1 09 07 PM

TESTING INSTRUCTIONS

Go to sqllab and run a query that contains more than 20.

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

@codecov
Copy link

codecov bot commented Jul 21, 2023

Codecov Report

Merging #24772 (27637dc) into master (abb8e28) will decrease coverage by 8.83%.
The diff coverage is 82.60%.

❗ Current head 27637dc differs from pull request most recent head e4993fd. Consider uploading reports for the commit e4993fd to get more accurate results

@@            Coverage Diff             @@
##           master   #24772      +/-   ##
==========================================
- Coverage   67.23%   58.41%   -8.83%     
==========================================
  Files        1902     1902              
  Lines       73939    73997      +58     
  Branches     8176     8195      +19     
==========================================
- Hits        49713    43224    -6489     
- Misses      22113    28654    +6541     
- Partials     2113     2119       +6     
Flag Coverage Δ
javascript 55.79% <83.51%> (+0.04%) ⬆️
mysql ?
postgres ?
sqlite ?

Flags with carried forward coverage won't be shown. Click here to find out more.

Files Changed Coverage Δ
...frontend/src/SqlLab/components/SouthPane/index.tsx 79.54% <ø> (ø)
...-frontend/src/components/FilterableTable/index.tsx 75.59% <ø> (ø)
superset-frontend/src/components/Select/utils.tsx 82.25% <ø> (-1.62%) ⬇️
superset/views/api.py 60.93% <0.00%> (-7.82%) ⬇️
superset-frontend/src/components/Select/Select.tsx 85.78% <77.04%> (-4.86%) ⬇️
...set-frontend/src/components/Select/AsyncSelect.tsx 89.32% <96.42%> (+0.85%) ⬆️
...frontend/src/SqlLab/components/ResultSet/index.tsx 63.29% <100.00%> (+0.23%) ⬆️

... and 350 files with indirect coverage changes

📣 We’re building smart automated test selection to slash your CI/CD build times. Learn more

const ResultContainer = styled.div`
display: flex;
flex-direction: column;
gap: ${({ theme }) => theme.gridUnit * 2}px;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is adding space vertically and horizontally while previously we had only vertical spacing with padding: ${({ theme }) => 2 * theme.gridUnit}px 0;. Is this intended or should we use row-gap?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

updated

Copy link
Member

@michael-s-molina michael-s-molina left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@michael-s-molina michael-s-molina merged commit 4a81284 into apache:master Jul 25, 2023
26 checks passed
@michael-s-molina michael-s-molina added the v3.0 Label added by the release manager to track PRs to be included in the 3.0 branch label Jul 25, 2023
michael-s-molina pushed a commit that referenced this pull request Jul 26, 2023
@mistercrunch mistercrunch added 🍒 3.0.0 🍒 3.0.1 🍒 3.0.2 🍒 3.0.3 🍒 3.0.4 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 3.1.0 labels Mar 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels size/S v3.0 Label added by the release manager to track PRs to be included in the 3.0 branch 🍒 3.0.0 🍒 3.0.1 🍒 3.0.2 🍒 3.0.3 🍒 3.0.4 🚢 3.1.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants