Enhance Bible Search App (Phase 2 – Core Product Features)

Project Title:
Enhance Bible Search App (Phase 2 – Core Product Features)

Overview:
We have a working MVP deployed (React front-end + audio search + Railway hosting).

This phase focuses on turning it into a usable product by improving:

* saving
* sharing
* playback experience

The existing UI and structure should remain the same. This is an enhancement phase, not a redesign.

---

Scope of Work:

1. Google Login + Saved Verses

* Add “Sign in with Google”
* Users can save verses when logged in
* Saved verses appear in the Saved tab
* Saved verses persist across devices
* Save button should toggle state (e.g. green when saved)

---

2. Share Full Search Page (Important)

* URL must update with search query (e.g. /search?q=joy)
* Add Share button at page level
* On mobile: open native share sheet
* On desktop: copy link to clipboard

---

3. Audio + Scroll Sync

* While audio is playing:

* highlight the currently playing verse
* automatically scroll to keep it visible
* Smooth scrolling behaviour (not jumpy)

---

4. Improve Action Button UX

* Keep Play and Save clearly visible
* Move secondary actions (Copy, Share) into a menu if needed
* Avoid clutter on mobile

---

5. Saved Button Visual Feedback

* When a verse is saved:

* button changes colour (e.g. green)
* clear toggle state (Saved / Unsave)

---

Out of Scope:

* Background playback / mini player
* Streaming audio system
* Full account/profile system beyond Google login
* Major UI redesign

---

Deliverables:

* Updated React app
* All features working on mobile + desktop
* Deployed to Railway
* Clean, maintainable code

---

Acceptance Criteria:

* User can log in with Google
* Saved verses persist across sessions/devices
* Share link opens same search results
* Audio scrolls and highlights correctly
* UI is clean and not cluttered