feat(pwa): configure vite-plugin-pwa with manifest and workbox precaching

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>

apps/main/vite.config.ts

@@ -5,6 +5,7 @@ import tailwindcss from "@tailwindcss/vite";
 import react from "@vitejs/plugin-react";
 import { visualizer } from "rollup-plugin-visualizer";
 import { defineConfig, type PluginOption } from "vite";
+import { VitePWA } from "vite-plugin-pwa";
 import tsconfigPaths from "vite-tsconfig-paths";
 
 // https://vitejs.dev/config/
@@ -16,6 +17,49 @@ export default defineConfig(({ mode }) => {
     tsconfigPaths(),
   ];
 
+  plugins.push(
+    VitePWA({
+      registerType: "autoUpdate",
+      includeAssets: [
+        "public/icon.jpg",
+        "public/logo_dark.png",
+        "public/logo_white.png",
+      ],
+      manifest: {
+        name: mode === "staging" ? "XTablo (Staging)" : "XTablo",
+        short_name: "XTablo",
+        description: "Collaborative project management for construction teams",
+        start_url: "/",
+        display: "standalone",
+        orientation: "any",
+        theme_color: "#1e1b2e",
+        background_color: "#1e1b2e",
+        icons: [
+          {
+            src: "pwa-icons/pwa-192x192.png",
+            sizes: "192x192",
+            type: "image/png",
+          },
+          {
+            src: "pwa-icons/pwa-512x512.png",
+            sizes: "512x512",
+            type: "image/png",
+          },
+          {
+            src: "pwa-icons/pwa-512x512-maskable.png",
+            sizes: "512x512",
+            type: "image/png",
+            purpose: "maskable",
+          },
+        ],
+      },
+      workbox: {
+        globPatterns: ["**/*.{js,css,html,ico,png,jpg,svg,woff,woff2}"],
+        globIgnores: ["**/*.map"],
+      },
+    })
+  );
+
   // Only include cloudflare plugin when not in test mode
   if (mode !== "test" && process.env.VITEST !== "true") {
     plugins.push(cloudflare({ inspectorPort: 9230 }));