small banner photos for navbar

src/lib/s3upload.ts

@@ -4,6 +4,7 @@
  */
 
 import { api } from "~/lib/api";
+import { resizeImage } from "~/lib/resize-utils";
 
 export default async function AddImageToS3(
   file: Blob | File,
@@ -26,7 +27,7 @@ export default async function AddImageToS3(
     const ext = /^.+\.([^.]+)$/.exec(filename);
     const contentType = ext ? `image/${ext[1]}` : "application/octet-stream";
 
-    // Upload file to S3 using pre-signed URL
+    // Upload original file to S3 using pre-signed URL
     const uploadResponse = await fetch(uploadURL, {
       method: "PUT",
       headers: {
@@ -39,6 +40,47 @@ export default async function AddImageToS3(
       throw new Error("Failed to upload file to S3");
     }
 
+    // For blog cover images, also create and upload a thumbnail
+    if (type === "blog") {
+      try {
+        // Create thumbnail (max 200x200px for sidebar display)
+        const thumbnail = await resizeImage(file, 200, 200, 0.8);
+
+        // Generate thumbnail filename: insert "-small" before extension
+        const thumbnailFilename = filename.replace(
+          /(\.[^.]+)$/,
+          "-small$1"
+        );
+
+        // Get pre-signed URL for thumbnail
+        const { uploadURL: thumbnailUploadURL } =
+          await api.misc.getPreSignedURL.mutate({
+            type,
+            title,
+            filename: thumbnailFilename
+          });
+
+        // Upload thumbnail to S3
+        const thumbnailUploadResponse = await fetch(thumbnailUploadURL, {
+          method: "PUT",
+          headers: {
+            "Content-Type": "image/jpeg" // Thumbnails are always JPEG
+          },
+          body: thumbnail
+        });
+
+        if (!thumbnailUploadResponse.ok) {
+          console.error("Failed to upload thumbnail to S3");
+          // Don't fail the entire upload if thumbnail fails
+        } else {
+          console.log("Thumbnail uploaded successfully");
+        }
+      } catch (thumbnailError) {
+        console.error("Thumbnail creation/upload failed:", thumbnailError);
+        // Don't fail the entire upload if thumbnail fails
+      }
+    }
+
     return key;
   } catch (e) {
     console.error("S3 upload error:", e);