|
| 1 | +# Customizing the Base Orchestrator Agent |
| 2 | + |
| 3 | +This document outlines how to customize the `BaseOrchestratorAgent.ts` file, specifically focusing on adding new agent types and their corresponding UI buttons. |
| 4 | + |
| 5 | +## Overview |
| 6 | + |
| 7 | +**What is a Base Orchestrator Agent?** |
| 8 | + |
| 9 | +The Base Orchestrator Agent acts as a central controller within the AI chat panel. It is responsible for managing different specialized AI agent types (like Search, Deep Research, Shopping, etc.). Based on user selection or context, it determines which agent configuration (including system prompts and available tools) should be active, thereby orchestrating the AI's behavior and capabilities for the specific task at hand. |
| 10 | + |
| 11 | +The `BaseOrchestratorAgent.ts` file defines different types of AI agents, their system prompts, available tools, and how they are rendered as selectable buttons in the UI. Customizing this file allows you to introduce new specialized agents tailored to specific tasks. |
| 12 | + |
| 13 | +**What is Graph-Based Workflow?** |
| 14 | + |
| 15 | +The `BaseOrchestratorAgent` (and the agents it invokes) often follows a structured process defined by a workflow graph, such as `defaultAgentGraph` found in `GraphConfigs.ts`. This graph outlines a map of possible steps (like 'Agent Action', 'Tool Execution', 'Final Output') and the allowed paths between them. Using a graph provides explicit control over the execution sequence, ensuring certain steps happen in a specific order, rather than leaving the entire flow up to the LLM. For example, a graph can be designed to always include a final critique step before displaying the answer. |
| 16 | + |
| 17 | +## Adding a New Agent Type |
| 18 | + |
| 19 | +To add a new agent type and its button, you need to modify three main parts of the `BaseOrchestratorAgent.ts` file: |
| 20 | + |
| 21 | +1. **`BaseOrchestratorAgentType` enum:** |
| 22 | + Add your new agent type to this enum. This provides a typed identifier for your agent. |
| 23 | + |
| 24 | + ```typescript |
| 25 | + export enum BaseOrchestratorAgentType { |
| 26 | + SEARCH = 'search', |
| 27 | + DEEP_RESEARCH = 'deep-research', |
| 28 | + SHOPPING = 'shopping', |
| 29 | + YOUR_NEW_AGENT_TYPE = 'your-new-agent-type' // Add your new type here |
| 30 | + } |
| 31 | + ``` |
| 32 | + |
| 33 | +2. **`SYSTEM_PROMPTS` constant:** |
| 34 | + Define the system prompt for your new agent. This prompt guides the AI's behavior and responses. |
| 35 | + |
| 36 | + ```typescript |
| 37 | + export const SYSTEM_PROMPTS = { |
| 38 | + // ... existing prompts ... |
| 39 | + [BaseOrchestratorAgentType.YOUR_NEW_AGENT_TYPE]: \`You are a [description of your new agent]. |
| 40 | + Your goal is to [explain the agent\'s purpose and how it should behave]. |
| 41 | + You have access to the following tools: [list tools if specific].\` // Define your prompt here |
| 42 | + }; |
| 43 | + ``` |
| 44 | + |
| 45 | +3. **`AGENT_CONFIGS` constant:** |
| 46 | + Add a configuration object for your new agent. This object links the agent type, its UI representation (icon, label, description), system prompt, and the tools it can use. |
| 47 | + |
| 48 | + ```typescript |
| 49 | + export const AGENT_CONFIGS: {[key: string]: AgentConfig} = { |
| 50 | + // ... existing agent configurations ... |
| 51 | + [BaseOrchestratorAgentType.YOUR_NEW_AGENT_TYPE]: { |
| 52 | + type: BaseOrchestratorAgentType.YOUR_NEW_AGENT_TYPE, |
| 53 | + icon: '🤖', // Choose an appropriate emoji or icon |
| 54 | + label: 'Your New Agent', // Label for the button |
| 55 | + description: 'A brief description of what your new agent does.', // Tooltip for the button |
| 56 | + systemPrompt: SYSTEM_PROMPTS[BaseOrchestratorAgentType.YOUR_NEW_AGENT_TYPE], |
| 57 | + availableTools: [ |
| 58 | + // Add instances of tools your agent will use |
| 59 | + // e.g., new NavigateURLTool(), ToolRegistry.getToolInstance('some_tool') |
| 60 | + ] |
| 61 | + } |
| 62 | + }; |
| 63 | + ``` |
| 64 | + |
| 65 | +## How Buttons are Added |
| 66 | + |
| 67 | +The UI buttons for selecting an agent type are rendered by the `renderAgentTypeButtons` function. This function iterates over the `AGENT_CONFIGS` object. Therefore, by adding a new entry to `AGENT_CONFIGS` as described above, a new button for your custom agent will automatically be created and displayed in the UI. |
| 68 | + |
| 69 | +No further changes are needed to display the button once the `AGENT_CONFIGS` entry is correctly added. The `createAgentTypeSelectionHandler` function will handle the selection logic for the newly added button. |
| 70 | + |
| 71 | +## Available Tools |
| 72 | + |
| 73 | +When defining `availableTools` for your new agent, you can use existing tools imported at the top of the file (e.g., `NavigateURLTool`, `SchemaBasedExtractorTool`) or tools registered in the `ToolRegistry`. |
| 74 | + |
| 75 | +Make sure any tools retrieved via `ToolRegistry.getToolInstance('tool_name')` are properly registered elsewhere in the codebase. |
| 76 | + |
| 77 | +## Default Behavior |
| 78 | + |
| 79 | +If an agent type is requested that doesn't have a specific configuration in `AGENT_CONFIGS`: |
| 80 | +* The `getSystemPrompt` function will return a default system prompt. |
| 81 | +* The `getAgentTools` function will return a default set of tools. |
| 82 | + |
| 83 | +This ensures that the system can gracefully handle unknown agent types, though for a fully functional custom agent, providing a specific configuration is essential. |
0 commit comments