@puckeditor/plugin-ai 0.8.3-canary.89ddeea1 → 0.8.3-canary.8cefba87

package/dist/index.js

@@ -4392,12 +4392,28 @@ var waitForIframeReady = async (root, imageTimeout = 1e4) => {
   await waitForNextPaint(document2);
 };
 
+// src/lib/client-tool-response.ts
+init_react_import();
+async function postClientToolResponse(host, body) {
+  const response = await fetch(`${host.replace(/\/+$/, "")}/tool`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(body)
+  });
+  if (!response.ok) {
+    throw new Error(
+      `Client tool endpoint returned ${response.status} ${response.statusText}`.trim()
+    );
+  }
+}
+
 // src/components/Chat/index.tsx
 var import_jsx_runtime35 = require("react/jsx-runtime");
 var q = (0, import_qler.default)();
 var DEFAULT_API_VERSION = "v2";
 var BUILD_OP_DEBOUNCE_MS = 1e3 / 60;
-var PLUGIN_AI_VERSION = true ? "0.8.3-canary.89ddeea1" : "unknown";
+var CLIENT_TOOL_ENDPOINT_UNAVAILABLE_ERROR_MESSAGE = "Unable to verify the page data. Please enable the `/chat/tool` endpoint on the server and try again.";
+var PLUGIN_AI_VERSION = true ? "0.8.3-canary.8cefba87" : "unknown";
 var BENCHMARK = false;
 var prefixedUlid = (prefix = "") => `${prefix ? `${prefix}_` : ""}${(0, import_ulid.ulid)()}`;
 var getClassName18 = getClassNameFactory("Chat", styles_module_default);
@@ -4435,6 +4451,8 @@ function Chat2(props) {
   }, [puckData, getPuck]);
   const [error, setError] = (0, import_react27.useState)();
   const [userError, setUserError] = (0, import_react27.useState)();
+  const clientToolEndpointUnavailableRef = (0, import_react27.useRef)(false);
+  const stopChatRef = (0, import_react27.useRef)(null);
   const [composerAttachments, setComposerAttachments] = (0, import_react27.useState)([]);
   const removedAttachmentClientIdsRef = (0, import_react27.useRef)(/* @__PURE__ */ new Set());
   const uploadControllersRef = (0, import_react27.useRef)(/* @__PURE__ */ new Map());
@@ -4551,6 +4569,40 @@ function Chat2(props) {
     },
     [debouncedFlushBuildOps]
   );
