How brentmengelman/summarist-home-page works
Summarist is a book-summary discovery and listening app. Users browse or search titles, open a book’s details, and play its audio summary; they can save or finish books in a personal library, authenticate, and choose a subscription plan. The graph includes the Redux state layer and the Data Connect-backed library. Source excerpts show the library and search calls; page and checkout relationships rely on the source index, and payment-provider wiring is not shown.
Main entry points: page.tsx Landing Page · Sidebar.tsx Navigation Sidebar · SearchHeader.tsx Book Search · api.ts Book Catalog API
Components 29
Discovery
- Landing Page
src/app/page.tsx - Landing Sections
src/components/Landing.tsx - Feature Highlights
src/components/Features.tsx - Member Reviews
src/components/Reviews.tsx - Usage Numbers
src/components/Numbers.tsx - Footer
src/components/Footer.tsx - Recommendations
src/app/for-you/page.tsx - Book Search
src/components/SearchHeader.tsx - Book Catalog API
src/services/api.ts - Catalog Service
Book Experience
- Book Details
src/app/book/[id]/page.tsx - Audio Player
src/app/player/[id]/page.tsx
Account and Library
- Authentication
src/components/AuthModal.tsx - Auth State
src/store/authSlice.ts - Firebase Auth
src/firebase/firebase.ts - My Library
src/app/library/page.tsx - Library State
src/store/librarySlice.ts - Library Service
src/services/libraryService.ts - Firebase Data Connect
src/dataconnect-generated/esm/index.esm.js - Settings
src/app/settings/page.tsx - Plan Selection
src/app/choose-plan/page.tsx - Checkout Endpoint
src/app/api/create-checkout-session/route.ts
App Platform
- App Layout
src/app/layout.tsx - State Providers
src/store/providers.tsx - Redux Store
src/store/store.ts - Typed Store Hooks
src/store/hooks.ts - Navigation Sidebar
src/components/Sidebar.tsx
Other components
- Reader
- Payment Provider
Connections 34
- Reader → Landing Page: opens
src/app/page.tsx - Landing Page → Landing Sections: renders
src/app/page.tsx - Landing Page → Feature Highlights: renders
src/app/page.tsx - Landing Page → Member Reviews: renders
src/app/page.tsx - Landing Page → Usage Numbers: renders
src/app/page.tsx - Landing Page → Footer: renders
src/app/page.tsx - Reader → Recommendations: browses
src/app/for-you/page.tsx - Recommendations → Book Search: renders
src/app/for-you/page.tsx - Book Search → Book Catalog API: searches via
src/components/SearchHeader.tsx - Book Catalog API → Catalog Service: fetches titles
src/services/api.ts - Book Search → Book Details: opens selected
src/components/SearchHeader.tsx - Book Details → Book Catalog API: loads book
src/app/book/[id]/page.tsx - Book Details → Navigation Sidebar: renders
src/app/book/[id]/page.tsx - Audio Player → Book Catalog API: loads book
src/app/player/[id]/page.tsx - Audio Player → Library Service: marks finished
src/app/player/[id]/page.tsx - Audio Player → Navigation Sidebar: renders
src/app/player/[id]/page.tsx - Reader → Authentication: authenticates
src/components/AuthModal.tsx - Authentication → Firebase Auth: calls auth
src/components/AuthModal.tsx - Authentication → Auth State: updates
src/components/AuthModal.tsx - Navigation Sidebar → Firebase Auth: signs out
src/components/Sidebar.tsx - Navigation Sidebar → Auth State: updates
src/components/Sidebar.tsx - My Library → Library State: dispatches fetch
src/app/library/page.tsx - Library State → Library Service: loads and saves
src/store/librarySlice.ts - Library Service → Firebase Data Connect: queries and writes
src/services/libraryService.ts - My Library → Navigation Sidebar: renders
src/app/library/page.tsx - My Library → Book Search: renders
src/app/library/page.tsx - Settings → Navigation Sidebar: renders
src/app/settings/page.tsx - Settings → Auth State: reads
src/app/settings/page.tsx - Reader → Plan Selection: chooses plan
src/app/choose-plan/page.tsx - Plan Selection → Checkout Endpoint: starts checkout
- Checkout Endpoint → Payment Provider: processes payment
- App Layout → State Providers: wraps app
src/app/layout.tsx - State Providers → Redux Store: provides
src/store/providers.tsx - Typed Store Hooks → Redux Store: accesses
src/store/hooks.ts