fix(dashboard): hide "Filters out of scope" section when empty

[mikebridge]

SUMMARY

The "Filters out of scope" collapsible was rendered "disabled" when no filters were out of scope, showing "Filters out of scope (0)" in the filter bar. The component now is not rendered at all when filtersOutOfScope is an empty array.

• FilterControls.tsx: extract showFiltersOutOfScope condition and add length > 0 check
• FiltersDropdownContent: add length > 0 check at the call site
• FiltersOutOfScopeCollapsible: remove now-unreachable collapsible="disabled" fallback
• Add unit tests covering empty/non-empty/showCollapsePanel cases

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before:

After:

Invariant:

TESTING INSTRUCTIONS

Test that Filters out of scope (0) is hidden:

1. Open the Sales Dashboard
2. Scroll down to the bottom of the list of filters
3. You should not see "Filters out of scope (0)" above the "Apply Filters" button

Test that Filters out of scope (1) is not hidden:

1. Open the Sales Dashboard (it has two tabs: "Sales Overview" and "Exploratory")
2. Click the gear icon (⚙️ ) at the top of the filter bar to open "Add and edit filters"
3. Pick any existing filter (e.g., "Country")
4. Click the "Scoping" tab in the filter editor
5. Switch from "Apply to all panels" to "Apply to specific panels"
6. Uncheck the "Exploratory" tab so the filter only applies to "Sales Overview"
7. Click Save
8. Now in the filter bar, select a country value (e.g., "USA") — filters need a value to be evaluated
9. Switch to the "Exploratory" tab
10. Scroll down to the bottom of the list of filters
11. You should see "Filters out of scope (1)" above the "Apply Filters" button

ADDITIONAL INFORMATION

• Has associated issue: 98072
• 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

[netlify]

✅ Deploy Preview for superset-docs-preview ready!

Name	Link
🔨 Latest commit	9e92935
🔍 Latest deploy log	https://app.netlify.com/projects/superset-docs-preview/deploys/69d67bc734e9d50008ecdf57
😎 Deploy Preview	https://deploy-preview-39201--superset-docs-preview.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[bito-code-review]

Code Review Agent Run #c09479

Actionable Suggestions - 1

• superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FiltersOutOfScopeCollapsible/index.tsx - 1

  • UX Regression: Empty Collapse Expandable · Line 40-40

Review Details

• Files reviewed - 4 · Commit Range: 9e92935..9e92935

  • superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/FilterControls.tsx
  • superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FiltersDropdownContent/FiltersDropdownContent.test.tsx
  • superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FiltersDropdownContent/index.tsx
  • superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FiltersOutOfScopeCollapsible/index.tsx
• Files skipped - 0
• Tools

  • Whispers (Secret Scanner) - ✔︎ Successful
  • Detect-secrets (Secret Scanner) - ✔︎ Successful

---

Bito Usage Guide

Commands

Type the following command in the pull request comment and save the comment.

• /review - Manually triggers a full AI review.

• /pause - Pauses automatic reviews on this pull request.

• /resume - Resumes automatic reviews.

• /resolve - Marks all Bito-posted review comments as resolved.

• /abort - Cancels all in-progress reviews.

Refer to the documentation for additional commands.

Configuration

This repository uses Superset You can customize the agent settings here or contact your Bito workspace admin at evan@preset.io.

Documentation & Help

• Customize agent settings
• Review rules
• General documentation
• FAQ

AI Code Review powered by

[bito-code-review]

UX Regression: Empty Collapse Expandable

Removing the collapsible prop allows users to expand an empty collapse section when there are no filters out of scope, which provides no value and creates confusing UX. The original logic disabled the collapse appropriately.

Code suggestion

Check the AI-generated fix before applying

 -    expandIconPosition="end"
 -    items=[
 +    expandIconPosition="end"
 +    collapsible={filtersOutOfScope.length === 0 ? 'disabled' : undefined}
 +    items=[

Code Review Run #c09479

---

Should Bito avoid suggestions like this for future reviews? (Manage Rules)

• Yes, avoid them

[mikebridge]

By convention a dev shouldn't call this with an empty list, and therefore this line would never be hit unless a dev makes an error, but we can add it in if we want to be future-friendly. Personally I dislike the idea of having a fallback that will never be used.

[bito-code-review]

Yes, the suggestion is valid — it adds defensive code to disable the collapsible when filtersOutOfScope is empty, ensuring robustness against potential future misuse without impacting current behavior.

[mikebridge]

The collapsible-disabled prop was removed because the entire FiltersOutOfScopeCollapsible component is no longer rendered when filtersOutOfScope.length === 0. The empty-state guard has been moved up one level to the call sites, where it lives alongside the other "should this section render at all" predicates:

  //  FilterControls.tsx (lines 225–228, 351):                                                                                                               
  
  const showFiltersOutOfScope =
     showCollapsePanel &&                                                                                                                                 
    (hideHeader || sectionsOpen.filters) && 
    filtersOutOfScope.length > 0;
                                                                                                                
  // ...                                                                                                                                                 
                                            
  {showFiltersOutOfScope && (                                                                                                                            
    <FiltersOutOfScopeCollapsible ... />
  )}                                                                                                                                                     
                                            
  FiltersDropdownContent/index.tsx (line 64):                                                                                                            
  {showCollapsePanel && filtersOutOfScope.length > 0 && (
    <FiltersOutOfScopeCollapsible ... />                                                                                                                 
  )}                                                                                                                                                     

So the empty FiltersOutOfScopeCollapsible cannot be reached through any code path — there's no UX regression, the component is simply never mounted with an empty array. The original collapsible="disabled" was redundant defense for a state the component will never see, and removing it eliminates the dead code path.

Two reasons we did it this way (call-site guard) instead of the leaf-component guard (return null inside the component):

1. Consistency with existing patterns — both call sites already gate on showCollapsePanel, hideHeader, etc., so adding filtersOutOfScope.length > 0 to the same predicate is the idiomatic next step rather than introducing a separate "leaf returns null" pattern.
2. Avoids mounting an empty React component — the component never instantiates when there's nothing to show, which is slightly cheaper and arguably cleaner than mounting a component just for it to render null.

[bito-code-review]

Your reasoning is sound. The guards at call sites prevent rendering the component when filtersOutOfScope is empty, so the collapsible-disabled prop is redundant and removed to eliminate dead code. No UX regression occurs since the section isn't mounted.

[github-actions]

🎪 Showtime is building environment on GHA for 9e92935

[codecov]

Codecov Report

❌ Patch coverage is 60.00000% with 2 lines in your changes missing coverage. Please review.
✅ Project coverage is 64.47%. Comparing base (3a3a653) to head (9e92935).
⚠️ Report is 14 commits behind head on master.

Files with missing lines	Patch %	Lines
...ilters/FilterBar/FilterControls/FilterControls.tsx	50.00%	2 Missing ⚠️

Additional details and impacted files

@@           Coverage Diff           @@
##           master   #39201   +/-   ##
=======================================
  Coverage   64.47%   64.47%           
=======================================
  Files        2541     2541           
  Lines      131674   131676    +2     
  Branches    30524    30526    +2     
=======================================
+ Hits        84893    84898    +5     
+ Misses      45315    45312    -3     
  Partials     1466     1466           

Flag	Coverage Δ
javascript	66.10% <60.00%> (+<0.01%)	⬆️

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

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.