Tool approvalNew

$pnpm dlx shadcn@latest add @nextui/tool-approval

1{
2  "registries": {
3    "@nextui": {
4      "url": "https://nextui.dev/r/{name}.json",
5      "headers": { "Authorization": "Bearer ${NEXTUI_TOKEN}" }
6    }
7  }
8}

1"use client";
2
3import { useChat } from "@ai-sdk/react";
4import { ToolApproval } from "@/components/nextui/tool-approval";
5
6// AI SDK 6: give the tool needsApproval: true on the server, then answer the request here.
7export function Messages() {
8  const { messages, addToolApprovalResponse } = useChat();
9
10  return messages.flatMap((message) =>
11    message.parts.map((part, i) =>
12      part.type === "tool-send_email" && part.state === "approval-requested" ? (
13        <ToolApproval
14          key={i}
15          title="Send this email?"
16          toolName="send_email"
17          details={{ To: part.input.to, Subject: part.input.subject }}
18          onApprove={() => addToolApprovalResponse({ id: part.approval.id, approved: true })}
19          onDeny={() => addToolApprovalResponse({ id: part.approval.id, approved: false })}
20        />
21      ) : null,
22    ),
23  );
24}