@animaapp/anima-sdk 0.2.7 → 0.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@animaapp/anima-sdk",
-  "version": "0.2.7",
+  "version": "0.3.0",
   "type": "module",
   "description": "Anima's JavaScript utilities library",
   "author": "Anima App, Inc.",
@@ -20,7 +20,8 @@
   },
   "scripts": {
     "build": "vite build",
-    "tests": "vitest run --dir ./tests",
+    "dev": "vite build --watch",
+    "test": "vitest --watch=false",
     "prepack": "yarn build"
   },
   "dependencies": {

package/src/anima.ts

@@ -76,7 +76,7 @@ export class Anima {
         Accept: "text/event-stream",
       },
       body: JSON.stringify({
-        tracking: params.tracking,
+        tracking,
         fileKey: params.fileKey,
         figmaToken: params.figmaToken,
         nodesId: params.nodesId,
@@ -96,17 +96,41 @@ export class Anima {
     });
 
     if (!response.ok) {
-      let errorMessage;
-      try {
-        const errorData = await response.json();
-        errorMessage =
-          errorData.message || `HTTP error! status: ${response.status}`;
-      } catch {
-        errorMessage = `HTTP error! status: ${response.status}`;
+      const errorData = await response
+        .json()
+        .catch(() => "HTTP error from Anima API");
+
+      if (typeof errorData === "string") {
+        throw new CodegenError({
+          name: errorData,
+          reason: "Unknown",
+          detail: { status: response.status },
+          status: response.status,
+        });
       }
+
+      if (typeof errorData !== "object") {
+        throw new CodegenError({
+          name: `Error "${errorData}"`,
+          reason: "Unknown",
+          detail: { status: response.status },
+          status: response.status,
+        });
+      }
+
+      if (errorData.error?.name === "ZodError") {
+        throw new CodegenError({
+          name: "HTTP error from Anima API",
+          reason: "Invalid body payload",
+          detail: errorData.error.issues,
+          status: response.status,
+        });
+      }
+
       throw new CodegenError({
-        name: "HTTP Error",
-        reason: errorMessage,
+        name: errorData.error?.name || "HTTP error from Anima API",
+        reason: "Unknown",
+        detail: { status: response.status },
         status: response.status,
       });
     }
@@ -223,7 +247,6 @@ export class Anima {
               }
 
               case "error": {
-                // not sure if we want to throw on "stream" errors
                 throw new CodegenError({
                   name: data.payload.errorName,
                   reason: data.payload.reason,
@@ -232,13 +255,12 @@ export class Anima {
 
               case "done": {
                 if (!result.files) {
-                  // not sure if we want to throw on "logical" errors
-                  // I think we should throw only on "HTTP" errors
                   throw new CodegenError({
                     name: "Invalid response",
-                    reason: "No files found",
+                    reason: "No code generated",
                   });
                 }
+
                 result.tokenUsage = data.payload.tokenUsage;
                 return result as AnimaSDKResult;
               }

package/src/dataStream.ts

@@ -4,7 +4,15 @@ import type { GetCodeParams, SSECodgenMessage } from "./types";
 
 export type StreamCodgenMessage =
   | Exclude<SSECodgenMessage, { type: "error" }>
-  | { type: "error"; payload: { message: CodegenErrorReason, status?: number } };
+  | {
+      type: "error";
+      payload: {
+        name: string;
+        message: CodegenErrorReason;
+        status?: number;
+        detail?: unknown;
+      };
+    };
 
 /**
  * Start the code generation and creates a ReadableStream to output its result.
@@ -24,11 +32,11 @@ export const createCodegenStream = (
       anima
         .generateCode(params, (message) => {
           if (message.type === "error") {
-            console.log('NOT SURE IF THIS IS REACHABLE, ALL ERRORS ARE THROWING');
-            controller.enqueue({
-              type: "error",
-              payload: { message: message.payload.reason },
-            });
+            // TODO: It's a dead code. It's never reached, since all errors are thrown.
+            // controller.enqueue({
+            //   type: "error",
+            //   payload: { message: message.payload.reason },
+            // });
           } else {
             controller.enqueue(message);
           }
@@ -39,10 +47,11 @@ export const createCodegenStream = (
         })
         .then((_result) => {
           controller.enqueue({
-            type: "done", payload: {
+            type: "done",
+            payload: {
               tokenUsage: _result.tokenUsage,
               sessionId: _result.sessionId,
-            }
+            },
           });
           controller.close();
         })
@@ -50,8 +59,10 @@ export const createCodegenStream = (
           controller.enqueue({
             type: "error",
             payload: {
+              name: "name" in error ? error.name : "Unknown error",
               message: "message" in error ? error.message : "Unknown",
               status: "status" in error ? error.status : undefined,
+              detail: "detail" in error ? error.detail : undefined,
             },
           });
           controller.close();
@@ -81,10 +92,14 @@ export const createCodegenResponseEventStream = async (
   if (
     firstMessage.done ||
     !firstMessage.value ||
-    firstMessage.value?.type === "error" && firstMessage.value?.payload?.status
+    (firstMessage.value?.type === "error" &&
+      firstMessage.value?.payload?.status)
   ) {
     return new Response(JSON.stringify(firstMessage.value), {
-      status: firstMessage.value?.type === "error" ? (firstMessage.value?.payload?.status ?? 500) : 500,
+      status:
+        firstMessage.value?.type === "error"
+          ? (firstMessage.value?.payload?.status ?? 500)
+          : 500,
       headers: {
         "Content-Type": "application/json",
       },
@@ -107,7 +122,7 @@ export const createCodegenResponseEventStream = async (
     status: 200,
     headers: {
       "Content-Type": "text/event-stream; charset=utf-8",
-      "Connection": "keep-alive",
+      Connection: "keep-alive",
       "Cache-Control": "no-cache",
     },
   });

package/src/errors.ts

@@ -1,21 +1,47 @@
 // TODO: `CodegenErrorReason` should be imported from `anima-public-api`
+/**
+ * Errors from Public API
+ */
 export type CodegenErrorReason =
-  | "The selected node is not a frame"
+  | "Selected node type is not supported"
+  | "Selected node is a page with multiple children"
   | "There is no node with the given id"
   | "Invalid Figma token"
+  | "Anima API connection error"
   | "Figma token expired"
-  | "No files found"
+  | "Invalid user token"
+  | "Figma file not found"
+  | "Figma rate limit exceeded"
+  | "Unknown";
+
+/**
+ * Errors from the SDK
+ */
+export type SDKErrorReason =
+  | "Invalid body payload"
+  | "No code generated"
   | "Connection closed before the 'done' message"
-  | "Unknown"
   | "Response body is null";
 
 export class CodegenError extends Error {
   status?: number;
+  detail?: unknown;
 
-  constructor({ name, reason, status }: { name: string; reason: CodegenErrorReason; status?: number }) {
+  constructor({
+    name,
+    reason,
+    status,
+    detail,
+  }: {
+    name: string;
+    reason: CodegenErrorReason | SDKErrorReason;
+    status?: number;
+    detail?: unknown;
+  }) {
     super();
-    this.name = `[Codegen Error] ${name}`;
+    this.name = name;
     this.message = reason;
+    this.detail = detail;
     this.status = status;
   }
 }

package/src/utils/figma.spec.ts

@@ -0,0 +1,31 @@
+import { describe, expect, it } from "vitest";
+import { formatToFigmaLink } from "./figma";
+
+describe("# figma", () => {
+  describe(".formatToFigmaLink", () => {
+    it("generates a link with file key and node id", () => {
+      const url = formatToFigmaLink({
+        fileKey: "file-key",
+        nodeId: "1:2",
+      });
+
+      expect(url.href).toBe(
+        "https://www.figma.com/design/file-key?node-id=1-2"
+      );
+    });
+
+    describe('when the "duplicate" flag is enabled', () => {
+      it("generates a link including the '/duplicated' path", () => {
+        const url = formatToFigmaLink({
+          fileKey: "file-key",
+          nodeId: "1:2",
+          duplicate: true,
+        });
+
+        expect(url.href).toBe(
+          "https://www.figma.com/design/file-key/duplicate?node-id=1-2"
+        );
+      });
+    });
+  });
+});

package/src/utils/figma.ts

@@ -29,13 +29,19 @@ export const isValidFigmaUrl = (
 export const formatToFigmaLink = ({
   fileKey,
   nodeId,
+  duplicate,
 }: {
   fileKey: string;
   nodeId: string;
+  duplicate?: boolean;
 }) => {
   const url = new URL("https://www.figma.com");
   url.pathname = `design/${fileKey}`;
 
+  if (duplicate) {
+    url.pathname = `${url.pathname}/duplicate`;
+  }
+
   if (nodeId) {
     url.searchParams.set("node-id", nodeId.replace(":", "-"));
   }