mirror of
https://github.com/CopilotKit/CopilotKit.git
synced 2026-09-14 16:26:20 +08:00
Tyler Slaton
74dfd09d32
- CopilotKit imports changed to V1 path (@copilotkit/react-core) - useDefaultTool renamed to useDefaultRenderTool Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
40 lines
1.3 KiB
Plaintext
40 lines
1.3 KiB
Plaintext
`useDefaultRenderTool` provides a catch-all renderer for **any tool** that doesn't have a specific `useRenderToolCall` defined. This is useful for:
|
|
|
|
- Displaying all tool calls during development
|
|
- Rendering MCP (Model Context Protocol) tools
|
|
- Providing a generic fallback UI for unexpected tools
|
|
|
|
```tsx title="app/page.tsx"
|
|
import { useDefaultRenderTool } from "@copilotkit/react-core/v2"; // [!code highlight]
|
|
// ...
|
|
|
|
const YourMainContent = () => {
|
|
// ...
|
|
// [!code highlight:15]
|
|
useDefaultRenderTool({
|
|
render: ({ name, args, status, result }) => {
|
|
return (
|
|
<div style={{ color: "black" }}>
|
|
<span>
|
|
{status === "complete" ? "✓" : "⏳"}
|
|
{name}
|
|
</span>
|
|
{status === "complete" && result && (
|
|
<pre>{JSON.stringify(result, null, 2)}</pre>
|
|
)}
|
|
</div>
|
|
);
|
|
},
|
|
});
|
|
// ...
|
|
}
|
|
```
|
|
|
|
<Callout type="info">
|
|
Unlike `useRenderToolCall`, which targets a specific tool by name, `useDefaultRenderTool` catches **all** tools that don't have a dedicated renderer.
|
|
</Callout>
|
|
|
|
<Callout type="info">
|
|
In v2, use [`useDefaultRenderTool`](/reference/v2/hooks/useDefaultRenderTool) for wildcard fallback rendering, and [`useRenderTool`](/reference/v2/hooks/useRenderTool) for named or wildcard renderer registration.
|
|
</Callout>
|