diff --git a/.github/copilot-instructions.md b/.github/copilot-instructions.md index 92187ff..7348f58 100644 --- a/.github/copilot-instructions.md +++ b/.github/copilot-instructions.md @@ -33,7 +33,6 @@ The system works through these main steps: - `lib/prompts`: Prompt templates for LLMs - `lib/chains`: LangChain chains for various operations - `lib/agents`: LangGraph agents for advanced processing - - `lib/tools`: LangGraph tools for use by agents - `lib/utils`: Utility functions and types including web content retrieval and processing ## Focus Modes @@ -77,7 +76,6 @@ When working on this codebase, you might need to: - Create new prompt templates in `/src/lib/prompts` - Build new chains in `/src/lib/chains` - Implement new LangGraph agents in `/src/lib/agents` -- Create new tools for LangGraph agents in `/src/lib/tools` ## AI Behavior diff --git a/.gitignore b/.gitignore index c95173d..f984aa5 100644 --- a/.gitignore +++ b/.gitignore @@ -37,3 +37,6 @@ Thumbs.db # Db db.sqlite /searxng + +# AI stuff for planning and implementation +.ai/ \ No newline at end of file diff --git a/src/app/api/chat/route.ts b/src/app/api/chat/route.ts index b8650f6..a54e56c 100644 --- a/src/app/api/chat/route.ts +++ b/src/app/api/chat/route.ts @@ -110,6 +110,18 @@ const handleEmitterEvents = async ( sources = parsedData.data; } }); + + stream.on('agent_action', (data) => { + writer.write( + encoder.encode( + JSON.stringify({ + type: 'agent_action', + data: data.data, + messageId: userMessageId, + }) + '\n', + ), + ); + }); let modelStats: ModelStats = { modelName: '', }; diff --git a/src/components/AgentActionDisplay.tsx b/src/components/AgentActionDisplay.tsx new file mode 100644 index 0000000..510fc54 --- /dev/null +++ b/src/components/AgentActionDisplay.tsx @@ -0,0 +1,122 @@ +'use client'; + +import { useState } from 'react'; +import { cn } from '@/lib/utils'; +import { ChevronDown, ChevronUp, Bot } from 'lucide-react'; +import { AgentActionEvent } from './ChatWindow'; + +interface AgentActionDisplayProps { + events: AgentActionEvent[]; + messageId: string; +} + +const AgentActionDisplay = ({ events, messageId }: AgentActionDisplayProps) => { + const [isExpanded, setIsExpanded] = useState(false); + + // Get the most recent event for collapsed view + const latestEvent = events[events.length - 1]; + + // Common function to format action names + const formatActionName = (action: string) => { + return action.replace(/_/g, ' ').toLocaleLowerCase(); + }; + + if (!latestEvent) { + return null; + } + + return ( +
{event.message}
+ )} + + {/* Display relevant details based on event type */} + {event.details && Object.keys(event.details).length > 0 && ( +