Improve dropdown filter UX and fix tag selection

[Simrayz]

Scope and purpose

Fixes #1887.

Replaces Choices.js type-ahead filters with dropdown-based search widgets and fixes several UX issues with the new implementation.

Screen recording

type-ahead-redesign-compressed.mp4

Changes

• Fix tag filter not applying: Checked search results were removed from the DOM before htmx could include them in the request. Now checked items are preserved in the persistent options container before search results are cleared.
• Fix dropdown flicker during updates: The outerHTML swap of .show-selected-box caused DaisyUI's .dropdown-content opacity transition to briefly fire. Fixed by adding dropdown-open class during htmx request/settle cycle.
• Keep search results visible for multi-select: Search results no longer clear on each selection, allowing users to check multiple items from a single search query. Checked results are moved to persistent storage only when a new search replaces them.
• Improve checkbox contrast: Changed checkbox border from border to border-base-content/20 for better visibility on white dropdown backgrounds.

Contributor Checklist

• Added a changelog fragment for towncrier
• Added/amended tests for new/changed code
• Added/changed documentation, including updates to the user manual if feature flow or UI is considerably changed
• Linted/formatted the code with ruff and djLint, easiest by using pre-commit
• The first line of the commit message continues the sentence "If applied, this commit will ...", starts with a capital letter, does not end with punctuation and is 50 characters or less long. See our how-to
• If applicable: Created new issues if this PR does not fix the issue completely/there is further work to be done
• If this results in changes in the UI: Added screenshots of the before and after

[github-actions]

Test naming convention

All new test names follow the convention. 👍

[github-actions]

Test results

    8 files  1 712 suites   3m 6s ⏱️
  933 tests   932 ✅ 1 💤 0 ❌
7 464 runs  7 456 ✅ 8 💤 0 ❌

Results for commit db0c9f2.

♻️ This comment has been updated with latest results.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 88.60%. Comparing base (4c8f688) to head (db0c9f2).
⚠️ Report is 1 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #1887   +/-   ##
=======================================
  Coverage   88.60%   88.60%           
=======================================
  Files         146      146           
  Lines        7089     7093    +4     
=======================================
+ Hits         6281     6285    +4     
  Misses        808      808           

☔ 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.

[johannaengland]

I find it quite strange that the searching is not happening directly in the field that I am clicking like how it currently is, but that a second field appears in the dropdown that looks like the other one

[hmpf]

I find it quite strange that the searching is not happening directly in the field that I am clicking like how it currently is, but that a second field appears in the dropdown that looks like the other one

I think HTMx could be used to fix this: swap in the new form for the old form then show old, filled in on Enter/save?

[Simrayz]

I find it quite strange that the searching is not happening directly in the field that I am clicking like how it currently is, but that a second field appears in the dropdown that looks like the other one

@johannaengland
I have modified the inputs to use "Select sources" with a dropdown chevron icon instead of duplicating the text. This should make it more clear that the input is in fact a dropdown select. What do you think? Remember to rebuild css.

[johannaengland]

I really like the look! But my comment about changing the two views from class based views back to function based views is still open - you said it was a rebase mistake, but it has not been changed back

[Simrayz]

I really like the look! But my comment about changing the two views from class based views back to function based views is still open - you said it was a rebase mistake, but it has not been changed back

It has been reverted now though 🙈

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud