santanche commited on
Commit
e57db30
·
1 Parent(s): b49293a

feat (interface/model): interface enhancements and biomistral again

Browse files
Files changed (6) hide show
  1. Dockerfile +3 -0
  2. EXAMPLES.md +22 -8
  3. QUICK_START.md +142 -0
  4. README.md +16 -13
  5. server.py +14 -5
  6. static/index.html +53 -13
Dockerfile CHANGED
@@ -45,6 +45,9 @@ sleep 10\n\
45
  echo "Pulling phi3 model..."\n\
46
  ollama pull phi3\n\
47
  \n\
 
 
 
48
  echo "Models ready! Starting FastAPI server..."\n\
49
  exec uvicorn server:app --host 0.0.0.0 --port 7860\n\
50
  ' > /app/start.sh && chmod +x /app/start.sh
 
45
  echo "Pulling phi3 model..."\n\
46
  ollama pull phi3\n\
47
  \n\
48
+ echo "Pulling biomistral model..."\n\
49
+ ollama pull cniongolo/biomistral\n\
50
+ \n\
51
  echo "Models ready! Starting FastAPI server..."\n\
52
  exec uvicorn server:app --host 0.0.0.0 --port 7860\n\
53
  ' > /app/start.sh && chmod +x /app/start.sh
EXAMPLES.md CHANGED
@@ -1,6 +1,8 @@
1
  # Pub/Sub Multi-Agent System - Example Configurations
2
 
3
- **Note**: This deployment uses **phi3** for all agents. phi3 is a capable general-purpose model suitable for most tasks.
 
 
4
 
5
  ## Example 1: Natural Language to SQL Pipeline (using phi3)
6
 
@@ -11,7 +13,7 @@
11
  Given this database schema:
12
  {schema}
13
 
14
- User question: {input}
15
 
16
  Analyze the question and identify:
17
  1. What tables are needed
@@ -34,6 +36,8 @@ Based on this analysis:
34
  Database schema:
35
  {schema}
36
 
 
 
37
  Generate a SQL query that answers the user's question.
38
  Return ONLY the SQL query, no explanation.
39
  ```
@@ -56,22 +60,24 @@ If invalid, return "INVALID: " followed by the corrected query.
56
  ```
57
  - **Model**: phi3
58
  - **Subscribe Topic**: SQL_GENERATED
59
- - **Publish Topic**: RESULT
60
 
61
  ---
62
 
63
  ## Example 2: Medical Symptom Analysis (Using BioMistral)
64
 
 
 
65
  ### Agent 1: Symptom Extractor
66
  - **Title**: Symptom Extractor
67
  - **Prompt**:
68
  ```
69
- Patient report: {input}
70
 
71
  Extract all symptoms mentioned in the patient report.
72
  List them clearly and concisely.
73
  ```
74
- - **Model**: phi3
75
  - **Subscribe Topic**: START
76
  - **Publish Topic**: SYMPTOMS_EXTRACTED
77
 
@@ -89,7 +95,9 @@ Provide a preliminary medical assessment including:
89
 
90
  Note: This is for educational purposes only, not medical advice.
91
  ```
92
- - **Model**: phi3
 
 
93
  - **Subscribe Topic**: SYMPTOMS_EXTRACTED
94
  - **Publish Topic**: ASSESSMENT_COMPLETE
95
 
@@ -227,12 +235,18 @@ Note: This is for educational purposes only.
227
  1. **Clear Subscribe/Publish Topics**: Use descriptive names like "SQL_GENERATED" not just "STEP2"
228
 
229
  2. **Prompt Placeholders**:
 
230
  - Use `{input}` for the message from the subscribed topic
231
  - Use `{schema}` to access the database schema
232
- - Both can be used together
233
 
234
  3. **Model Selection**:
235
- - **phi3**: Versatile general-purpose model suitable for all tasks in this system
 
 
 
 
 
236
 
237
  4. **Chain Design**:
238
  - Start simple with 2-3 agents
 
1
  # Pub/Sub Multi-Agent System - Example Configurations
2
 
3
+ **Note**: This deployment includes **phi3** (general purpose) and **cniongolo/biomistral** (medical/scientific) models.
4
+
5
+ **Important**: Use `{question}` in prompts to access the user's question, `{schema}` for database schema, and `{input}` for messages from subscribed topics.
6
 
7
  ## Example 1: Natural Language to SQL Pipeline (using phi3)
8
 
 
13
  Given this database schema:
14
  {schema}
15
 
16
+ User question: {question}
17
 
18
  Analyze the question and identify:
19
  1. What tables are needed
 
36
  Database schema:
37
  {schema}
38
 
39
+ Original question: {question}
40
+
41
  Generate a SQL query that answers the user's question.
42
  Return ONLY the SQL query, no explanation.
43
  ```
 
60
  ```
61
  - **Model**: phi3
62
  - **Subscribe Topic**: SQL_GENERATED
63
+ - **Publish Topic**: FINAL
64
 
65
  ---
66
 
67
  ## Example 2: Medical Symptom Analysis (Using BioMistral)
68
 
69
+ **User Question**: "Patient has fever, cough, and shortness of breath for 3 days"
70
+
71
  ### Agent 1: Symptom Extractor
72
  - **Title**: Symptom Extractor
73
  - **Prompt**:
74
  ```
75
+ Patient report: {question}
76
 
77
  Extract all symptoms mentioned in the patient report.
78
  List them clearly and concisely.
79
  ```
80
+ - **Model**: cniongolo/biomistral
81
  - **Subscribe Topic**: START
82
  - **Publish Topic**: SYMPTOMS_EXTRACTED
83
 
 
95
 
96
  Note: This is for educational purposes only, not medical advice.
97
  ```
98
+ - **Model**: cniongolo/biomistral
99
+ - **Subscribe Topic**: SYMPTOMS_EXTRACTED
100
+ - **Publish Topic**: FINAL
101
  - **Subscribe Topic**: SYMPTOMS_EXTRACTED
102
  - **Publish Topic**: ASSESSMENT_COMPLETE
103
 
 
235
  1. **Clear Subscribe/Publish Topics**: Use descriptive names like "SQL_GENERATED" not just "STEP2"
236
 
237
  2. **Prompt Placeholders**:
238
+ - Use `{question}` for the user's input question
239
  - Use `{input}` for the message from the subscribed topic
240
  - Use `{schema}` to access the database schema
241
+ - All three can be used together in any prompt
242
 
243
  3. **Model Selection**:
244
+ - **phi3**: Versatile general-purpose model - text analysis, SQL, reasoning, classification
245
+ - **cniongolo/biomistral**: Medical and scientific tasks - diagnosis, clinical reasoning, biomedical analysis
246
+
247
+ 4. **Final Results**:
248
+ - Publish to topic "FINAL" to display results in the Final Result box
249
+ - Only the last agent in your chain should publish to FINAL
250
 
251
  4. **Chain Design**:
252
  - Start simple with 2-3 agents
