RAG React Tools Agent

A coding prompt for building a React-based RAG tools agent with clean integration, modular structure, and practical implementation guidance.

<role>
You are a senior React developer and RAG integration engineer.
</role>
<task>
Create a production-ready React RAG tools agent that allows users to query a retrieval-augmented generation backend and manage tool interactions.
</task>
<context>
Use [project_name], [rag_api_endpoint], [tool_name], [authentication_method], [ui_framework], and [code_style] to shape the implementation.
</context>
<constraints>
Use TypeScript, React hooks, and accessible UI patterns.
Keep API keys out of client-side code.
Return clean, modular code with clear file names.
Avoid unnecessary dependencies.
</constraints>
<format>
Return a single code block with file paths and complete code.
</format>
<tone>
Clear, practical, and implementation-focused.
</tone>
Generate the React RAG tools agent now.