@copilotkit/react-core 1.57.3 → 1.58.0-canary.thread-id-propagation

package/src/hooks/use-langgraph-interrupt.ts

@@ -1,103 +0,0 @@
-import React, { useCallback, useRef } from "react";
-import { LangGraphInterruptRender } from "../types/interrupt-action";
-import { useInterrupt, useCopilotChatConfiguration } from "../v2";
-import type {
-  InterruptEvent,
-  InterruptRenderProps,
-  InterruptHandlerProps,
-} from "../v2";
-import { MetaEventName } from "@copilotkit/runtime-client-gql";
-import { parseJson } from "@copilotkit/shared";
-import { useAgentNodeName } from "./use-agent-nodename";
-import type { AgentSession } from "../context/copilot-context";
-
-/**
- * Transforms a v2 InterruptEvent into the v1 LangGraphInterruptEvent shape
- * expected by existing useLangGraphInterrupt callbacks.
- */
-function toV1Event<TEventValue>(event: InterruptEvent<TEventValue>) {
-  const value =
-    typeof event.value === "string"
-      ? parseJson(event.value, event.value)
-      : event.value;
-  return {
-    name: MetaEventName.LangGraphInterruptEvent,
-    type: "MetaEvent" as const,
-    value,
-  };
-}
-
-export function useLangGraphInterrupt<TEventValue = any>(
-  action: Omit<LangGraphInterruptRender<TEventValue>, "id">,
-  _dependencies?: any[],
-) {
-  const actionRef = useRef(action);
-  // Update ref synchronously during render so it's always current
-  // when callbacks read from it (useEffect would be one tick late).
-  actionRef.current = action;
-
-  const existingConfig = useCopilotChatConfiguration();
-  const resolvedAgentId =
-    action.agentId ?? existingConfig?.agentId ?? "default";
-  const threadId = existingConfig?.threadId;
-  const nodeName = useAgentNodeName(resolvedAgentId);
-
-  // Keep agentMetadata in a ref so stable callbacks always see current values.
-  const metadataRef = useRef<AgentSession>({
-    agentName: resolvedAgentId,
-    threadId,
-    nodeName,
-  });
-  metadataRef.current = {
-    agentName: resolvedAgentId,
-    threadId,
-    nodeName,
-  };
-
-  // Stable callback references that always read the latest action from the ref.
-  // This prevents useInterrupt's internal useMemo/useEffect from seeing new
-  // function identities on every render, which would cause an infinite loop.
-  const render = useCallback(
-    ({ event, result, resolve }: InterruptRenderProps<TEventValue>) => {
-      const renderFn = actionRef.current.render;
-      if (!renderFn) return React.createElement(React.Fragment);
-      const rendered = renderFn({
-        event: toV1Event(event) as any,
-        result,
-        resolve: (r) => resolve(r),
-      });
-      if (typeof rendered === "string") {
-        return React.createElement(React.Fragment, null, rendered);
-      }
-      return rendered;
-    },
-    [],
-  );
-
-  // Handler always delegates to the ref — if no handler is set at call time,
-  // the optional chaining returns undefined which useInterrupt treats as null.
-  const handler = useCallback(
-    ({ event, resolve }: InterruptHandlerProps<TEventValue>) => {
-      return actionRef.current.handler?.({
-        event: toV1Event(event) as any,
-        resolve: (r) => resolve(r),
-      });
-    },
-    [],
-  );
-
-  const enabled = useCallback((event: InterruptEvent<TEventValue>) => {
-    if (!actionRef.current.enabled) return true;
-    return actionRef.current.enabled({
-      eventValue: toV1Event(event).value,
-      agentMetadata: metadataRef.current,
-    });
-  }, []);
-
-  useInterrupt({
-    render,
-    handler,
-    enabled,
-    agentId: resolvedAgentId,
-  });
-}

package/src/hooks/use-lazy-tool-renderer.tsx

@@ -1,30 +0,0 @@
-import { useRenderToolCall } from "../v2";
-import { AIMessage, Message, ToolResult } from "@copilotkit/shared";
-import React, { useCallback } from "react";
-
-export function useLazyToolRenderer(): (
-  message?: AIMessage,
-  messages?: Message[],
-) => null | (() => ReturnType<ReturnType<typeof useRenderToolCall>> | null) {
-  const renderToolCall = useRenderToolCall();
-
-  return useCallback(
-    (message?: AIMessage, messages?: Message[]) => {
-      if (!message?.toolCalls?.length) return null;
-
-      const toolCall = message.toolCalls[0];
-      if (!toolCall) return null;
-
-      const toolMessage = messages?.find(
-        (m) => m.role === "tool" && m.toolCallId === toolCall.id,
-      ) as ToolResult;
-
-      return () =>
-        renderToolCall({
-          toolCall,
-          toolMessage,
-        });
-    },
-    [renderToolCall],
-  );
-}

