How saadferozee/nooks works
Nooks is a Next.js messaging app backed by Supabase. The user journey spans authentication and username onboarding, finding someone, starting or opening a conversation, and chatting; the root layout also mounts auth and presence tracking. The README documents group chat, typing, read receipts, and media, but the sampled source does not establish their implementation details, so those capabilities are represented as documented features with uncertain wiring omitted. Arrows reflect sampled calls and explicit README architecture; unsampled routes and feature internals are not inferred.
Main entry points: UserSearch.tsx User search · route.ts Auth callback · AuthListener.tsx Auth listener · useUserSearch.ts Search hook
Components 22
App entry
- Root layout
app/layout.tsx - Main layout
app/(main)/layout.tsx - Conversation route
app/(main)/chat/[conversationId]/page.tsx
Identity
- Login page
app/(auth)/login/page.tsx - Signup page
app/(auth)/signup/page.tsx - Auth callback
app/auth/callback/route.ts - Username onboarding
app/onboarding/username/page.tsx - Auth forms
components/auth - Auth listener
components/auth/AuthListener.tsx - Auth state
libraries/stores/AuthStore.ts
Messaging
- Conversation list
components/chat/ConversationList.tsx - User search
components/chat/UserSearch.tsx - Search hook
libraries/hooks/useUserSearch.ts - Start conversation
libraries/hooks/useStartConversation.ts - Chat thread
components/chat/ChatThread.tsx - Presence tracker
components/chat/PresenceTracker.tsx - Realtime features
components/chat - Media sharing
components/chat
Supabase access
- Browser client
libraries/supabase/client.ts - Server client
libraries/supabase/server.ts - Supabase services
Other components
- User
Connections 25
- User → Login page: signs in
- User → Signup page: registers
- Login page → Auth forms: renders
- Signup page → Auth forms: renders
- Root layout → Auth listener: mounts
- Root layout → Presence tracker: mounts
- Auth listener → Browser client: creates client
- Auth listener → Auth state: updates state
- Auth callback → Supabase services: exchanges code
- Auth callback → Supabase services: reads profile
- Auth callback → Username onboarding: redirects
- Main layout → Conversation list: renders
- Main layout → Conversation route: hosts
- Conversation list → User search: provides search
- User search → Search hook: searches users
- User search → Start conversation: starts conversation
- User search → Auth state: reads user
- Search hook → Browser client: creates client
- Search hook → Supabase services: queries profiles
- Start conversation → Browser client: creates client
- Start conversation → Supabase services: reads and writes
- Conversation route → Chat thread: renders
- Presence tracker → Supabase services: tracks presence
- User → User search: finds people
- User → Chat thread: sends messages