fix(app): use the same CSP during tauri dev as tauri build (#3894)

* fix(app): use the same CSP during `tauri dev` as `tauri build`

* chore(app-frontend): make Vite WS CSP policy a bit more strict

* tweak: make Tauri CSP config object readable again

At the cost of some extra code in the Vite config side, but I think it's
worth it.

* chore: fix linter warning in app frontend introduced who knows where else

We need a Git hook to ensure these things aren't pushed only to explode
later on or something.

apps/app-frontend/src/components/ui/Instance.vue

@@ -19,7 +19,6 @@ import { showProfileInFolder } from '@/helpers/utils.js'
 import { handleSevereError } from '@/store/error.js'
 import { trackEvent } from '@/helpers/analytics'
 import dayjs from 'dayjs'
-import { formatCategory } from '@modrinth/utils'
 
 const formatRelativeTime = useRelativeTime()
 

apps/app-frontend/tsconfig.node.json

@@ -10,6 +10,7 @@
     "isolatedModules": true,
     "moduleDetection": "force",
     "noEmit": true,
+    "resolveJsonModule": true,
 
     "strict": true
   },

apps/app-frontend/vite.config.ts

@@ -4,6 +4,8 @@ import svgLoader from 'vite-svg-loader'
 
 import vue from '@vitejs/plugin-vue'
 
+import tauriConf from '../app/tauri.conf.json'
+
 const projectRootDir = resolve(__dirname)
 
 // https://vitejs.dev/config/
@@ -41,17 +43,32 @@ export default defineConfig({
   server: {
     port: 1420,
     strictPort: true,
+    headers: {
+      'content-security-policy': Object.entries(tauriConf.app.security.csp)
+        .map(([directive, sources]) => {
+          // An additional websocket connect-src is required for Vite dev tools to work
+          if (directive === 'connect-src') {
+            sources = Array.isArray(sources) ? sources : [sources]
+            sources.push('ws://localhost:1420')
+          }
+
+          return Array.isArray(sources)
+            ? `${directive} ${sources.join(' ')}`
+            : `${directive} ${sources}`
+        })
+        .join('; '),
+    },
   },
   // to make use of `TAURI_ENV_DEBUG` and other env variables
   // https://v2.tauri.app/reference/environment-variables/#tauri-cli-hook-commands
   envPrefix: ['VITE_', 'TAURI_'],
   build: {
     // Tauri supports es2021
-    target: process.env.TAURI_PLATFORM == 'windows' ? 'chrome105' : 'safari13', // eslint-disable-line turbo/no-undeclared-env-vars
+    target: process.env.TAURI_ENV_PLATFORM == 'windows' ? 'chrome105' : 'safari13', // eslint-disable-line turbo/no-undeclared-env-vars
     // don't minify for debug builds
-    minify: !process.env.TAURI_DEBUG ? 'esbuild' : false, // eslint-disable-line turbo/no-undeclared-env-vars
+    minify: !process.env.TAURI_ENV_DEBUG ? 'esbuild' : false, // eslint-disable-line turbo/no-undeclared-env-vars
     // produce sourcemaps for debug builds
-    sourcemap: !!process.env.TAURI_DEBUG, // eslint-disable-line turbo/no-undeclared-env-vars
+    sourcemap: !!process.env.TAURI_ENV_DEBUG, // eslint-disable-line turbo/no-undeclared-env-vars
     commonjsOptions: {
       esmExternals: true,
     },