How mohammad-hamedi/note-flow works
NoteFlow is an authenticated, browser-local notes workspace. A signed-in user enters the app, browses and searches notes by text, tag, filter, or notebook, edits a note in rich-text or Markdown mode, and can organize, share, or export it. The central state hook filters and persists note data; preferences separately cover theme and locale. The README documents several capabilities whose implementation wiring was not sampled, so those branches are shown only where the tree or excerpts support them.
Main entry points: note-editor.tsx Note editor · use-notes.ts Note state and filtering · app-shell.tsx Workspace shell · app-preferences.tsx Theme and locale
Components 23
App and access
- App route
app/page.tsx - Sign-in screen
app/sign-in/sign-in-screen.tsx - App providers
app/providers.tsx
Notes workspace
- Workspace shell
components/app-shell.tsx - Navigation and notebooks
components/sidebar.tsx - Search and note list
components/notes-list.tsx - Note editor
components/note-editor.tsx
State and persistence
- Note state and filtering
hooks/use-notes.ts - Storage helpers
lib/storage.ts - Note model
lib/types.ts - Notebook hierarchy
lib/notebooks.ts
Writing and preferences
- Rich-text editing
components/rich-text-editor.tsx - Markdown editing
components/markdown-editor.tsx - Undo and redo
hooks/use-undo-redo.ts - Note export
lib/export.ts - Export options
components/export-modal.tsx - Keyboard shortcuts
hooks/use-keyboard-shortcuts.ts - Theme and locale
contexts/app-preferences.tsx - English and Persian
lib/i18n/index.ts
Other components
- User
- Clerk authentication
- Browser storage
- Clipboard
Connections 25
- User → Sign-in screen: requests access
- Sign-in screen → Clerk authentication: authenticates with
- User → App route: uses workspace
- App route → Workspace shell: renders
- App providers → Theme and locale: provides preferences
- Workspace shell → Note state and filtering: manages notes through
- Workspace shell → Navigation and notebooks: renders
- Workspace shell → Search and note list: renders
- Workspace shell → Note editor: renders
- Search and note list → Note state and filtering: searches and selects
- Navigation and notebooks → Note state and filtering: chooses notebook
- Note editor → Note state and filtering: updates and organizes
- Note state and filtering → Storage helpers: reads and writes
- Storage helpers → Browser storage: persists JSON
- Note state and filtering → Note model: uses note model
- Note state and filtering → Notebook hierarchy: notebook operations
- Note editor → Rich-text editing: edits rich text
- Note editor → Markdown editing: edits Markdown
- Note editor → Undo and redo: uses history
- Note editor → Export options: opens export
- Export options → Note export: exports notes
- Note editor → Clipboard: copies note text
- Workspace shell → Keyboard shortcuts: handles shortcuts
- Theme and locale → Storage helpers: reads and writes
- Theme and locale → English and Persian: translates UI