package/src/hooks/use-make-copilot-document-readable.ts

@@ -1,30 +0,0 @@
-import { useEffect, useRef } from "react";
-import { useCopilotContext } from "../context/copilot-context";
-import { DocumentPointer } from "../types";
-
-/**
- * Makes a document readable by Copilot.
- * @param document The document to make readable.
- * @param categories The categories to associate with the document.
- * @param dependencies The dependencies to use for the effect.
- * @returns The id of the document.
- */
-export function useMakeCopilotDocumentReadable(
-  document: DocumentPointer,
-  categories?: string[],
-  dependencies: any[] = [],
-): string | undefined {
-  const { addDocumentContext, removeDocumentContext } = useCopilotContext();
-  const idRef = useRef<string>(undefined!);
-
-  useEffect(() => {
-    const id = addDocumentContext(document, categories);
-    idRef.current = id;
-
-    return () => {
-      removeDocumentContext(id);
-    };
-  }, [addDocumentContext, removeDocumentContext, ...dependencies]);
-
-  return idRef.current;
-}

package/src/hooks/use-render-tool-call.ts

@@ -1,89 +0,0 @@
-import { type Parameter, getZodParameters } from "@copilotkit/shared";
-import { parseJson } from "@copilotkit/shared";
-import { defineToolCallRenderer, useCopilotKit } from "../v2";
-import type React from "react";
-import { useEffect, useRef } from "react";
-import {
-  type ActionRenderProps,
-  type ActionRenderPropsNoArgs,
-  ActionRenderPropsWait,
-  type FrontendAction,
-} from "../types";
-
-type ToolCallRendererDefinition = Parameters<typeof defineToolCallRenderer>[0];
-
-export type UseRenderToolCallArgs<T extends Parameter[] | [] = []> = Pick<
-  FrontendAction<T>,
-  "name" | "description" | "parameters"
-> & {
-  available?: "disabled" | "enabled";
-  render: T extends []
-    ? (props: ActionRenderPropsNoArgs<T>) => React.ReactElement
-    : (props: ActionRenderProps<T>) => React.ReactElement;
-};
-
-export function useRenderToolCall<const T extends Parameter[] | [] = []>(
-  tool: UseRenderToolCallArgs<T>,
-  dependencies?: any[],
-) {
-  const { copilotkit } = useCopilotKit();
-
-  // Track whether we've already added this renderer to avoid duplicates
-  const hasAddedRef = useRef(false);
-
-  useEffect(() => {
-    const { name, parameters, render } = tool;
-    const zodParameters = getZodParameters(parameters);
-
-    const renderToolCall =
-      name === "*"
-        ? defineToolCallRenderer({
-            name: "*",
-            render: ((args) => {
-              return render({
-                ...args,
-                result: args.result
-                  ? parseJson(args.result, args.result)
-                  : args.result,
-              });
-            }) as ToolCallRendererDefinition["render"],
-          })
-        : defineToolCallRenderer({
-            name,
-            args: zodParameters,
-            render: ((args) => {
-              return render({
-                ...args,
-                result: args.result
-                  ? parseJson(args.result, args.result)
-                  : args.result,
-              });
-            }) as ToolCallRendererDefinition["render"],
-          });
-
-    // Remove any existing renderer with the same name
-    const existingIndex = copilotkit.renderToolCalls.findIndex(
-      (r) => r.name === name,
-    );
-    if (existingIndex !== -1) {
-      copilotkit.renderToolCalls.splice(existingIndex, 1);
-    }
-
-    // Add the new renderer
-    copilotkit.renderToolCalls.push(renderToolCall);
-    hasAddedRef.current = true;
-
-    // Cleanup: remove this renderer when the component unmounts or tool changes
-    return () => {
-      if (hasAddedRef.current) {
-        const index = copilotkit.renderToolCalls.findIndex(
-          (r) => r.name === name,
-        );
-        if (index !== -1) {
-          copilotkit.renderToolCalls.splice(index, 1);
-        }
-        hasAddedRef.current = false;
-      }
-    };
-  }, [tool, ...(dependencies ?? [])]);
-}

