consolidate binary and claude image extension lists

Author: charlesvien

apps/code/src/renderer/features/editor/utils/cloud-prompt.ts

@@ -2,6 +2,7 @@ import type { ContentBlock } from "@agentclientprotocol/sdk";
 import {
   CLOUD_PROMPT_PREFIX,
   getImageMimeType,
+  isClaudeImageFile,
   isImageFile,
   serializeCloudPrompt,
 } from "@posthog/shared";
@@ -65,8 +66,6 @@ const TEXT_FILENAMES = new Set([
   "README",
   "README.md",
 ]);
-const CLOUD_IMAGE_EXTENSIONS = new Set(["png", "jpg", "jpeg", "gif", "webp"]);
-
 const MAX_EMBEDDED_IMAGE_BYTES = 5 * 1024 * 1024;
 
 function isTextAttachment(filePath: string): boolean {
@@ -75,10 +74,6 @@ function isTextAttachment(filePath: string): boolean {
   return TEXT_FILENAMES.has(fileName) || TEXT_EXTENSIONS.has(ext);
 }
 
-export function isSupportedCloudImageAttachment(filePath: string): boolean {
-  return CLOUD_IMAGE_EXTENSIONS.has(getFileExtension(filePath));
-}
-
 export function isSupportedCloudTextAttachment(filePath: string): boolean {
   return isTextAttachment(filePath);
 }
@@ -167,7 +162,7 @@ async function buildAttachmentBlock(filePath: string): Promise<ContentBlock> {
   const fileName = getFileName(filePath);
   const uri = pathToFileUri(filePath);
 
-  if (isSupportedCloudImageAttachment(fileName)) {
+  if (isClaudeImageFile(fileName)) {
     const base64 = await trpcClient.fs.readFileAsBase64.query({ filePath });
     if (!base64) {
       throw new Error(`Unable to read attached image ${fileName}`);

apps/code/src/renderer/utils/generateTitle.ts

@@ -1,5 +1,6 @@
 import { fetchAuthState } from "@features/auth/hooks/authQueries";
 import { xmlToContent } from "@features/message-editor/utils/content";
+import { isBinaryFile } from "@posthog/shared";
 import { trpcClient } from "@renderer/trpc";
 import { logger } from "@utils/logger";
 
@@ -8,44 +9,6 @@ const log = logger.scope("title-generator");
 const ATTACHED_FILES_REGEX = /^\[?Attached files:.*]?$/gm;
 const PASTED_TEXT_SNIPPET_LIMIT = 500;
 
-const BINARY_EXTENSIONS = new Set([
-  "png",
-  "jpg",
-  "jpeg",
-  "gif",
-  "webp",
-  "bmp",
-  "ico",
-  "svg",
-  "mp3",
-  "mp4",
-  "wav",
-  "avi",
-  "mov",
-  "mkv",
-  "pdf",
-  "zip",
-  "tar",
-  "gz",
-  "rar",
-  "7z",
-  "exe",
-  "dll",
-  "so",
-  "dylib",
-  "wasm",
-  "ttf",
-  "otf",
-  "woff",
-  "woff2",
-  "eot",
-]);
-
-function getExtension(filePath: string): string {
-  const dot = filePath.lastIndexOf(".");
-  return dot >= 0 ? filePath.slice(dot + 1).toLowerCase() : "";
-}
-
 function getFileName(filePath: string): string {
   const slash = filePath.lastIndexOf("/");
   return slash >= 0 ? filePath.slice(slash + 1) : filePath;
@@ -74,7 +37,7 @@ export async function enrichDescriptionWithFileContent(
 
   const parts = await Promise.all(
     paths.map(async (filePath) => {
-      if (BINARY_EXTENSIONS.has(getExtension(filePath))) {
+      if (isBinaryFile(filePath)) {
         return `[Attached: ${getFileName(filePath)}]`;
       }
       try {

packages/shared/src/binary.test.ts

@@ -0,0 +1,62 @@
+import { describe, expect, it } from "vitest";
+import { BINARY_EXTENSIONS, isBinaryFile } from "./binary";
+
+describe("isBinaryFile", () => {
+  it.each([
+    ["foo.png"],
+    ["foo.JPG"],
+    ["path/to/foo.gif"],
+    ["foo.webp"],
+    ["foo.tiff"],
+    ["foo.avif"],
+    ["foo.heic"],
+    ["foo.svg"],
+    ["foo.mp3"],
+    ["foo.mp4"],
+    ["foo.mov"],
+    ["foo.pdf"],
+    ["foo.zip"],
+    ["foo.tar.gz"],
+    ["foo.7z"],
+    ["foo.exe"],
+    ["foo.dll"],
+    ["foo.dylib"],
+    ["foo.wasm"],
+    ["foo.ttf"],
+    ["foo.woff2"],
+  ])("returns true for %s", (filename) => {
+    expect(isBinaryFile(filename)).toBe(true);
+  });
+
+  it.each([
+    ["foo.txt"],
+    ["foo.md"],
+    ["foo.ts"],
+    ["foo.json"],
+    ["foo"],
+    [""],
+    ["README"],
+  ])("returns false for %s", (filename) => {
+    expect(isBinaryFile(filename)).toBe(false);
+  });
+
+  it("includes every canonical image extension", () => {
+    for (const ext of [
+      "png",
+      "jpg",
+      "jpeg",
+      "gif",
+      "webp",
+      "bmp",
+      "ico",
+      "tiff",
+      "tif",
+      "svg",
+      "heic",
+      "heif",
+      "avif",
+    ]) {
+      expect(BINARY_EXTENSIONS.has(ext)).toBe(true);
+    }
+  });
+});

packages/shared/src/binary.ts

@@ -0,0 +1,66 @@
+import { IMAGE_MIME_TYPES } from "./image";
+
+export const AUDIO_VIDEO_EXTENSIONS: ReadonlySet<string> = new Set([
+  "mp3",
+  "mp4",
+  "wav",
+  "avi",
+  "mov",
+  "mkv",
+  "webm",
+  "mpg",
+  "mpeg",
+  "flac",
+  "ogg",
+  "m4a",
+  "aac",
+]);
+
+export const ARCHIVE_EXTENSIONS: ReadonlySet<string> = new Set([
+  "zip",
+  "tar",
+  "gz",
+  "tgz",
+  "bz2",
+  "xz",
+  "rar",
+  "7z",
+]);
+
+export const EXECUTABLE_EXTENSIONS: ReadonlySet<string> = new Set([
+  "exe",
+  "dll",
+  "so",
+  "dylib",
+  "wasm",
+  "bin",
+  "o",
+]);
+
+export const FONT_EXTENSIONS: ReadonlySet<string> = new Set([
+  "ttf",
+  "otf",
+  "woff",
+  "woff2",
+  "eot",
+]);
+
+export const DOCUMENT_BINARY_EXTENSIONS: ReadonlySet<string> = new Set(["pdf"]);
+
+export const BINARY_EXTENSIONS: ReadonlySet<string> = new Set([
+  ...Object.keys(IMAGE_MIME_TYPES),
+  ...AUDIO_VIDEO_EXTENSIONS,
+  ...ARCHIVE_EXTENSIONS,
+  ...EXECUTABLE_EXTENSIONS,
+  ...FONT_EXTENSIONS,
+  ...DOCUMENT_BINARY_EXTENSIONS,
+]);
+
+function extensionOf(filename: string): string {
+  return filename.split(".").pop()?.toLowerCase() ?? "";
+}
+
+export function isBinaryFile(filename: string): boolean {
+  const ext = extensionOf(filename);
+  return ext.length > 0 && BINARY_EXTENSIONS.has(ext);
+}

packages/shared/src/image.test.ts

@@ -3,6 +3,7 @@ import {
   buildImageDataUrl,
   getImageMimeType,
   isAllowedImageMimeType,
+  isClaudeImageFile,
   isGifFile,
   isImageFile,
   isRasterImageFile,
@@ -201,6 +202,30 @@ describe("isRasterImageFile", () => {
   });
 });
 
+describe("isClaudeImageFile", () => {
+  it.each([["foo.png"], ["foo.JPG"], ["foo.jpeg"], ["foo.gif"], ["foo.webp"]])(
+    "returns true for Claude-supported %s",
+    (filename) => {
+      expect(isClaudeImageFile(filename)).toBe(true);
+    },
+  );
+
+  it.each([
+    ["foo.bmp"],
+    ["foo.ico"],
+    ["foo.tiff"],
+    ["foo.svg"],
+    ["foo.heic"],
+    ["foo.heif"],
+    ["foo.avif"],
+    ["foo.txt"],
+    ["foo"],
+    [""],
+  ])("returns false for unsupported %s", (filename) => {
+    expect(isClaudeImageFile(filename)).toBe(false);
+  });
+});
+
 describe("isGifFile", () => {
   it("returns true for .gif", () => {
     expect(isGifFile("foo.gif")).toBe(true);

packages/shared/src/image.ts

@@ -52,6 +52,14 @@ export type ClaudeImageMimeType =
   | "image/gif"
   | "image/webp";
 
+export const CLAUDE_IMAGE_EXTENSIONS: ReadonlySet<string> = new Set([
+  "png",
+  "jpg",
+  "jpeg",
+  "gif",
+  "webp",
+]);
+
 const DATA_URL_PATTERN =
   /^data:([a-zA-Z]+\/[a-zA-Z0-9.+-]+)(?:;[a-zA-Z0-9-]+=[^;,]+)*;base64,([A-Za-z0-9+/=\s]+)$/;
 
@@ -77,6 +85,11 @@ export function isRasterImageFile(filename: string): boolean {
   return ext.length > 0 && RASTER_IMAGE_EXTENSIONS.has(ext);
 }
 
+export function isClaudeImageFile(filename: string): boolean {
+  const ext = extensionOf(filename);
+  return ext.length > 0 && CLAUDE_IMAGE_EXTENSIONS.has(ext);
+}
+
 export function isGifFile(filename: string): boolean {
   return extensionOf(filename) === "gif";
 }

packages/shared/src/index.ts

@@ -1,3 +1,12 @@
+export {
+  ARCHIVE_EXTENSIONS,
+  AUDIO_VIDEO_EXTENSIONS,
+  BINARY_EXTENSIONS,
+  DOCUMENT_BINARY_EXTENSIONS,
+  EXECUTABLE_EXTENSIONS,
+  FONT_EXTENSIONS,
+  isBinaryFile,
+} from "./binary";
 export {
   CLOUD_PROMPT_PREFIX,
   deserializeCloudPrompt,
@@ -7,10 +16,12 @@ export {
 export {
   ALLOWED_IMAGE_MIME_TYPES,
   buildImageDataUrl,
+  CLAUDE_IMAGE_EXTENSIONS,
   type ClaudeImageMimeType,
   getImageMimeType,
   IMAGE_MIME_TYPES,
   isAllowedImageMimeType,
+  isClaudeImageFile,
   isGifFile,
   isImageFile,
   isRasterImageFile,