@mastra/react 0.1.0-beta.1 → 0.1.0-beta.11

package/dist/index.js

@@ -1,6 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { createContext, useContext, useRef, useState, Fragment, useLayoutEffect, useEffect } from 'react';
 import { MastraClient } from '@mastra/client-js';
+import { v4 } from '@lukeed/uuid';
 import { ChevronDownIcon, CheckIcon, CopyIcon } from 'lucide-react';
 import { twMerge } from 'tailwind-merge';
 import { toJsxRuntime } from 'hast-util-to-jsx-runtime';
@@ -46,7 +47,7 @@ const mapWorkflowStreamChunkToWatchResult = (prev, chunk) => {
     return {
       ...prev,
       status: chunk.payload.workflowStatus,
-      ...finalStatus === "success" && lastStep?.status === "success" ? { result: lastStep?.output } : finalStatus === "failed" && lastStep?.status === "failed" ? { error: lastStep?.error } : {}
+      ...finalStatus === "success" && lastStep?.status === "success" ? { result: lastStep?.output } : finalStatus === "failed" && lastStep?.status === "failed" ? { error: lastStep?.error } : finalStatus === "tripwire" && chunk.payload.tripwire ? { tripwire: chunk.payload.tripwire } : {}
     };
   }
   const { stepCallId, stepName, ...newPayload } = chunk.payload ?? {};
