superset
superset copied to clipboard
fix(dashboard): Add correct icon, label and badge to horizontal native filters dropdown button
SUMMARY
This PR is based on #22169 and fixes some issues with the native filters dropdown button:
- Style tweaks
- Adds icon and label
- Adds logic to identify the active filters in the dropdown and update badge to reflect
- Forces button to appear even when container has no overflowing items if custom dropdown content is inserted
- Fixes an issue where filters/dividers would appear in horizontal overflow view when not in the overflow dropdown
Note: there are still some issues with getting the component to resize correctly, but those will be addressed in a future PR.
BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
Before:
After:
TESTING INSTRUCTIONS
- Confirm that the button appears even when there's no badge
- Confirm that the button appears even when there are only out-of-scope filters in it
- Confirm that the button shows only the number of active filters, not including out-of-scope filters
- Confirm that when the view is large enough for there to be no overflowed items, items have correct non-overflow horizontal appearance
ADDITIONAL INFORMATION
- [ ] Has associated issue:
- [x] Required feature flags:
HORIZONTAL_FILTER_BAR
- [x] 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 Report
Merging #22211 (1d2a069) into master (64939f2) will decrease coverage by
0.07%
. The diff coverage is41.00%
.
:exclamation: Current head 1d2a069 differs from pull request most recent head b0046fb. Consider uploading reports for the commit b0046fb to get more accurate results
@@ Coverage Diff @@
## master #22211 +/- ##
==========================================
- Coverage 66.91% 66.84% -0.08%
==========================================
Files 1839 1841 +2
Lines 70079 70220 +141
Branches 7636 7670 +34
==========================================
+ Hits 46894 46936 +42
- Misses 21218 21302 +84
- Partials 1967 1982 +15
Flag | Coverage Δ | |
---|---|---|
javascript | 53.66% <36.11%> (-0.11%) |
: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% <ø> (ø) |
|
...superset-ui-core/src/query/types/PostProcessing.ts | 100.00% <ø> (ø) |
|
...s/legacy-plugin-chart-country-map/src/countries.ts | 100.00% <ø> (ø) |
|
...ins/plugin-chart-echarts/src/BoxPlot/buildQuery.ts | 66.66% <ø> (ø) |
|
...s/plugin-chart-echarts/src/BoxPlot/controlPanel.ts | 5.55% <ø> (ø) |
|
...charts/src/Timeseries/Regular/Bar/controlPanel.tsx | 35.71% <ø> (+4.46%) |
:arrow_up: |
.../plugin-chart-echarts/src/Timeseries/buildQuery.ts | 71.42% <ø> (ø) |
|
.../plugin-chart-pivot-table/src/plugin/buildQuery.ts | 42.85% <ø> (ø) |
|
...ugin-chart-pivot-table/src/plugin/controlPanel.tsx | 4.16% <0.00%> (ø) |
|
...ntend/plugins/plugin-chart-table/src/buildQuery.ts | 56.25% <ø> (ø) |
|
... and 29 more |
:mega: We’re building smart automated test selection to slash your CI/CD build times. Learn more
