How 11suixing11/mindnotes-pro works
MindNotes Pro is a local-first whiteboard: users draw and edit one board, organize it with layers and workspace settings, then rely on local autosave or export/import portable files. The React workspace routes interaction through canvas handlers into the Zustand document state; saving is managed separately through the document repository and recovery journal. README-documented templates, Mermaid import, export formats, and offline/desktop runtimes are included. Several feature modules were not sampled, so their implementation links are limited to paths supported by the tree.
Main entry points: appStore.ts Application store · App.tsx App workspace · Toolbar.tsx Tools and actions · ExportMenu.tsx Export actions
Components 26
Workspace UI
- App workspace
src/App.tsx - App lifecycle
src/components/app/useAppLifecycle.ts - Tools and actions
src/components/toolbar/Toolbar.tsx - Layers panel
src/components/layers/LayersPanel.tsx
Canvas Editing
- Canvas interaction
src/components/canvas/Canvas.tsx - Pointer engine
src/components/canvas/usePointerEngine.ts - Drawing handlers
src/components/canvas/useDrawingPointerHandlers.ts - Selection handlers
src/components/canvas/useSelectPointerHandlers.ts - Canvas renderer
src/components/canvas/useCanvasRenderer.ts - Canvas geometry
- Editable templates
src/components/templates/TemplateGallery.tsx - Mermaid import
src/core/mermaidImport.ts
Document State
- Application store
src/store/appStore.ts - Document operations
src/store/slices/canvasElements.ts - Layer model
src/store/layers.ts - Autosave manager
src/store/saveManager.ts - Document repository
src/store/documentRepository.ts - IndexedDB documents
src/store/indexedDbDocumentRepository.ts - Recovery journal
src/store/recovery.ts
Portability
- Export actions
src/components/export-menu/ExportMenu.tsx - Canvas exports
src/canvas/documentExport.ts - JSON backup
src/store/backup.ts - Legacy import
src/store/v4Import.ts
Other components
- Whiteboard user
- Browser runtime
- Electron shell
electron/main.mts
Connections 33
- Whiteboard user → App workspace: uses
- App workspace → Canvas interaction: renders
- App workspace → Tools and actions: renders
- App workspace → Layers panel: renders
- App workspace → App lifecycle: initializes
- Canvas interaction → Pointer engine: dispatches input
- Pointer engine → Drawing handlers: dispatches drawing
- Pointer engine → Selection handlers: dispatches selection
- Drawing handlers → Application store: commits elements
- Selection handlers → Application store: updates selection
- Canvas interaction → Canvas renderer: renders board
- Canvas renderer → Application store: reads document
- Drawing handlers → Canvas geometry: uses geometry
- Selection handlers → Canvas geometry: uses geometry
- Layers panel → Application store: updates layers
- Tools and actions → Application store: issues actions
- Tools and actions → Editable templates: opens templates
- Editable templates → Application store: inserts content
- App lifecycle → Application store: initializes board
- Application store → Document operations: delegates mutations
- Application store → Autosave manager: schedules saves
- Autosave manager → Document repository: persists document
- Document repository → IndexedDB documents: reads and writes
- Autosave manager → Recovery journal: writes draft
- Tools and actions → Export actions: opens export
- Export actions → Canvas exports: exports visuals
- Export actions → JSON backup: backs up
- Export actions → Legacy import: imports backup
- Legacy import → Application store: replaces board
- App workspace → Mermaid import: handles paste
- Mermaid import → Application store: imports diagram
- Browser runtime → App workspace: hosts
- Electron shell → App workspace: loads UI