Commit 7: PWA (Manifest, Service Worker, Icons, Offline-Grundfunktion)

apps/frontend/vite.config.ts

@@ -1,8 +1,59 @@
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
+import { VitePWA } from "vite-plugin-pwa";
 
 export default defineConfig({
-  plugins: [react()],
+  plugins: [
+    react(),
+    VitePWA({
+      registerType: "autoUpdate",
+      includeAssets: ["favicon.svg", "apple-touch-icon.png"],
+      manifest: {
+        name: "LaunchPad",
+        short_name: "LaunchPad",
+        description: "Schneller, minimalistischer Homelab-Launcher",
+        lang: "de",
+        theme_color: "#0a0a0a",
+        background_color: "#0a0a0a",
+        display: "standalone",
+        start_url: "/",
+        icons: [
+          { src: "/icons/icon-192.png", sizes: "192x192", type: "image/png" },
+          { src: "/icons/icon-512.png", sizes: "512x512", type: "image/png" },
+          {
+            src: "/icons/icon-maskable-192.png",
+            sizes: "192x192",
+            type: "image/png",
+            purpose: "maskable",
+          },
+          {
+            src: "/icons/icon-maskable-512.png",
+            sizes: "512x512",
+            type: "image/png",
+            purpose: "maskable",
+          },
+        ],
+      },
+      workbox: {
+        // Zeigt beim Offline-Öffnen weiterhin die (gecachte) App-Shell an.
+        navigateFallback: "/index.html",
+        runtimeCaching: [
+          {
+            // Zuletzt geladene Geräte/Dienste/Kategorien bleiben offline verfügbar
+            // (NetworkFirst: frische Daten, wenn erreichbar, sonst letzter Cache-Stand).
+            urlPattern: ({ url }: { url: URL }) => url.pathname.startsWith("/api/"),
+            handler: "NetworkFirst",
+            options: {
+              cacheName: "launchpad-api-cache",
+              networkTimeoutSeconds: 3,
+              cacheableResponse: { statuses: [0, 200] },
+              expiration: { maxEntries: 100, maxAgeSeconds: 60 * 60 * 24 },
+            },
+          },
+        ],
+      },
+    }),
+  ],
   server: {
     host: true,
     port: 5173,