Back to practice Practice this problem
AI for FrontendAdvanced55 minutes
Conversational UI Agent
Design a tool-calling conversational agent that can take actions in your app — searching, creating, updating — through natural language with approval gates and rollback.
LLM-friendly summary
An advanced AI-for-frontend problem about designing a tool-calling conversational agent with ReAct loops, approval gates, action transparency, and multi-step rollback.
Scenario
A project management app wants to let users say "move all overdue tasks to next sprint and notify the team" and have the AI agent plan the steps, request approval, and execute them with rollback if something goes wrong.
What you need to design
- 1Design the agent loop — plan, tool selection, execution, observation, next step.
- 2Define the tool interface and capability registration system.
- 3Implement approval gates for destructive or high-impact actions.
- 4Show the agent reasoning process and action history to the user.
- 5Handle partial failures, rollback, and multi-step undo.
Concepts
ReAct PatternTool CallingAgent LoopsApproval GatesRollback
Skills
Agent ArchitectureTool OrchestrationSafety DesignConversational UX
What good solutions are evaluated on
- - Agent loop and tool calling architecture
- - Approval gate and safety design
- - Action history and transparency UX
- - Rollback, partial failure, and recovery
Ready to practice this yourself?
Open the interactive AlgoReason workspace to sketch the architecture, write notes, and submit for AI evaluation.