Refine catalog layout and logo media

server/catalog-server.mjs

@@ -27,6 +27,8 @@ const mimeTypes = {
   ".png": "image/png",
   ".svg": "image/svg+xml",
   ".webm": "video/webm",
+  ".webp": "image/webp",
+  ".mov": "video/quicktime",
 };
 
 function json(response, statusCode, value) {
@@ -45,8 +47,19 @@ async function readJsonBody(request, maxBytes = 2 * 1024 * 1024) {
   return JSON.parse(Buffer.concat(chunks).toString("utf8"));
 }
 
-function safeUploadName(name) {
-  const extension = extname(name).toLowerCase() === ".mp4" ? ".mp4" : ".mp4";
+function safeUploadName(name, contentType = "") {
+  const allowed = new Set([".gif", ".jpeg", ".jpg", ".m4v", ".mov", ".mp4", ".png", ".webm", ".webp"]);
+  const contentTypeExtensions = {
+    "image/gif": ".gif",
+    "image/jpeg": ".jpg",
+    "image/png": ".png",
+    "image/webp": ".webp",
+    "video/mp4": ".mp4",
+    "video/quicktime": ".mov",
+    "video/webm": ".webm",
+  };
+  const requestedExtension = extname(name).toLowerCase();
+  const extension = allowed.has(requestedExtension) ? requestedExtension : contentTypeExtensions[contentType] || ".bin";
   const stem = name.replace(/\.[^.]+$/, "").replace(/[^a-z0-9_-]+/gi, "-").replace(/^-+|-+$/g, "").slice(0, 64) || "stage-video";
   return `${Date.now()}-${stem}${extension}`;
 }
@@ -108,7 +121,7 @@ const server = createServer(async (request, response) => {
 
     if (url.pathname === "/api/layout/media" && request.method === "PUT") {
       const originalName = decodeURIComponent(String(request.headers["x-file-name"] || "stage-video.mp4"));
-      const fileName = safeUploadName(originalName);
+      const fileName = safeUploadName(originalName, String(request.headers["content-type"] || ""));
       const targetPath = join(uploadDir, fileName);
       await pipeline(request, createWriteStream(targetPath, { flags: "wx" }));
       json(response, 201, { fileName: originalName, url: `/uploads/${fileName}` });