@@ -98,6 +99,34 @@ const mapWorkflowStreamChunkToWatchResult = (prev, chunk) => {
 };
 const toUIMessage = ({ chunk, conversation, metadata }) => {
   const result = [...conversation];
+  if (chunk.type.startsWith("data-")) {
+    const lastMessage = result[result.length - 1];
+    if (!lastMessage || lastMessage.role !== "assistant") {
+      const newMessage = {
+        id: `data-${chunk.runId}-${Date.now()}`,
+        role: "assistant",
+        parts: [
+          {
+            type: chunk.type,
+            data: "data" in chunk ? chunk.data : void 0
+          }
+        ],
+        metadata
+      };
+      return [...result, newMessage];
+    }
+    const updatedMessage = {
+      ...lastMessage,
+      parts: [
+        ...lastMessage.parts,
+        {
+          type: chunk.type,
+          data: "data" in chunk ? chunk.data : void 0
+        }
+      ]
+    };
+    return [...result.slice(0, -1), updatedMessage];
+  }
   switch (chunk.type) {
     case "tripwire": {
       const newMessage = {
@@ -106,12 +135,17 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
         parts: [
           {
             type: "text",
-            text: chunk.payload.tripwireReason
+            text: chunk.payload.reason
           }
         ],
         metadata: {
           ...metadata,
-          status: "warning"
+          status: "tripwire",
+          tripwire: {
+            retry: chunk.payload.retry,
+            tripwirePayload: chunk.payload.metadata,
+            processorId: chunk.payload.processorId
+          }
         }
       };
       return [...result, newMessage];
@@ -255,17 +289,19 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
       if (!lastMessage || lastMessage.role !== "assistant") return result;
       const parts = [...lastMessage.parts];
       const toolPartIndex = parts.findIndex(
-        (part) => part.type === "dynamic-tool" && "toolCallId" in part && part.toolCallId === chunk.payload.toolCallId
+        (part) => (part.type === "dynamic-tool" || typeof part.type === "string" && part.type.startsWith("tool-")) && "toolCallId" in part && part.toolCallId === chunk.payload.toolCallId
       );
       if (toolPartIndex !== -1) {
         const toolPart = parts[toolPartIndex];
-        if (toolPart.type === "dynamic-tool") {
+        if (toolPart.type === "dynamic-tool" || typeof toolPart.type === "string" && toolPart.type.startsWith("tool-")) {
+          const toolName = "toolName" in toolPart && typeof toolPart.toolName === "string" ? toolPart.toolName : toolPart.type.startsWith("tool-") ? toolPart.type.substring(5) : "";
+          const toolCallId = toolPart.toolCallId;
           if (chunk.type === "tool-result" && chunk.payload.isError || chunk.type === "tool-error") {
             const error = chunk.type === "tool-error" ? chunk.payload.error : chunk.payload.result;
             parts[toolPartIndex] = {
               type: "dynamic-tool",
-              toolName: toolPart.toolName,
-              toolCallId: toolPart.toolCallId,
+              toolName,
+              toolCallId,
               state: "output-error",
               input: toolPart.input,
               errorText: String(error),
@@ -284,8 +320,8 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
             }
             parts[toolPartIndex] = {
               type: "dynamic-tool",
-              toolName: toolPart.toolName,
-              toolCallId: toolPart.toolCallId,
+              toolName,
+              toolCallId,
               state: "output-available",
               input: toolPart.input,
               output,
@@ -307,11 +343,14 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
       if (!lastMessage || lastMessage.role !== "assistant") return result;
       const parts = [...lastMessage.parts];
       const toolPartIndex = parts.findIndex(
-        (part) => part.type === "dynamic-tool" && "toolCallId" in part && part.toolCallId === chunk.payload.toolCallId
+        (part) => (part.type === "dynamic-tool" || typeof part.type === "string" && part.type.startsWith("tool-")) && "toolCallId" in part && part.toolCallId === chunk.payload.toolCallId
       );
       if (toolPartIndex !== -1) {
         const toolPart = parts[toolPartIndex];
-        if (toolPart.type === "dynamic-tool") {
+        if (toolPart.type === "dynamic-tool" || typeof toolPart.type === "string" && toolPart.type.startsWith("tool-")) {
+          const toolName = "toolName" in toolPart && typeof toolPart.toolName === "string" ? toolPart.toolName : typeof toolPart.type === "string" && toolPart.type.startsWith("tool-") ? toolPart.type.substring(5) : "";
+          const toolCallId = toolPart.toolCallId;
+          const input = toolPart.input;
           if (chunk.payload.output?.type?.startsWith("workflow-")) {
             const existingWorkflowState = toolPart.output || {};
             const updatedWorkflowState = mapWorkflowStreamChunkToWatchResult(
@@ -319,7 +358,11 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
               chunk.payload.output
             );
             parts[toolPartIndex] = {
-              ...toolPart,
+              type: "dynamic-tool",
+              toolName,
+              toolCallId,
+              state: "input-streaming",
+              input,
               output: updatedWorkflowState
             };
           } else if (chunk.payload.output?.from === "AGENT" || chunk.payload.output?.from === "USER" && chunk.payload.output?.payload?.output?.type?.startsWith("workflow-")) {
@@ -328,7 +371,11 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
             const currentOutput = toolPart.output || [];
             const existingOutput = Array.isArray(currentOutput) ? currentOutput : [];
             parts[toolPartIndex] = {
-              ...toolPart,
+              type: "dynamic-tool",
+              toolName,
+              toolCallId,
+              state: "input-streaming",
+              input,
               output: [...existingOutput, chunk.payload.output]
             };
           }
@@ -651,6 +698,29 @@ const toAssistantUIMessage = (message) => {
       }
       return baseToolCall;
     }
+    const requireApprovalMetadata = extendedMessage.metadata?.requireApprovalMetadata;
+    const partToolCallId = "toolCallId" in part && typeof part.toolCallId === "string" ? part.toolCallId : void 0;
+    const suspensionData = partToolCallId ? requireApprovalMetadata?.[partToolCallId] : void 0;
+    if (suspensionData) {
+      const toolName = "toolName" in part && typeof part.toolName === "string" ? part.toolName : part.type.startsWith("tool-") ? part.type.substring(5) : "";
+      return {
+        type: "tool-call",
+        toolCallId: partToolCallId,
+        toolName,
+        argsText: "input" in part ? JSON.stringify(part.input) : "{}",
+        args: "input" in part ? part.input : {},
+        metadata: extendedMessage.metadata
+      };
+    }
+    if (part.type.startsWith("data-")) {
+      return {
+        type: "data",
+        name: part.type.substring(5),
+        // Extract name from 'data-{name}'
+        data: part.data,
+        metadata: message.metadata
+      };
+    }
     return {
       type: "text",
       text: "",
@@ -737,7 +807,6 @@ const resolveInitialMessages = (messages) => {
             childMessages,
             result: finalResult?.text || ""
           };
-          console.log("json", json);
           const nextMessage = {
             role: "assistant",
             parts: [
@@ -765,6 +834,18 @@ const resolveInitialMessages = (messages) => {
         return message;
       }
     }
+    const extendedMessage = message;
+    const pendingToolApprovals = extendedMessage.metadata?.pendingToolApprovals;
+    if (pendingToolApprovals && typeof pendingToolApprovals === "object") {
+      return {
+        ...message,
+        metadata: {
+          ...message.metadata,
+          mode: "stream",
+          requireApprovalMetadata: pendingToolApprovals
+        }
+      };
+    }
     return message;
   });
 };
@@ -1213,12 +1294,24 @@ const fromCoreUserMessageToUIMessage = (coreUserMessage) => {
   };
 };
 
-const useChat = ({ agentId, initializeMessages }) => {
-  const _currentRunId = useRef(void 0);
+const useChat = ({ agentId, resourceId, initializeMessages }) => {
+  const extractRunIdFromMessages = (messages2) => {
+    for (const message of messages2) {
+      const pendingToolApprovals = message.metadata?.pendingToolApprovals;
+      if (pendingToolApprovals && typeof pendingToolApprovals === "object") {
+        const suspensionData = Object.values(pendingToolApprovals)[0];
+        if (suspensionData?.runId) {
+          return suspensionData.runId;
+        }
+      }
+    }
+    return void 0;
+  };
+  const initialMessages = initializeMessages?.() || [];
+  const initialRunId = extractRunIdFromMessages(initialMessages);
+  const _currentRunId = useRef(initialRunId);
   const _onChunk = useRef(void 0);
-  const [messages, setMessages] = useState(
-    () => resolveInitialMessages(initializeMessages?.() || [])
-  );
+  const [messages, setMessages] = useState(() => resolveInitialMessages(initialMessages));
   const [toolCallApprovals, setToolCallApprovals] = useState({});
   const baseClient = useMastraClient();
   const [isRunning, setIsRunning] = useState(false);
@@ -1228,7 +1321,8 @@ const useChat = ({ agentId, initializeMessages }) => {
     threadId,
     modelSettings,
     signal,
-    onFinish
+    onFinish,
+    tracingOptions
   }) => {
     const {
       frequencyPenalty,
@@ -1250,7 +1344,7 @@ const useChat = ({ agentId, initializeMessages }) => {
     const agent = clientWithAbort.getAgent(agentId);
     const response = await agent.generate({
       messages: coreUserMessages,
-      runId: agentId,
+      runId: v4(),
       maxSteps,
       modelSettings: {
         frequencyPenalty,
@@ -1263,8 +1357,9 @@ const useChat = ({ agentId, initializeMessages }) => {
       },
       instructions,
       requestContext,
-      ...threadId ? { threadId, resourceId: agentId } : {},
-      providerOptions
+      ...threadId ? { threadId, resourceId: resourceId || agentId } : {},
+      providerOptions,
+      tracingOptions
     });
     setIsRunning(false);
     if (response && "uiMessages" in response.response && response.response.uiMessages) {
@@ -1278,7 +1373,15 @@ const useChat = ({ agentId, initializeMessages }) => {
       setMessages((prev) => [...prev, ...mastraUIMessages]);
     }
   };
-  const stream = async ({ coreUserMessages, requestContext, threadId, onChunk, modelSettings, signal }) => {
+  const stream = async ({
+    coreUserMessages,
+    requestContext,
+    threadId,
+    onChunk,
+    modelSettings,
+    signal,
+    tracingOptions
+  }) => {
     const {
       frequencyPenalty,
       presencePenalty,
@@ -1298,7 +1401,7 @@ const useChat = ({ agentId, initializeMessages }) => {
       abortSignal: signal
     });
     const agent = clientWithAbort.getAgent(agentId);
-    const runId = agentId;
+    const runId = v4();
     const response = await agent.stream({
       messages: coreUserMessages,
       runId,
@@ -1314,9 +1417,10 @@ const useChat = ({ agentId, initializeMessages }) => {
       },
       instructions,
       requestContext,
-      ...threadId ? { threadId, resourceId: agentId } : {},
+      ...threadId ? { threadId, resourceId: resourceId || agentId } : {},
       providerOptions,
-      requireToolApproval
+      requireToolApproval,
+      tracingOptions
     });
     _onChunk.current = onChunk;
     _currentRunId.current = runId;
@@ -1334,7 +1438,8 @@ const useChat = ({ agentId, initializeMessages }) => {
     threadId,
     onNetworkChunk,
     modelSettings,
-    signal
+    signal,
+    tracingOptions
   }) => {
     const { frequencyPenalty, presencePenalty, maxRetries, maxTokens, temperature, topK, topP, maxSteps } = modelSettings || {};
     setIsRunning(true);
@@ -1343,6 +1448,7 @@ const useChat = ({ agentId, initializeMessages }) => {
       abortSignal: signal
     });
     const agent = clientWithAbort.getAgent(agentId);
+    const runId = v4();
     const response = await agent.network({
       messages: coreUserMessages,
       maxSteps,
@@ -1355,9 +1461,10 @@ const useChat = ({ agentId, initializeMessages }) => {
         topK,
         topP
       },
-      runId: agentId,
+      runId,
       requestContext,
-      ...threadId ? { thread: threadId, resourceId: agentId } : {}
+      ...threadId ? { thread: threadId, resourceId: resourceId || agentId } : {},
+      tracingOptions
     });
     const transformer = new AISdkNetworkTransformer();
     await response.processDataStream({