QUICK_START.md ADDED
@@ -0,0 +1,142 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ # Quick Start Guide - Enhanced Pub/Sub System
2
+
3
+ ## New Features
4
+
5
+ ### 1. User Question Input
6
+ - Located above the agent configuration
7
+ - Enter your question here
8
+ - Available in prompts using `{question}` placeholder
9
+ - Gets published to START topic when you click Execute
10
+
11
+ ### 2. Final Result Display
12
+ - Green-highlighted box at the top right
13
+ - Automatically shows results from agents publishing to "FINAL" topic
14
+ - **Important**: Make your last agent publish to "FINAL" topic to see results here
15
+
16
+ ### 3. BioMistral Model Support
17
+ - Now includes `cniongolo/biomistral` for medical/scientific tasks
18
+ - Use for healthcare, clinical reasoning, biomedical analysis
19
+
20
+ ## How to Use
21
+
22
+ ### Step 1: Enter Your Question
23
+ In the "User Question" box, type your question:
24
+ ```
25
+ What were the top 5 products by revenue in 2024?
26
+ ```
27
+
28
+ ### Step 2: Configure Agents
29
+ Click "Add Agent" and set up your pipeline. Example:
30
+
31
+ **Agent 1:**
32
+ - Title: `SQL Generator`
33
+ - Prompt: `Generate SQL for: {question}\nSchema: {schema}`
34
+ - Model: `phi3`
35
+ - Subscribe: `START`
36
+ - Publish: `SQL_GENERATED`
37
+
38
+ **Agent 2:**
39
+ - Title: `SQL Formatter`
40
+ - Prompt: `Format this SQL nicely: {input}`
41
+ - Model: `phi3`
42
+ - Subscribe: `SQL_GENERATED`
43
+ - Publish: `FINAL` ← **Important!**
44
+
45
+ ### Step 3: Execute
46
+ Click "Execute Pipeline" and watch:
47
+ 1. **Execution Log** shows each step
48
+ 2. **Final Result** displays the output from the agent that published to "FINAL"
49
+
50
+ ## Prompt Placeholders
51
+
52
+ You can use three placeholders in agent prompts:
53
+
54
+ | Placeholder | Contains | Example Use |
55
+ |------------|----------|-------------|
56
+ | `{question}` | User's input question | First agent in chain |
57
+ | `{input}` | Message from subscribed topic | Middle/end agents |
58
+ | `{schema}` | Database schema | Any agent needing schema |
59
+
60
+ ### Example Prompt Using All Three:
61
+ ```
62
+ User asked: {question}
63
+
64
+ Previous analysis: {input}
65
+
66
+ Database schema:
67
+ {schema}
68
+
69
+ Now generate the final SQL query.
70
+ ```
71
+
72
+ ## Medical Analysis Example
73
+
74
+ **User Question:** "Patient has fever 39°C, persistent cough, difficulty breathing"
75
+
76
+ **Agent 1: Symptom Analyzer**
77
+ - Prompt: `Extract symptoms from: {question}`
78
+ - Model: `cniongolo/biomistral`
79
+ - Subscribe: `START`
80
+ - Publish: `SYMPTOMS`
81
+
82
+ **Agent 2: Diagnosis**
83
+ - Prompt: `Based on symptoms: {input}\nProvide differential diagnosis`
84
+ - Model: `cniongolo/biomistral`
85
+ - Subscribe: `SYMPTOMS`
86
+ - Publish: `FINAL`
87
+
88
+ Result appears in the Final Result box automatically!
89
+
90
+ ## Tips for Best Results
91
+
92
+ 1. **Always end with FINAL**: Your last agent should publish to "FINAL" topic to display results
93
+
94
+ 2. **Use {question} in first agent**: The START message contains the user's question
95
+
96
+ 3. **Chain logically**: Each agent builds on the previous:
97
+ ```
98
+ START → Analyze → Generate → Validate → FINAL
99
+ ```
100
+
101
+ 4. **Choose right model**:
102
+ - General tasks (SQL, text): use `phi3`
103
+ - Medical/scientific: use `cniongolo/biomistral`
104
+
105
+ 5. **Test incrementally**: Start with 2 agents, then add more
106
+
107
+ ## Common Patterns
108
+
109
+ ### Pattern 1: Analysis → Generation → Validation
110
+ ```
111
+ Agent 1: Analyze {question} → ANALYZED
112
+ Agent 2: Generate from {input} → GENERATED
113
+ Agent 3: Validate {input} → FINAL
114
+ ```
115
+
116
+ ### Pattern 2: Extract → Process → Summarize
117
+ ```
118
+ Agent 1: Extract data from {question} → EXTRACTED
119
+ Agent 2: Process {input} → PROCESSED
120
+ Agent 3: Summarize {input} → FINAL
121
+ ```
122
+
123
+ ### Pattern 3: Medical Workflow
124
+ ```
125
+ Agent 1: Categorize symptoms from {question} → CATEGORIZED
126
+ Agent 2: Diagnose based on {input} → DIAGNOSIS
127
+ Agent 3: Recommend treatment for {input} → FINAL
128
+ ```
129
+
130
+ ## Troubleshooting
131
+
132
+ **Q: Final Result box is empty**
133
+ - Check if your last agent publishes to "FINAL" (exact capitalization)
134
+
135
+ **Q: Nothing happens when I click Execute**
136
+ - Ensure at least one agent subscribes to "START"
137
+
138
+ **Q: Agent doesn't receive the question**
139
+ - Use `{question}` in the prompt, not `{input}` for the first agent
140
+
141
+ **Q: Chain stops early**
142
+ - Check that each agent's Publish Topic matches the next agent's Subscribe Topic
README.md CHANGED
@@ -35,10 +35,10 @@ This system allows you to create and orchestrate multiple AI agents that communi
35
  ### 1. Agent Configuration
