feat(pwa): add Progressive Web App support with iOS compatibility

- Install vite-plugin-pwa and workbox-window for PWA functionality
- Configure Vite with full PWA manifest (name, icons, theme, display)
- Add service worker caching for static assets only (no API cache)
- Create app icons (192x192, 512x512, apple-touch-icon)
- Generate iOS splash screens for multiple device sizes
- Add iOS-specific meta tags (apple-mobile-web-app-capable, etc.)
- Implement InstallPWA component with dual platform support:
  - Android/Chrome: beforeinstallprompt event with custom UI
  - iOS Safari: manual installation instructions with icons
- Add dismissal logic with 7-day localStorage persistence
- Update documentation to reflect 90% project completion

PWA implementation focuses on installability and static asset caching
while avoiding offline API cache (WebRTC requires active connection).
This commit is contained in:
Radosław Gierwiało
2025-11-19 20:59:26 +01:00
parent bfbfd0e729
commit f0a1bfb31a
21 changed files with 4618 additions and 12 deletions

View File

@@ -17,6 +17,7 @@ import HistoryPage from './pages/HistoryPage';
import ProfilePage from './pages/ProfilePage';
import PublicProfilePage from './pages/PublicProfilePage';
import VerificationBanner from './components/common/VerificationBanner';
import InstallPWA from './components/pwa/InstallPWA';
// Protected Route Component with Verification Banner
const ProtectedRoute = ({ children }) => {
@@ -65,6 +66,9 @@ function App() {
return (
<BrowserRouter>
<AuthProvider>
{/* PWA Install Prompt */}
<InstallPWA />
<Routes>
{/* Public Routes */}
<Route