feat: add installable PWA #30

vite.config.ts

@@ -2,10 +2,55 @@ import { fileURLToPath, URL } from "node:url";
 import babel from "@rolldown/plugin-babel";
 import react, { reactCompilerPreset } from "@vitejs/plugin-react";
 import { defineConfig } from "vite";
+import { VitePWA } from "vite-plugin-pwa";
 
 // https://vite.dev/config/
 export default defineConfig({
-	plugins: [react(), babel({ presets: [reactCompilerPreset()] })],
+	plugins: [
+		react(),
+		babel({ presets: [reactCompilerPreset()] }),
+		VitePWA({
+			injectRegister: "script-defer",
+			// Let the waiting worker activate after all app windows close.
+			registerType: "prompt",
+			includeAssets: ["favicon.svg", "icons.svg", "apple-touch-icon.png"],
+			manifest: {
+				id: "/",
+				name: "WealthLedger",
+				short_name: "WealthLedger",
+				description: "Личные финансы и инвестиции",
+				lang: "ru",
+				start_url: "/",
+				scope: "/",
+				display: "standalone",
+				theme_color: "#ffffff",
+				background_color: "#ffffff",
+				icons: [
+					{ src: "/pwa-192x192.png", sizes: "192x192", type: "image/png" },
+					{ src: "/pwa-512x512.png", sizes: "512x512", type: "image/png" },
+					{
+						src: "/pwa-512x512.png",
+						sizes: "512x512",
+						type: "image/png",
+						purpose: "maskable",
+					},
+				],
+			},
+			workbox: {
+				globPatterns: ["**/*.{js,css,html,woff2}"],
+				// Only the static shell is cached; API requests always use the network.
+				navigateFallbackDenylist: [/^\/api(?:\/|$)/],
+			},
+			integration: {
+				configureOptions(config, options) {
+					// Storybook loads this Vite config but must not install an app worker.
+					options.disable = config.plugins.some((plugin) =>
+						plugin.name.startsWith("storybook:"),
+					);
+				},
+			},
+		}),
+	],
 	resolve: { alias: { "@": fileURLToPath(new URL("./src", import.meta.url)) } },
 	server: {
 		proxy: {