feat: Adds overflow to the DropdownContainer popover

[michael-s-molina]

SUMMARY

Adds overflow to the DropdownContainer popover.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

https://user-images.githubusercontent.com/70410625/204400117-c1275fea-4f6d-476b-a877-27a8a8fad707.mov

TESTING INSTRUCTIONS

• Check that no overflow is set if the popover height is less than MAX_HEIGHT
• Check that an overflow is set if the popover height is greater than MAX_HEIGHT

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

[kgabryje]

/testenv up FEATURE_HORIZONTAL_FILTER_BAR=true

[github-actions[bot]]

@kgabryje Ephemeral environment spinning up at http://52.41.55.109:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

[kgabryje]

It's not related to this PR, but while testing I crashed the dashboard :(

The error points to this piece of code in FilterControls.tsx

@codyml I think you modified that recently, do you know why dataMask might be undefined here? Should we just add a null check or can it be a deeper issue?

[kgabryje]

@michael-s-molina I'm wondering if we should set the scrollbar to be always visible when the overflow is present. Without it users might not notice that the dropdown is scrollable

[codyml]

It's not related to this PR, but while testing I crashed the dashboard :(

@codyml I think you modified that recently, do you know why dataMask might be undefined here? Should we just add a null check or can it be a deeper issue?

Oops yes! I made a typing mistake; the DataMaskStateWithId type should have dataMask as optional. Fix here: https://github.com/apache/superset/pull/22260

[michael-s-molina]

@kgabryje I added some CSS configurations to make the scroll visible.

[codecov[bot]]

Codecov Report

Merging #22250 (716f12a) into master (435926b) will increase coverage by 11.36%. The diff coverage is 58.66%.

:exclamation: Current head 716f12a differs from pull request most recent head 244d5e8. Consider uploading reports for the commit 244d5e8 to get more accurate results

@@             Coverage Diff             @@
##           master   #22250       +/-   ##
===========================================
+ Coverage   55.46%   66.82%   +11.36%     
===========================================
  Files        1841     1842        +1     
  Lines       70220    70259       +39     
  Branches     7670     7675        +5     
===========================================
+ Hits        38947    46953     +8006     
+ Misses      29291    21321     -7970     
- Partials     1982     1985        +3     

Flag	Coverage Δ
javascript	53.66% <63.88%> (-0.01%)	:arrow_down:

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

Impacted Files	Coverage Δ
...ages/superset-ui-core/src/query/types/Dashboard.ts	100.00% <ø> (ø)
...packages/superset-ui-core/src/query/types/Query.ts	100.00% <ø> (ø)
...ugins/plugin-chart-echarts/src/Radar/buildQuery.ts	0.00% <0.00%> (ø)
...rontend/src/components/MetadataBar/MetadataBar.tsx	98.21% <ø> (ø)
...d/components/DashboardBuilder/DashboardBuilder.tsx	74.28% <0.00%> (-0.96%)	:arrow_down:
...Filters/FilterBar/FilterControls/FilterDivider.tsx	84.00% <0.00%> (+2.51%)	:arrow_up:
...rontend/src/filters/components/Range/buildQuery.ts	0.00% <ø> (ø)
...ontend/src/filters/components/Select/buildQuery.ts	90.00% <ø> (ø)
superset/views/database/views.py	31.27% <33.33%> (+0.82%)	:arrow_up:
...ilters/FilterBar/FilterControls/FilterControls.tsx	70.21% <50.00%> (-2.13%)	:arrow_down:
... and 299 more

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

[kgabryje]

/testenv up HORIZONTAL_FILTER_BAR=true

[github-actions[bot]]

@kgabryje Ephemeral environment spinning up at http://34.221.95.76:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

[kgabryje]

/testenv up FEATURE_HORIZONTAL_FILTER_BAR=true

[github-actions[bot]]

@kgabryje Ephemeral environment spinning up at http://54.70.88.225:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

[github-actions[bot]]

Ephemeral environment shutdown and build artifacts deleted.