fixed image previews

backend/routes/upload.js

@@ -4,6 +4,7 @@ const { authenticateToken } = require("../middleware/auth");
 const { uploadPresignLimiter } = require("../middleware/rateLimiter");
 const s3Service = require("../services/s3Service");
 const S3OwnershipService = require("../services/s3OwnershipService");
+const { v4: uuidv4 } = require("uuid");
 const logger = require("../utils/logger");
 const MAX_BATCH_SIZE = 20;
 
@@ -63,6 +64,7 @@ router.post(
 /**
  * POST /api/upload/presign-batch
  * Get presigned URLs for uploading multiple files to S3
+ * All files in a batch share the same UUID base for coordinated variant uploads
  */
 router.post(
   "/presign-batch",
@@ -96,13 +98,17 @@ router.post(
         }
       }
 
+      // Generate one shared UUID for all files in this batch
+      const sharedBaseKey = uuidv4();
+
       const results = await Promise.all(
         files.map((f) =>
           s3Service.getPresignedUploadUrl(
             uploadType,
             f.contentType,
             f.fileName,
-            f.fileSize
+            f.fileSize,
+            sharedBaseKey
           )
         )
       );
@@ -111,9 +117,10 @@ router.post(
         userId: req.user.id,
         uploadType,
         count: results.length,
+        baseKey: sharedBaseKey,
       });
 
-      res.json({ uploads: results });
+      res.json({ uploads: results, baseKey: sharedBaseKey });
     } catch (error) {
       if (error.message.includes("Invalid")) {
         return res.status(400).json({ error: error.message });

backend/services/s3Service.js

@@ -112,9 +112,10 @@ class S3Service {
    * @param {string} contentType - MIME type of the file
    * @param {string} fileName - Original filename (used for extension)
    * @param {number} fileSize - File size in bytes (required for size enforcement)
+   * @param {string} [baseKey] - Optional base key (UUID) for coordinated variant uploads
    * @returns {Promise<{uploadUrl: string, key: string, publicUrl: string, expiresAt: Date}>}
    */
-  async getPresignedUploadUrl(uploadType, contentType, fileName, fileSize) {
+  async getPresignedUploadUrl(uploadType, contentType, fileName, fileSize, baseKey = null) {
     if (!this.enabled) {
       throw new Error("S3 storage is not enabled");
     }
@@ -135,8 +136,21 @@ class S3Service {
       );
     }
 
+    // Extract known variant suffix from fileName if present (e.g., "photo_th.jpg" -> "_th")
     const ext = path.extname(fileName) || this.getExtFromMime(contentType);
-    const key = `${config.folder}/${uuidv4()}${ext}`;
+    const baseName = path.basename(fileName, ext);
+
+    // Only recognize known variant suffixes
+    let suffix = "";
+    if (baseName.endsWith("_th")) {
+      suffix = "_th";
+    } else if (baseName.endsWith("_md")) {
+      suffix = "_md";
+    }
+
+    // Use provided baseKey or generate new UUID
+    const uuid = baseKey || uuidv4();
+    const key = `${config.folder}/${uuid}${suffix}${ext}`;
 
     const cacheDirective = config.public ? "public" : "private";
     const command = new PutObjectCommand({