feat(filter): adding inputs to Numerical Range Filter

[alexandrusoare]

SUMMARY

Adding inputs to the Numerical Range Filter

Fixes #31345

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

BEFORE

AFTER

BEFORE

AFTER

TESTING INSTRUCTIONS

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

Description by Korbit AI

What change is being made?

Add numerical input fields to the Numerical Range Filter and update tests to reflect and verify this new functionality.

Why are these changes being made?

The current slider interface is being replaced with numerical input fields to improve precision and user control in defining numerical ranges. This enhancement also ensures that the inputs sync to maintain valid ranges dynamically, improving usability. The accompanying tests are updated to ensure the new input behavior works as expected and edge cases are properly handled.

Is this description stale? Ask me to generate a new description by commenting /korbit-generate-pr-description

[korbit-ai]

Based on your review schedule, I'll hold off on reviewing this PR until it's marked as ready for review. If you'd like me to take a look now, comment /korbit-review.

Your admin can change your review schedule in the Korbit Console

[villebro]

@alexandrusoare would it be a good idea to make the inputs optional? Especially in horizontal filter bar orientation the added inputs may be problematic.

[alexandrusoare]

@alexandrusoare would it be a good idea to make the inputs optional? Especially in horizontal filter bar orientation the added inputs may be problematic.

@villebro I think having both the slider and the inputs offer greater control to the user, it's hard setting values just from the slider alone. For the horizontal bar I do agree that it doesn't look good, so what I propose is to have the slider next to the inputs instead of having them one on top of the other. Let me know what you think about this

[kasiazjc]

@alexandrusoare would it be a good idea to make the inputs optional? Especially in horizontal filter bar orientation the added inputs may be problematic.

@villebro I think having both the slider and the inputs offer greater control to the user, it's hard setting values just from the slider alone. For the horizontal bar I do agree that it doesn't look good, so what I propose is to have the slider next to the inputs instead of having them one on top of the other. Let me know what you think about this

I agree with @villebro actually - the plan was to get rid of the slider entirely as it's not really an easy to use pattern. Inputs are better in terms of usability and precision. I think keeping both adds to the clutter and we already have a lot of different elements in this dashboard view.

[korbit-ai]

I've completed my review and didn't find any issues.

Files scanned

​

File Path	Reviewed
superset-frontend/src/filters/components/Range/RangeFilterPlugin.tsx	✅

Explore our documentation to understand the languages and file types we support and the files we ignore.

Need a new review? Comment /korbit-review on this PR and I'll review your latest changes.

Korbit Guide: Usage and Customization

Interacting with Korbit

• You can manually ask Korbit to review your PR using the /korbit-review command in a comment at the root of your PR.
• You can ask Korbit to generate a new PR description using the /korbit-generate-pr-description command in any comment on your PR.
• Too many Korbit comments? I can resolve all my comment threads if you use the /korbit-resolve command in any comment on your PR.
• Chat with Korbit on issues we post by tagging @korbit-ai in your reply.
• Help train Korbit to improve your reviews by giving a 👍 or 👎 on the comments Korbit posts.

Customizing Korbit

• Check out our docs on how you can make Korbit work best for you and your team.
• Customize Korbit for your organization through the Korbit Console.

Current Korbit Configuration

General Settings

​

Setting	Value
Review Schedule	Automatic excluding drafts
Max Issue Count	10
Automatic PR Descriptions	✅

Issue Categories

​

Category	Enabled
Naming	✅
Database Operations	✅
Documentation	✅
Logging	✅
Error Handling	✅
Systems and Environment	✅
Objects and Data Structures	✅
Readability and Maintainability	✅
Asynchronous Processing	✅
Design Patterns	✅
Third-Party Libraries	✅
Performance	✅
Security	✅
Functionality	✅

Feedback and Support

• Tell us what you think of Korbit
• Schedule a call with our team
• Email us @ [email protected]

Note

Korbit Pro is free for open source projects 🎉

Looking to add Korbit to your team? Get started with a free 2 week trial here

[michael-s-molina]

Reviewers: this PR just left draft state.

[sadpandajoe]

👍 on the cypress test. I'll leave the other two files for people that have more experience with those components.

[geido]

Something is wrong when working with these inputs in the native filters modal.

• I can't really set a value with keyboard. It will always default to 0
• It won't allow me to delete an existing value
• The width seems too big

1.-.Sample.dashboard.mp4

[geido]

I am still seeing a bunch of different issues:

• When selecting the Single value option the filter goes out of scope for some reasons
• When working with the default value I see the value being reset to zero and sometimes I have also seen it blink from the lowest value to the highest, not sure

Tabbed.Dashboard.mp4

[alexandrusoare]

I am still seeing a bunch of different issues:

• When selecting the Single value option the filter goes out of scope for some reasons
• When working with the default value I see the value being reset to zero and sometimes I have also seen it blink from the lowest value to the highest, not sure

Tabbed.Dashboard.mp4

Hey @geido , thank you for your feedback. Regarding the first issue, this is something that I could reproduce on master as well, and with all the types of filters, not just the Numerical Range one