Tool Approval
Tool Approval
Demonstrate tool execution with user confirmation. Includes approval workflows, confirmation UI, and state management for safe AI operations.
Loading preview…
Problems solved
- Require user confirmation before a needsApproval tool runs
- Demonstrate the AI SDK built-in approval mechanism for delete_file
- Keep pending approval state visible in the chat UI
Use cases
- File-deletion confirmations in assistants
- Destructive admin actions gated by the user
- Teaching needsApproval tool flows
- Safe tool execution demos
Setup
Requirements, wiring steps, and what this pattern adds to your project.
Getting started
Pick how you want to pull this pattern in — then wire env vars and routes the same way.
- 1
Install from the preview toolbar

Copy the install command above and run it in your project — Pro patterns include a short-lived token.
- 2
Add environment variables to .env.local
OPENAI_API_KEY
- 3
Point client fetches at your API routes
Replace preview `/view/.../api/...` paths with `/api/...` in the installed files.
- 4
Customize the agent and tool files
Adapt prompts, tools, and stop conditions for your product — Copy for AI in the toolbar helps seed that work.
- 5
Run your dev server and open the pattern route
Install dependencies if needed, then start the app and verify responses.
Environment variables
OPENAI_API_KEYGet key
Capabilities
AI SDK APIs
streamTextconvertToModelMessagesuseChataddToolApprovalResponseProviders
Files added
4 filesapp/page.tsxapp/layout.tsxcomponents/chat-form.tsxapp/api/ai-elements-confirmation/route.ts
Dependencies
7 totalnpm packages
5
Registry components
Critical files
ai-elements-confirmation/route.tsAPI route demonstrating the needsApproval tool pattern. Defines a delete_file tool with needsApproval: true that requires user confirmation before execution. Shows the built-in AI SDK approval mechanism.
Requirements
- Complexity
- Beginner
- Setup time
- ~10 minutes
- Node
- 24+
- Memory
- 512MB









