You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
When working with large codebases, the Ranked section becomes difficult to search — there's no way to quickly find a specific component, leading to endless scrolling.
This PR adds a search bar below the Ranked section header to filter rows by label (case-insensitive), making it fast to locate any component.
Problems Addressed
No search in Ranked list — impossible to quickly find a component at scale
Inaccurate bar chart — bar fill was calculated against only visible rows after filtering, not the full event total
Divide-by-zero risk — bar width math lacked a safe guard for zero-total edge cases
Changes
Search input under the Ranked section header — filters rows by label, case-insensitive
Fixed pointer/focus handling so dragging no longer interrupts user input in form controls
Bar fill now reflects proportion vs. the full event total (not filtered subset)
Small, tested helper functions + divide-by-zero guard for bar width calculation
Summary
When working with large codebases, the Ranked section becomes difficult to search — there's no way to quickly find a specific component, leading to endless scrolling.
This PR adds a search bar below the Ranked section header to filter rows by label (case-insensitive), making it fast to locate any component.
Problems Addressed
Changes
Please checkout this Video for reference
react-scan-without-search.webm