@agent-native/core-corpus 0.214.0 → 0.217.0

package/corpus/templates/slides-2/app/components/design-system/builder-design-system-upload.ts

@@ -0,0 +1,200 @@
+import { callAction } from "@agent-native/core/client/hooks";
+
+import type { BuilderIndexResult } from "./builder-index-response";
+
+const GCS_CHUNK_SIZE = 16 * 1024 * 1024;
+const MAX_CHUNK_RETRIES = 5;
+
+export const DECODE_JOB_POLL_INTERVAL_MS = 5_000;
+export const DECODE_JOB_MAX_POLLS = 120;
+
+export const DECODE_JOB_TIMEOUT_MESSAGE =
+  "Timed out waiting for the design system to finish decoding.";
+
+export interface DecodeJobStatus {
+  status: "pending" | "processing" | "complete" | "error";
+  branchUrl: string | null;
+  error: string | null;
+  framesProcessed: number;
+  totalFrames: number;
+}
+
+interface UploadSlot {
+  idx: number;
+  uploadUrl: string;
+  uploadToken: string;
+}
+
+async function requestUploadSlots(files: File[]): Promise<UploadSlot[]> {
+  const { uploads } = await callAction("start-design-system-upload", {
+    attachments: files.map((file) => ({
+      name: file.name,
+      mimetype: file.type || "application/octet-stream",
+      declaredSize: file.size,
+    })),
+  });
+  const slots = Array.isArray(uploads)
+    ? ([...uploads] as UploadSlot[]).sort((a, b) => a.idx - b.idx)
+    : [];
+  if (slots.length !== files.length) {
+    throw new Error("Upload could not be started for all files.");
+  }
+  return slots;
+}
+
+async function initiateResumableSession(
+  uploadUrl: string,
+  mimetype: string,
+  fileSize: number,
+): Promise<string> {
+  const response = await fetch(uploadUrl, {
+    method: "POST",
+    headers: {
+      "x-goog-resumable": "start",
+      "x-goog-content-length-range": `0,${fileSize}`,
+      "Content-Type": mimetype,
+    },
+  });
+  if (!response.ok) {
+    throw new Error(`Failed to initiate upload session (${response.status})`);
+  }
+  const sessionUri = response.headers.get("Location");
+  if (!sessionUri) {
+    throw new Error("Upload session URI missing from storage response");
+  }
+  return sessionUri;
+}
+
+function committedOffsetFromRange(response: Response): number | null {
+  const match = response.headers.get("Range")?.match(/bytes=0-(\d+)/);
+  return match ? parseInt(match[1], 10) + 1 : null;
+}
+
+async function queryCommittedOffset(
+  sessionUri: string,
+  total: number,
+): Promise<number> {
+  const response = await fetch(sessionUri, {
+    method: "PUT",
+    headers: { "Content-Range": `bytes */${total}` },
+  });
+  if (response.status === 200 || response.status === 201) return total;
+  if (response.status === 308) return committedOffsetFromRange(response) ?? 0;
+  throw new Error(`Failed to query upload status (${response.status})`);
+}
+
+function delay(ms: number, signal?: AbortSignal): Promise<void> {
+  return new Promise((resolve, reject) => {
+    if (signal?.aborted) {
+      return reject(new DOMException("Aborted", "AbortError"));
+    }
+    const timer = setTimeout(resolve, ms);
+    signal?.addEventListener(
+      "abort",
+      () => {
+        clearTimeout(timer);
+        reject(new DOMException("Aborted", "AbortError"));
+      },
+      { once: true },
+    );
+  });
+}
+
+async function streamFileToStorage(
+  slot: UploadSlot,
+  file: File,
+  onProgress: (uploadedBytes: number) => void,
+): Promise<void> {
+  const mimetype = file.type || "application/octet-stream";
+  const sessionUri = await initiateResumableSession(
+    slot.uploadUrl,
+    mimetype,
+    file.size,
+  );
+  const total = file.size;
+
+  if (total === 0) {
+    const response = await fetch(sessionUri, {
+      method: "PUT",
+      headers: { "Content-Range": "bytes */0" },
+      body: new Uint8Array(0),
+    });
+    if (response.status !== 200 && response.status !== 201) {
+      throw new Error(
+        `Failed to finalize zero-byte upload (${response.status})`,
+      );
+    }
+    onProgress(0);
+    return;
+  }
+
+  let offset = 0;
+  let retries = 0;
+  while (offset < total) {
+    const end = Math.min(offset + GCS_CHUNK_SIZE, total);
+    const isLast = end === total;
+    try {
+      const response = await fetch(sessionUri, {
+        method: "PUT",
+        headers: { "Content-Range": `bytes ${offset}-${end - 1}/${total}` },
+        body: file.slice(offset, end),
+      });
+      if (response.status === 200 || response.status === 201) {
+        offset = total;
+      } else if (!isLast && response.status === 308) {
+        const nextOffset = committedOffsetFromRange(response) ?? offset;
+        if (nextOffset <= offset) {
+          throw new Error(`Upload stalled at byte ${offset}`);
+        }
+        offset = nextOffset;
+      } else {
+        throw new Error(`Unexpected upload status ${response.status}`);
+      }
+      retries = 0;
+      onProgress(offset);
+    } catch (err) {
+      if (++retries > MAX_CHUNK_RETRIES) throw err;
+      await delay(500 * retries);
+      try {
+        offset = await queryCommittedOffset(sessionUri, total);
+      } catch {
+        // If the offset query also fails, retry from the last local offset —
+        // GCS's resumable PUT safely re-acknowledges bytes it already has.
+      }
+      onProgress(offset);
+    }
+  }
+}
+
+export interface UploadAndIndexOptions {
+  projectName?: string;
+  onProgress?: (fraction: number) => void;
+  indexUploadedFiles: (args: {
+    projectName?: string;
+    uploadTokens: string[];
+  }) => Promise<BuilderIndexResult>;
+}
+
+export async function uploadAndIndexFigmaFiles(
+  files: File[],
+  options: UploadAndIndexOptions,
+): Promise<BuilderIndexResult> {
+  if (files.length === 0) throw new Error("No files to upload.");
+
+  const slots = await requestUploadSlots(files);
+
+  const totalBytes = files.reduce((sum, file) => sum + file.size, 0) || 1;
+  const uploadedPerFile = new Array<number>(files.length).fill(0);
+  for (let i = 0; i < files.length; i++) {
+    await streamFileToStorage(slots[i], files[i], (uploaded) => {
+      uploadedPerFile[i] = uploaded;
+      const done = uploadedPerFile.reduce((sum, n) => sum + n, 0);
+      options.onProgress?.(Math.min(done / totalBytes, 1));
+    });
+  }
+
+  return options.indexUploadedFiles({
+    projectName: options.projectName,
+    uploadTokens: slots.map((slot) => slot.uploadToken),
+  });
+}

