From d1ba638cd5269246f4c8d9825b2cc40c7f9ecf2a Mon Sep 17 00:00:00 2001
From: dswbx <dennis.senn@gmx.ch>
Date: Mon, 29 Sep 2025 16:07:40 +0200
Subject: [PATCH] fix: refine mime type checks and improve MediaInfoModal
 layout

Updated tests to check for mime types using `toStartWith` for better validation. Adjusted mime type patterns in DropzoneInner for XML handling. Modified MediaInfoModal to enhance layout responsiveness and broaden text format support for previews, ensuring better file handling and user experience.
---
 app/__test__/media/MediaController.spec.ts  | 4 ++--
 app/src/media/storage/mime-types-tiny.ts    | 4 ++--
 app/src/ui/elements/media/DropzoneInner.tsx | 2 +-
 app/src/ui/modals/media/MediaInfoModal.tsx  | 4 ++--
 4 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/app/__test__/media/MediaController.spec.ts b/app/__test__/media/MediaController.spec.ts
index ec2aa1e..bf62599 100644
--- a/app/__test__/media/MediaController.spec.ts
+++ b/app/__test__/media/MediaController.spec.ts
@@ -104,7 +104,7 @@ describe("MediaController", () => {
          body: file,
       });
       const result = (await res.json()) as any;
-      expect(result.data.mime_type).toBe("audio/mpeg");
+      expect(result.data.mime_type).toStartWith("audio/mpeg");
       expect(result.name).toBe(name);
 
       const destFile = Bun.file(assetsTmpPath + "/" + name);
@@ -121,7 +121,7 @@ describe("MediaController", () => {
          body: file,
       });
       const result = (await res.json()) as any;
-      expect(result.data.mime_type).toBe("text/plain");
+      expect(result.data.mime_type).toStartWith("text/plain");
       expect(result.name).toBe(name);
 
       const destFile = Bun.file(assetsTmpPath + "/" + name);
diff --git a/app/src/media/storage/mime-types-tiny.ts b/app/src/media/storage/mime-types-tiny.ts
index fcadd55..bbc8d9d 100644
--- a/app/src/media/storage/mime-types-tiny.ts
+++ b/app/src/media/storage/mime-types-tiny.ts
@@ -2,8 +2,8 @@ export const Q = {
    video: ["mp4", "webm"],
    audio: ["ogg"],
    image: ["jpeg", "png", "gif", "webp", "bmp", "tiff", "avif", "heic", "heif"],
-   text: ["html", "css", "mdx", "yaml", "vcard", "csv", "vtt", "xml"],
-   application: ["zip", "toml", "json", "json5", "pdf", "sql"],
+   text: ["html", "css", "mdx", "yaml", "vcard", "csv", "vtt"],
+   application: ["zip", "toml", "json", "json5", "pdf", "xml"],
    font: ["woff", "woff2", "ttf", "otf"],
 } as const;
 
diff --git a/app/src/ui/elements/media/DropzoneInner.tsx b/app/src/ui/elements/media/DropzoneInner.tsx
index 742ca3b..bb9ae54 100644
--- a/app/src/ui/elements/media/DropzoneInner.tsx
+++ b/app/src/ui/elements/media/DropzoneInner.tsx
@@ -296,7 +296,7 @@ const Previews = [
       Icon: TbFileTypeCsv,
    },
    {
-      mime: "text/xml",
+      mime: /(text|application)\/xml/,
       Icon: TbFileTypeXml,
    },
    {
diff --git a/app/src/ui/modals/media/MediaInfoModal.tsx b/app/src/ui/modals/media/MediaInfoModal.tsx
index 3a87e01..bfce4f1 100644
--- a/app/src/ui/modals/media/MediaInfoModal.tsx
+++ b/app/src/ui/modals/media/MediaInfoModal.tsx
@@ -43,7 +43,7 @@ export function MediaInfoModal({
 
    return (
       <div className="flex flex-col md:flex-row">
-         <div className="flex w-full md:w-[calc(100%-300px)] justify-center items-center bg-lightest min-w-0">
+         <div className="flex w-full md:w-[calc(100%-300px)] justify-center items-center bg-lightest min-w-50">
             <FilePreview file={file} />
          </div>
          <div className="w-full md:!w-[300px] flex flex-col">
@@ -156,7 +156,7 @@ const Item = ({
    );
 };
 
-const textFormats = [/^text\/.*$/, /application\/(json|ld\+json|javascript|xml|rtf|sql)/];
+const textFormats = [/^text\/.*$/, /application\/(x\-)?(json|json|yaml|javascript|xml|rtf|sql)/];
 
 const FilePreview = ({ file }: { file: FileState }) => {
    const objectUrl = typeof file.body === "string" ? file.body : URL.createObjectURL(file.body);