@uploadbox/react 0.1.0

package/dist/upload-dropzone.js

@@ -0,0 +1,47 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { useDropzone } from "react-dropzone";
+import { useUploadbox } from "./use-uploadbox.js";
+export function UploadDropzone(props) {
+    const { endpoint, onClientUploadComplete, onUploadError, onUploadProgress, onBeforeUploadBegin, className, disabled, content, } = props;
+    const [state, setState] = useState("idle");
+    const [selectedFiles, setSelectedFiles] = useState([]);
+    const { startUpload, isUploading, progress } = useUploadbox(endpoint, {
+        onClientUploadComplete: (files) => {
+            setState("complete");
+            setSelectedFiles([]);
+            onClientUploadComplete?.(files);
+            setTimeout(() => setState("idle"), 2000);
+        },
+        onUploadError: (error) => {
+            setState("error");
+            onUploadError?.(error);
+            setTimeout(() => setState("idle"), 3000);
+        },
+        onUploadProgress,
+        onBeforeUploadBegin,
+    });
+    const onDrop = useCallback((acceptedFiles) => {
+        setSelectedFiles(acceptedFiles);
+        setState("idle");
+    }, []);
+    const { getRootProps, getInputProps, isDragActive } = useDropzone({
+        onDrop,
+        disabled: disabled || isUploading,
+    });
+    const handleUpload = useCallback(async () => {
+        if (selectedFiles.length === 0)
+            return;
+        setState("uploading");
+        await startUpload(selectedFiles);
+    }, [selectedFiles, startUpload]);
+    const stateClass = isDragActive ? "dragover" : state;
+    return (_jsxs("div", { ...getRootProps(), className: `uploadbox-dropzone uploadbox-dropzone--${stateClass} ${className ?? ""}`, children: [_jsx("input", { ...getInputProps() }), state === "complete" ? (_jsx("div", { className: "uploadbox-dropzone-content", children: _jsx("p", { className: "uploadbox-dropzone-label", children: "Upload complete!" }) })) : state === "error" ? (_jsx("div", { className: "uploadbox-dropzone-content", children: _jsx("p", { className: "uploadbox-dropzone-label", children: "Upload failed. Try again." }) })) : (_jsxs("div", { className: "uploadbox-dropzone-content", children: [_jsxs("svg", { className: "uploadbox-dropzone-icon", xmlns: "http://www.w3.org/2000/svg", width: "40", height: "40", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }), _jsx("polyline", { points: "17 8 12 3 7 8" }), _jsx("line", { x1: "12", y1: "3", x2: "12", y2: "15" })] }), _jsx("p", { className: "uploadbox-dropzone-label", children: isDragActive
+                            ? "Drop files here"
+                            : content?.label ?? "Drag & drop files here, or click to browse" }), content?.allowedContent && (_jsx("p", { className: "uploadbox-dropzone-allowed", children: content.allowedContent })), selectedFiles.length > 0 && !isUploading && (_jsxs("div", { className: "uploadbox-dropzone-selected", children: [_jsxs("p", { children: [selectedFiles.length, " file(s) selected"] }), _jsx("button", { type: "button", className: "uploadbox-button", onClick: (e) => {
+                                    e.stopPropagation();
+                                    handleUpload();
+                                }, children: content?.button ?? "Upload" })] })), isUploading && (_jsx("div", { className: "uploadbox-progress-bar", children: _jsx("div", { className: "uploadbox-progress-bar-fill", style: { width: `${progress}%` } }) }))] }))] }));
+}
+//# sourceMappingURL=upload-dropzone.js.map

package/dist/upload-dropzone.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upload-dropzone.js","sourceRoot":"","sources":["../src/upload-dropzone.tsx"],"names":[],"mappings":"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"}

package/dist/use-uploadbox.d.ts