package/corpus/templates/slides-2/app/components/design-system/builder-index-response.ts

@@ -0,0 +1,104 @@
+export interface BuilderIndexResult {
+  ok: boolean;
+  source: "builder";
+  suggestedTitle: string | null;
+  projectId: string;
+  jobId: string;
+  designSystemId: string;
+  builderUrl: string;
+  status:
+    | "in-progress"
+    | "ready"
+    | "complete"
+    | "completed"
+    | "error"
+    | "failed"
+    | "cancelled";
+  localDesignSystemId?: string;
+  uploadedFileCount?: number;
+  instructions?: string;
+  builderConnectUrl?: string;
+}
+
+export const MAX_BUILDER_INDEX_UPLOAD_BYTES = 512 * 1024 * 1024;
+
+export function formatFileSize(bytes: number): string {
+  return `${Math.round(bytes / 1024 / 1024)} MB`;
+}
+
+function isHtmlErrorPage(bodyText: string): boolean {
+  return /<!doctype\s+html\b|<html\b/i.test(bodyText);
+}
+
+function summarizeUploadFailure(
+  status: number,
+  bodyText: string,
+  contentType?: string | null,
+): string {
+  if (status === 413) {
+    return `File too large (max ${formatFileSize(MAX_BUILDER_INDEX_UPLOAD_BYTES)}).`;
+  }
+
+  if (
+    contentType?.toLowerCase().includes("text/html") ||
+    isHtmlErrorPage(bodyText)
+  ) {
+    return `Upload failed (${status})`;
+  }
+
+  const trimmed = bodyText
+    .replace(/<[^>]*>/g, " ")
+    .replace(/\s+/g, " ")
+    .trim();
+  if (trimmed) {
+    return `Upload failed (${status}): ${trimmed.slice(0, 180)}`;
+  }
+  return `Upload failed (${status})`;
+}
+
+export async function readBuilderIndexResponse(
+  res: Response,
+): Promise<BuilderIndexResult> {
+  const bodyText = await res.text();
+  let json: unknown = null;
+
+  if (bodyText) {
+    try {
+      json = JSON.parse(bodyText);
+    } catch {
+      throw new Error(
+        summarizeUploadFailure(
+          res.status,
+          bodyText,
+          res.headers.get("Content-Type"),
+        ),
+      );
+    }
+  }
+
+  if (json && typeof json === "object" && "error" in json) {
+    const error = (json as { error?: unknown; builderConnectUrl?: unknown })
+      .error;
+    throw new Error(
+      typeof error === "string" && !isHtmlErrorPage(error)
+        ? error
+        : summarizeUploadFailure(
+            res.status,
+            typeof error === "string" ? error : bodyText,
+            res.headers.get("Content-Type"),
+          ),
+    );
+  }
+
+  if (!res.ok) {
+    throw new Error(
+      summarizeUploadFailure(
+        res.status,
+        bodyText,
+        res.headers.get("Content-Type"),
+      ),
+    );
+  }
+
+  return json as BuilderIndexResult;
+}