---
id: task-4
title: PWA offline support
status: Done
assignee: []
created_date: '2025-12-15 19:37'
updated_date: '2026-01-02 16:15'
labels: []
dependencies: []
priority: high
---

## Description

<!-- SECTION:DESCRIPTION:BEGIN -->
Implement service worker for offline caching. Store map tiles, venue data, and room state in IndexedDB. Sync when reconnected.
<!-- SECTION:DESCRIPTION:END -->

## Implementation Notes

<!-- SECTION:NOTES:BEGIN -->
## Partial Implementation

PWA basics implemented:

1. **Service Worker** (`public/sw.js`)
   - Push notification handling
   - Location request messaging
   - Basic caching setup

2. **Install Banner** (`src/components/room/InstallBanner.tsx`)
   - Detects installable PWA state
   - Shows "Add to Home Screen" prompt
   - iOS-specific instructions
   - Dismissible with localStorage persistence

3. **PWA Manifest** - App manifest with icons and theme colors

## Still Needed
- Offline map tile caching (IndexedDB)
- Room state persistence for offline viewing
- Sync queue for offline location updates
- Background sync when reconnected

## Offline Support Completed

Implemented comprehensive PWA offline support:

1. **Multi-Strategy Service Worker Caching**:
   - App shell precaching for instant loading
   - Map tiles cache-first with background refresh (max 500 tiles)
   - API requests network-first with cache fallback
   - Static assets stale-while-revalidate

2. **IndexedDB Room State Persistence**:
   - saveRoomState() and getRoomState() for offline storage
   - Room state sync in useRoom hook
   - Saves state to SW on changes
   - Loads cached state on initial load for offline fallback

3. **Message Handlers**:
   - SAVE_ROOM_STATE - persist room data
   - GET_ROOM_STATE - retrieve cached data
   - CLEAR_CACHES - manual cache clearing

Deployed to production on 2026-01-02.
<!-- SECTION:NOTES:END -->