@@ -0,0 +1,4 @@
+import type { FileRouter } from "@uploadbox/core";
+import type { UseUploadboxOpts, UseUploadboxReturn } from "./types.js";
+export declare function useUploadbox<TRouter extends FileRouter, TEndpoint extends keyof TRouter & string>(endpoint: TEndpoint, opts?: Omit<UseUploadboxOpts<TRouter, TEndpoint>, "endpoint">): UseUploadboxReturn;
+//# sourceMappingURL=use-uploadbox.d.ts.map

package/dist/use-uploadbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-uploadbox.d.ts","sourceRoot":"","sources":["../src/use-uploadbox.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAgB,MAAM,iBAAiB,CAAC;AAChE,OAAO,KAAK,EACV,gBAAgB,EAChB,kBAAkB,EAInB,MAAM,YAAY,CAAC;AAmGpB,wBAAgB,YAAY,CAC1B,OAAO,SAAS,UAAU,EAC1B,SAAS,SAAS,MAAM,OAAO,GAAG,MAAM,EAExC,QAAQ,EAAE,SAAS,EACnB,IAAI,CAAC,EAAE,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,SAAS,CAAC,EAAE,UAAU,CAAC,GAC5D,kBAAkB,CAyNpB"}

package/dist/use-uploadbox.js

