hackforla / hackforla/website

Search/Filter Integration: Update Counter and Improve Visual Feedback

Open
#8,467 0 comments 0 reactions 0 assignees View on GitHub
Complexity: Large Feature: Refactor CSS Feature: Refactor HTML HLC: M P-Feature: Projects page Ready for Prioritization role: back end/devOps role: front end size: 2pt
Dominant language
JavaScript
Stars
363
Forks
872
Avg merge
2d 21h
Merged PRs (30d)
18

Description

### Overview
We need to integrate the search bar with the filter system on the Projects page so that search terms update the filter counter, provide immediate visual feedback, and allow users to continuously add multiple search terms. Currently, users have no visual indication that their search was applied unless they manually open the filter bar, and they cannot add multiple search terms in a continuous workflow.

### Action Items
- [ ] Update filter counter to increment when search is performed (e.g., "Filters" → "Filters (1)")
- [ ] Make search terms immediately visible in the "Applied Filters" section without requiring the filter bar to be opened
- [ ] Enable continuous search functionality so users can add multiple search terms without reopening the filter bar
- [ ] Verify that the filter counter accurately reflects the total number of active filters AND search terms
- [ ] Test that all changes work correctly in both mobile and desktop views

### Resources/Instructions
- ER: Search Bar Not Persisting Results and Missing Filter Bar Integration #8420
* Technical consideration: The root problem is that the search bar and filter bar operate independently. The fix should make them work together as a single, unified system.
* Note: "Clear All" button currently works correctly and clears search results.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.