Research & Agent Chat UI
Relevant source files
The following files were used as context for generating this wiki page:
- apps/web/src/components/research/agent-panel.tsx
- apps/web/src/components/research/research-chat-message.tsx
- apps/web/src/app/research/page.tsx
- apps/web/src/components/research/research-input.tsx
- apps/web/src/components/research/research-sidebar.tsx
- packages/ui/src/components/ai-input.tsx
- apps/server/src/agents/prompts/system.ts
The Research & Agent Chat UI is a central component of the Poneglyph platform, designed to facilitate humanitarian intelligence analysis through interactive AI-driven workflows. It provides researchers with a collaborative environment where they can query internal humanitarian datasets, conduct web-based research, and visualize findings in real-time.
The system is structured as a multi-panel dashboard containing a sidebar for session management, a main conversation thread for research logs, and an specialized input area for agent interaction. It leverages an orchestrator AI model to synthesize information from various tools, including internal database searches and deep web investigations.
Sources: apps/web/src/app/research/page.tsx:1-125, apps/server/src/agents/prompts/system.ts:1-41
Core UI Architecture
The research interface is a full-screen application utilizing a sidebar-content layout. The main content area is responsible for displaying the scrollable conversation thread, status logs, and media previews generated during research sessions.
Layout Components
| Component | Description | File Path |
|---|---|---|
ResearchPage | Main page container managing the overall layout and scroll area. | apps/web/src/app/research/page.tsx |
ResearchSidebar | Manages research history and navigation, categorized by time (e.g., "This Week"). | apps/web/src/components/research/research-sidebar.tsx |
ResearchInput | Advanced input field with agent mode selection and model configuration. | apps/web/src/components/research/research-input.tsx |
AgentPanel | A floating/docked panel for direct file uploads and chat-based data analysis. | apps/web/src/components/research/agent-panel.tsx |
Sources: apps/web/src/app/research/page.tsx:11-20, apps/web/src/components/research/research-sidebar.tsx:4-70, apps/web/src/components/research/agent-panel.tsx:21-166
Agent Communication & Message Flow
The system handles multiple types of communication: user queries, agent responses, and status logs that track background processing (e.g., file exploration).
Interaction Sequence
The following diagram illustrates the lifecycle of a research query, from user input to the agent's tool execution and final synthesized response.
The Orchestrator Agent is guided by a system prompt to prefer parallel execution of internal database searches and web searches to ensure comprehensive results.
Sources: apps/server/src/agents/prompts/system.ts:1-41, apps/web/src/app/research/page.tsx:24-118
Message Structures
The interface utilizes specific data structures to manage the state of the conversation.
// From apps/web/src/components/research/agent-panel.tsx
interface Message {
id: string;
role: "user" | "agent";
content: string;
files?: File[];
timestamp: Date;
}
Sources: apps/web/src/components/research/agent-panel.tsx:9-15
Research Tooling & Modes
The UI provides granular control over the AI's behavior through the ResearchInput component. Users can toggle between different execution modes and underlying LLM versions.
Agent Configuration Options
The input area allows for the following configurations:
- Modes: Agent Mode, Direct Mode, and Vision Mode.
- Model Selection: Options include specialized versions like "Opus 4.6" (best), "Sonnet 4.5" (fast), and "Haiku 4.1" (compact).
- Specialized Tools:
- searchDatabase: Queries humanitarian field reports and NGO datasets.
- webSearch: Real-time grounding via Gemini.
- deepResearch: Multi-step investigation using Tavily for complex synthesis.
Sources: apps/web/src/components/research/research-input.tsx:18-63, apps/server/src/agents/prompts/system.ts:13-33
Data Upload & Processing
The AgentPanel provides an interactive zone for data ingestion. It supports drag-and-drop file uploads specifically for data analysis tasks.
File Ingestion Flow
The panel supports standard data formats such as .csv, .json, .xlsx, and .xls.
Sources: apps/web/src/components/research/agent-panel.tsx:82-113, apps/web/src/components/research/agent-panel.tsx:154-155
Visual Components & Status Logging
The Research UI utilizes custom components to provide feedback during long-running AI tasks.
- ResearchStatusLog: Displays duration and activities, such as "Explored 12 files" or "Processed screen recording".
- Media Previews: Placeholder windows simulate the results of research dashboard builds, including fake app window headers and sidebar structures.
- AI Input Primitives: The system uses
AiInputfrom the shared UI package, which features advanced controls for "DeepMind" and "Search" toggles.
Sources: apps/web/src/app/research/page.tsx:29-55, packages/ui/src/components/ai-input.tsx:170-220
Summary
The Research & Agent Chat UI serves as the primary workspace for analysts in the Poneglyph ecosystem. By combining structured messaging, real-time status logging, and parallelized tool execution (Internal DB and Web Search), it enables efficient humanitarian data synthesis and visualization. Its architecture emphasizes clear separation between session history, research execution, and interactive data analysis.