package/src/hooks/use-tree.ts

@@ -1,222 +0,0 @@
-import { randomId } from "@copilotkit/shared";
-import { useCallback, useReducer } from "react";
-
-export type TreeNodeId = string;
-
-export interface TreeNode {
-  id: TreeNodeId;
-  value: string;
-  children: TreeNode[];
-  parentId?: TreeNodeId;
-  categories: Set<string>;
-}
-
-export type Tree = TreeNode[];
-
-export interface UseTreeReturn {
-  tree: Tree;
-  addElement: (
-    value: string,
-    categories: string[],
-    parentId?: TreeNodeId,
-  ) => TreeNodeId;
-  printTree: (categories: string[]) => string;
-  removeElement: (id: TreeNodeId) => void;
-  getAllElements: () => Tree;
-}
-
-const findNode = (nodes: Tree, id: TreeNodeId): TreeNode | undefined => {
-  for (const node of nodes) {
-    if (node.id === id) {
-      return node;
-    }
-    const result = findNode(node.children, id);
-    if (result) {
-      return result;
-    }
-  }
-  return undefined;
-};
-
-const removeNode = (nodes: Tree, id: TreeNodeId): Tree => {
-  return nodes.reduce((result: Tree, node) => {
-    if (node.id !== id) {
-      const newNode = { ...node, children: removeNode(node.children, id) };
-      result.push(newNode);
-    }
-    return result;
-  }, []);
-};
-
-const addNode = (
-  nodes: Tree,
-  newNode: TreeNode,
-  parentId?: TreeNodeId,
-): Tree => {
-  if (!parentId) {
-    return [...nodes, newNode];
-  }
-  return nodes.map((node) => {
-    if (node.id === parentId) {
-      return { ...node, children: [...node.children, newNode] };
-    } else if (node.children.length) {
-      return { ...node, children: addNode(node.children, newNode, parentId) };
-    }
-    return node;
-  });
-};
-
-const treeIndentationRepresentation = (
-  index: number,
-  indentLevel: number,
-): string => {
-  if (indentLevel === 0) {
-    return (index + 1).toString();
-  } else if (indentLevel === 1) {
-    return String.fromCharCode(65 + index); // 65 is the ASCII value for 'A'
-  } else if (indentLevel === 2) {
-    return String.fromCharCode(97 + index); // 97 is the ASCII value for 'a'
-  } else {
-    return "-";
-  }
-};
-
-const printNode = (node: TreeNode, prefix = "", indentLevel = 0): string => {
-  const indent = " ".repeat(3).repeat(indentLevel);
-
-  const prefixPlusIndentLength = prefix.length + indent.length;
-  const subsequentLinesPrefix = " ".repeat(prefixPlusIndentLength);
-
-  const valueLines = node.value.split("\n");
-
-  const outputFirstLine = `${indent}${prefix}${valueLines[0]}`;
-  const outputSubsequentLines = valueLines
-    .slice(1)
-    .map((line) => `${subsequentLinesPrefix}${line}`)
-    .join("\n");
-
-  let output = `${outputFirstLine}\n`;
-  if (outputSubsequentLines) {
-    output += `${outputSubsequentLines}\n`;
-  }
-
-  const childPrePrefix = " ".repeat(prefix.length);
-
-  node.children.forEach(
-    (child, index) =>
-      (output += printNode(
-        child,
-        `${childPrePrefix}${treeIndentationRepresentation(index, indentLevel + 1)}. `,
-        indentLevel + 1,
-      )),
-  );
-  return output;
-};
-
-// Action types
-type Action =
-  | {
-      type: "ADD_NODE";
-      value: string;
-      parentId?: string;
-      id: string;
-      categories: string[];
-    }
-  | { type: "REMOVE_NODE"; id: string };
-
-// Reducer function
-function treeReducer(state: Tree, action: Action): Tree {
-  switch (action.type) {
-    case "ADD_NODE": {
-      const { value, parentId, id: newNodeId } = action;
-      const newNode: TreeNode = {
-        id: newNodeId,
-        value,
-        children: [],
-        categories: new Set(action.categories),
-      };
-
-      try {
-        return addNode(state, newNode, parentId);
-      } catch (error) {
-        console.error(`Error while adding node with id ${newNodeId}: ${error}`);
-        return state;
-      }
-    }
-    case "REMOVE_NODE":
-      return removeNode(state, action.id);
-    default:
-      return state;
-  }
-}
-
-// useTree hook
-const useTree = (): UseTreeReturn => {
-  const [tree, dispatch] = useReducer(treeReducer, []);
-
-  const addElement = useCallback(
-    (value: string, categories: string[], parentId?: string): TreeNodeId => {
-      const newNodeId = randomId(); // Generate new ID outside of dispatch
-      dispatch({
-        type: "ADD_NODE",
-        value,
-        parentId,
-        id: newNodeId,
-        categories: categories,
-      });
-      return newNodeId; // Return the new ID
-    },
-    [],
-  );
-
-  const removeElement = useCallback((id: TreeNodeId): void => {
-    dispatch({ type: "REMOVE_NODE", id });
-  }, []);
-
-  const getAllElements = useCallback(() => {
-    return tree;
-  }, [tree]);
-
-  const printTree = useCallback(
-    (categories: string[]): string => {
-      const categoriesSet = new Set(categories);
-
-      let output = "";
-      tree.forEach((node, index) => {
-        // if the node does not have any of the desired categories, continue to the next node
-        if (!setsHaveIntersection(categoriesSet, node.categories)) {
-          return;
-        }
-
-        // add a new line before each node except the first one
-        if (index !== 0) {
-          output += "\n";
-        }
-
-        output += printNode(
-          node,
-          `${treeIndentationRepresentation(index, 0)}. `,
-        );
-      });
-      return output;
-    },
-    [tree],
-  );
-
-  return { tree, addElement, printTree, removeElement, getAllElements };
-};
-
-export default useTree;
-
-function setsHaveIntersection<T>(setA: Set<T>, setB: Set<T>): boolean {
-  const [smallerSet, largerSet] =
-    setA.size <= setB.size ? [setA, setB] : [setB, setA];
-
-  for (let item of smallerSet) {
-    if (largerSet.has(item)) {
-      return true;
-    }
-  }
-
-  return false;
-}

