Centralize MIME type allowlists and update usage

Introduces src/lib/constants/mime.ts to centralize text and image MIME allowlists. Updates components and server endpoint logic to use these constants for file type filtering, improving consistency and maintainability. Also fixes a minor label and MIME string typo.

Author: gary149

src/lib/components/chat/ChatInput.svelte

@@ -11,6 +11,7 @@
 	import CarbonLink from "~icons/carbon/link";
 	import CarbonChevronRight from "~icons/carbon/chevron-right";
 	import UrlFetchModal from "./UrlFetchModal.svelte";
+	import { TEXT_MIME_ALLOWLIST, IMAGE_MIME_ALLOWLIST_DEFAULT } from "$lib/constants/mime";
 
 	import { isVirtualKeyboard } from "$lib/utils/isVirtualKeyboard";
 	import { requireAuthUser } from "$lib/utils/auth";
@@ -73,13 +74,14 @@
 	function openFilePickerText() {
 		const textAccept =
 			mimeTypes.filter((m) => !(m === "image/*" || m.startsWith("image/"))).join(",") ||
-			"text/*,application/json,application/xml,application/csv";
+			TEXT_MIME_ALLOWLIST.join(",");
 		openPickerWithAccept(textAccept);
 	}
 
 	function openFilePickerImage() {
 		const imageAccept =
-			mimeTypes.filter((m) => m === "image/*" || m.startsWith("image/")).join(",") || "image/*";
+			mimeTypes.filter((m) => m === "image/*" || m.startsWith("image/")).join(",") ||
+			IMAGE_MIME_ALLOWLIST_DEFAULT.join(",");
 		openPickerWithAccept(imageAccept);
 	}
 

src/lib/components/chat/ChatWindow.svelte

@@ -232,18 +232,15 @@
 	let modelIsMultimodal = $derived((modelIsMultimodalOverride ?? currentModel.multimodal) === true);
 
 	// Always allow common text-like files; add images only when model is multimodal
-	const ALWAYS_TEXT_MIME_TYPES = [
-		"text/*",
-		"application/json",
-		"application/xml",
-		"application/csv",
-	];
+	import { TEXT_MIME_ALLOWLIST, IMAGE_MIME_ALLOWLIST_DEFAULT } from "$lib/constants/mime";
 
 	let activeMimeTypes = $derived(
 		Array.from(
 			new Set([
-				...ALWAYS_TEXT_MIME_TYPES,
-				...(modelIsMultimodal ? (currentModel.multimodalAcceptedMimetypes ?? ["image/*"]) : []),
+				...TEXT_MIME_ALLOWLIST,
+				...(modelIsMultimodal
+					? currentModel.multimodalAcceptedMimetypes ?? [...IMAGE_MIME_ALLOWLIST_DEFAULT]
+					: []),
 			])
 		)
 	);

src/lib/components/chat/UploadedFile.svelte

@@ -182,7 +182,7 @@
 					{/if}
 				</dl>
 			</div>
-		{:else if file.mime === "octet-stream"}
+{:else if file.mime === "application/octet-stream"}
 			<div
 				class="flex h-14 w-72 items-center gap-2 overflow-hidden rounded-xl border border-gray-200 bg-white p-2 dark:border-gray-800 dark:bg-gray-900"
 				class:file-hoverable={isClickable}

src/lib/components/chat/UrlFetchModal.svelte

@@ -136,7 +136,7 @@
 
 				<div class="flex flex-col gap-2">
 					<label class="text-sm text-gray-600 dark:text-gray-400" for="fetch-url-input"
-						>HTTPS URL</label
+						>Enter URL</label
 					>
 					<input
 						id="fetch-url-input"

src/lib/constants/mime.ts

@@ -0,0 +1,15 @@
+// Centralized MIME allowlists used across client and server
+// Keep these lists minimal and consistent with server processing.
+
+export const TEXT_MIME_ALLOWLIST = [
+  "text/*",
+  "application/json",
+  "application/xml",
+  "application/csv",
+] as const;
+
+export const IMAGE_MIME_ALLOWLIST_DEFAULT = [
+  "image/jpeg",
+  "image/png",
+] as const;
+

src/lib/server/endpoints/openai/endpointOai.ts

@@ -14,6 +14,7 @@ import { config } from "$lib/server/config";
 import type { Endpoint } from "../endpoints";
 import type OpenAI from "openai";
 import { createImageProcessorOptionsValidator, makeImageProcessor } from "../images";
+import { TEXT_MIME_ALLOWLIST } from "$lib/constants/mime";
 import type { MessageFile } from "$lib/types/Message";
 import type { EndpointMessage } from "../endpoints";
 // uuid import removed (no tool call ids)
@@ -282,14 +283,17 @@ async function prepareFiles(
 	textContent: string;
 }> {
 	// Separate image and text files
-	const imageFiles = files.filter((file) => file.mime.startsWith("image/"));
-	const textFiles = files.filter(
-		(file) =>
-			file.mime.startsWith("text/") ||
-			file.mime === "application/json" ||
-			file.mime === "application/xml" ||
-			file.mime === "application/csv"
-	);
+    const imageFiles = files.filter((file) => file.mime.startsWith("image/"));
+    const textFiles = files.filter((file) => {
+        const mime = (file.mime || "").toLowerCase();
+        const [fileType, fileSubtype] = mime.split("/");
+        return TEXT_MIME_ALLOWLIST.some((allowed) => {
+            const [type, subtype] = allowed.toLowerCase().split("/");
+            const typeOk = type === "*" || type === fileType;
+            const subOk = subtype === "*" || subtype === fileSubtype;
+            return typeOk && subOk;
+        });
+    });
 
 	// Process images if multimodal is enabled
 	let imageParts: OpenAI.Chat.Completions.ChatCompletionContentPartImage[] = [];