feat(home): move "use my location" beside the hero search box #19

Merged
tudor merged 1 commits from feat/near-me-by-search into main 2026-07-06 17:56:58 +00:00
Owner

What

Moves the "Use my location" geolocation shortcut from the discovery strip (below the results) up into the hero search card, directly under the search input and paired with the postcode hint. The two ways to find nearby schools — type a postcode, or use your location — now read as one idea and are visible at first glance.

Chosen layout: Option A (pill under the search box) from the mockups reviewed with the user.

Changes

  • FilterBar.tsx — new optional onNearMe / geoState / geoError props; renders the teal "Use my location" pill (with the "Locating you…" spinner and inline error) in hero mode. The geolocation flow itself stays in HomeView.
  • HomeView.tsx — passes the geo handler/state into FilterBar; removes the now-duplicate near-me button and the whole discovery block.
  • CSS — pill/spinner/error styles moved into FilterBar.module.css (full-width, centered on ≤600px); dead .discoverySection / .nearMe* / .geoError rules removed from HomeView.module.css.
  • Hint copy refreshed to pair with the button.

Behaviour

Unchanged geolocation flow: permission prompt → nearest-postcode lookup → /?postcode=…&radius=1. Same analytics events (near_me_used, search_submitted).

Tests

  • e2e/tests/journeys.spec.ts — new assertion that the "use my location" shortcut renders inside the hero on /.
  • Local npm run typecheck and npm test (33 tests) pass.

Not visually verified against a running build (project rule: no local server) — the staging E2E gate covers the rendered result before promotion.

🤖 Generated with Claude Code

## What Moves the **"Use my location"** geolocation shortcut from the discovery strip (below the results) up into the hero search card, directly under the search input and paired with the postcode hint. The two ways to find nearby schools — type a postcode, or use your location — now read as one idea and are visible at first glance. Chosen layout: **Option A** (pill under the search box) from the mockups reviewed with the user. ## Changes - `FilterBar.tsx` — new optional `onNearMe` / `geoState` / `geoError` props; renders the teal "Use my location" pill (with the "Locating you…" spinner and inline error) in hero mode. The geolocation flow itself stays in `HomeView`. - `HomeView.tsx` — passes the geo handler/state into `FilterBar`; removes the now-duplicate near-me button and the whole discovery block. - CSS — pill/spinner/error styles moved into `FilterBar.module.css` (full-width, centered on ≤600px); dead `.discoverySection` / `.nearMe*` / `.geoError` rules removed from `HomeView.module.css`. - Hint copy refreshed to pair with the button. ## Behaviour Unchanged geolocation flow: permission prompt → nearest-postcode lookup → `/?postcode=…&radius=1`. Same analytics events (`near_me_used`, `search_submitted`). ## Tests - `e2e/tests/journeys.spec.ts` — new assertion that the "use my location" shortcut renders inside the hero on `/`. - Local `npm run typecheck` and `npm test` (33 tests) pass. Not visually verified against a running build (project rule: no local server) — the staging E2E gate covers the rendered result before promotion. 🤖 Generated with [Claude Code](https://claude.com/claude-code)
tudor added 1 commit 2026-07-06 16:02:07 +00:00
feat(home): move "use my location" beside the hero search box
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 9m40s
PR Checks / Backend Smoke (pull_request) Successful in 5s
PR Checks / Build Backend (no push) (pull_request) Successful in 10s
PR Checks / Build Frontend (no push) (pull_request) Successful in 42s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 9s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 1m19s
4e8df006d7
The geolocation shortcut lived in the discovery strip below the results,
away from the search. Move it directly under the hero search input, paired
with the postcode hint, so the two ways to find nearby schools ("type a
postcode" / "use my location") read as one idea and are visible at first
glance.

- FilterBar gains optional onNearMe/geoState/geoError props and renders the
  teal "Use my location" pill (with spinner + error) in hero mode; the
  geolocation flow itself still lives in HomeView.
- Remove the now-duplicate near-me button and its dead CSS from the
  discovery section.
- Refresh the search hint copy to pair with the button.
- e2e: assert the "use my location" shortcut renders in the hero.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

🤖 AI Code Review (Claude Code)

This PR relocates the 'use my location' geolocation shortcut from a separate discovery section below the fold into the hero search card in FilterBar, next to the search input, and adds a new e2e test asserting its visibility there. It's a purely presentational/structural move — CSS is transplanted intact (old rules deleted from HomeView.module.css, new copies added to FilterBar.module.css), state/handlers (geoState, geoError, handleNearMe) remain owned by HomeView and are passed down as props unchanged, and the new button uses type="button" so it can't interfere with the search form's onSubmit.

No issues found.

## 🤖 AI Code Review (Claude Code) This PR relocates the 'use my location' geolocation shortcut from a separate discovery section below the fold into the hero search card in FilterBar, next to the search input, and adds a new e2e test asserting its visibility there. It's a purely presentational/structural move — CSS is transplanted intact (old rules deleted from HomeView.module.css, new copies added to FilterBar.module.css), state/handlers (geoState, geoError, handleNearMe) remain owned by HomeView and are passed down as props unchanged, and the new button uses type="button" so it can't interfere with the search form's onSubmit. ✅ No issues found.
tudor merged commit 929748d014 into main 2026-07-06 17:56:58 +00:00
Sign in to join this conversation.
No Reviewers
No labels
2 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: tudor/school_compare#19