36
  Each agent has:
37
  - **Title**: A descriptive name
38
- - **Prompt**: Template for processing (can use `{schema}` and `{input}` placeholders)
39
  - **Model**: Which LLM to use
40
  - **Subscribe Topic**: Which topic triggers this agent
41
- - **Publish Topic**: Where to publish results
42
 
43
  ### 2. Message Bus
44
  - Agents subscribe to topics during initialization
@@ -48,9 +48,15 @@ Each agent has:
48
 
49
  ### 3. Execution Flow
50
  ```
51
- START Agent1 (subscribes to START) publishes to TOPIC_A
52
- → Agent2 (subscribes to TOPIC_A) → publishes to TOPIC_B
53
- Agent3 (subscribes to TOPIC_B) → publishes to DONE
 
 
 
 
 
 
54
  ```
55
 
56
  ## Example Use Case: NL to SQL Pipeline
@@ -86,14 +92,12 @@ START → Agent1 (subscribes to START) → publishes to TOPIC_A
86
 
87
  ## Supported Models
88
 
89
- This deployment uses **phi3** (3.8B parameters) - a general-purpose model that handles:
90
- - Text analysis and classification
91
- - SQL query generation
92
- - Summarization and extraction
93
- - Question answering
94
- - General reasoning tasks
95
 
96
- The single-model approach ensures fast startup and reliable performance on free-tier resources.
 
 
 
97
 
98
  ## Architecture
99
 
@@ -122,4 +126,3 @@ Perfect for learning:
122
  - Pub/Sub messaging patterns
123
  - Asynchronous agent orchestration
124
  - Dynamic workflow composition
125
-
 
35
  ### 1. Agent Configuration
36
  Each agent has:
37
  - **Title**: A descriptive name
38
+ - **Prompt**: Template for processing (can use `{schema}`, `{input}`, and `{question}` placeholders)
39
  - **Model**: Which LLM to use
40
  - **Subscribe Topic**: Which topic triggers this agent
41
+ - **Publish Topic**: Where to publish results (use "FINAL" for end results)
42
 
43
  ### 2. Message Bus
44
  - Agents subscribe to topics during initialization
 
48
 
49
  ### 3. Execution Flow
50
  ```
51
+ User enters questionPublished to START topic
52
+
53
+ Agent1 (subscribes to START) → publishes to TOPIC_A
54
+
55
+ Agent2 (subscribes to TOPIC_A) → publishes to TOPIC_B
56
+
57
+ Agent3 (subscribes to TOPIC_B) → publishes to FINAL
58
+
59
+ Final result displayed to user
60
  ```
61
 
62
  ## Example Use Case: NL to SQL Pipeline
 
