How yoyongler/bedtime-ai works
Bedtime Unwind is a React relaxation app whose main workflow is choosing a breathing exercise, following its timed visual phases with optional sound, and reaching a completion screen. Its alternate Unload & Breathe flow accepts typed or dictated thoughts, generates reassurance through Gemini when configured (otherwise using a fallback), then transitions into breathing. The app also includes API-key configuration and volume controls. The graph follows documented screen flows and sampled calls; unsampled relationships are omitted rather than inferred.
Main entry points: App.tsx Screen flow · MindDumpScreen.tsx Thought and reassurance · HomeScreen.tsx Exercise selection · ExerciseScreen.tsx Breathing session
Components 16
Relaxation experience
- Screen flow
src/App.tsx - Exercise selection
src/components/HomeScreen.tsx - Exercise definitions
src/constants/exercises.ts - Breathing session
src/components/ExerciseScreen.tsx - Completion screen
src/components/CompletionScreen.tsx
Mind-dump and speech
- Thought and reassurance
src/components/MindDumpScreen.tsx - Dictation lifecycle
src/hooks/useSpeechToText.ts - Speech API wrapper
src/utils/speechRecognition.ts
Sound and controls
- Audio synthesizer
src/utils/audio.ts - Volume controls
src/components/VolumeControl.tsx
External integrations
- Reassurance service
src/services/gemini.ts - API key settings
src/components/ApiKeyModal.tsx
Other components
- Sleeptime user
- Browser speech service
- Google Gemini
- Browser localStorage
Connections 22
- Sleeptime user → Screen flow: uses
README.md - Screen flow → Exercise selection: shows selection
README.md - Exercise selection → Screen flow: selects exercise
README.md - Screen flow → Exercise definitions: loads config
src/App.tsx - Screen flow → Breathing session: shows session
src/App.tsx - Breathing session → Screen flow: signals completion
README.md - Screen flow → Completion screen: shows result
src/App.tsx - Exercise selection → Thought and reassurance: selects mind dump
README.md - Screen flow → Thought and reassurance: shows thought flow
src/App.tsx - Thought and reassurance → Screen flow: proceeds to breathing
src/App.tsx - Thought and reassurance → Dictation lifecycle: uses dictation
src/components/MindDumpScreen.tsx - Dictation lifecycle → Speech API wrapper: uses recognition helpers
src/hooks/useSpeechToText.ts - Speech API wrapper → Browser speech service: detects and controls
src/utils/speechRecognition.ts - Thought and reassurance → Reassurance service: requests reassurance
src/components/MindDumpScreen.tsx - Reassurance service → Google Gemini: generates reassurance
src/services/gemini.ts - Reassurance service → Browser localStorage: reads saved key
README.md - API key settings → Browser localStorage: saves key
README.md - Screen flow → API key settings: shows settings
src/App.tsx - Screen flow → Audio synthesizer: starts and stops ambience
src/App.tsx - Breathing session → Audio synthesizer: plays phase cues
src/components/ExerciseScreen.tsx - Exercise selection → Volume controls: renders controls
src/components/HomeScreen.tsx - Screen flow → Audio synthesizer: toggles mute
src/App.tsx