package/src/index.tsx

@@ -1,7 +0,0 @@
-"use client";
-export * from "./components";
-export * from "./context";
-export * from "./hooks";
-export * from "./types";
-export * from "./lib";
-export * from "./utils";

package/src/lib/copilot-task.ts

@@ -1,215 +0,0 @@
-/**
- * This class is used to execute one-off tasks, for example on button press. It can use the context available via [useCopilotReadable](/reference/v1/hooks/useCopilotReadable) and the actions provided by [useCopilotAction](/reference/v1/hooks/useCopilotAction), or you can provide your own context and actions.
- *
- * ## Example
- * In the simplest case, use CopilotTask in the context of your app by giving it instructions on what to do.
- *
- * ```tsx
- * import { CopilotTask, useCopilotContext } from "@copilotkit/react-core";
- *
- * export function MyComponent() {
- *   const context = useCopilotContext();
- *
- *   const task = new CopilotTask({
- *     instructions: "Set a random message",
- *     actions: [
- *       {
- *         name: "setMessage",
- *       description: "Set the message.",
- *       argumentAnnotations: [
- *         {
- *           name: "message",
- *           type: "string",
- *           description:
- *             "A message to display.",
- *           required: true,
- *         },
- *       ],
- *      }
- *     ]
- *   });
- *
- *   const executeTask = async () => {
- *     await task.run(context, action);
- *   }
- *
- *   return (
- *     <>
- *       <button onClick={executeTask}>
- *         Execute task
- *       </button>
- *     </>
- *   )
- * }
- * ```
- *
- * Have a look at the [Presentation Example App](https://github.com/CopilotKit/CopilotKit/blob/main/examples/v1/next-openai/src/app/presentation/page.tsx) for a more complete example.
- */
-
-import {
-  ActionExecutionMessage,
-  CopilotRuntimeClient,
-  Message,
-  Role,
-  TextMessage,
-  convertGqlOutputToMessages,
-  convertMessagesToGqlInput,
-  filterAgentStateMessages,
-  CopilotRequestType,
-  ForwardedParametersInput,
-} from "@copilotkit/runtime-client-gql";
-import {
-  FrontendAction,
-  processActionsForRuntimeRequest,
-} from "../types/frontend-action";
-import { CopilotContextParams } from "../context";
-import { defaultCopilotContextCategories } from "../components";
-
-export interface CopilotTaskConfig {
-  /**
-   * The instructions to be given to the assistant.
-   */
-  instructions: string;
-  /**
-   * An array of action definitions that can be called.
-   */
-  actions?: FrontendAction<any>[];
-  /**
-   * Whether to include the copilot readable context in the task.
-   */
-  includeCopilotReadable?: boolean;
-
-  /**
-   * Whether to include actions defined via useCopilotAction in the task.
-   */
-  includeCopilotActions?: boolean;
-
-  /**
-   * The forwarded parameters to use for the task.
-   */
-  forwardedParameters?: ForwardedParametersInput;
-}
-
-export class CopilotTask<T = any> {
-  private instructions: string;
-  private actions: FrontendAction<any>[];
-  private includeCopilotReadable: boolean;
-  private includeCopilotActions: boolean;
-  private forwardedParameters?: ForwardedParametersInput;
-  constructor(config: CopilotTaskConfig) {
-    this.instructions = config.instructions;
-    this.actions = config.actions || [];
-    this.includeCopilotReadable = config.includeCopilotReadable !== false;
-    this.includeCopilotActions = config.includeCopilotActions !== false;
-    this.forwardedParameters = config.forwardedParameters;
-  }
-
-  /**
-   * Run the task.
-   * @param context The CopilotContext to use for the task. Use `useCopilotContext` to obtain the current context.
-   * @param data The data to use for the task.
-   */
-  async run(context: CopilotContextParams, data?: T): Promise<void> {
-    const actions = this.includeCopilotActions
-      ? Object.assign({}, context.actions)
-      : {};
-
-    // merge functions into entry points
-    for (const fn of this.actions) {
-      actions[fn.name] = fn;
-    }
-
-    let contextString = "";
-
-    if (data) {
-      contextString =
-        (typeof data === "string" ? data : JSON.stringify(data)) + "\n\n";
-    }
-
-    if (this.includeCopilotReadable) {
-      contextString += context.getContextString(
-        [],
-        defaultCopilotContextCategories,
-      );
-    }
-
-    const systemMessage = new TextMessage({
-      content: taskSystemMessage(contextString, this.instructions),
-      role: Role.System,
-    });
-
-    const messages: Message[] = [systemMessage];
-
-    const runtimeClient = new CopilotRuntimeClient({
-      url: context.copilotApiConfig.chatApiEndpoint,
-      publicApiKey: context.copilotApiConfig.publicApiKey,
-      headers: context.copilotApiConfig.headers,
-      credentials: context.copilotApiConfig.credentials,
-    });
-
-    const response = await runtimeClient
-      .generateCopilotResponse({
-        data: {
-          frontend: {
-            actions: processActionsForRuntimeRequest(Object.values(actions)),
-            url: window.location.href,
-          },
-          messages: convertMessagesToGqlInput(
-            filterAgentStateMessages(messages),
-          ),
-          metadata: {
-            requestType: CopilotRequestType.Task,
-          },
-          forwardedParameters: {
-            // if forwardedParameters is provided, use it
-            toolChoice: "required",
-            ...this.forwardedParameters,
-          },
-        },
-        properties: context.copilotApiConfig.properties,
-      })
-      .toPromise();
-
-    const functionCallHandler = context.getFunctionCallHandler(actions);
-    const functionCalls = convertGqlOutputToMessages(
-      response.data?.generateCopilotResponse?.messages || [],
-    ).filter((m): m is ActionExecutionMessage => m.isActionExecutionMessage());
-
-    for (const functionCall of functionCalls) {
-      await functionCallHandler({
-        messages,
-        name: functionCall.name,
-        args: functionCall.arguments,
-      });
-    }
-  }
-}
-
-function taskSystemMessage(
-  contextString: string,
-  instructions: string,
-): string {
-  return `
-Please act as an efficient, competent, conscientious, and industrious professional assistant.
-
-Help the user achieve their goals, and you do so in a way that is as efficient as possible, without unnecessary fluff, but also without sacrificing professionalism.
-Always be polite and respectful, and prefer brevity over verbosity.
-
-The user has provided you with the following context:
-\`\`\`
-${contextString}
-\`\`\`
-
-They have also provided you with functions you can call to initiate actions on their behalf.
-
-Please assist them as best you can.
-
-This is not a conversation, so please do not ask questions. Just call a function without saying anything else.
-
-The user has given you the following task to complete:
-
-\`\`\`
-${instructions}
-\`\`\`
-`;
-}

package/src/lib/index.ts

@@ -1 +0,0 @@
-export * from "./copilot-task";