5847 surface common filters with helper

[mononoken]

Note: This is an alternative approach to #5871
Instead of persisting client state with sessionStorage, I scrapped the idea of using client state for the collapse logic. Instead, I am using the original method of having the menu shown or hidden based on the existence of the filter params. However, I have removed the "surfaced" params from this check, so that when you filter only by an option such as "Hide draft", it will not open the filter options menu.

---

What github issue is this PR for, if any?

Resolves #5847

What changed, and why?

• Moved the Sorted by and Hide drafts filter options outside of the collapsable area of the form element, so that they display regardless of filter menu collapse status.
• Fixed the positioning of the form select pseudo icons by refactoring the HTML syntax around the select elements
• Changed the filter-card-body collapse class logic to, fix a bug where the "Expand / show" button did not respond to the first click after filtering. This change accounts for how Bootstrap implements its version of collapse.
• Added helper expand_filters? to prevent filter menu from expanding when filtering only by "surfaced" filter options.

How is this tested? (please write tests!) 💖💪

I added tests for the new expanded_filters? helper method.

Screenshots please :)

Feelings gif (optional)

Instead of a gif, I asked ChatGPT to write a haiku about Bootstrap.
ブートストラップ
制約を感じて
自由を求め

[elasticspoon]

I'm pretty happy with this. I'll manually test it a bit and let Sam provide his input.

@mononoken Do you think you could add something to the system test that uses the exposed filters? ex:

Have drafts > check present
hide drafts > filter > check absent
expand > select another filter > filter
select all filters work > check still expanded by selecting some other expanded filter option

[mononoken]

I'm pretty happy with this. I'll manually test it a bit and let Sam provide his input.

@mononoken Do you think you could add something to the system test that uses the exposed filters? ex:

Have drafts > check present hide drafts > filter > check absent expand > select another filter > filter select all filters work > check still expanded by selecting some other expanded filter option

@elasticspoon , it looks like the first case was already tested at :93, but I have added some system tests to test the hide draft filter and the filter menu collapse functionality. If I missed any cases or the tests could be improved, please let me know!

[schoork]

Looks great @mononoken! I like this, too, because I think it will be easier to hook into Hotwire when we add it to the project.

[elasticspoon]

If you wanted to be fancy you could do:

<div class="<%= token_list("card-content mb-10 ml-20 collapse", {show: expand_filters?}) %>" id="filter-card-body">

https://apidock.com/rails/ActionView/Helpers/TagHelper/token_list

[elasticspoon]

This looks great! Thanks so much.

If you are still interested in turbo I can write up an issue for that 🙂

[mononoken]

Thank you both for the feedback on the issue! I'd be happy to work on implementing Turbo on the next issue, @elasticspoon .