Highlight selected filter facets in search sidebar

[Bhoma38]

Description

Fixes #2328
Reference PR #4078

Collapsed sidebar filter facets should indicate if a value is selected

Instructions for Reviewers

When users apply multiple filters on the /search page, they often collapse individual facets. This makes it difficult to track which filters are active without expanding each section.

Expected Behavior

Sidebar filter facets should clearly indicate if they're "active", especially when they're collapsed.

List of Changes in this PR:

• Added a variable $highlightColor: rgba(30, 111, 144, 0.3) !default in src/styles/_bootstrap_variables.scss
• Mapped --bs-highlight-color: #{$highlightColor} in src/styles/_bootstrap_variables_mapping.scss
• Added background color (--bs-highlight-color) when checkbox is checked in ds-search-filter in src/styles/_global-styles.scss

Steps to Test and Reproduce the Behavior:

On the /search page, when you select a checkbox within a filter, the filter becomes active. If you collapse the filter, it remains active as long as a checkbox is selected. If no checkbox is selected, the filter is not activated.

[PitbaranK]

@tdonohue,
Can you please help in aligning reviewer for this.

[tdonohue]

@PitbaranK : This PR, along with the other PRs you've just updated are all on our 10.0 board waiting for volunteer reviewers. At this time, DSpace code reviews are performed entirely by volunteers. So, the process of finding an interested reviewer can take some time (and I also have very limited time to perform reviews). If you'd like to speed up the process of finding a reviewer, I often recommend finding a developer to "trade reviews" with (see Trading Reviews on Pull Requests). "Trading reviews" means that you (or someone on your team) would review/test someone else's PR in exchange for them reviewing/testing one of your PRs.

Otherwise, we will eventually find a volunteer to review these PRs. It's just that we are currently under a PR backlog and it's taking time to review all the PRs that need attention.

[github-actions]

Hi @Bhoma38,
Conflicts have been detected against the base branch.
Please resolve these conflicts as soon as you can. Thanks!

[alegontarz]

QA testing performed (no code review).

Works as expected:

1. Collapsed sidebar filter facets correctly indicate when a checkbox value is selected.
2. The highlight remains visible after collapsing the facet and is removed when no checkbox is selected.

Does not work as expected:

1. The Date filter does not indicate an active state, although it does not use checkboxes; for UI consistency, it should also change its background color when a date value is selected.

[tdonohue]

@alegontarz : Just a sidenote. For any PRs you review that have problems. please leave them in the "Under Review" column. The "In Progress" column is only meant for issue tickets to represent they are being worked on. So, we don't want PRs to move into "In Progress" as they will get lost in that column among the issue tickets. Thanks!

[PitbaranK]

Hey @alegontarz,
We appreciate the valuable QA feedback and have integrated the updates; could you please perform a final review?

[tdonohue]

@PitbaranK : Just wanted to note that, per DSpace policies, all PRs require approval outside of your own team. I see that you are approving all PRs from your Virsoftech colleagues without any comments regarding why you approve it. We will be ignoring those approvals, as these appear to be a possible conflict of interest (as it's unclear that you are performing the required testing or code review that we ask of all reviewers).

If you have actually tested your colleague's PRs or performed a code review, then we ask that you provide details in your review regarding what steps you've taken to test/verify the work in each PR. Thanks!

[PitbaranK]

@PitbaranK : Just wanted to note that, per DSpace policies, all PRs require approval outside of your own team. I see that you are approving all PRs from your Virsoftech colleagues without any comments regarding why you approve it. We will be ignoring those approvals, as these appear to be a possible conflict of interest (as it's unclear that you are performing the required testing or code review that we ask of all reviewers).

If you have actually tested your colleague's PRs or performed a code review, then we ask that you provide details in your review regarding what steps you've taken to test/verify the work in each PR. Thanks!

@tdonohue : Noted. To clarify, our internal approvals are the result of a code review and QA process within Virsoftech. The approval contains as part of code review and QA check.

If it is helpful, we can provide the specific evidence from our internal reviews and testing to help speed up the process. Please let us know in case we can include those details moving forward. Thanks!

[tdonohue]

@PitbaranK : Thanks for clarifying. We do require evidence of any approvals, if you plan to submit approvals. So, please do include details about any code reviewing or testing that has been done internally, or (alternatively) you could begin to provide more of your internal reviews in a public fashion.

Essentially, we ask that all testers/reviewers provide details/evidence of their test/review whenever they submit approval. That way we can understand which parts of the code may have already been tested/reviewed, etc.

[alanorth]

Closing and re-opening to fix stuck tests in GitHub CI.

[alanorth]

Thanks @Bhoma38! I tested this locally against sandbox.dspace.org and I really like the effect. It's subtle and gives a nice hint to the user about filters that have been modified.

See:

I left a small feedback about the usage of a new variable for the color.