92
 
93
  ## Supported Models
94
 
95
+ This deployment includes two models optimized for different tasks:
 
 
 
 
 
96
 
97
+ - **phi3**: General-purpose model (3.8B parameters) - Great for text analysis, SQL generation, summarization, reasoning
98
+ - **cniongolo/biomistral**: Medical/scientific domain model - Specialized for healthcare and biomedical tasks
99
+
100
+ These models provide a good balance between general and specialized capabilities.
101
 
102
  ## Architecture
103
 
 
126
  - Pub/Sub messaging patterns
127
  - Asynchronous agent orchestration
128
  - Dynamic workflow composition
 
server.py CHANGED
@@ -37,6 +37,7 @@ class Agent(BaseModel):
37
 
38
  class ExecutionRequest(BaseModel):
39
  schema: str
 
40
  agents: List[Agent]
41
 
42
  # Pub/Sub Bus
@@ -78,12 +79,15 @@ def get_llm(model_name: str):
78
  return Ollama(model=model_name, temperature=0.1)
79
 
80
  # Execute agent
81
- async def execute_agent(agent: Agent, input_content: str, schema: str) -> str:
82
  """Execute a single agent with the given input"""
83
  llm = get_llm(agent.model)
84
 
85
  # Replace placeholders in prompt
86
- prompt_text = agent.prompt.replace("{schema}", schema).replace("{input}", input_content)
 
 
 
87
 
88
  # Create and invoke prompt
