generate index.html's absolute URLs from PUBLIC_URL

index.html hardcoded the deployment's domain in eight places, so every instance
had to carry its own edit of the file — the only thing separating the rezio
branch from master.

The tags genuinely need absolute URLs. OpenGraph is fetched standalone by
crawlers, and Bun's HTML bundler treats a root-relative href as an asset to
resolve on disk, failing the build with "Could not resolve: /favicon.ico" —
external URLs are the only form it passes through untouched.

Bun's HTML import offers no substitution hook, so scripts/gen-index.ts swaps
__PUBLIC_URL__ for the value in .env and writes index.gen.html, which the server
imports. index.html is the tracked template and is now identical on every
deployment; index.gen.html is gitignored. predev/prestart run the generator, and
it is idempotent so --watch does not loop.

Substituting also fixes the manifest: an absolute URL puts its fetch in CORS
mode, which failed whenever the hardcoded domain was not the serving origin.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/apps/officer-web/index.html

@@ -6,29 +6,35 @@
     <title>Officer Dev (Alpha)</title>
     <meta name="description" content="Your all-purpose AI operating system. Personal AI assistant, terminal, file browser, code editor, and customizable dashboards — all self-hosted." />
 
+    <!-- OpenGraph. Crawlers fetch these standalone, so they need absolute URLs. __PUBLIC_URL__ is
+         substituted from .env by scripts/gen-index.ts into index.gen.html, which is what the server
+         actually serves — this file is the template and stays identical across deployments. -->
     <!-- OpenGraph -->
     <meta property="og:type" content="website" />
     <meta property="og:title" content="Officer Dev (Alpha)" />
     <meta property="og:description" content="Your all-purpose AI operating system. Personal AI assistant, terminal, file browser, code editor, and customizable dashboards — all self-hosted." />
-    <meta property="og:image" content="https://officer.pastilhas.dev/og-image-v3.jpg" />
-    <meta property="og:image:secure_url" content="https://officer.pastilhas.dev/og-image-v3.jpg" />
+    <meta property="og:image" content="__PUBLIC_URL__/og-image-v3.jpg" />
+    <meta property="og:image:secure_url" content="__PUBLIC_URL__/og-image-v3.jpg" />
     <meta property="og:image:width" content="1200" />
     <meta property="og:image:height" content="630" />
     <meta property="og:image:type" content="image/jpeg" />
-    <meta property="og:url" content="https://officer.pastilhas.dev" />
+    <meta property="og:url" content="__PUBLIC_URL__" />
     <meta property="og:site_name" content="Officer Dev" />
 
     <!-- Twitter Card -->
     <meta name="twitter:card" content="summary_large_image" />
     <meta name="twitter:title" content="Officer Dev (Alpha)" />
     <meta name="twitter:description" content="Your all-purpose AI operating system. Personal AI assistant, terminal, file browser, code editor, and customizable dashboards — all self-hosted." />
-    <meta name="twitter:image" content="https://officer.pastilhas.dev/og-image-v3.jpg" />
+    <meta name="twitter:image" content="__PUBLIC_URL__/og-image-v3.jpg" />
 
-    <!-- Favicons & App Icons -->
-    <link rel="icon" type="image/x-icon" href="https://officer.pastilhas.dev/favicon.ico" />
-    <link rel="icon" type="image/png" sizes="96x96" href="https://officer.pastilhas.dev/favicon-96x96.png" />
-    <link rel="apple-touch-icon" sizes="180x180" href="https://officer.pastilhas.dev/apple-touch-icon.png" />
-    <link rel="manifest" href="https://officer.pastilhas.dev/site.webmanifest" />
+    <!-- Favicons & App Icons. These must stay absolute: Bun's HTML bundler treats a root-relative
+         href as an asset to resolve on disk and fails the build ("Could not resolve: /favicon.ico"),
+         whereas external URLs are passed through untouched. Substituting PUBLIC_URL also keeps the
+         manifest same-origin, so its CORS-mode fetch succeeds. -->
+    <link rel="icon" type="image/x-icon" href="__PUBLIC_URL__/favicon.ico" />
+    <link rel="icon" type="image/png" sizes="96x96" href="__PUBLIC_URL__/favicon-96x96.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="__PUBLIC_URL__/apple-touch-icon.png" />
+    <link rel="manifest" href="__PUBLIC_URL__/site.webmanifest" />
     <meta name="theme-color" content="#1F2620" />
 
     <script src="https://cdn.jsdelivr.net/npm/eruda"></script>

src/server.tsx

@@ -12,7 +12,7 @@ import { cliampWebsocket } from './servers/api/cliamp/websocket';
 import { cliampAudioWebsocket } from './servers/api/cliamp/audio-ws';
 import { desktopWebsocket } from './servers/api/desktop/websocket';
 import { findEntryByProxyId, touchEntry } from './servers/api/dev-server/router';
-import officerWeb from './apps/officer-web/index.html';
+import officerWeb from './apps/officer-web/index.gen.html';
 import { startBrowserRelay } from './servers/api/browser/relay';
 import { registerSidecar, unregisterSidecar, handleSidecarMessage } from './servers/sidecar-registry';
 import './servers/api/chat/opencode/sidecar-server'; // subscribe to the opencode sidecar's port report