feat: add offline mode support with PWA capabilities #48
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Implements comprehensive offline functionality for the fitness workout app: ## New Features **PWA Infrastructure** - Add PWA manifest (manifest.json) with app metadata and icons - Create service worker with caching strategies: - Stale-while-revalidate for API calls - Cache-first for static assets - Background sync support for deferred actions **Client-Side Storage (IndexedDB)** - Add Dexie.js for IndexedDB management - Store entities locally: splits, exercises, workout sessions, personal records - Track sync state with isDirty flags - Implement pending actions queue for offline mutations - Add API response cache with TTL **Network & Sync** - Connection monitoring with Network Information API - Priority-based sync (workout sessions first) - Retry logic with max 3 attempts - Failed actions moved to dead letter queue - Sync locking to prevent concurrent operations - Automatic sync when connection restored **Offline-Aware API Client** - Enhanced apiRequest() with offline fallback - Queue mutations for later sync when offline - GET request caching with 5-minute TTL - Request timeout handling (10 seconds) - Authentication error handling (401) **UI Components** - OfflineIndicator component showing: - Online/offline status - Pending sync count - Manual sync button - Connection type (WiFi/cellular) **Integration** - Initialize offline support in layout - Service worker registration - Connection monitoring setup ## Tests Add 74 new tests (222 total): - IndexedDB operations (14 tests) - Sync service (13 tests) - Connection store (22 tests) - API client offline behavior (18 tests) - Service worker utilities (11 tests) All tests pass: 222 tests, 29 test files
Fix 'This expression is not callable' error by adding type assertion to updateFoundHandler variable in tests. TypeScript was incorrectly inferring the type as 'never' due to closure boundaries. - Add type assertion: (updateFoundHandler as () => void)() - Change null check from truthy to explicit !== null check
|
Branch |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Implements full offline functionality for SplitShare, allowing users to continue tracking workouts, viewing splits, and accessing exercise data even without an internet connection. All changes sync automatically when
connectivity is restored.
Key Features
🌐 PWA Infrastructure
static/manifest.json) - App metadata, icons, and display settingssrc/service-worker.ts) - Advanced caching strategies:💾 Client-Side Storage (IndexedDB)
isDirtyflags on all mutable entities🔄 Intelligent Sync System
📡 Network-Aware API Client
apiRequest()- Automatically handles offline scenarios📊 UI/UX Improvements
Testing
New Tests Added (74 tests, 222 total)
Test Infrastructure
fake-indexeddbfor browser-compatible IndexedDB mockingArchitecture Notes
.svelte.tsextension for proper rune support