@copilotkit/react-core 1.4.7 → 1.4.8-coagents-v0-3.1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # ui
 
+## 1.4.8-coagents-v0-3.1
+
+### Patch Changes
+
+- CoAgents v0.3 prerelease
+- Updated dependencies
+  - @copilotkit/runtime-client-gql@1.4.8-coagents-v0-3.1
+  - @copilotkit/shared@1.4.8-coagents-v0-3.1
+
+## 1.4.8-next.0
+
+### Patch Changes
+
+- @copilotkit/runtime-client-gql@1.4.8-next.0
+- @copilotkit/shared@1.4.8-next.0
+
 ## 1.4.7
 
 ### Patch Changes

package/dist/{chunk-EUIBVFV6.mjs → chunk-EC5YZTSH.mjs}

@@ -27,7 +27,8 @@ import {
   MessageRole,
   Role,
   CopilotRequestType,
-  ActionInputAvailability
+  ActionInputAvailability,
+  loadMessagesFromJsonRepresentation
 } from "@copilotkit/runtime-client-gql";
 function useChat(options) {
   const {
@@ -75,28 +76,28 @@ function useChat(options) {
     setMessages([...previousMessages, ...newMessages]);
     const systemMessage = makeSystemMessageCallback();
     const messagesWithContext = [systemMessage, ...initialMessages || [], ...previousMessages];
+    const filteredActions = actions.filter((action) => action.available !== ActionInputAvailability.Disabled || !action.disabled).map((action) => {
+      let available = ActionInputAvailability.Enabled;
+      if (action.disabled) {
+        available = ActionInputAvailability.Disabled;
+      } else if (action.available === "disabled") {
+        available = ActionInputAvailability.Disabled;
+      } else if (action.available === "remote") {
+        available = ActionInputAvailability.Remote;
+      }
+      return {
+        name: action.name,
+        description: action.description || "",
+        jsonSchema: JSON.stringify(actionParametersToJsonSchema(action.parameters || [])),
+        available
+      };
+    });
+    const isAgentRun = agentSessionRef.current !== null;
     const stream = runtimeClient.asStream(
       runtimeClient.generateCopilotResponse({
         data: __spreadProps(__spreadValues(__spreadProps(__spreadValues({
           frontend: {
-            actions: actions.filter(
-              (action) => action.available !== ActionInputAvailability.Disabled || !action.disabled
-            ).map((action) => {
-              let available = ActionInputAvailability.Enabled;
-              if (action.disabled) {
-                available = ActionInputAvailability.Disabled;
-              } else if (action.available === "disabled") {
-                available = ActionInputAvailability.Disabled;
-              } else if (action.available === "remote") {
-                available = ActionInputAvailability.Remote;
-              }
-              return {
-                name: action.name,
-                description: action.description || "",
-                jsonSchema: JSON.stringify(actionParametersToJsonSchema(action.parameters || [])),
-                available
-              };
-            }),
+            actions: filteredActions,
             url: window.location.href
           },
           threadId: threadIdRef.current,
@@ -129,9 +130,10 @@ function useChat(options) {
     );
     const guardrailsEnabled = ((_g = (_f = (_e = copilotConfig.cloud) == null ? void 0 : _e.guardrails) == null ? void 0 : _f.input) == null ? void 0 : _g.restrictToTopic.enabled) || false;
     const reader = stream.getReader();
-    let actionResults = {};
     let executedCoAgentStateRenders = [];
     let followUp = void 0;
+    let messages2 = [];
+    let syncedMessages = [];
     try {
       while (true) {
         let done, value;
@@ -150,7 +152,7 @@ function useChat(options) {
         }
         threadIdRef.current = value.generateCopilotResponse.threadId || null;
         runIdRef.current = value.generateCopilotResponse.runId || null;
-        const messages2 = convertGqlOutputToMessages(
+        messages2 = convertGqlOutputToMessages(
           filterAdjacentAgentStateMessages(value.generateCopilotResponse.messages)
         );
         if (messages2.length === 0) {
@@ -164,39 +166,11 @@ function useChat(options) {
               content: ((_i = value.generateCopilotResponse.status.details) == null ? void 0 : _i.guardrailsReason) || ""
             })
           ];
+          setMessages([...previousMessages, ...newMessages]);
+          break;
         } else {
+          newMessages = [...messages2];
           for (const message of messages2) {
-            newMessages.push(message);
-            if (message.isActionExecutionMessage() && message.status.code !== MessageStatusCode.Pending && message.scope === "client" && onFunctionCall) {
-              if (!(message.id in actionResults)) {
-                if (guardrailsEnabled && value.generateCopilotResponse.status === void 0) {
-                  break;
-                }
-                try {
-                  setMessages([...previousMessages, ...newMessages]);
-                  const action = actions.find((action2) => action2.name === message.name);
-                  if (action) {
-                    followUp = action.followUp;
-                  }
-                  const result = yield onFunctionCall({
-                    messages: previousMessages,
-                    name: message.name,
-                    args: message.arguments
-                  });
-                  actionResults[message.id] = result;
-                } catch (e) {
-                  actionResults[message.id] = `Failed to execute action ${message.name}`;
-                  console.error(`Failed to execute action ${message.name}: ${e}`);
-                }
-              }
-              newMessages.push(
-                new ResultMessage({
-                  result: ResultMessage.encodeResult(actionResults[message.id]),
-                  actionExecutionId: message.id,
-                  actionName: message.name
-                })
-              );
-            }
             if (message.isAgentStateMessage() && !message.active && !executedCoAgentStateRenders.includes(message.id) && onCoAgentStateRender) {
               if (guardrailsEnabled && value.generateCopilotResponse.status === void 0) {
                 break;
@@ -211,6 +185,11 @@ function useChat(options) {
           }
           const lastAgentStateMessage = [...messages2].reverse().find((message) => message.isAgentStateMessage());
           if (lastAgentStateMessage) {
+            if (lastAgentStateMessage.state.messages && lastAgentStateMessage.state.messages.length > 0) {
+              syncedMessages = loadMessagesFromJsonRepresentation(
+                lastAgentStateMessage.state.messages
+              );
+            }
             setCoagentStatesWithRef((prevAgentStates) => __spreadProps(__spreadValues({}, prevAgentStates), {
               [lastAgentStateMessage.agentName]: {
                 name: lastAgentStateMessage.agentName,
@@ -237,14 +216,52 @@ function useChat(options) {
           setMessages([...previousMessages, ...newMessages]);
         }
       }
+      const finalMessages = constructFinalMessages(syncedMessages, previousMessages, newMessages);
+      let didExecuteAction = false;
+      if (onFunctionCall) {
+        const lastMessages = [];
+        for (let i = finalMessages.length - 1; i >= 0; i--) {
+          const message = finalMessages[i];
+          if (message.isActionExecutionMessage() && message.status.code !== MessageStatusCode.Pending) {
+            lastMessages.unshift(message);
+          } else {
+            break;
+          }
+        }
+        for (const message of lastMessages) {
+          setMessages(finalMessages);
+          const action = actions.find((action2) => action2.name === message.name);
+          if (action) {
+            followUp = action.followUp;
+            const result = yield onFunctionCall({
+              messages: finalMessages,
+              name: message.name,
+              args: message.arguments
+            });
+            didExecuteAction = true;
+            const messageIndex = finalMessages.findIndex((msg) => msg.id === message.id);
+            finalMessages.splice(
+              messageIndex + 1,
+              0,
+              new ResultMessage({
+                id: "result-" + message.id,
+                result: ResultMessage.encodeResult(result),
+                actionExecutionId: message.id,
+                actionName: message.name
+              })
+            );
+          }
+        }
+        setMessages(finalMessages);
+      }
       if (
         // if followUp is not explicitly false
-        followUp !== false && // if we have client side results
-        (Object.values(actionResults).length || // or the last message we received is a result
-        newMessages.length && newMessages[newMessages.length - 1].isResultMessage())
+        followUp !== false && // and we executed an action
+        (didExecuteAction || // the last message is a server side result
+        !isAgentRun && finalMessages.length && finalMessages[finalMessages.length - 1].isResultMessage())
       ) {
         yield new Promise((resolve) => setTimeout(resolve, 10));
-        return yield runChatCompletionRef.current([...previousMessages, ...newMessages]);
+        return yield runChatCompletionRef.current(finalMessages);
       } else {
         return newMessages.slice();
       }
@@ -287,8 +304,25 @@ function useChat(options) {
     runChatCompletion: () => runChatCompletionRef.current(messages)
   };
 }
+function constructFinalMessages(syncedMessages, previousMessages, newMessages) {
+  const finalMessages = syncedMessages.length > 0 ? [...syncedMessages] : [...previousMessages, ...newMessages];
+  if (syncedMessages.length > 0) {
+    const messagesWithAgentState = [...previousMessages, ...newMessages];
+    let previousMessageId = void 0;
+    for (const message of messagesWithAgentState) {
+      if (message.isAgentStateMessage()) {
+        const index = finalMessages.findIndex((msg) => msg.id === previousMessageId);
+        if (index !== -1) {
+          finalMessages.splice(index + 1, 0, message);
+        }
+      }
+      previousMessageId = message.id;
+    }
+  }
+  return finalMessages;
+}
 
 export {
   useChat
 };
-//# sourceMappingURL=chunk-EUIBVFV6.mjs.map
+//# sourceMappingURL=chunk-EC5YZTSH.mjs.map

package/dist/chunk-EC5YZTSH.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/use-chat.ts"],"sourcesContent":["import { useRef } from \"react\";\nimport {\n  FunctionCallHandler,\n  COPILOT_CLOUD_PUBLIC_API_KEY_HEADER,\n  actionParametersToJsonSchema,\n  CoAgentStateRenderHandler,\n} from \"@copilotkit/shared\";\nimport {\n  Message,\n  TextMessage,\n  ResultMessage,\n  convertMessagesToGqlInput,\n  filterAdjacentAgentStateMessages,\n  filterAgentStateMessages,\n  convertGqlOutputToMessages,\n  MessageStatusCode,\n  MessageRole,\n  Role,\n  CopilotRequestType,\n  ActionInputAvailability,\n  loadMessagesFromJsonRepresentation,\n} from \"@copilotkit/runtime-client-gql\";\n\nimport { CopilotApiConfig } from \"../context\";\nimport { FrontendAction } from \"../types/frontend-action\";\nimport { CoagentState } from \"../types/coagent-state\";\nimport { AgentSession } from \"../context/copilot-context\";\nimport { useToast } from \"../components/toast/toast-provider\";\nimport { useCopilotRuntimeClient } from \"./use-copilot-runtime-client\";\n\nexport type UseChatOptions = {\n  /**\n   * System messages of the chat. Defaults to an empty array.\n   */\n  initialMessages?: Message[];\n  /**\n   * Callback function to be called when a function call is received.\n   * If the function returns a `ChatRequest` object, the request will be sent\n   * automatically to the API and will be used to update the chat.\n   */\n  onFunctionCall?: FunctionCallHandler;\n\n  /**\n   * Callback function to be called when a coagent action is received.\n   */\n  onCoAgentStateRender?: CoAgentStateRenderHandler;\n\n  /**\n   * Function definitions to be sent to the API.\n   */\n  actions: FrontendAction<any>[];\n\n  /**\n   * The CopilotKit API configuration.\n   */\n  copilotConfig: CopilotApiConfig;\n\n  /**\n   * The current list of messages in the chat.\n   */\n  messages: Message[];\n  /**\n   * The setState-powered method to update the chat messages.\n   */\n  setMessages: React.Dispatch<React.SetStateAction<Message[]>>;\n\n  /**\n   * A callback to get the latest system message.\n   */\n  makeSystemMessageCallback: () => TextMessage;\n\n  /**\n   * Whether the API request is in progress\n   */\n  isLoading: boolean;\n\n  /**\n   * setState-powered method to update the isChatLoading value\n   */\n  setIsLoading: React.Dispatch<React.SetStateAction<boolean>>;\n\n  /**\n   * The current list of coagent states.\n   */\n  coagentStatesRef: React.RefObject<Record<string, CoagentState>>;\n\n  /**\n   * setState-powered method to update the agent states\n   */\n  setCoagentStatesWithRef: React.Dispatch<React.SetStateAction<Record<string, CoagentState>>>;\n\n  /**\n   * The current agent session.\n   */\n  agentSession: AgentSession | null;\n\n  /**\n   * setState-powered method to update the agent session\n   */\n  setAgentSession: React.Dispatch<React.SetStateAction<AgentSession | null>>;\n};\n\nexport type UseChatHelpers = {\n  /**\n   * Append a user message to the chat list. This triggers the API call to fetch\n   * the assistant's response.\n   * @param message The message to append\n   */\n  append: (message: Message) => Promise<void>;\n  /**\n   * Reload the last AI chat response for the given chat history. If the last\n   * message isn't from the assistant, it will request the API to generate a\n   * new response.\n   */\n  reload: () => Promise<void>;\n  /**\n   * Abort the current request immediately, keep the generated tokens if any.\n   */\n  stop: () => void;\n\n  /**\n   * Run the chat completion.\n   */\n  runChatCompletion: () => Promise<Message[]>;\n};\n\nexport function useChat(options: UseChatOptions): UseChatHelpers {\n  const {\n    messages,\n    setMessages,\n    makeSystemMessageCallback,\n    copilotConfig,\n    setIsLoading,\n    initialMessages,\n    isLoading,\n    actions,\n    onFunctionCall,\n    onCoAgentStateRender,\n    setCoagentStatesWithRef,\n    coagentStatesRef,\n    agentSession,\n    setAgentSession,\n  } = options;\n\n  const abortControllerRef = useRef<AbortController>();\n  const threadIdRef = useRef<string | null>(null);\n  const runIdRef = useRef<string | null>(null);\n  const { addGraphQLErrorsToast } = useToast();\n\n  const runChatCompletionRef = useRef<(previousMessages: Message[]) => Promise<Message[]>>();\n  // We need to keep a ref of coagent states and session because of renderAndWait - making sure\n  // the latest state is sent to the API\n  // This is a workaround and needs to be addressed in the future\n  const agentSessionRef = useRef<AgentSession | null>(agentSession);\n  agentSessionRef.current = agentSession;\n\n  const publicApiKey = copilotConfig.publicApiKey;\n\n  const headers = {\n    ...(copilotConfig.headers || {}),\n    ...(publicApiKey ? { [COPILOT_CLOUD_PUBLIC_API_KEY_HEADER]: publicApiKey } : {}),\n  };\n\n  const runtimeClient = useCopilotRuntimeClient({\n    url: copilotConfig.chatApiEndpoint,\n    publicApiKey: copilotConfig.publicApiKey,\n    headers,\n    credentials: copilotConfig.credentials,\n  });\n\n  const runChatCompletion = async (previousMessages: Message[]): Promise<Message[]> => {\n    setIsLoading(true);\n\n    // this message is just a placeholder. It will disappear once the first real message\n    // is received\n    let newMessages: Message[] = [\n      new TextMessage({\n        content: \"\",\n        role: Role.Assistant,\n      }),\n    ];\n    const abortController = new AbortController();\n    abortControllerRef.current = abortController;\n\n    setMessages([...previousMessages, ...newMessages]);\n\n    const systemMessage = makeSystemMessageCallback();\n\n    const messagesWithContext = [systemMessage, ...(initialMessages || []), ...previousMessages];\n\n    const filteredActions = actions\n      .filter((action) => action.available !== ActionInputAvailability.Disabled || !action.disabled)\n      .map((action) => {\n        let available: ActionInputAvailability | undefined = ActionInputAvailability.Enabled;\n        if (action.disabled) {\n          available = ActionInputAvailability.Disabled;\n        } else if (action.available === \"disabled\") {\n          available = ActionInputAvailability.Disabled;\n        } else if (action.available === \"remote\") {\n          available = ActionInputAvailability.Remote;\n        }\n        return {\n          name: action.name,\n          description: action.description || \"\",\n          jsonSchema: JSON.stringify(actionParametersToJsonSchema(action.parameters || [])),\n          available,\n        };\n      });\n\n    const isAgentRun = agentSessionRef.current !== null;\n\n    const stream = runtimeClient.asStream(\n      runtimeClient.generateCopilotResponse({\n        data: {\n          frontend: {\n            actions: filteredActions,\n            url: window.location.href,\n          },\n          threadId: threadIdRef.current,\n          runId: runIdRef.current,\n          messages: convertMessagesToGqlInput(filterAgentStateMessages(messagesWithContext)),\n          ...(copilotConfig.cloud\n            ? {\n                cloud: {\n                  ...(copilotConfig.cloud.guardrails?.input?.restrictToTopic?.enabled\n                    ? {\n                        guardrails: {\n                          inputValidationRules: {\n                            allowList:\n                              copilotConfig.cloud.guardrails.input.restrictToTopic.validTopics,\n                            denyList:\n                              copilotConfig.cloud.guardrails.input.restrictToTopic.invalidTopics,\n                          },\n                        },\n                      }\n                    : {}),\n                },\n              }\n            : {}),\n          metadata: {\n            requestType: CopilotRequestType.Chat,\n          },\n          ...(agentSessionRef.current\n            ? {\n                agentSession: agentSessionRef.current,\n              }\n            : {}),\n          agentStates: Object.values(coagentStatesRef.current!).map((state) => ({\n            agentName: state.name,\n            state: JSON.stringify(state.state),\n          })),\n        },\n        properties: copilotConfig.properties,\n        signal: abortControllerRef.current?.signal,\n      }),\n    );\n\n    const guardrailsEnabled =\n      copilotConfig.cloud?.guardrails?.input?.restrictToTopic.enabled || false;\n\n    const reader = stream.getReader();\n\n    let executedCoAgentStateRenders: string[] = [];\n    let followUp: FrontendAction[\"followUp\"] = undefined;\n\n    let messages: Message[] = [];\n    let syncedMessages: Message[] = [];\n\n    try {\n      while (true) {\n        let done, value;\n\n        try {\n          const readResult = await reader.read();\n          done = readResult.done;\n          value = readResult.value;\n        } catch (readError) {\n          break;\n        }\n        if (done) {\n          break;\n        }\n\n        if (!value?.generateCopilotResponse) {\n          continue;\n        }\n\n        threadIdRef.current = value.generateCopilotResponse.threadId || null;\n        runIdRef.current = value.generateCopilotResponse.runId || null;\n\n        messages = convertGqlOutputToMessages(\n          filterAdjacentAgentStateMessages(value.generateCopilotResponse.messages),\n        );\n\n        if (messages.length === 0) {\n          continue;\n        }\n\n        newMessages = [];\n\n        // request failed, display error message and quit\n        if (\n          value.generateCopilotResponse.status?.__typename === \"FailedResponseStatus\" &&\n          value.generateCopilotResponse.status.reason === \"GUARDRAILS_VALIDATION_FAILED\"\n        ) {\n          newMessages = [\n            new TextMessage({\n              role: MessageRole.Assistant,\n              content: value.generateCopilotResponse.status.details?.guardrailsReason || \"\",\n            }),\n          ];\n          setMessages([...previousMessages, ...newMessages]);\n          break;\n        }\n\n        // add messages to the chat\n        else {\n          newMessages = [...messages];\n\n          for (const message of messages) {\n            // execute onCoAgentStateRender handler\n            if (\n              message.isAgentStateMessage() &&\n              !message.active &&\n              !executedCoAgentStateRenders.includes(message.id) &&\n              onCoAgentStateRender\n            ) {\n              // Do not execute a coagent action if guardrails are enabled but the status is not known\n              if (guardrailsEnabled && value.generateCopilotResponse.status === undefined) {\n                break;\n              }\n              // execute coagent action\n              await onCoAgentStateRender({\n                name: message.agentName,\n                nodeName: message.nodeName,\n                state: message.state,\n              });\n              executedCoAgentStateRenders.push(message.id);\n            }\n          }\n\n          const lastAgentStateMessage = [...messages]\n            .reverse()\n            .find((message) => message.isAgentStateMessage());\n\n          if (lastAgentStateMessage) {\n            if (\n              lastAgentStateMessage.state.messages &&\n              lastAgentStateMessage.state.messages.length > 0\n            ) {\n              syncedMessages = loadMessagesFromJsonRepresentation(\n                lastAgentStateMessage.state.messages,\n              );\n            }\n            setCoagentStatesWithRef((prevAgentStates) => ({\n              ...prevAgentStates,\n              [lastAgentStateMessage.agentName]: {\n                name: lastAgentStateMessage.agentName,\n                state: lastAgentStateMessage.state,\n                running: lastAgentStateMessage.running,\n                active: lastAgentStateMessage.active,\n                threadId: lastAgentStateMessage.threadId,\n                nodeName: lastAgentStateMessage.nodeName,\n                runId: lastAgentStateMessage.runId,\n              },\n            }));\n            if (lastAgentStateMessage.running) {\n              setAgentSession({\n                threadId: lastAgentStateMessage.threadId,\n                agentName: lastAgentStateMessage.agentName,\n                nodeName: lastAgentStateMessage.nodeName,\n              });\n            } else {\n              setAgentSession(null);\n            }\n          }\n        }\n\n        if (newMessages.length > 0) {\n          // Update message state\n          setMessages([...previousMessages, ...newMessages]);\n        }\n      }\n      const finalMessages = constructFinalMessages(syncedMessages, previousMessages, newMessages);\n\n      let didExecuteAction = false;\n\n      // execute regular action executions that are specific to the frontend (last actions)\n      if (onFunctionCall) {\n        // Find consecutive action execution messages at the end\n        const lastMessages = [];\n        for (let i = finalMessages.length - 1; i >= 0; i--) {\n          const message = finalMessages[i];\n          if (\n            message.isActionExecutionMessage() &&\n            message.status.code !== MessageStatusCode.Pending\n          ) {\n            lastMessages.unshift(message);\n          } else {\n            break;\n          }\n        }\n\n        for (const message of lastMessages) {\n          // We update the message state before calling the handler so that the render\n          // function can be called with `executing` state\n          setMessages(finalMessages);\n\n          const action = actions.find((action) => action.name === message.name);\n\n          if (action) {\n            followUp = action.followUp;\n            const result = await onFunctionCall({\n              messages: finalMessages,\n              name: message.name,\n              args: message.arguments,\n            });\n            didExecuteAction = true;\n            const messageIndex = finalMessages.findIndex((msg) => msg.id === message.id);\n            finalMessages.splice(\n              messageIndex + 1,\n              0,\n              new ResultMessage({\n                id: \"result-\" + message.id,\n                result: ResultMessage.encodeResult(result),\n                actionExecutionId: message.id,\n                actionName: message.name,\n              }),\n            );\n          }\n        }\n\n        setMessages(finalMessages);\n      }\n\n      if (\n        // if followUp is not explicitly false\n        followUp !== false &&\n        // and we executed an action\n        (didExecuteAction ||\n          // the last message is a server side result\n          (!isAgentRun &&\n            finalMessages.length &&\n            finalMessages[finalMessages.length - 1].isResultMessage()))\n      ) {\n        // run the completion again and return the result\n\n        // wait for next tick to make sure all the react state updates\n        // - tried using react-dom's flushSync, but it did not work\n        await new Promise((resolve) => setTimeout(resolve, 10));\n\n        return await runChatCompletionRef.current!(finalMessages);\n      } else {\n        return newMessages.slice();\n      }\n    } finally {\n      setIsLoading(false);\n    }\n  };\n\n  runChatCompletionRef.current = runChatCompletion;\n\n  const runChatCompletionAndHandleFunctionCall = async (messages: Message[]): Promise<void> => {\n    await runChatCompletionRef.current!(messages);\n  };\n\n  const append = async (message: Message): Promise<void> => {\n    if (isLoading) {\n      return;\n    }\n\n    const newMessages = [...messages, message];\n    setMessages(newMessages);\n    return runChatCompletionAndHandleFunctionCall(newMessages);\n  };\n\n  const reload = async (): Promise<void> => {\n    if (isLoading || messages.length === 0) {\n      return;\n    }\n    let newMessages = [...messages];\n    const lastMessage = messages[messages.length - 1];\n\n    if (lastMessage.isTextMessage() && lastMessage.role === \"assistant\") {\n      newMessages = newMessages.slice(0, -1);\n    }\n\n    setMessages(newMessages);\n\n    return runChatCompletionAndHandleFunctionCall(newMessages);\n  };\n\n  const stop = (): void => {\n    abortControllerRef.current?.abort();\n  };\n\n  return {\n    append,\n    reload,\n    stop,\n    runChatCompletion: () => runChatCompletionRef.current!(messages),\n  };\n}\n\nfunction constructFinalMessages(\n  syncedMessages: Message[],\n  previousMessages: Message[],\n  newMessages: Message[],\n): Message[] {\n  const finalMessages =\n    syncedMessages.length > 0 ? [...syncedMessages] : [...previousMessages, ...newMessages];\n\n  if (syncedMessages.length > 0) {\n    const messagesWithAgentState = [...previousMessages, ...newMessages];\n\n    let previousMessageId: string | undefined = undefined;\n\n    for (const message of messagesWithAgentState) {\n      if (message.isAgentStateMessage()) {\n        // insert this message into finalMessages after the position of previousMessageId\n        const index = finalMessages.findIndex((msg) => msg.id === previousMessageId);\n        if (index !== -1) {\n          finalMessages.splice(index + 1, 0, message);\n        }\n      }\n\n      previousMessageId = message.id;\n    }\n  }\n\n  return finalMessages;\n}\n"],"mappings":"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","names":["messages","action"]}

package/dist/{chunk-XBVKTDXP.mjs → chunk-TNSI3FLW.mjs}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-DCTJZ742.mjs";
 import {
   useChat
-} from "./chunk-EUIBVFV6.mjs";
+} from "./chunk-EC5YZTSH.mjs";
 import {
   useCopilotContext
 } from "./chunk-XQFVXX6R.mjs";
@@ -169,4 +169,4 @@ export {
   useCopilotChat,
   defaultSystemMessage
 };
-//# sourceMappingURL=chunk-XBVKTDXP.mjs.map
+//# sourceMappingURL=chunk-TNSI3FLW.mjs.map

package/dist/{chunk-JHEAUB3Z.mjs → chunk-X6ZF5WAX.mjs}

@@ -46,4 +46,4 @@ function useCoAgentStateRender(action, dependencies) {
 export {
   useCoAgentStateRender
 };
-//# sourceMappingURL=chunk-JHEAUB3Z.mjs.map
+//# sourceMappingURL=chunk-X6ZF5WAX.mjs.map

package/dist/{chunk-JHEAUB3Z.mjs.map → chunk-X6ZF5WAX.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/use-coagent-state-render.ts"],"sourcesContent":["/**\n * <Callout type=\"info\">\n *   Usage of this hook assumes some additional setup in your application, for more information\n *   on that see the CoAgents <span className=\"text-blue-500\">[Agentic Generative UI documentation](/coagents/chat-ui/render-agent-state)</span>.\n * </Callout>\n *\n * The useCoAgentStateRender hook allows you to render UI components or text based on a Agentic Copilot's state.\n * This is particularly useful for showing intermediate state or progress during Agentic Copilot operations.\n *\n * ## Usage\n *\n * ### Simple Usage\n *\n * ```tsx\n * import { useCoagentStateRender } from \"@copilotkit/react-core\";\n *\n * type YourAgentState = {\n *   agent_state_property: string;\n * }\n *\n * useCoagentStateRender<YourAgentState>({\n *   name: \"basic_agent\",\n *   nodeName: \"optionally_specify_a_specific_node\",\n *   render: ({ status, state, nodeName }) => {\n *     return (\n *       <YourComponent\n *         agentStateProperty={state.agent_state_property}\n *         status={status}\n *         nodeName={nodeName}\n *       />\n *     );\n *   },\n * });\n * ```\n *\n * This allows for you to render UI components or text based on what is happening within the agent.\n *\n * ### Example\n * A great example of this is in our Perplexity Clone where we render the progress of an agent's internet search as it is happening.\n * You can play around with it below or learn how to build it with its [demo](/coagents/videos/perplexity-clone).\n *\n * <Callout type=\"info\">\n *   This example is hosted on Vercel and may take a few seconds to load.\n * </Callout>\n *\n * <iframe src=\"https://examples-coagents-ai-researcher-ui.vercel.app/\" className=\"w-full rounded-lg border h-[700px] my-4\" />\n */\n\nimport { useRef, useContext, useEffect } from \"react\";\nimport { CopilotContext } from \"../context/copilot-context\";\nimport { randomId } from \"@copilotkit/shared\";\nimport { CoAgentStateRender } from \"../types/coagent-action\";\n\n/**\n * This hook is used to render agent state with custom UI components or text. This is particularly\n * useful for showing intermediate state or progress during Agentic Copilot operations.\n * To get started using rendering intermediate state through this hook, checkout the documentation.\n *\n * https://docs.copilotkit.ai/coagents/chat-ui/render-agent-state.\n */\n\n// We implement useCoAgentStateRender dependency handling so that\n// the developer has the option to not provide any dependencies.\n// see useCopilotAction for more details about this approach.\nexport function useCoAgentStateRender<T = any>(\n  action: CoAgentStateRender<T>,\n  dependencies?: any[],\n): void {\n  const {\n    setCoAgentStateRender,\n    removeCoAgentStateRender,\n    coAgentStateRenders,\n    chatComponentsCache,\n  } = useContext(CopilotContext);\n  const idRef = useRef<string>(randomId());\n\n  const key = `${action.name}-${action.nodeName || \"global\"}`;\n\n  if (dependencies === undefined) {\n    if (coAgentStateRenders[idRef.current]) {\n      coAgentStateRenders[idRef.current].handler = action.handler as any;\n      if (typeof action.render === \"function\") {\n        if (chatComponentsCache.current !== null) {\n          chatComponentsCache.current.coAgentStateRenders[key] = action.render;\n        }\n      }\n    }\n  }\n\n  useEffect(() => {\n    setCoAgentStateRender(idRef.current, action as any);\n    if (chatComponentsCache.current !== null && action.render !== undefined) {\n      chatComponentsCache.current.coAgentStateRenders[key] = action.render;\n    }\n    return () => {\n      removeCoAgentStateRender(idRef.current);\n    };\n  }, [\n    setCoAgentStateRender,\n    removeCoAgentStateRender,\n    action.name,\n    // include render only if it's a string\n    typeof action.render === \"string\" ? action.render : undefined,\n    // dependencies set by the developer\n    ...(dependencies || []),\n  ]);\n}\n"],"mappings":";;;;;AAgDA,SAAS,QAAQ,YAAY,iBAAiB;AAE9C,SAAS,gBAAgB;AAclB,SAAS,sBACd,QACA,cACM;AACN,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,cAAc;AAC7B,QAAM,QAAQ,OAAe,SAAS,CAAC;AAEvC,QAAM,MAAM,GAAG,OAAO,QAAQ,OAAO,YAAY;AAEjD,MAAI,iBAAiB,QAAW;AAC9B,QAAI,oBAAoB,MAAM,OAAO,GAAG;AACtC,0BAAoB,MAAM,OAAO,EAAE,UAAU,OAAO;AACpD,UAAI,OAAO,OAAO,WAAW,YAAY;AACvC,YAAI,oBAAoB,YAAY,MAAM;AACxC,8BAAoB,QAAQ,oBAAoB,GAAG,IAAI,OAAO;AAAA,QAChE;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,YAAU,MAAM;AACd,0BAAsB,MAAM,SAAS,MAAa;AAClD,QAAI,oBAAoB,YAAY,QAAQ,OAAO,WAAW,QAAW;AACvE,0BAAoB,QAAQ,oBAAoB,GAAG,IAAI,OAAO;AAAA,IAChE;AACA,WAAO,MAAM;AACX,+BAAyB,MAAM,OAAO;AAAA,IACxC;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA,OAAO;AAAA;AAAA,IAEP,OAAO,OAAO,WAAW,WAAW,OAAO,SAAS;AAAA;AAAA,IAEpD,GAAI,gBAAgB,CAAC;AAAA,EACvB,CAAC;AACH;","names":[]}
+{"version":3,"sources":["../src/hooks/use-coagent-state-render.ts"],"sourcesContent":["/**\n * <Callout type=\"info\">\n *   Usage of this hook assumes some additional setup in your application, for more information\n *   on that see the CoAgents <span className=\"text-blue-500\">[Agentic Generative UI documentation](/coagents/chat-ui/render-agent-state)</span>.\n * </Callout>\n *\n * The useCoAgentStateRender hook allows you to render UI components or text based on a Agentic Copilot's state.\n * This is particularly useful for showing intermediate state or progress during Agentic Copilot operations.\n *\n * ## Usage\n *\n * ### Simple Usage\n *\n * ```tsx\n * import { useCoAgentStateRender } from \"@copilotkit/react-core\";\n *\n * type YourAgentState = {\n *   agent_state_property: string;\n * }\n *\n * useCoAgentStateRender<YourAgentState>({\n *   name: \"basic_agent\",\n *   nodeName: \"optionally_specify_a_specific_node\",\n *   render: ({ status, state, nodeName }) => {\n *     return (\n *       <YourComponent\n *         agentStateProperty={state.agent_state_property}\n *         status={status}\n *         nodeName={nodeName}\n *       />\n *     );\n *   },\n * });\n * ```\n *\n * This allows for you to render UI components or text based on what is happening within the agent.\n *\n * ### Example\n * A great example of this is in our Perplexity Clone where we render the progress of an agent's internet search as it is happening.\n * You can play around with it below or learn how to build it with its [demo](/coagents/videos/perplexity-clone).\n *\n * <Callout type=\"info\">\n *   This example is hosted on Vercel and may take a few seconds to load.\n * </Callout>\n *\n * <iframe src=\"https://examples-coagents-ai-researcher-ui.vercel.app/\" className=\"w-full rounded-lg border h-[700px] my-4\" />\n */\n\nimport { useRef, useContext, useEffect } from \"react\";\nimport { CopilotContext } from \"../context/copilot-context\";\nimport { randomId } from \"@copilotkit/shared\";\nimport { CoAgentStateRender } from \"../types/coagent-action\";\n\n/**\n * This hook is used to render agent state with custom UI components or text. This is particularly\n * useful for showing intermediate state or progress during Agentic Copilot operations.\n * To get started using rendering intermediate state through this hook, checkout the documentation.\n *\n * https://docs.copilotkit.ai/coagents/chat-ui/render-agent-state.\n */\n\n// We implement useCoAgentStateRender dependency handling so that\n// the developer has the option to not provide any dependencies.\n// see useCopilotAction for more details about this approach.\nexport function useCoAgentStateRender<T = any>(\n  action: CoAgentStateRender<T>,\n  dependencies?: any[],\n): void {\n  const {\n    setCoAgentStateRender,\n    removeCoAgentStateRender,\n    coAgentStateRenders,\n    chatComponentsCache,\n  } = useContext(CopilotContext);\n  const idRef = useRef<string>(randomId());\n\n  const key = `${action.name}-${action.nodeName || \"global\"}`;\n\n  if (dependencies === undefined) {\n    if (coAgentStateRenders[idRef.current]) {\n      coAgentStateRenders[idRef.current].handler = action.handler as any;\n      if (typeof action.render === \"function\") {\n        if (chatComponentsCache.current !== null) {\n          chatComponentsCache.current.coAgentStateRenders[key] = action.render;\n        }\n      }\n    }\n  }\n\n  useEffect(() => {\n    setCoAgentStateRender(idRef.current, action as any);\n    if (chatComponentsCache.current !== null && action.render !== undefined) {\n      chatComponentsCache.current.coAgentStateRenders[key] = action.render;\n    }\n    return () => {\n      removeCoAgentStateRender(idRef.current);\n    };\n  }, [\n    setCoAgentStateRender,\n    removeCoAgentStateRender,\n    action.name,\n    // include render only if it's a string\n    typeof action.render === \"string\" ? action.render : undefined,\n    // dependencies set by the developer\n    ...(dependencies || []),\n  ]);\n}\n"],"mappings":";;;;;AAgDA,SAAS,QAAQ,YAAY,iBAAiB;AAE9C,SAAS,gBAAgB;AAclB,SAAS,sBACd,QACA,cACM;AACN,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,cAAc;AAC7B,QAAM,QAAQ,OAAe,SAAS,CAAC;AAEvC,QAAM,MAAM,GAAG,OAAO,QAAQ,OAAO,YAAY;AAEjD,MAAI,iBAAiB,QAAW;AAC9B,QAAI,oBAAoB,MAAM,OAAO,GAAG;AACtC,0BAAoB,MAAM,OAAO,EAAE,UAAU,OAAO;AACpD,UAAI,OAAO,OAAO,WAAW,YAAY;AACvC,YAAI,oBAAoB,YAAY,MAAM;AACxC,8BAAoB,QAAQ,oBAAoB,GAAG,IAAI,OAAO;AAAA,QAChE;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,YAAU,MAAM;AACd,0BAAsB,MAAM,SAAS,MAAa;AAClD,QAAI,oBAAoB,YAAY,QAAQ,OAAO,WAAW,QAAW;AACvE,0BAAoB,QAAQ,oBAAoB,GAAG,IAAI,OAAO;AAAA,IAChE;AACA,WAAO,MAAM;AACX,+BAAyB,MAAM,OAAO;AAAA,IACxC;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA,OAAO;AAAA;AAAA,IAEP,OAAO,OAAO,WAAW,WAAW,OAAO,SAAS;AAAA;AAAA,IAEpD,GAAI,gBAAgB,CAAC;AAAA,EACvB,CAAC;AACH;","names":[]}

package/dist/{chunk-O22KGHOQ.mjs → chunk-XIDLJSIH.mjs}

@@ -1,6 +1,6 @@
 import {
   useCopilotChat
-} from "./chunk-XBVKTDXP.mjs";
+} from "./chunk-TNSI3FLW.mjs";
 import {
   useCopilotMessagesContext
 } from "./chunk-DCTJZ742.mjs";
@@ -125,4 +125,4 @@ function runAgent(name, context, appendMessage, runChatCompletion, hint) {
 export {
   useCoAgent
 };
-//# sourceMappingURL=chunk-O22KGHOQ.mjs.map
+//# sourceMappingURL=chunk-XIDLJSIH.mjs.map

package/dist/chunk-XIDLJSIH.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/use-coagent.ts"],"sourcesContent":["/**\n * <Callout type=\"info\">\n *   Usage of this hook assumes some additional setup in your application, for more information\n *   on that see the CoAgents <span className=\"text-blue-500\">[getting started guide](/coagents/quickstart)</span>.\n * </Callout>\n * <Frame className=\"my-12\">\n *   <img\n *     src=\"/images/coagents/SharedStateCoAgents.gif\"\n *     alt=\"CoAgents demonstration\"\n *     className=\"w-auto\"\n *   />\n * </Frame>\n *\n * This hook is used to integrate an agent into your application. With its use, you can\n * render and update the state of an agent, allowing for a dynamic and interactive experience.\n * We call these shared state experiences agentic copilots, or CoAgents for short.\n *\n * ## Usage\n *\n * ### Simple Usage\n *\n * ```tsx\n * import { useCoAgent } from \"@copilotkit/react-core\";\n *\n * type AgentState = {\n *   count: number;\n * }\n *\n * const agent = useCoAgent<AgentState>({\n *   name: \"my-agent\",\n *   initialState: {\n *     count: 0,\n *   },\n * });\n *\n * ```\n *\n * `useCoAgent` returns an object with the following properties:\n *\n * ```tsx\n * const {\n *   name,     // The name of the agent currently being used.\n *   nodeName, // The name of the current LangGraph node.\n *   state,    // The current state of the agent.\n *   setState, // A function to update the state of the agent.\n *   running,  // A boolean indicating if the agent is currently running.\n *   start,    // A function to start the agent.\n *   stop,     // A function to stop the agent.\n *   run,      // A function to re-run the agent. Takes a HintFunction to inform the agent why it is being re-run.\n * } = agent;\n * ```\n *\n * Finally we can leverage these properties to create reactive experiences with the agent!\n *\n * ```tsx\n * const { state, setState } = useCoAgent<AgentState>({\n *   name: \"my-agent\",\n *   initialState: {\n *     count: 0,\n *   },\n * });\n *\n * return (\n *   <div>\n *     <p>Count: {state.count}</p>\n *     <button onClick={() => setState({ count: state.count + 1 })}>Increment</button>\n *   </div>\n * );\n * ```\n *\n * This reactivity is bidirectional, meaning that changes to the state from the agent will be reflected in the UI and vice versa.\n *\n * ## Parameters\n * <PropertyReference name=\"options\" type=\"UseCoagentOptions<T>\" required>\n *   The options to use when creating the coagent.\n *   <PropertyReference name=\"name\" type=\"string\" required>\n *     The name of the agent to use.\n *   </PropertyReference>\n *   <PropertyReference name=\"initialState\" type=\"T | any\">\n *     The initial state of the agent.\n *   </PropertyReference>\n *   <PropertyReference name=\"state\" type=\"T | any\">\n *     State to manage externally if you are using this hook with external state management.\n *   </PropertyReference>\n *   <PropertyReference name=\"setState\" type=\"(newState: T | ((prevState: T | undefined) => T)) => void\">\n *     A function to update the state of the agent if you are using this hook with external state management.\n *   </PropertyReference>\n * </PropertyReference>\n */\n\nimport { useEffect } from \"react\";\nimport {\n  CopilotContextParams,\n  CopilotMessagesContextParams,\n  useCopilotContext,\n  useCopilotMessagesContext,\n} from \"../context\";\nimport { CoagentState } from \"../types/coagent-state\";\nimport { useCopilotChat } from \"./use-copilot-chat\";\nimport { Message } from \"@copilotkit/runtime-client-gql\";\n\ninterface WithInternalStateManagementAndInitial<T> {\n  /**\n   * The name of the agent being used.\n   */\n  name: string;\n  /**\n   * The initial state of the agent.\n   */\n  initialState: T;\n}\n\ninterface WithInternalStateManagement {\n  /**\n   * The name of the agent being used.\n   */\n  name: string;\n  /**\n   * Optional initialState with default type any\n   */\n  initialState?: any;\n}\n\ninterface WithExternalStateManagement<T> {\n  /**\n   * The name of the agent being used.\n   */\n  name: string;\n  /**\n   * The current state of the agent.\n   */\n  state: T;\n  /**\n   * A function to update the state of the agent.\n   */\n  setState: (newState: T | ((prevState: T | undefined) => T)) => void;\n}\n\ntype UseCoagentOptions<T> =\n  | WithInternalStateManagementAndInitial<T>\n  | WithInternalStateManagement\n  | WithExternalStateManagement<T>;\n\nexport interface UseCoagentReturnType<T> {\n  /**\n   * The name of the agent being used.\n   */\n  name: string;\n  /**\n   * The name of the current LangGraph node.\n   */\n  nodeName?: string;\n  /**\n   * The ID of the thread the agent is running in.\n   */\n  threadId?: string;\n  /**\n   * A boolean indicating if the agent is currently running.\n   */\n  running: boolean;\n  /**\n   * The current state of the agent.\n   */\n  state: T;\n  /**\n   * A function to update the state of the agent.\n   */\n  setState: (newState: T | ((prevState: T | undefined) => T)) => void;\n  /**\n   * A function to start the agent.\n   */\n  start: () => void;\n  /**\n   * A function to stop the agent.\n   */\n  stop: () => void;\n  /**\n   * A function to re-run the agent. The hint function can be used to provide a hint to the agent\n   * about why it is being re-run again.\n   */\n  run: (hint?: HintFunction) => Promise<void>;\n}\n\nexport interface HintFunctionParams {\n  /**\n   * The previous state of the agent.\n   */\n  previousState: any;\n  /**\n   * The current state of the agent.\n   */\n  currentState: any;\n}\n\nexport type HintFunction = (params: HintFunctionParams) => Message | undefined;\n\n/**\n * This hook is used to integrate an agent into your application. With its use, you can\n * render and update the state of the agent, allowing for a dynamic and interactive experience.\n * We call these shared state experiences \"agentic copilots\". To get started using agentic copilots, which\n * we refer to as CoAgents, checkout the documentation at https://docs.copilotkit.ai/coagents/quickstart.\n */\nexport function useCoAgent<T = any>(options: UseCoagentOptions<T>): UseCoagentReturnType<T> {\n  const isExternalStateManagement = (\n    options: UseCoagentOptions<T>,\n  ): options is WithExternalStateManagement<T> => {\n    return \"state\" in options && \"setState\" in options;\n  };\n\n  const { name } = options;\n\n  const isInternalStateManagementWithInitial = (\n    options: UseCoagentOptions<T>,\n  ): options is WithInternalStateManagementAndInitial<T> => {\n    return \"initialState\" in options;\n  };\n\n  const generalContext = useCopilotContext();\n  const messagesContext = useCopilotMessagesContext();\n  const context = { ...generalContext, ...messagesContext };\n  const { coagentStates, coagentStatesRef, setCoagentStatesWithRef } = context;\n  const { appendMessage, runChatCompletion } = useCopilotChat();\n\n  const getCoagentState = (coagentStates: Record<string, CoagentState>, name: string) => {\n    if (coagentStates[name]) {\n      return coagentStates[name];\n    } else {\n      return {\n        name,\n        state: isInternalStateManagementWithInitial(options) ? options.initialState : {},\n        running: false,\n        active: false,\n        threadId: undefined,\n        nodeName: undefined,\n        runId: undefined,\n      };\n    }\n  };\n\n  // if we manage state internally, we need to provide a function to set the state\n  const setState = (newState: T | ((prevState: T | undefined) => T)) => {\n    let coagentState: CoagentState = getCoagentState(coagentStatesRef.current || {}, name);\n    const updatedState =\n      typeof newState === \"function\" ? (newState as Function)(coagentState.state) : newState;\n\n    setCoagentStatesWithRef({\n      ...coagentStatesRef.current,\n      [name]: {\n        ...coagentState,\n        state: updatedState,\n      },\n    });\n  };\n\n  const coagentState = getCoagentState(coagentStates, name);\n\n  const state = isExternalStateManagement(options) ? options.state : coagentState.state;\n\n  // Sync internal state with external state if state management is external\n  useEffect(() => {\n    if (isExternalStateManagement(options)) {\n      setState(options.state);\n    } else if (coagentStates[name] === undefined) {\n      setState(options.initialState === undefined ? {} : options.initialState);\n    }\n  }, [isExternalStateManagement(options) ? JSON.stringify(options.state) : undefined]);\n\n  // Return the state and setState function\n  return {\n    name,\n    nodeName: coagentState.nodeName,\n    state,\n    setState,\n    running: coagentState.running,\n    start: () => {\n      startAgent(name, context);\n    },\n    stop: () => {\n      stopAgent(name, context);\n    },\n    run: (hint?: HintFunction) => {\n      return runAgent(name, context, appendMessage, runChatCompletion, hint);\n    },\n  };\n}\n\nfunction startAgent(name: string, context: CopilotContextParams) {\n  const { setAgentSession } = context;\n  setAgentSession({\n    agentName: name,\n  });\n}\n\nfunction stopAgent(name: string, context: CopilotContextParams) {\n  const { agentSession, setAgentSession } = context;\n  if (agentSession && agentSession.agentName === name) {\n    setAgentSession(null);\n  } else {\n    console.warn(`No agent session found for ${name}`);\n  }\n}\n\nasync function runAgent(\n  name: string,\n  context: CopilotContextParams & CopilotMessagesContextParams,\n  appendMessage: (message: Message) => Promise<void>,\n  runChatCompletion: () => Promise<Message[]>,\n  hint?: HintFunction,\n) {\n  const { agentSession, setAgentSession } = context;\n  if (!agentSession || agentSession.agentName !== name) {\n    setAgentSession({\n      agentName: name,\n    });\n  }\n\n  let previousState: any = null;\n  for (let i = context.messages.length - 1; i >= 0; i--) {\n    const message = context.messages[i];\n    if (message.isAgentStateMessage() && message.agentName === name) {\n      previousState = message.state;\n    }\n  }\n\n  let state = context.coagentStatesRef.current?.[name]?.state || {};\n\n  if (hint) {\n    const hintMessage = hint({ previousState, currentState: state });\n    if (hintMessage) {\n      await appendMessage(hintMessage);\n    } else {\n      await runChatCompletion();\n    }\n  } else {\n    await runChatCompletion();\n  }\n}\n"],"mappings":"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","names":["options","coagentStates","name","coagentState"]}

package/dist/hooks/index.js

@@ -245,28 +245,28 @@ function useChat(options) {
     setMessages([...previousMessages, ...newMessages]);
     const systemMessage = makeSystemMessageCallback();
     const messagesWithContext = [systemMessage, ...initialMessages || [], ...previousMessages];
+    const filteredActions = actions.filter((action) => action.available !== import_runtime_client_gql2.ActionInputAvailability.Disabled || !action.disabled).map((action) => {
+      let available = import_runtime_client_gql2.ActionInputAvailability.Enabled;
+      if (action.disabled) {
+        available = import_runtime_client_gql2.ActionInputAvailability.Disabled;
+      } else if (action.available === "disabled") {
+        available = import_runtime_client_gql2.ActionInputAvailability.Disabled;
+      } else if (action.available === "remote") {
+        available = import_runtime_client_gql2.ActionInputAvailability.Remote;
+      }
+      return {
+        name: action.name,
+        description: action.description || "",
+        jsonSchema: JSON.stringify((0, import_shared.actionParametersToJsonSchema)(action.parameters || [])),
+        available
+      };
+    });
+    const isAgentRun = agentSessionRef.current !== null;
     const stream = runtimeClient.asStream(
       runtimeClient.generateCopilotResponse({
         data: __spreadProps(__spreadValues(__spreadProps(__spreadValues({
           frontend: {
-            actions: actions.filter(
-              (action) => action.available !== import_runtime_client_gql2.ActionInputAvailability.Disabled || !action.disabled
-            ).map((action) => {
-              let available = import_runtime_client_gql2.ActionInputAvailability.Enabled;
-              if (action.disabled) {
-                available = import_runtime_client_gql2.ActionInputAvailability.Disabled;
-              } else if (action.available === "disabled") {
-                available = import_runtime_client_gql2.ActionInputAvailability.Disabled;
-              } else if (action.available === "remote") {
-                available = import_runtime_client_gql2.ActionInputAvailability.Remote;
-              }
-              return {
-                name: action.name,
-                description: action.description || "",
-                jsonSchema: JSON.stringify((0, import_shared.actionParametersToJsonSchema)(action.parameters || [])),
-                available
-              };
-            }),
+            actions: filteredActions,
             url: window.location.href
           },
           threadId: threadIdRef.current,
@@ -299,9 +299,10 @@ function useChat(options) {
     );
     const guardrailsEnabled = ((_g = (_f = (_e = copilotConfig.cloud) == null ? void 0 : _e.guardrails) == null ? void 0 : _f.input) == null ? void 0 : _g.restrictToTopic.enabled) || false;
     const reader = stream.getReader();
-    let actionResults = {};
     let executedCoAgentStateRenders = [];
     let followUp = void 0;
+    let messages2 = [];
+    let syncedMessages = [];
     try {
       while (true) {
         let done, value;
@@ -320,7 +321,7 @@ function useChat(options) {
         }
         threadIdRef.current = value.generateCopilotResponse.threadId || null;
         runIdRef.current = value.generateCopilotResponse.runId || null;
-        const messages2 = (0, import_runtime_client_gql2.convertGqlOutputToMessages)(
+        messages2 = (0, import_runtime_client_gql2.convertGqlOutputToMessages)(
           (0, import_runtime_client_gql2.filterAdjacentAgentStateMessages)(value.generateCopilotResponse.messages)
         );
         if (messages2.length === 0) {
@@ -334,39 +335,11 @@ function useChat(options) {
               content: ((_i = value.generateCopilotResponse.status.details) == null ? void 0 : _i.guardrailsReason) || ""
             })
           ];
+          setMessages([...previousMessages, ...newMessages]);
+          break;
         } else {
+          newMessages = [...messages2];
           for (const message of messages2) {
-            newMessages.push(message);
-            if (message.isActionExecutionMessage() && message.status.code !== import_runtime_client_gql2.MessageStatusCode.Pending && message.scope === "client" && onFunctionCall) {
-              if (!(message.id in actionResults)) {
-                if (guardrailsEnabled && value.generateCopilotResponse.status === void 0) {
-                  break;
-                }
-                try {
-                  setMessages([...previousMessages, ...newMessages]);
-                  const action = actions.find((action2) => action2.name === message.name);
-                  if (action) {
-                    followUp = action.followUp;
-                  }
-                  const result = yield onFunctionCall({
-                    messages: previousMessages,
-                    name: message.name,
-                    args: message.arguments
-                  });
-                  actionResults[message.id] = result;
-                } catch (e) {
-                  actionResults[message.id] = `Failed to execute action ${message.name}`;
-                  console.error(`Failed to execute action ${message.name}: ${e}`);
-                }
-              }
-              newMessages.push(
-                new import_runtime_client_gql2.ResultMessage({
-                  result: import_runtime_client_gql2.ResultMessage.encodeResult(actionResults[message.id]),
-                  actionExecutionId: message.id,
-                  actionName: message.name
-                })
-              );
-            }
             if (message.isAgentStateMessage() && !message.active && !executedCoAgentStateRenders.includes(message.id) && onCoAgentStateRender) {
               if (guardrailsEnabled && value.generateCopilotResponse.status === void 0) {
                 break;
@@ -381,6 +354,11 @@ function useChat(options) {
           }
           const lastAgentStateMessage = [...messages2].reverse().find((message) => message.isAgentStateMessage());
           if (lastAgentStateMessage) {
+            if (lastAgentStateMessage.state.messages && lastAgentStateMessage.state.messages.length > 0) {
+              syncedMessages = (0, import_runtime_client_gql2.loadMessagesFromJsonRepresentation)(
+                lastAgentStateMessage.state.messages
+              );
+            }
             setCoagentStatesWithRef((prevAgentStates) => __spreadProps(__spreadValues({}, prevAgentStates), {
               [lastAgentStateMessage.agentName]: {
                 name: lastAgentStateMessage.agentName,
@@ -407,14 +385,52 @@ function useChat(options) {
           setMessages([...previousMessages, ...newMessages]);
         }
       }
+      const finalMessages = constructFinalMessages(syncedMessages, previousMessages, newMessages);
+      let didExecuteAction = false;
+      if (onFunctionCall) {
+        const lastMessages = [];
+        for (let i = finalMessages.length - 1; i >= 0; i--) {
+          const message = finalMessages[i];
+          if (message.isActionExecutionMessage() && message.status.code !== import_runtime_client_gql2.MessageStatusCode.Pending) {
+            lastMessages.unshift(message);
+          } else {
+            break;
+          }
+        }
+        for (const message of lastMessages) {
+          setMessages(finalMessages);
+          const action = actions.find((action2) => action2.name === message.name);
+          if (action) {
+            followUp = action.followUp;
+            const result = yield onFunctionCall({
+              messages: finalMessages,
+              name: message.name,
+              args: message.arguments
+            });
+            didExecuteAction = true;
+            const messageIndex = finalMessages.findIndex((msg) => msg.id === message.id);
+            finalMessages.splice(
+              messageIndex + 1,
+              0,
+              new import_runtime_client_gql2.ResultMessage({
+                id: "result-" + message.id,
+                result: import_runtime_client_gql2.ResultMessage.encodeResult(result),
+                actionExecutionId: message.id,
+                actionName: message.name
+              })
+            );
+          }
+        }
+        setMessages(finalMessages);
+      }
       if (
         // if followUp is not explicitly false
-        followUp !== false && // if we have client side results
-        (Object.values(actionResults).length || // or the last message we received is a result
-        newMessages.length && newMessages[newMessages.length - 1].isResultMessage())
+        followUp !== false && // and we executed an action
+        (didExecuteAction || // the last message is a server side result
+        !isAgentRun && finalMessages.length && finalMessages[finalMessages.length - 1].isResultMessage())
       ) {
         yield new Promise((resolve) => setTimeout(resolve, 10));
-        return yield runChatCompletionRef.current([...previousMessages, ...newMessages]);
+        return yield runChatCompletionRef.current(finalMessages);
       } else {
         return newMessages.slice();
       }
@@ -457,6 +473,23 @@ function useChat(options) {
     runChatCompletion: () => runChatCompletionRef.current(messages)
   };
 }
+function constructFinalMessages(syncedMessages, previousMessages, newMessages) {
+  const finalMessages = syncedMessages.length > 0 ? [...syncedMessages] : [...previousMessages, ...newMessages];
+  if (syncedMessages.length > 0) {
+    const messagesWithAgentState = [...previousMessages, ...newMessages];
+    let previousMessageId = void 0;
+    for (const message of messagesWithAgentState) {
+      if (message.isAgentStateMessage()) {
+        const index = finalMessages.findIndex((msg) => msg.id === previousMessageId);
+        if (index !== -1) {
+          finalMessages.splice(index + 1, 0, message);
+        }
+      }
+      previousMessageId = message.id;
+    }
+  }
+  return finalMessages;
+}
 
 // src/components/copilot-provider/copilotkit.tsx
 var import_react6 = require("react");