Commit Graph

5 Commits

Author SHA1 Message Date
8c0981fa90 Implement Redux Persist for state persistence across page reloads
- Install redux-persist package
- Configure persistReducer with whitelist (offline, activities, children)
- Exclude network slice from persistence (should be fresh on reload)
- Add PersistGate to ReduxProvider with loading indicator
- Configure serializableCheck to ignore persist actions
- Store state now persists to localStorage automatically

This fixes the issue where app state was lost on page reload, improving UX.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-02 14:52:12 +00:00
6c8a50b910 Add biometric authentication enrollment UI
- Create biometric API client with WebAuthn methods
- Add BiometricSettings component for credential management
- Support Face ID, Touch ID, Windows Hello enrollment
- Display list of enrolled credentials with metadata
- Add/remove/rename biometric credentials
- Check browser and platform authenticator support
- Integrate into settings page with animations

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-01 22:30:09 +00:00
50bde54c8e feat: Integrate Redux Provider and simplify Redux store configuration
Some checks failed
CI/CD Pipeline / Build Application (push) Has been cancelled
CI/CD Pipeline / Lint and Test (push) Has been cancelled
CI/CD Pipeline / E2E Tests (push) Has been cancelled
Added Redux Provider to app layout and simplified Redux store to work
properly with Next.js SSR.

**Changes:**
- Added ReduxProvider wrapper to root layout (app/layout.tsx)
- Fixed ReduxProvider TypeScript type (React.ReactNode)
- Simplified store configuration by removing @redux-offline package
- Removed packages incompatible with SSR:
  - @redux-offline/redux-offline
  - redux-persist
  - localforage
- Re-added NetworkStatusIndicator to main page (now works with Redux)
- Kept custom offline middleware and sync middleware for offline-first functionality

**Why:**
The @redux-offline package and localforage try to access browser APIs (IndexedDB,
localStorage) during SSR, causing "No available storage method found" errors.
Our custom offline middleware provides the same functionality without SSR issues.

**Result:**
Redux store now works correctly with:
- Network status detection
- Offline action queuing
- Custom sync middleware
- Activities and children slices with optimistic updates

Next step: Can add redux-persist back with proper SSR guards if needed.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-01 19:42:33 +00:00
7cb2ff97de feat: Implement offline-first Redux architecture with optimistic updates
Some checks failed
CI/CD Pipeline / Lint and Test (push) Has been cancelled
CI/CD Pipeline / E2E Tests (push) Has been cancelled
CI/CD Pipeline / Build Application (push) Has been cancelled
Implemented comprehensive offline-first state management:

Redux Store Setup:
- Configure Redux Toolkit with @redux-offline/redux-offline
- Setup redux-persist with IndexedDB (localforage)
- Custom offline config with exponential backoff retry
- Normalized state with entity adapters

State Slices:
- activitiesSlice: Normalized activities with optimistic CRUD
- childrenSlice: Normalized children with optimistic CRUD
- networkSlice: Network status and connection quality
- offlineSlice: Sync queue and pending actions

Middleware:
- offlineMiddleware: Queue actions when offline
- syncMiddleware: Process pending actions when online
- Conflict resolution strategies (SERVER_WINS, CLIENT_WINS, LAST_WRITE_WINS, MERGE)
- Version-based conflict detection

Features:
- Optimistic updates for immediate UI feedback
- Automatic sync queue with retry logic (5 retries max)
- Network detection (browser events + periodic checks)
- Connection quality monitoring (excellent/good/poor/offline)
- Latency tracking
- Conflict resolution with multiple strategies
- Entity versioning for optimistic updates

Components:
- NetworkStatusIndicator: Full-screen status banner
- NetworkStatusBadge: Compact app bar badge
- ReduxProvider: Provider with network detection setup

Custom Hooks:
- useAppDispatch/useAppSelector: Typed Redux hooks
- useIsOnline: Check online status
- useHasPendingSync: Check for pending actions
- useSyncStatus: Get sync progress info
- useOptimisticAction: Combine optimistic + actual actions
- useNetworkQuality: Get connection quality
- useIsOptimistic: Check if entity is being synced

Documentation:
- Comprehensive README with usage examples
- Architecture overview
- Best practices guide
- Troubleshooting section

State Structure:
- Normalized entities with byId/allIds
- Optimistic metadata (_optimistic, _localId, _version)
- Entity adapters with memoized selectors
- Offline queue persistence to IndexedDB

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-01 19:24:46 +00:00
f3ff07c0ef Add comprehensive .gitignore 2025-10-01 19:01:52 +00:00