aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/client/components/SyncStatusIndicator.tsx
AgeCommit message (Collapse)Author
2026-05-02feat(client): read decks/cards/study from IndexedDB firstnsfisis
Switch deckAtom, cardsByDeckAtomFamily, noteTypesAtom, and studyDataAtom to a stale-while-revalidate pattern: read from IndexedDB synchronously, trigger sync in the background, and refetch on sync_complete. When local is empty, await a single bootstrap pull before deciding there's no data. Add study-builder to assemble StudyCards from LocalCard + Note + NoteType + field values, replacing the server /study endpoint dependency. The study session can now run end-to-end offline. Disable submit on all write modals when offline since writes still require the server. Add a "Showing cached data" hint to the sync status indicator. Drop cacheStudyCards (cards arrive via regular sync pull now) and update page tests to reflect that lists no longer refresh by hitting the GET API.
2026-01-04refactor(client): migrate state management from React Context to Jotainsfisis
Replace AuthProvider and SyncProvider with Jotai atoms for more granular state management and better performance. This migration: - Creates atoms for auth, sync, decks, cards, noteTypes, and study state - Uses atomFamily for parameterized state (e.g., cards by deckId) - Introduces StoreInitializer component for subscription initialization - Updates all components and pages to use useAtomValue/useSetAtom - Updates all tests to use Jotai Provider with createStore pattern 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-08refactor(client): replace inline SVGs with Font Awesome iconsnsfisis
Migrate all 28 inline SVG icons across 8 components to use Font Awesome React components for better maintainability and consistency. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-08feat(client): redesign frontend with TailwindCSS v4nsfisis
Replace inline styles with TailwindCSS, implementing a cohesive Japanese-inspired design system with custom colors (cream, teal primary), typography (Fraunces, DM Sans), and animations. Update all pages and components with consistent styling, improve accessibility by adding aria-hidden to decorative SVGs, and configure Biome for Tailwind CSS syntax support. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-07feat(client): add sync status indicator componentnsfisis
Add SyncStatusIndicator component to display current sync state in the UI header. The component shows online/offline status, syncing progress, pending changes count, and sync errors. - Create SyncProvider context to wrap SyncManager for React components - Add SyncStatusIndicator component with visual status indicators - Integrate indicator into HomePage header - Add comprehensive tests for SyncStatusIndicator and SyncProvider - Update existing tests to include SyncProvider wrapper 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>