- {/* Messages area - Takes exactly 80% of the height */}
-
+ {/* Main layout with fixed input at bottom */}
+
{/* Adjust height as needed */}
+ {/* Chat messages area */}
+
{processedMessages.length === 0 ? (
+
{filterMessages(processedMessages).map(msg => (
- {/* Input area - Fixed at 20% of the container height */}
-
+ {/* Fixed input area - Always at bottom */}
+
{conversationStatus === "idle" || conversationStatus === "active" ? (
@@ -509,10 +519,12 @@ The agents are still formulating their responses. I'll provide a summary once th
});
// Create summary points for each agent
- const summaryPoints = Object.entries(agentMessages).map(([agentId, msgs]) => {
- const agentName = msgs[0].agentName || 'Agent';
- return `- **${agentName}** highlighted the importance of ${getKeyPointFromMessage(msgs[0].content || '')}`;
- }).join('\n');
+ const summaryPoints = Object.entries(agentMessages)
+ .filter(([agentId]) => agentId !== 'coordinator' && agentId !== '')
+ .map(([agentId, msgs]) => {
+ const agentName = msgs[0].agentName || 'Agent';
+ return `- **${agentName}** highlighted the importance of ${getKeyPointFromMessage(msgs[0].content || '')}`;
+ }).join('\n');
return `
### Summary
diff --git a/src/components/chat/ChatMessage.tsx b/src/components/chat/ChatMessage.tsx
index ddf4fc9..e10f75f 100644
--- a/src/components/chat/ChatMessage.tsx
+++ b/src/components/chat/ChatMessage.tsx
@@ -90,7 +90,7 @@ export function ChatMessage({ message, showFeedback = true }: ChatMessageProps)
{String(children).replace(/\n$/, '')}
@@ -103,7 +103,7 @@ export function ChatMessage({ message, showFeedback = true }: ChatMessageProps)
);
},
p({ children }: any) {
- return {children} ;
+ return {children} ;
},
h3({ children }: any) {
- return 
;
+ },
+ pre({ children, ...props }: any) {
+ return
{children}
; + return{children}
; }, ul({ children }: any) { return- {children}
- {children}
{children}
; + return{children}
; }, h4({ children }: any) { - return{children}
; + return{children}
; + }, + // Adding these to handle other types of content + img({ src, alt, ...props }: any) { + return{children};
+ },
+ table({ children, ...props }: any) {
+ return (
+
+
+ {children}
+
+
+ );
},
};
@@ -152,7 +168,7 @@ export function ChatMessage({ message, showFeedback = true }: ChatMessageProps)
>
-
{message.content}
+{message.content}
@@ -184,12 +200,12 @@ export function ChatMessage({ message, showFeedback = true }: ChatMessageProps)
{message.agentAvatar || "👨💼"}
-
+
{/* Added min-width:0 to enable text wrapping */}
-
System
@@ -201,7 +217,7 @@ export function ChatMessage({ message, showFeedback = true }: ChatMessageProps)
) : (
- {message.agentName || "Coordinator"}
+{message.agentName || "Coordinator"}
+
{message.content}
@@ -228,13 +244,13 @@ export function ChatMessage({ message, showFeedback = true }: ChatMessageProps)
{message.agentAvatar || message.agentName?.[0] || "A"}
-
+
{/* Added min-width:0 to enable text wrapping */}
-
+
+
{message.agentName || "Agent"}
{message.isPending && (
-
+
●
Typing...
@@ -242,7 +258,7 @@ export function ChatMessage({ message, showFeedback = true }: ChatMessageProps)
@@ -253,7 +269,7 @@ export function ChatMessage({ message, showFeedback = true }: ChatMessageProps)
) : (
-
+
{message.content}
diff --git a/src/lib/environment.ts b/src/lib/environment.ts
index 990a8af..e991645 100644
--- a/src/lib/environment.ts
+++ b/src/lib/environment.ts
@@ -89,6 +89,13 @@ export const environmentConfig = {
default: '',
environmentVariable: true
},
+ // Gemini
+ NEXT_PUBLIC_GEMINI_API_KEY: {
+ description: 'Gemini API Key',
+ required: true,
+ default: '',
+ environmentVariable: true
+ },
// n8n
NEXT_PUBLIC_AGENT_API_URL: {
@@ -141,7 +148,7 @@ export function checkRequiredEnvironmentVariables(backend: string): {
missingVars.push('NEXT_PUBLIC_ANTHROPIC_API_KEY');
}
break;
-
+
case 'azure':
if (!process.env.NEXT_PUBLIC_AZURE_OPENAI_API_KEY) {
missingVars.push('NEXT_PUBLIC_AZURE_OPENAI_API_KEY');
@@ -151,6 +158,12 @@ export function checkRequiredEnvironmentVariables(backend: string): {
}
break;
+ case 'gemini':
+ if (!process.env.NEXT_PUBLIC_GEMINI_API_KEY) {
+ missingVars.push('NEXT_PUBLIC_GEMINI_API_KEY');
+ }
+ break;
+
case 'n8n':
// n8n variables are optional, but we check them anyway
if (!process.env.NEXT_PUBLIC_AGENT_API_URL) {
diff --git a/src/services/connectionValidator.ts b/src/services/connectionValidator.ts
index a79b1d6..9cfdec2 100644
--- a/src/services/connectionValidator.ts
+++ b/src/services/connectionValidator.ts
@@ -4,6 +4,7 @@ import { ApiSettings } from '@/types';
type ConnectionResult = {
success: boolean;
message: string;
+ hasGemini2Flash?: boolean; // Optional property for Gemini validation
};
/**
@@ -75,7 +76,7 @@ export const connectionValidator = {
'Accept': 'application/json',
}
});
-
+
if (!response.ok) {
const error = await response.json();
return {
@@ -158,7 +159,62 @@ export const connectionValidator = {
};
}
},
-
+
+ /**
+ * Validate Gemini connection
+ */
+ async validateGemini(): Promise {
+ const apiKey = process.env.NEXT_PUBLIC_GEMINI_API_KEY;
+
+ console.log('Validating Gemini API key in connectionValidator service');
+ console.log('Gemini API key exists:', !!apiKey);
+
+ if (!apiKey || apiKey.trim() === '') {
+ console.error('Gemini API key not found in environment variables');
+ return {
+ success: false,
+ message: 'Gemini API key not found in environment variables'
+ };
+ }
+
+ try {
+ console.log('Calling Gemini validation API endpoint');
+ // Use a proxy API route for Gemini validation
+ const response = await fetch('/api/gemini/validate', {
+ method: 'GET'
+ });
+
+ console.log(`Gemini validation API response status: ${response.status}`);
+
+ if (!response.ok) {
+ const error = await response.json().catch(e => {
+ console.error('Error parsing Gemini validation error response:', e);
+ return { message: 'Unknown error' };
+ });
+ console.error('Gemini validation API error:', error);
+ return {
+ success: false,
+ message: `Gemini API key is invalid: ${error.message || response.statusText}`
+ };
+ }
+
+ const result = await response.json();
+ console.log('Gemini validation API success response:', result);
+
+ return {
+ success: true,
+ message: result.message || 'Gemini API key is valid',
+ hasGemini2Flash: result.hasGemini2Flash
+ };
+ } catch (error) {
+ console.error('Gemini validation error:', error);
+ return {
+ success: false,
+ message: `Gemini validation error: ${error instanceof Error ? error.message : 'Unknown error'}`
+ };
+ }
+ },
+
/**
* Validate n8n workflow with specific model type
*/
@@ -248,6 +304,8 @@ export const connectionValidator = {
return this.validateOllama();
case 'claude':
return this.validateClaude();
+ case 'gemini':
+ return this.validateGemini();
default:
return { success: false, message: `Unknown backend type: ${backendType}` };
}
diff --git a/src/services/n8nService.ts b/src/services/n8nService.ts
index adde2a2..fa5f30b 100644
--- a/src/services/n8nService.ts
+++ b/src/services/n8nService.ts
@@ -10,6 +10,7 @@ const DEFAULT_WORKFLOW_ENDPOINT = process.env.NEXT_PUBLIC_N8N_DEFAULT_WORKFLOW |
const OPENAI_WORKFLOW_ENDPOINT = process.env.NEXT_PUBLIC_N8N_OPENAI_WORKFLOW || '/webhook/dataengineering-common';
const OLLAMA_WORKFLOW_ENDPOINT = process.env.NEXT_PUBLIC_N8N_OLLAMA_WORKFLOW || '/webhook/dataengineering-common';
const CLAUDE_WORKFLOW_ENDPOINT = process.env.NEXT_PUBLIC_N8N_CLAUDE_WORKFLOW || '/webhook/dataengineering-common';
+const GEMINI_WORKFLOW_ENDPOINT = process.env.NEXT_PUBLIC_N8N_GEMINI_WORKFLOW || '/webhook/dataengineering-common';
// Define workflow endpoints mapping
const WORKFLOW_ENDPOINTS: Record = {
@@ -17,6 +18,7 @@ const WORKFLOW_ENDPOINTS: Record = {
'openai': OPENAI_WORKFLOW_ENDPOINT,
'ollama': OLLAMA_WORKFLOW_ENDPOINT,
'claude': CLAUDE_WORKFLOW_ENDPOINT,
+ 'gemini': GEMINI_WORKFLOW_ENDPOINT,
'demo': DEFAULT_WORKFLOW_ENDPOINT // Fallback for demo mode
};
@@ -64,12 +66,12 @@ export const n8nService = {
// Otherwise, try to use the real n8n service
try {
- // Get the modelType - should be one of: 'default', 'openai', 'ollama', 'claude', 'demo'
+ // Get the modelType - should be one of: 'default', 'openai', 'ollama', 'claude', 'gemini', 'demo'
// First try to use n8nWorkflowType from apiSettings since it should have the correct type
let modelType = apiSettings.n8nWorkflowType || "default";
// Validate modelType to ensure it's one of the expected values
- const validModelTypes = ['default', 'openai', 'ollama', 'claude', 'demo'];
+ const validModelTypes = ['default', 'openai', 'ollama', 'claude', 'gemini', 'demo'];
if (!validModelTypes.includes(modelType)) {
console.warn(`Invalid modelType "${modelType}", falling back to "default"`);
modelType = "default";
diff --git a/src/types/index.ts b/src/types/index.ts
index 98c8c7c..a808295 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -112,7 +112,7 @@ export interface UserSettings {
maxHistoryItems: number;
}
-export type N8nWorkflowType = 'default' | 'openai' | 'ollama' | 'claude' | 'demo';
+export type N8nWorkflowType = 'default' | 'openai' | 'ollama' | 'claude' | 'gemini' | 'demo';
// Then in your ApiSettings interface, update the n8nWorkflowType property to use this type:
export interface ApiSettings {
@@ -234,6 +234,7 @@ export interface EnvVariables {
NEXT_PUBLIC_ANTHROPIC_API_KEY: string;
NEXT_PUBLIC_AZURE_OPENAI_API_KEY: string;
NEXT_PUBLIC_AZURE_OPENAI_ENDPOINT: string;
+ NEXT_PUBLIC_GEMINI_API_KEY: string;
}
// Data engineering specific types