89
  prompt = PromptTemplate(
@@ -112,8 +116,9 @@ async def execute_pipeline(request: ExecutionRequest) -> AsyncGenerator[str, Non
112
  yield create_event("agent_subscribed", agent=agent.title, topic=agent.subscribe_topic)
113
 
114
  # Publish START message
115
- bus.publish("START", "System initialized")
116
- yield create_event("message_published", topic="START", content="System initialized")
 
117
 
118
  # Process messages in the bus
119
  processed_topics = set()
@@ -146,13 +151,17 @@ async def execute_pipeline(request: ExecutionRequest) -> AsyncGenerator[str, Non
146
 
147
  # Execute agent
148
  try:
149
- result = await execute_agent(agent, message_content, request.schema)
150
  yield create_event("agent_output", content=result)
151
 
152
  # Publish result to agent's publish topic
153
  if agent.publish_topic:
154
  bus.publish(agent.publish_topic, result)
155
  yield create_event("message_published", topic=agent.publish_topic, content=result)
 
 
 
 
156
 
157
  yield create_event("agent_completed", agent=agent.title)
158
 
 
37
 
38
  class ExecutionRequest(BaseModel):
39
  schema: str
40
+ user_question: str = ""
41
  agents: List[Agent]
42
 
43
  # Pub/Sub Bus
 
79
  return Ollama(model=model_name, temperature=0.1)
80
 
81
  # Execute agent
82
+ async def execute_agent(agent: Agent, input_content: str, schema: str, user_question: str) -> str:
83
  """Execute a single agent with the given input"""
84
  llm = get_llm(agent.model)
85
 
86
  # Replace placeholders in prompt
87
+ prompt_text = (agent.prompt
88
+ .replace("{schema}", schema)
89
+ .replace("{input}", input_content)
90
+ .replace("{question}", user_question))
91
 
92
  # Create and invoke prompt
93
  prompt = PromptTemplate(
 
116
  yield create_event("agent_subscribed", agent=agent.title, topic=agent.subscribe_topic)
117
 
118
  # Publish START message
119
+ start_message = request.user_question if request.user_question else "System initialized"
120
+ bus.publish("START", start_message)
121
+ yield create_event("message_published", topic="START", content=start_message)
122
 
123
  # Process messages in the bus
124
  processed_topics = set()
 
151
 
152
  # Execute agent
153
  try:
154
+ result = await execute_agent(agent, message_content, request.schema, request.user_question)
155
  yield create_event("agent_output", content=result)
156
 
157
  # Publish result to agent's publish topic
158
  if agent.publish_topic:
159
  bus.publish(agent.publish_topic, result)
160
  yield create_event("message_published", topic=agent.publish_topic, content=result)
161
+
162
+ # If publishing to FINAL, send special event to frontend
163
+ if agent.publish_topic == "FINAL":
164
+ yield create_event("final_result", content=result)
165
 
166
  yield create_event("agent_completed", agent=agent.title)
167
 
static/index.html CHANGED
@@ -21,11 +21,14 @@
21
  - products (id, name, category, price)
22
  - orders (id, customer_id, order_date, total)
23
  - order_items (id, order_id, product_id, quantity, price)`);
 
 
24
  const [logs, setLogs] = useState('');
25
  const [isExecuting, setIsExecuting] = useState(false);
26
 
27
  const models = [
28
- "phi3"
 
29
  ];
30
 
31
  const addLog = (message, type = 'info') => {
@@ -59,9 +62,13 @@
59
  const executeSystem = async () => {
60
  setIsExecuting(true);
61
  setLogs('');
 
62
 
63
  addLog('Initializing Pub/Sub Agent System...', 'info');
64
  addLog(`Total agents configured: ${agents.length}`, 'info');
 
 
 
65
 
66
  try {
67
  const response = await fetch('/execute', {
@@ -71,6 +78,7 @@
71
  },
72
  body: JSON.stringify({
73
  schema,
 
74
  agents: agents.map(a => ({
75
  title: a.title,
76
  prompt: a.prompt,
@@ -116,6 +124,9 @@
116
  addLog(`Output: ${data.content}`, 'info');
117
  } else if (data.type === 'agent_completed') {
118
  addLog(`Agent "${data.agent}" completed`, 'success');
 
 
 
119
  } else if (data.type === 'no_subscribers') {
120
  addLog(`No subscribers for topic "${data.topic}"`, 'error');
121
  } else if (data.type === 'execution_complete') {
@@ -167,6 +178,19 @@
167
  />
168
  </div>
169
 
 
 
 
 
 
 
 
 
 
 
 
 
 
170
  {/* Agents */}
171
  <div className="bg-white rounded-lg shadow p-4">
172
  <div className="flex justify-between items-center mb-4">
@@ -212,7 +236,7 @@
212
  value={agent.prompt}
213
  onChange={(e) => updateAgent(agent.id, 'prompt', e.target.value)}
214
  className="w-full h-24 p-2 border border-gray-300 rounded text-sm font-mono focus:ring-2 focus:ring-purple-500"
215
- placeholder="Enter prompt template (use {schema}, {input}, etc.)"
216
  />
217
  </div>
218
 
@@ -283,17 +307,33 @@
283
  </button>
284
  </div>
285
 
286
- {/* Right Column - Execution Log */}
287
- <div className="bg-white rounded-lg shadow p-4">
288
- <label className="block text-sm font-semibold text-gray-700 mb-2">
289
- 📋 Execution Log
290
- </label>
291
- <textarea
292
- value={logs}
293
- readOnly
294
- className="w-full h-[calc(100vh-200px)] p-3 border border-gray-300 rounded-lg font-mono text-xs bg-gray-50 focus:outline-none overflow-auto"
295
- placeholder="Execution logs will appear here when you run the pipeline..."
296
- />
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
297
  </div>
298
  </div>
299
  </div>
 
21
  - products (id, name, category, price)
22
  - orders (id, customer_id, order_date, total)
23
  - order_items (id, order_id, product_id, quantity, price)`);
24
+ const [userQuestion, setUserQuestion] = useState('');
25
+ const [finalResult, setFinalResult] = useState('');
26
  const [logs, setLogs] = useState('');
27
  const [isExecuting, setIsExecuting] = useState(false);
28
 
29
  const models = [
30
+ "phi3",
31
+ "cniongolo/biomistral"
32
  ];
33
 
34
  const addLog = (message, type = 'info') => {
 
62
  const executeSystem = async () => {
63
  setIsExecuting(true);
64
  setLogs('');
65
+ setFinalResult('');
66
 
67
  addLog('Initializing Pub/Sub Agent System...', 'info');
68
  addLog(`Total agents configured: ${agents.length}`, 'info');
69
+ if (userQuestion) {
70
+ addLog(`User Question: ${userQuestion}`, 'info');
71
+ }
72
 
73
  try {
74
  const response = await fetch('/execute', {
 
78
  },
79
  body: JSON.stringify({
80
  schema,
81
+ user_question: userQuestion,
82
  agents: agents.map(a => ({
83
  title: a.title,
84
  prompt: a.prompt,
 
124
  addLog(`Output: ${data.content}`, 'info');
125
  } else if (data.type === 'agent_completed') {
126
  addLog(`Agent "${data.agent}" completed`, 'success');
127
+ } else if (data.type === 'final_result') {
128
+ addLog(`\n=== FINAL RESULT ===`, 'success');
129
+ setFinalResult(data.content);
130
  } else if (data.type === 'no_subscribers') {
131
  addLog(`No subscribers for topic "${data.topic}"`, 'error');
132
  } else if (data.type === 'execution_complete') {
 
178
  />
179
  </div>
180
 
181
+ {/* User Question */}
182
+ <div className="bg-white rounded-lg shadow p-4">
183
+ <label className="block text-sm font-semibold text-gray-700 mb-2">
184
+ 💬 User Question
185
+ </label>
186
+ <textarea
187
+ value={userQuestion}
188
+ onChange={(e) => setUserQuestion(e.target.value)}
189
+ className="w-full h-24 p-3 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-purple-500 focus:border-transparent"
190
+ placeholder="Enter your question (available as {question} in prompts)..."
191
+ />
192
+ </div>
193
+
194
  {/* Agents */}
195
  <div className="bg-white rounded-lg shadow p-4">
196
  <div className="flex justify-between items-center mb-4">
 
236
  value={agent.prompt}
237
  onChange={(e) => updateAgent(agent.id, 'prompt', e.target.value)}
238
  className="w-full h-24 p-2 border border-gray-300 rounded text-sm font-mono focus:ring-2 focus:ring-purple-500"
239
+ placeholder="Use {schema}, {input}, {question} as placeholders"
240
  />
241
  </div>
242
 
 
307
  </button>
308
  </div>
309
 
310
+ {/* Right Column - Logs and Results */}
311
+ <div className="space-y-4">
312
+ {/* Final Result */}
313
+ <div className="bg-white rounded-lg shadow p-4">
314
+ <label className="block text-sm font-semibold text-gray-700 mb-2">
315
+ ✨ Final Result (from FINAL topic)
316
+ </label>
317
+ <textarea
318
+ value={finalResult}
319
+ readOnly
320
+ className="w-full h-48 p-3 border border-gray-300 rounded-lg text-sm bg-green-50 focus:outline-none overflow-auto"
321
+ placeholder="The result from agents publishing to 'FINAL' topic will appear here..."
322
+ />
323
+ </div>
324
+
325
+ {/* Execution Log */}
326
+ <div className="bg-white rounded-lg shadow p-4">
327
+ <label className="block text-sm font-semibold text-gray-700 mb-2">
328
+ 📋 Execution Log
329
+ </label>
330
+ <textarea
331
+ value={logs}
332
+ readOnly
333
+ className="w-full h-[calc(100vh-500px)] p-3 border border-gray-300 rounded-lg font-mono text-xs bg-gray-50 focus:outline-none overflow-auto"
334
+ placeholder="Execution logs will appear here when you run the pipeline..."
335
+ />
336
+ </div>
337
  </div>
338
  </div>
339
  </div>