@drawnagency/primitives 0.1.98 → 0.1.100

package/src/hooks/useDocumentUploads.ts

@@ -0,0 +1,330 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { hashFileBuffer } from "../media/utils";
+import type { DocumentManifest, DocumentManifestEntry } from "../schemas/documents";
+import {
+  planDocumentUpload,
+  documentRejectionMessage,
+  documentGitPath,
+  documentBucketPath,
+  type DocumentRejectionReason,
+} from "../lib/document-uploads";
+import {
+  addPendingDocument,
+  clearPendingDocumentsByIds,
+  getPendingDocuments,
+} from "../lib/dexie";
+import type { PendingDocument } from "../components/shell/MediaLibraryContext";
+
+const REJECTION_CODES: ReadonlySet<string> = new Set([
+  "unsupported_type",
+  "too_large",
+  "too_small",
+  "no_documents_store",
+]);
+
+interface UseDocumentUploadsInput {
+  documentManifest: DocumentManifest;
+  setDocumentManifest: React.Dispatch<React.SetStateAction<DocumentManifest>>;
+  setLocalChangesExist: React.Dispatch<React.SetStateAction<boolean>>;
+  /** Drops a committed-but-locally-deleted id from the pipeline's
+   *  `pendingDocumentDeletions`. That list lives in useMediaPipeline and is
+   *  invisible here, so without this the dedup below cannot tell a live
+   *  document from a doomed one. No-op for an id that isn't doomed. */
+  undeleteDocument?: (id: string) => void;
+  /** Same channel the media pipeline uses — surfaces in UploadRejectionAlert. */
+  onUploadError?: (message: string) => void;
+}
+
+/**
+ * Document uploads. Deliberately a separate hook from useMediaPipeline: bytes
+ * pass through untouched (no rasterizer worker, no variants, no poster), the
+ * manifest is a sidecar, and every rejection is typed. Both tiers must (1) never
+ * throw to the caller, (2) call onUploadError exactly once on failure, and (3)
+ * leave no leaked progress entry.
+ */
+export function useDocumentUploads({
+  documentManifest,
+  setDocumentManifest,
+  setLocalChangesExist,
+  undeleteDocument,
+  onUploadError,
+}: UseDocumentUploadsInput) {
+  const [pendingDocuments, setPendingDocuments] = useState<PendingDocument[]>([]);
+  const [pendingDocumentUrls, setPendingDocumentUrls] = useState<Record<string, string>>({});
+  const [documentUploadProgress, setDocumentUploadProgress] = useState<Record<string, number>>({});
+
+  // Read inside uploadDocument's async body, where a state snapshot would be
+  // stale across an await.
+  const pendingRef = useRef<PendingDocument[]>(pendingDocuments);
+  useEffect(() => { pendingRef.current = pendingDocuments; }, [pendingDocuments]);
+  const manifestRef = useRef<DocumentManifest>(documentManifest);
+  useEffect(() => { manifestRef.current = documentManifest; }, [documentManifest]);
+
+  /** Restore documents staged in a previous session (Dexie survives reload). */
+  const hydratePendingDocuments = useCallback(async () => {
+    // Never throws: it runs from a mount effect, before/independently of the
+    // editor store being initialized, and a failed restore must not take the
+    // shell down.
+    let rows: Awaited<ReturnType<typeof getPendingDocuments>>;
+    try {
+      rows = await getPendingDocuments();
+    } catch (err) {
+      console.error("[useDocumentUploads] Failed to restore staged documents:", err);
+      return;
+    }
+    if (rows.length === 0) return;
+    setPendingDocuments(rows.map(({ id, entry }) => ({ id, entry })));
+    // The persisted `blob:` URL died with the session that minted it, so a
+    // git-tier row (which carries its bytes) gets a fresh object URL here.
+    // Bucket-tier rows have no blob and keep their stored URL — theirs is a real
+    // remote one. The fallback keeps this function's never-throws contract if a
+    // round-tripped row comes back as something createObjectURL rejects.
+    setPendingDocumentUrls(
+      Object.fromEntries(
+        rows.map(({ id, localUrl, blob }) => {
+          if (!blob) return [id, localUrl];
+          try {
+            return [id, URL.createObjectURL(blob)];
+          } catch (err) {
+            console.error(`[useDocumentUploads] Failed to re-mint a URL for "${id}":`, err);
+            return [id, localUrl];
+          }
+        }),
+      ),
+    );
+  }, []);
+
+  const stage = useCallback(
+    async (id: string, entry: DocumentManifestEntry, blob: Blob | null, localUrl: string, filename: string): Promise<boolean> => {
+      try {
+        await addPendingDocument({ id, entry, blob, localUrl });
+      } catch (err) {
+        console.error(`[useDocumentUploads] Failed to stage "${filename}":`, err);
+        URL.revokeObjectURL(localUrl);
+        onUploadError?.(`"${filename}" couldn't be stored locally — try again.`);
+        return false;
+      }
+      setPendingDocuments((prev) => [...prev, { id, entry }]);
+      setPendingDocumentUrls((prev) => ({ ...prev, [id]: localUrl }));
+      setLocalChangesExist(true);
+      return true;
+    },
+    [onUploadError, setLocalChangesExist],
+  );
+
+  const uploadDocument = useCallback(
+    async (file: File, onComplete?: (documentId: string) => void): Promise<void> => {
+      const plan = planDocumentUpload({ name: file.name, size: file.size, type: file.type });
+      if (plan.tier === "rejected") {
+        onUploadError?.(documentRejectionMessage(plan.reason, file.name));
+        return;
+      }
+
+      let hash: string;
+      try {
+        hash = await hashFileBuffer(await file.arrayBuffer());
+      } catch (err) {
+        console.error(`[useDocumentUploads] Failed to read "${file.name}":`, err);
+        onUploadError?.(`"${file.name}" couldn't be read — try again.`);
+        return;
+      }
+
+      // Same bytes already known: reuse the id rather than staging a duplicate.
+      // Only ever hits on the GIT tier, where the content hash IS the id —
+      // bucket-tier ids are server-minted, so re-picking a large file stages a
+      // second entry. Accepted: the manifest is correct either way, and the
+      // publish-time docs GC collects whichever object stops being referenced.
+      if (manifestRef.current[hash] || pendingRef.current.some((d) => d.id === hash)) {
+        // A committed document deleted but not yet saved is only DOOMED, never
+        // gone: its bytes and its manifest entry are still on the branch, and
+        // deletion deliberately leaves documentManifest alone. So re-adding one
+        // un-dooms it — otherwise the drop zone swallows the file silently, and
+        // the picker points a section at an id the save then deletes. Nothing to
+        // re-upload either way. Tier-agnostic on purpose: a bucket-tier id can
+        // only reach this branch already staged (its ids are server-minted, so
+        // re-picking the file mints a new one), and un-dooming is right there too.
+        undeleteDocument?.(hash);
+        onComplete?.(hash);
+        return;
+      }
+
+      if (plan.tier === "git") {
+        const entry: DocumentManifestEntry = {
+          filename: file.name,
+          size: file.size,
+          kind: plan.kind,
+          storage: "git",
+          path: documentGitPath(file.name, hash, plan.ext),
+        };
+        const localUrl = URL.createObjectURL(file);
+        if (await stage(hash, entry, file, localUrl, file.name)) onComplete?.(hash);
+        return;
+      }
+
+      // The id for a BUCKET-tier document is minted server-side and comes back
+      // from upload-intent — never the client hash (decision 4). It keys both
+      // the object and the manifest entry, so staging under anything else would
+      // point the manifest at bytes that are not there. Declared out here so
+      // the `finally` can clear the progress entry it keys.
+      let documentId = "";
+      try {
+        let uploadUrl: string;
+        let filename: string;
+        try {
+          const res = await fetch("/api/documents/upload-intent", {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({ name: file.name, size: file.size, contentType: file.type }),
+          });
+          if (!res.ok) {
+            const body = (await res.json().catch(() => ({}))) as { error?: string };
+            const reason: DocumentRejectionReason =
+              body.error && REJECTION_CODES.has(body.error)
+                ? (body.error as DocumentRejectionReason)
+                : "no_documents_store";
+            onUploadError?.(documentRejectionMessage(reason, file.name));
+            return;
+          }
+          const intent = (await res.json()) as {
+            uploadUrl?: unknown; path?: unknown; documentId?: unknown; filename?: unknown; storage?: unknown;
+          };
+          if (
+            typeof intent.uploadUrl !== "string" ||
+            typeof intent.path !== "string" ||
+            typeof intent.documentId !== "string" ||
+            !/^[a-f0-9]{32}$/.test(intent.documentId)
+          ) {
+            throw new Error("malformed upload-intent response");
+          }
+          uploadUrl = intent.uploadUrl;
+          documentId = intent.documentId;
+          filename = typeof intent.filename === "string" && intent.filename ? intent.filename : file.name;
+        } catch (err) {
+          onUploadError?.(`"${file.name}": couldn't start the upload — ${(err as Error).message}. Try again.`);
+          return;
+        }
+
+        try {
+          await new Promise<void>((resolvePut, rejectPut) => {
+            const xhr = new XMLHttpRequest();
+            xhr.open("PUT", uploadUrl);
+            xhr.setRequestHeader("Content-Type", file.type);
+            xhr.upload.onprogress = (e) => {
+              if (e.lengthComputable) {
+                setDocumentUploadProgress((prev) => ({ ...prev, [documentId]: e.loaded / e.total }));
+              }
+            };
+            xhr.onload = () =>
+              xhr.status >= 200 && xhr.status < 300 ? resolvePut() : rejectPut(new Error(`upload ${xhr.status}`));
+            xhr.onerror = () => rejectPut(new Error("upload failed"));
+            xhr.send(file);
+          });
+        } catch (err) {
+          onUploadError?.(`"${file.name}": upload failed — ${(err as Error).message}. Try again.`);
+          return;
+        }
+
+        const entry: DocumentManifestEntry = {
+          filename,
+          size: file.size,
+          kind: plan.kind,
+          storage: "bucket",
+          // SITE-RELATIVE, derived from the server's id — deliberately NOT the
+          // intent's `path`, which is the tenant-prefixed object key
+          // (sites/{siteId}/…). DocumentStore prepends that prefix itself, and
+          // the GC and the delete broker both match on the site-relative form.
+          path: documentBucketPath(documentId, plan.ext),
+        };
+        // Manifest-only: the bytes are in the bucket, never in Dexie or /api/save.
+        const localUrl = URL.createObjectURL(file);
+        if (await stage(documentId, entry, null, localUrl, file.name)) onComplete?.(documentId);
+      } finally {
+        setDocumentUploadProgress((prev) => {
+          if (!documentId || !(documentId in prev)) return prev;
+          const next = { ...prev };
+          delete next[documentId];
+          return next;
+        });
+      }
+    },
+    [onUploadError, stage, undeleteDocument],
+  );
+
+  /** Called after a save commits these ids: promote them into the manifest,
+   *  drop the staged rows, release the blob URLs. */
+  const publishDocuments = useCallback(
+    async (ids: string[]) => {
+      if (ids.length === 0) return;
+      const idSet = new Set(ids);
+      const promoted = pendingRef.current.filter((d) => idSet.has(d.id));
+      if (promoted.length > 0) {
+        setDocumentManifest((prev) => {
+          const next = { ...prev };
+          for (const { id, entry } of promoted) next[id] = entry;
+          return next;
+        });
+      }
+      setPendingDocuments((prev) => prev.filter((d) => !idSet.has(d.id)));
+      setPendingDocumentUrls((prev) => {
+        const next = { ...prev };
+        for (const id of ids) {
+          if (next[id]) {
+            URL.revokeObjectURL(next[id]);
+            delete next[id];
+          }
+        }
+        return next;
+      });
+      try {
+        await clearPendingDocumentsByIds(ids);
+      } catch (err) {
+        console.error("[useDocumentUploads] Failed to clear staged documents:", err);
+      }
+    },
+    [setDocumentManifest],
+  );
+
+  /** Drop staged-but-never-committed documents (the local-delete path): release
+   *  the blob URLs and the Dexie rows. Deliberately manifest-free — nothing was
+   *  ever committed, so a save has nothing to remove. A bucket-tier row's
+   *  already-PUT object is left where it is; the publish-time docs GC collects
+   *  whichever object stops being referenced (same acceptance as the re-pick
+   *  dedup case above). */
+  const unstageDocuments = useCallback(async (ids: string[]) => {
+    if (ids.length === 0) return;
+    const idSet = new Set(ids);
+    setPendingDocuments((prev) => prev.filter((d) => !idSet.has(d.id)));
+    setPendingDocumentUrls((prev) => {
+      const next = { ...prev };
+      for (const id of ids) {
+        if (next[id]) {
+          URL.revokeObjectURL(next[id]);
+          delete next[id];
+        }
+      }
+      return next;
+    });
+    try {
+      await clearPendingDocumentsByIds(ids);
+    } catch (err) {
+      console.error("[useDocumentUploads] Failed to clear staged documents:", err);
+    }
+  }, []);
+
+  // Memoized: useMediaPipeline lists this object in handleMediaUpload's and
+  // enqueueFile's dependency arrays, and those two callbacks sit in
+  // contextValue's deps — a fresh literal every render would defeat all three
+  // memos and re-render every MediaLibraryContext consumer on every keystroke.
+  return useMemo(
+    () => ({
+      pendingDocuments,
+      pendingDocumentUrls,
+      documentUploadProgress,
+      uploadDocument,
+      publishDocuments,
+      unstageDocuments,
+      hydratePendingDocuments,
+    }),
+    [pendingDocuments, pendingDocumentUrls, documentUploadProgress, uploadDocument, publishDocuments, unstageDocuments, hydratePendingDocuments],
+  );
+}