Add aria-label to filter panel close button

[olitreadwell]

Upstream target

hackforla/food-oasis: no issue; self-found accessibility gap in the search results filter panel.

What changed

Add aria-label="Close filters" to the desktop close button (icon-only IconButton) in the search results filter panel.

Add a Playwright test that verifies the button is reachable by its accessible name and closes the panel.

Why

The button at FilterPanel.tsx:155 rendered only a <CloseIcon /> with no text and no aria-label, so its accessible name was empty.

A screen reader announced it just as "button", giving no hint of its purpose.

The fix follows the file's own convention: the sibling clear-filter button already uses aria-label="Clear organization name filter", and AnnouncementSnackbar uses aria-label="close".

Verified empirically: with the source fix reverted, the new test fails (getByRole("button", { name: "Close filters" }) finds nothing); with the fix, it passes.

How to verify

git fetch https://github.com/olitreadwell/food-oasis.git fix/aria_label_filter_panel_close_button
git checkout FETCH_HEAD
cd client
npm ci
npx playwright install chromium
npm run start &                       # vite dev server on :3000
npx wait-on http://localhost:3000
CI=1 npx playwright test tests/organizations.spec.ts --project=chromium

Coverage

N/A: repo has no coverage tool wired up.

The change adds one focused Playwright test to the existing e2e suite.

Checks run locally

• Tests: PASS (organizations.spec.ts 9 passed, 0 failed; full chromium suite 35 passed before + 1 new = 36)
• Lint: N/A: npm run lint only globs **/*.{js,jsx}; this change is .tsx/.ts. The eslint binary is also not installed in the client workspace.
• Typecheck: PASS (npm run typecheck → tsc --noEmit, no errors)
• Build: PASS (npm run build → tsc && vite build, built in ~10s)

Style / template compliance

CONTRIBUTING.md has no code-style rules beyond the wiki workflow and no AI policy; there is no PR template in the repo.

The change matches neighbouring code style.

Prettier flags FilterPanel.tsx, but that warning pre-exists (present with this change stashed) and Prettier leaves the edited line unchanged, so the file was intentionally not reformatted to avoid unrelated churn.

Confidence: HIGH

Single-attribute a11y fix plus a test that fails without it.

The "Close filters" wording is a reasonable label for the panel titled "Filters"; a maintainer may prefer different wording, which is a trivial follow-up.

Recommendation

Ready to send upstream as-is (label wording is the only thing a human might tweak).

Promotion note

To open this against upstream once ready:

gh pr create --repo hackforla/food-oasis --base develop --head olitreadwell:contrib/hackforla-food-oasis-20260804-195901

No CLA or signed-commit requirement was found in hackforla/food-oasis's CONTRIBUTING.md or .github config (no PR template exists in this repo; the body above follows the CONTRIBUTING.md guidance to route developer contributions through the project's own dev workflow).

AI assistance

Drafted with AI assistance.

The gap was found and verified against the current code, the change was verified before opening, and this diff was reviewed line by line.

---

PROMOTION NOTE (remove this section before/when opening against upstream):

gh pr create --repo hackforla/food-oasis --base develop --head olitreadwell:fix/aria_label_filter_panel_close_button

Prerequisites: none outstanding (re-verify CLA/DCO/signing before promoting).

[olitreadwell]

Closing as duplicate: the same change was already submitted upstream in hackforla#2851 (CLOSED). See hackforla#2851

[olitreadwell]

Superseded by upstream hackforla#2851.