@@ -0,0 +1,246 @@
+"use client";
+import { useState, useEffect, useCallback, useMemo, useRef } from "react";
+import { ProgressTracker } from "./progress-tracker.js";
+import { withRetry, DEFAULT_RETRY_CONFIG } from "./retry.js";
+import { shouldUseMultipart, uploadFileMultipart } from "./multipart.js";
+import { useUploadboxConfig } from "./provider.js";
+const DEFAULT_API_URL = "/api/uploadbox";
+function buildHeaders(providerHeaders, providerApiKey, optHeaders) {
+    const merged = {};
+    if (providerHeaders)
+        Object.assign(merged, providerHeaders);
+    if (providerApiKey)
+        merged["Authorization"] = `Bearer ${providerApiKey}`;
+    if (optHeaders)
+        Object.assign(merged, optHeaders);
+    return merged;
+}
+async function fetchRouterConfig(apiUrl, headers) {
+    const res = await fetch(apiUrl, { headers });
+    if (!res.ok)
+        throw new Error("Failed to fetch router config");
+    return res.json();
+}
+async function requestPresignedUrls(apiUrl, routeKey, files, headers) {
+    const res = await fetch(apiUrl, {
+        method: "POST",
+        headers: { "Content-Type": "application/json", ...headers },
+        body: JSON.stringify({ action: "upload", routeKey, files }),
+    });
+    if (!res.ok) {
+        const err = await res.json();
+        throw new Error(err.message || "Failed to get upload URLs");
+    }
+    return res.json();
+}
+async function confirmUploads(apiUrl, routeKey, keys, headers) {
+    const res = await fetch(apiUrl, {
+        method: "POST",
+        headers: { "Content-Type": "application/json", ...headers },
+        body: JSON.stringify({ action: "complete", routeKey, keys }),
+    });
+    if (!res.ok) {
+        const err = await res.json();
+        throw new Error(err.message || "Failed to confirm uploads");
+    }
+    return res.json();
+}
+function uploadFileWithProgress(url, file, contentType, onProgress, signal) {
+    return new Promise((resolve, reject) => {
+        const xhr = new XMLHttpRequest();
+        xhr.open("PUT", url);
+        xhr.setRequestHeader("Content-Type", contentType);
+        if (signal) {
+            signal.addEventListener("abort", () => xhr.abort(), { once: true });
+        }
+        xhr.upload.addEventListener("progress", (event) => {
+            if (event.lengthComputable) {
+                onProgress?.(event.loaded);
+            }
+        });
+        xhr.addEventListener("load", () => {
+            if (xhr.status >= 200 && xhr.status < 300) {
+                resolve();
+            }
+            else {
+                reject(new Error(`Upload failed with status ${xhr.status}`));
+            }
+        });
+        xhr.addEventListener("error", () => reject(new Error("Upload failed")));
+        xhr.addEventListener("abort", () => reject(new Error("Upload aborted")));
+        xhr.send(file);
+    });
+}
+export function useUploadbox(endpoint, opts) {
+    const providerConfig = useUploadboxConfig();
+    const apiUrl = providerConfig.apiUrl ?? DEFAULT_API_URL;
+    const mergedHeaders = useMemo(() => buildHeaders(providerConfig.headers, providerConfig.apiKey, opts?.headers), [providerConfig.headers, providerConfig.apiKey, opts?.headers]);
+    const [isUploading, setIsUploading] = useState(false);
+    const [progress, setProgress] = useState(0);
+    const [fileProgress, setFileProgress] = useState([]);
+    const [routeConfig, setRouteConfig] = useState();
+    const trackerRef = useRef(new ProgressTracker());
+    const abortControllerRef = useRef(null);
+    useEffect(() => {
+        fetchRouterConfig(apiUrl, mergedHeaders).then((config) => {
+            setRouteConfig(config[endpoint]);
+        }).catch(console.error);
+    }, [endpoint, apiUrl, mergedHeaders]);
+    const abort = useCallback(() => {
+        abortControllerRef.current?.abort();
+    }, []);
+    const startUpload = useCallback(async (inputFiles) => {
+        const abortController = new AbortController();
+        abortControllerRef.current = abortController;
+        const tracker = trackerRef.current;
+        tracker.reset();
+        try {
+            setIsUploading(true);
+            setProgress(0);
+            let filesToUpload = inputFiles;
+            if (opts?.onBeforeUploadBegin) {
+                filesToUpload = opts.onBeforeUploadBegin(filesToUpload);
+            }
+            // Initialize progress tracker
+            filesToUpload.forEach((f, i) => {
+                tracker.init(String(i), f.name, f.size, f.type || "application/octet-stream");
+            });
+            // 1. Build file infos with metadata
+            const fileInfos = filesToUpload.map((f) => ({
+                name: f.name,
+                size: f.size,
+                type: f.type || "application/octet-stream",
+                ...(opts?.getFileMetadata ? { customMetadata: opts.getFileMetadata(f) } : {}),
+                ...(opts?.ttlSeconds != null ? { ttlSeconds: opts.ttlSeconds } : {}),
+            }));
+            // Split into small files (single-part) and large files (multipart)
+            const smallFileIndices = [];
+            const largeFileIndices = [];
+            filesToUpload.forEach((f, i) => {
+                if (shouldUseMultipart(f.size)) {
+                    largeFileIndices.push(i);
+                }
+                else {
+                    smallFileIndices.push(i);
+                }
+            });
+            // 2. Request presigned URLs for small files
+            const smallFileInfos = smallFileIndices.map((i) => fileInfos[i]);
+            let presignedResults = [];
+            if (smallFileInfos.length > 0) {
+                presignedResults = await requestPresignedUrls(apiUrl, endpoint, smallFileInfos, mergedHeaders);
+            }
+            const retryConfig = opts?.retry === false ? undefined : (opts?.retry ?? DEFAULT_RETRY_CONFIG);
+            // Helper to emit progress
+            const emitProgress = () => {
+                const snapshot = tracker.getSnapshot();
+                setProgress(snapshot.percent);
+                setFileProgress(snapshot.fileProgress);
+                opts?.onUploadProgress?.(snapshot);
+            };
+            // 3. Upload small files with retry
+            const smallUploadPromises = presignedResults.map((result, idx) => {
+                const fileIndex = smallFileIndices[idx];
+                const file = filesToUpload[fileIndex];
+                const fileId = String(fileIndex);
+                tracker.setKey(fileId, result.key);
+                tracker.setStatus(fileId, "uploading");
+                const doUpload = async () => {
+                    await uploadFileWithProgress(result.url, file, file.type || "application/octet-stream", (loaded) => {
+                        tracker.updateProgress(fileId, loaded);
+                        emitProgress();
+                    }, abortController.signal);
+                };
+                if (retryConfig) {
+                    return withRetry(() => doUpload(), retryConfig, (attempt) => {
+                        tracker.incrementRetry(fileId);
+                        emitProgress();
+                    }, abortController.signal).then(() => {
+                        tracker.setStatus(fileId, "complete");
+                        emitProgress();
+                    });
+                }
+                return doUpload().then(() => {
+                    tracker.setStatus(fileId, "complete");
+                    emitProgress();
+                });
+            });
+            // 4. Upload large files via multipart
+            const largeUploadPromises = largeFileIndices.map(async (fileIndex) => {
+                const file = filesToUpload[fileIndex];
+                const fileId = String(fileIndex);
+                const info = fileInfos[fileIndex];
+                tracker.setStatus(fileId, "uploading");
+                const result = await uploadFileMultipart({
+                    file,
+                    routeKey: endpoint,
+                    fileInfo: info,
+                    apiUrl,
+                    headers: mergedHeaders,
+                    retryConfig: retryConfig ?? undefined,
+                    signal: abortController.signal,
+                    onProgress: (loaded) => {
+                        tracker.updateProgress(fileId, loaded);
+                        emitProgress();
+                    },
+                    onRetry: () => {
+                        tracker.incrementRetry(fileId);
+                        emitProgress();
+                    },
+                });
+                tracker.setKey(fileId, result.key);
+                tracker.setStatus(fileId, "complete");
+                emitProgress();
+                return result;
+            });
+            // Wait for all uploads
+            await Promise.all([...smallUploadPromises, ...largeUploadPromises]);
+            // 5. Confirm small file uploads
+            const smallKeys = presignedResults.map((r) => r.key);
+            let allResults = [];
+            if (smallKeys.length > 0) {
+                const smallConfirm = await confirmUploads(apiUrl, endpoint, smallKeys, mergedHeaders);
+                allResults.push(...smallConfirm);
+            }
+            // Large file results are already confirmed server-side during multipart complete
+            // Add their results too
+            for (const idx of largeFileIndices) {
+                const fileId = String(idx);
+                const fp = tracker.getSnapshot().fileProgress.find((f) => f.fileId === fileId);
+                if (fp?.key) {
+                    allResults.push({
+                        file: {
+                            key: fp.key,
+                            name: fp.name,
+                            size: fp.size,
+                            type: fp.type,
+                            url: "", // URL will come from confirm
+                        },
+                    });
+                }
+            }
+            const uploadedFiles = allResults.map((r) => ({
+                key: r.file.key,
+                name: r.file.name,
+                size: r.file.size,
+                type: r.file.type,
+                url: r.file.url,
+                customMetadata: r.file.customMetadata,
+            }));
+            setProgress(100);
+            opts?.onClientUploadComplete?.(uploadedFiles);
+            return uploadedFiles;
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error("Upload failed");
+            opts?.onUploadError?.(error);
+            return undefined;
+        }
+        finally {
+            setIsUploading(false);
+            abortControllerRef.current = null;
+        }
+    }, [apiUrl, endpoint, mergedHeaders, opts]);
+    return { startUpload, isUploading, progress, routeConfig, fileProgress, abort };
+}
+//# sourceMappingURL=use-uploadbox.js.map