+  const handleClientToolEndpointUnavailable = (0, import_react27.useCallback)(() => {
+    if (clientToolEndpointUnavailableRef.current) return;
+    clientToolEndpointUnavailableRef.current = true;
+    setError(CLIENT_TOOL_ENDPOINT_UNAVAILABLE_ERROR_MESSAGE);
+    console.error(CLIENT_TOOL_ENDPOINT_UNAVAILABLE_ERROR_MESSAGE);
+    setToolStatus((current) => {
+      let changed = false;
+      const next = {};
+      for (const [id, toolState] of Object.entries(current)) {
+        if (toolState.loading) {
+          changed = true;
+          next[id] = {
+            ...toolState,
+            loading: false,
+            label: "Verification unavailable"
+          };
+        } else {
+          next[id] = toolState;
+        }
+      }
+      return changed ? next : current;
+    });
+    stopChatRef.current?.();
+  }, []);
+  const sendClientToolResponse = (0, import_react27.useCallback)(
+    async (body) => {
+      try {
+        await postClientToolResponse(host, body);
+      } catch {
+        handleClientToolEndpointUnavailable();
+      }
+    },
+    [handleClientToolEndpointUnavailable, host]
+  );
   const processData = (0, import_react27.useCallback)(
     (dataPart) => {
       lastStreamActivityRef.current = Date.now();
@@ -4584,13 +4636,9 @@ function Chat2(props) {
             debouncedFlushBuildOps.flush();
             q.wait().then(() => {
               const { appState } = getPuck();
-              return fetch(`${host}/tool`, {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify({
-                  id: requestId,
-                  responses: [{ action, output: appState.data }]
-                })
+              return sendClientToolResponse({
+                id: requestId,
+                responses: [{ action, output: appState.data }]
               });
             }).catch((e) => {
               console.error("Failed to respond to client request:", e);
@@ -4632,13 +4680,9 @@ function Chat2(props) {
                   `Upload failed with status ${uploadResponse.status}`
                 );
               }
-              return fetch(`${host}/tool`, {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify({
-                  id: requestId,
-                  responses: [{ action, output: { sizeBytes: blob.size } }]
-                })
+              return sendClientToolResponse({
+                id: requestId,
+                responses: [{ action, output: { sizeBytes: blob.size } }]
               });
             }).catch((e) => {
               console.error("Failed to respond to client request:", e);
@@ -4685,6 +4729,7 @@ function Chat2(props) {
       getPuck,
       puckDispatch,
       queueBuildOp,
+      sendClientToolResponse,
       uploadScreenshot
     ]
   );
@@ -4754,12 +4799,14 @@ function Chat2(props) {
       if (BENCHMARK) {
         console.timeEnd("chat");
       }
-      setError(e.message);
+      if (!clientToolEndpointUnavailableRef.current) {
+        setError(e.message);
+      }
     },
     onFinish: (options) => {
       debouncedFlushBuildOps.flush();
       q.wait().then(() => {
-        if (!options.isAbort) {
+        if (!options.isAbort || clientToolEndpointUnavailableRef.current) {
           puckDispatch({
             type: "set",
             state: getPuck().appState,
@@ -4774,12 +4821,13 @@ function Chat2(props) {
       });
     }
   });
-  (0, import_react27.useEffect)(
-    () => () => {
+  (0, import_react27.useEffect)(() => {
+    stopChatRef.current = stop;
+    return () => {
+      stopChatRef.current = null;
       stop();
-    },
-    [stop]
-  );
+    };
+  }, [stop]);
   const statusRef = (0, import_react27.useRef)(status);
   (0, import_react27.useEffect)(() => {
     statusRef.current = status;
@@ -4880,6 +4928,8 @@ function Chat2(props) {
     if (!text && readyAttachments.length === 0) {
       return false;
     }
+    clientToolEndpointUnavailableRef.current = false;
+    setError("");
     setUserError("");
     if (chat?.onSubmit) {
       try {
@@ -5119,6 +5169,7 @@ function Chat2(props) {
       ),
       error,
       handleRetry: () => {
+        clientToolEndpointUnavailableRef.current = false;
         setError("");
         regenerate();
       },

package/dist/index.mjs

@@ -4424,12 +4424,28 @@ var waitForIframeReady = async (root, imageTimeout = 1e4) => {
   await waitForNextPaint(document2);
 };
 
+// src/lib/client-tool-response.ts
+init_react_import();
+async function postClientToolResponse(host, body) {
+  const response = await fetch(`${host.replace(/\/+$/, "")}/tool`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(body)
+  });
+  if (!response.ok) {
+    throw new Error(
+      `Client tool endpoint returned ${response.status} ${response.statusText}`.trim()
+    );
+  }
+}
+
 // src/components/Chat/index.tsx
 import { Fragment as Fragment9, jsx as jsx35, jsxs as jsxs20 } from "react/jsx-runtime";
 var q = qler();
 var DEFAULT_API_VERSION = "v2";
 var BUILD_OP_DEBOUNCE_MS = 1e3 / 60;
-var PLUGIN_AI_VERSION = true ? "0.8.3-canary.89ddeea1" : "unknown";
+var CLIENT_TOOL_ENDPOINT_UNAVAILABLE_ERROR_MESSAGE = "Unable to verify the page data. Please enable the `/chat/tool` endpoint on the server and try again.";
+var PLUGIN_AI_VERSION = true ? "0.8.3-canary.8cefba87" : "unknown";
 var BENCHMARK = false;
 var prefixedUlid = (prefix = "") => `${prefix ? `${prefix}_` : ""}${ulid()}`;
 var getClassName18 = getClassNameFactory("Chat", styles_module_default);
@@ -4467,6 +4483,8 @@ function Chat2(props) {
   }, [puckData, getPuck]);
   const [error, setError] = useState16();
   const [userError, setUserError] = useState16();
+  const clientToolEndpointUnavailableRef = useRef13(false);
+  const stopChatRef = useRef13(null);
   const [composerAttachments, setComposerAttachments] = useState16([]);
   const removedAttachmentClientIdsRef = useRef13(/* @__PURE__ */ new Set());
   const uploadControllersRef = useRef13(/* @__PURE__ */ new Map());
@@ -4583,6 +4601,40 @@ function Chat2(props) {
     },
     [debouncedFlushBuildOps]
   );
+  const handleClientToolEndpointUnavailable = useCallback6(() => {
+    if (clientToolEndpointUnavailableRef.current) return;
+    clientToolEndpointUnavailableRef.current = true;
+    setError(CLIENT_TOOL_ENDPOINT_UNAVAILABLE_ERROR_MESSAGE);
+    console.error(CLIENT_TOOL_ENDPOINT_UNAVAILABLE_ERROR_MESSAGE);
+    setToolStatus((current) => {
+      let changed = false;
+      const next = {};
+      for (const [id, toolState] of Object.entries(current)) {
+        if (toolState.loading) {
+          changed = true;
+          next[id] = {
+            ...toolState,
+            loading: false,
+            label: "Verification unavailable"
+          };
+        } else {
+          next[id] = toolState;
+        }
+      }
+      return changed ? next : current;
+    });
+    stopChatRef.current?.();
+  }, []);
+  const sendClientToolResponse = useCallback6(
+    async (body) => {
+      try {
+        await postClientToolResponse(host, body);
+      } catch {
+        handleClientToolEndpointUnavailable();
+      }
+    },
+    [handleClientToolEndpointUnavailable, host]
+  );
   const processData = useCallback6(
     (dataPart) => {
       lastStreamActivityRef.current = Date.now();
@@ -4616,13 +4668,9 @@ function Chat2(props) {
             debouncedFlushBuildOps.flush();
             q.wait().then(() => {
               const { appState } = getPuck();
-              return fetch(`${host}/tool`, {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify({
-                  id: requestId,
-                  responses: [{ action, output: appState.data }]
-                })
+              return sendClientToolResponse({
+                id: requestId,
+                responses: [{ action, output: appState.data }]
               });
             }).catch((e) => {
               console.error("Failed to respond to client request:", e);
@@ -4664,13 +4712,9 @@ function Chat2(props) {
                   `Upload failed with status ${uploadResponse.status}`
                 );
               }
-              return fetch(`${host}/tool`, {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify({
-                  id: requestId,
-                  responses: [{ action, output: { sizeBytes: blob.size } }]
-                })
+              return sendClientToolResponse({
+                id: requestId,
+                responses: [{ action, output: { sizeBytes: blob.size } }]
               });
             }).catch((e) => {
               console.error("Failed to respond to client request:", e);
@@ -4717,6 +4761,7 @@ function Chat2(props) {
       getPuck,
       puckDispatch,
       queueBuildOp,
+      sendClientToolResponse,
       uploadScreenshot
     ]
   );
@@ -4786,12 +4831,14 @@ function Chat2(props) {
       if (BENCHMARK) {
         console.timeEnd("chat");
       }
-      setError(e.message);
+      if (!clientToolEndpointUnavailableRef.current) {
+        setError(e.message);
+      }
     },
     onFinish: (options) => {
       debouncedFlushBuildOps.flush();
       q.wait().then(() => {
-        if (!options.isAbort) {
+        if (!options.isAbort || clientToolEndpointUnavailableRef.current) {
           puckDispatch({
             type: "set",
             state: getPuck().appState,
@@ -4806,12 +4853,13 @@ function Chat2(props) {
       });
     }
   });
-  useEffect13(
-    () => () => {
+  useEffect13(() => {
+    stopChatRef.current = stop;
+    return () => {
+      stopChatRef.current = null;
       stop();
-    },
-    [stop]
-  );
+    };
+  }, [stop]);
   const statusRef = useRef13(status);
   useEffect13(() => {
     statusRef.current = status;
@@ -4912,6 +4960,8 @@ function Chat2(props) {
     if (!text && readyAttachments.length === 0) {
       return false;
     }
+    clientToolEndpointUnavailableRef.current = false;
+    setError("");
     setUserError("");
     if (chat?.onSubmit) {
       try {
@@ -5151,6 +5201,7 @@ function Chat2(props) {
       ),
       error,
       handleRetry: () => {
+        clientToolEndpointUnavailableRef.current = false;
         setError("");
         regenerate();
       },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@puckeditor/plugin-ai",
-  "version": "0.8.3-canary.89ddeea1",
+  "version": "0.8.3-canary.8cefba87",
   "author": "Chris Villa <chris@puckeditor.com>",
   "repository": {
     "type": "git",
@@ -52,12 +52,12 @@
     "tsup": "^8.2.4",
     "typescript": "^5.5.4",
     "vitest": "^4.1.0",
-    "@puckeditor/ai-types": "0.8.3-canary.89ddeea1",
-    "@puckeditor/platform-types": "0.8.3-canary.89ddeea1",
-    "eslint-config-custom": "0.8.3-canary.89ddeea1",
-    "reducer": "0.8.3-canary.89ddeea1",
-    "tsconfig": "0.8.3-canary.89ddeea1",
-    "tsup-config": "0.8.3-canary.89ddeea1"
+    "@puckeditor/ai-types": "0.8.3-canary.8cefba87",
+    "@puckeditor/platform-types": "0.8.3-canary.8cefba87",
+    "eslint-config-custom": "0.8.3-canary.8cefba87",
+    "reducer": "0.8.3-canary.8cefba87",
+    "tsconfig": "0.8.3-canary.8cefba87",
+    "tsup-config": "0.8.3-canary.8cefba87"
   },
   "peerDependencies": {
     "@puckeditor/core": "^0",