Modernize frontend and centralize branding

vite.config.mjs

@@ -0,0 +1,58 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import tailwindcss from '@tailwindcss/vite';
+import { readFileSync, writeFileSync } from 'node:fs';
+
+const branding = JSON.parse(readFileSync(new URL('./branding.json', import.meta.url), 'utf8'));
+
+const brandHtml = {
+  name: 'anchorhost-brand-html',
+  configureServer(server) {
+    server.middlewares.use((request, response, next) => {
+      if (request.url?.split('?')[0] !== '/manifest.json') return next();
+      const manifest = JSON.parse(readFileSync(new URL('./public/manifest.json', import.meta.url), 'utf8'));
+      manifest.name = branding.name;
+      manifest.short_name = branding.name;
+      response.setHeader('Content-Type', 'application/manifest+json');
+      response.end(JSON.stringify(manifest));
+    });
+  },
+  transformIndexHtml(html) {
+    return html
+      .replaceAll('%BRAND_NAME%', branding.name)
+      .replaceAll('%BRAND_DESCRIPTION%', branding.description);
+  },
+  generateBundle(_, bundle) {
+    const manifest = bundle['manifest.json'];
+    if (!manifest || manifest.type !== 'asset') return;
+    const data = JSON.parse(manifest.source.toString());
+    data.name = branding.name;
+    data.short_name = branding.name;
+    manifest.source = JSON.stringify(data, null, 2);
+  },
+  closeBundle() {
+    const manifestPath = new URL('./dist/manifest.json', import.meta.url);
+    try {
+      const data = JSON.parse(readFileSync(manifestPath, 'utf8'));
+      data.name = branding.name;
+      data.short_name = branding.name;
+      writeFileSync(manifestPath, `${JSON.stringify(data, null, 2)}\n`);
+    } catch (error) {
+      if (error.code !== 'ENOENT') throw error;
+    }
+  },
+};
+
+export default defineConfig({
+  plugins: [react(), tailwindcss(), brandHtml],
+  server: {
+    host: '0.0.0.0',
+  },
+  preview: {
+    host: '0.0.0.0',
+  },
+  build: {
+    outDir: 'dist',
+    sourcemap: false,
+  },
+});