package/dist/use-uploadbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-uploadbox.js","sourceRoot":"","sources":["../src/use-uploadbox.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "@uploadbox/react",
+  "version": "0.1.0",
+  "private": false,
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./styles.css": "./src/styles.css"
+  },
+  "dependencies": {
+    "react-dropzone": "^14.3.0",
+    "@uploadbox/core": "0.1.0"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.7.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0"
+  },
+  "description": "React components and hooks for Uploadbox — UploadButton, UploadDropzone, useUploadbox",
+  "keywords": [
+    "uploadbox",
+    "react",
+    "upload",
+    "file-upload",
+    "upload-button",
+    "dropzone"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/federicostarace/uploadbox",
+    "directory": "packages/react"
+  },
+  "files": [
+    "dist",
+    "src"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsc",
+    "dev": "tsc --watch",
+    "typecheck": "tsc --noEmit",
+    "clean": "rm -rf dist"
+  }
+}

package/src/generate-components.ts

@@ -0,0 +1,20 @@
+import type { FileRouter } from "@uploadbox/core";
+import type { UploadButtonProps, UploadDropzoneProps } from "./types.js";
+import { UploadButton } from "./upload-button.js";
+import { UploadDropzone } from "./upload-dropzone.js";
+
+export function generateUploadButton<
+  TRouter extends FileRouter
+>() {
+  return UploadButton as <TEndpoint extends keyof TRouter & string>(
+    props: UploadButtonProps<TRouter, TEndpoint>
+  ) => React.JSX.Element;
+}
+
+export function generateUploadDropzone<
+  TRouter extends FileRouter
+>() {
+  return UploadDropzone as <TEndpoint extends keyof TRouter & string>(
+    props: UploadDropzoneProps<TRouter, TEndpoint>
+  ) => React.JSX.Element;
+}

