feat: use production Totman favicon

Author: backnotprop

apps/hook/index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Plannotator</title>
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
+    <link rel="icon" type="image/png" sizes="64x64" href="/favicon.png">
 
     <!-- Fonts -->
     <link rel="preconnect" href="https://fonts.googleapis.com">

apps/marketing/public/favicon.png

@@ -23,7 +23,7 @@ import '../styles/global.css';
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>{title}</title>
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
+    <link rel="icon" type="image/png" sizes="256x256" href="/favicon.png">
     <meta name="description" content={description} />
 
     <meta property="og:type" content="website" />

apps/marketing/public/favicon.svg

@@ -9,7 +9,7 @@ import type { IncomingMessage } from "node:http";
 import { tmpdir } from "node:os";
 import { join, resolve as resolvePath } from "node:path";
 import { saveDraft, loadDraft, deleteDraft, getDraftGeneration } from "../generated/draft.js";
-import { FAVICON_SVG } from "../generated/favicon.js";
+import { FAVICON_PNG_BYTES } from "../generated/favicon.js";
 
 import { json, parseBody, send, toWebRequest } from "./helpers";
 import {
@@ -229,8 +229,8 @@ export function readDraftGenerationFromBody(body: unknown): number | undefined {
 export { readDraftGenerationFromUrl };
 
 export function handleFavicon(res: Res): void {
-	send(res, FAVICON_SVG, 200, {
-		"Content-Type": "image/svg+xml",
+	send(res, Buffer.from(FAVICON_PNG_BYTES), 200, {
+		"Content-Type": "image/png",
 		"Cache-Control": "public, max-age=86400",
 	});
 }

apps/marketing/src/layouts/Base.astro

@@ -609,7 +609,7 @@ export async function startAnnotateServer(options: {
 		} else if (url.pathname === "/api/reference/files/stream" && req.method === "GET") {
 			handleFileBrowserStreamRequest(req, res, url);
 			return;
-		} else if (url.pathname === "/favicon.svg") {
+		} else if (url.pathname === "/favicon.png") {
 			handleFavicon(res);
 		} else if (url.pathname === "/api/exit" && req.method === "POST") {
 			deleteDraft(draftKey, readDraftGenerationFromUrl(req));

apps/pi-extension/server/handlers.ts

@@ -324,7 +324,7 @@ export async function startPlanReviewServer(options: {
 			}
 		} else if (url.pathname === "/api/agents" && req.method === "GET") {
 			json(res, { agents: [] });
-		} else if (url.pathname === "/favicon.svg") {
+		} else if (url.pathname === "/favicon.png") {
 			handleFavicon(res);
 		} else if (url.pathname === "/api/save-notes" && req.method === "POST") {
 			await handleSaveNotesRequest(req, res);

apps/pi-extension/server/serverAnnotate.ts

@@ -2313,7 +2313,7 @@ export async function startReviewServer(options: {
 			}
 		} else if (url.pathname === "/api/draft") {
 			await handleDraftRequest(req, res, draftKey);
-		} else if (url.pathname === "/favicon.svg") {
+		} else if (url.pathname === "/favicon.png") {
 			handleFavicon(res);
 		} else if (await editorAnnotations.handle(req, res, url)) {
 			return;

apps/pi-extension/server/serverPlan.ts

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Code Review</title>
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
+    <link rel="icon" type="image/png" sizes="64x64" href="/favicon.png">
 
     <!-- Fonts -->
     <link rel="preconnect" href="https://fonts.googleapis.com">

apps/pi-extension/server/serverReview.ts

@@ -0,0 +1,33 @@
+import { describe, expect, test } from "bun:test";
+import { createHash } from "node:crypto";
+import {
+  FAVICON_PNG_BYTES,
+  FAVICON_PNG_DATA_URL,
+  FAVICON_SVG,
+} from "./favicon";
+
+describe("production favicon", () => {
+  test("embeds the canonical 64px PNG exactly", () => {
+    expect(createHash("sha256").update(FAVICON_PNG_BYTES).digest("hex")).toBe(
+      "8467d50dba314f3b72ab73ba37d406baabd8d74ed72529e853613442a8c65073",
+    );
+    expect(Array.from(FAVICON_PNG_BYTES.subarray(0, 8))).toEqual([
+      0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a,
+    ]);
+
+    const view = new DataView(
+      FAVICON_PNG_BYTES.buffer,
+      FAVICON_PNG_BYTES.byteOffset,
+      FAVICON_PNG_BYTES.byteLength,
+    );
+    expect(view.getUint32(16)).toBe(64);
+    expect(view.getUint32(20)).toBe(64);
+  });
+
+  test("keeps the SVG export as a wrapper around the canonical PNG", () => {
+    expect(FAVICON_PNG_DATA_URL).toStartWith("data:image/png;base64,");
+    expect(FAVICON_SVG).toContain(FAVICON_PNG_DATA_URL);
+    expect(FAVICON_SVG).not.toContain("<text");
+    expect(FAVICON_SVG).not.toContain("#070b14");
+  });
+});