package/src/index.ts

@@ -0,0 +1,22 @@
+export { UploadButton } from "./upload-button.js";
+export { UploadDropzone } from "./upload-dropzone.js";
+export { useUploadbox } from "./use-uploadbox.js";
+export { generateUploadButton, generateUploadDropzone } from "./generate-components.js";
+export { UploadboxProvider, useUploadboxConfig } from "./provider.js";
+export type { UploadboxContextValue } from "./provider.js";
+export { withRetry, DEFAULT_RETRY_CONFIG, isRetryableError } from "./retry.js";
+export { ProgressTracker } from "./progress-tracker.js";
+export { shouldUseMultipart, uploadFileMultipart } from "./multipart.js";
+export type {
+  UploadButtonProps,
+  UploadDropzoneProps,
+  UseUploadboxOpts,
+  UseUploadboxReturn,
+  UploadedFile,
+  UploadProgressEvent,
+  EndpointHelper,
+  FileUploadStatus,
+  FileProgress,
+  EnhancedUploadProgressEvent,
+  RetryConfig,
+} from "./types.js";

package/src/multipart.ts

@@ -0,0 +1,189 @@
+import type { RetryConfig } from "./types.js";
+import { withRetry, DEFAULT_RETRY_CONFIG } from "./retry.js";
+
+const DEFAULT_API_URL = "/api/uploadbox";
+const MULTIPART_THRESHOLD = 10 * 1024 * 1024; // 10MB
+const DEFAULT_PART_SIZE = 10 * 1024 * 1024; // 10MB
+const MAX_CONCURRENT_PARTS = 4;
+
+export function shouldUseMultipart(fileSize: number): boolean {
+  return fileSize >= MULTIPART_THRESHOLD;
+}
+
+interface MultipartUploadOptions {
+  file: File;
+  routeKey: string;
+  fileInfo: { name: string; size: number; type: string; customMetadata?: Record<string, string>; ttlSeconds?: number };
+  apiUrl?: string;
+  headers?: Record<string, string>;
+  retryConfig?: RetryConfig;
+  signal?: AbortSignal;
+  onProgress?: (loaded: number) => void;
+  onRetry?: () => void;
+}
+
+interface MultipartInitResponse {
+  fileKey: string;
+  uploadId: string;
+  parts: { partNumber: number; url: string }[];
+  partSize: number;
+  totalParts: number;
+}
+
+function uploadPartWithXhr(
+  url: string,
+  blob: Blob,
+  onProgress?: (loaded: number) => void,
+  signal?: AbortSignal
+): Promise<string> {
+  return new Promise((resolve, reject) => {
+    const xhr = new XMLHttpRequest();
+    xhr.open("PUT", url);
+
+    if (signal) {
+      signal.addEventListener("abort", () => xhr.abort(), { once: true });
+    }
+
+    xhr.upload.addEventListener("progress", (event) => {
+      if (event.lengthComputable) {
+        onProgress?.(event.loaded);
+      }
+    });
+
+    xhr.addEventListener("load", () => {
+      if (xhr.status >= 200 && xhr.status < 300) {
+        const etag = xhr.getResponseHeader("ETag");
+        if (!etag) {
+          reject(new Error("Missing ETag in upload response — check S3 CORS exposeHeaders"));
+          return;
+        }
+        resolve(etag);
+      } else {
+        reject(new Error(`Part upload failed with status ${xhr.status}`));
+      }
+    });
+
+    xhr.addEventListener("error", () => reject(new Error("Part upload failed")));
+    xhr.addEventListener("abort", () => reject(new Error("Upload aborted")));
+
+    xhr.send(blob);
+  });
+}
+
+export async function uploadFileMultipart(
+  options: MultipartUploadOptions
+): Promise<{ key: string; uploadId: string }> {
+  const { file, routeKey, fileInfo, apiUrl = DEFAULT_API_URL, headers, retryConfig, signal, onProgress, onRetry } = options;
+
+  // 1. Create multipart upload on server
+  const initRes = await fetch(apiUrl, {
+    method: "POST",
+    headers: { "Content-Type": "application/json", ...headers },
+    body: JSON.stringify({
+      action: "create-multipart",
+      routeKey,
+      file: fileInfo,
+    }),
+    signal,
+  });
+
+  if (!initRes.ok) {
+    const err = await initRes.json();
+    throw new Error(err.message || "Failed to create multipart upload");
+  }
+
+  const initData: MultipartInitResponse = await initRes.json();
+  const { fileKey, uploadId, parts, partSize } = initData;
+
+  // 2. Upload parts with concurrency
+  const completedParts: { partNumber: number; etag: string }[] = [];
+  const partLoaded = new Map<number, number>();
+  let aborted = false;
+
+  const uploadPart = async (part: { partNumber: number; url: string }) => {
+    if (signal?.aborted) throw new Error("Upload aborted");
+
+    const start = (part.partNumber - 1) * partSize;
+    const end = Math.min(start + partSize, file.size);
+    const blob = file.slice(start, end);
+
+    const retry = retryConfig ?? DEFAULT_RETRY_CONFIG;
+
+    const etag = await withRetry(
+      async () => {
+        return uploadPartWithXhr(
+          part.url,
+          blob,
+          (loaded) => {
+            partLoaded.set(part.partNumber, loaded);
+            const totalLoaded = Array.from(partLoaded.values()).reduce((a, b) => a + b, 0);
+            onProgress?.(totalLoaded);
+          },
+          signal
+        );
+      },
+      retry,
+      () => {
+        partLoaded.set(part.partNumber, 0);
+        onRetry?.();
+      },
+      signal
+    );
+
+    completedParts.push({ partNumber: part.partNumber, etag });
+  };
+
+  // Process parts with concurrency limit
+  const queue = [...parts];
+  const workers: Promise<void>[] = [];
+
+  for (let i = 0; i < Math.min(MAX_CONCURRENT_PARTS, queue.length); i++) {
+    workers.push(
+      (async () => {
+        while (queue.length > 0 && !aborted) {
+          const part = queue.shift();
+          if (!part) break;
+          await uploadPart(part);
+        }
+      })()
+    );
+  }
+
+  try {
+    await Promise.all(workers);
+  } catch (err) {
+    aborted = true;
+    // Abort the multipart upload on failure
+    await fetch(apiUrl, {
+      method: "POST",
+      headers: { "Content-Type": "application/json", ...headers },
+      body: JSON.stringify({
+        action: "abort-multipart",
+        fileKey,
+        uploadId,
+      }),
+    }).catch(() => {});
+    throw err;
+  }
+
+  // 3. Complete multipart upload on server
+  const completeRes = await fetch(apiUrl, {
+    method: "POST",
+    headers: { "Content-Type": "application/json", ...headers },
+    body: JSON.stringify({
+      action: "complete-multipart",
+      routeKey,
+      fileKey,
+      uploadId,
+      parts: completedParts,
+    }),
+    signal,
+  });
+
+  if (!completeRes.ok) {
+    const err = await completeRes.json();
+    throw new Error(err.message || "Failed to complete multipart upload");
+  }
+
+  return { key: fileKey, uploadId };
+}