neogenia/neo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP - AI Assistant working

Browse Source
This commit is contained in:
Francisco Gaona
2026-01-04 05:42:51 +01:00
parent 86fa7a9564
commit 8b747fd667
6 changed files with 319 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
frontend/components/SoftphoneDialog.vue
View File

@@ -85,39 +85,39 @@
{{ digit }}
</Button>
</div>
</div>
<!-- AI Transcript -->
<div v-if="softphone.transcript.value.length > 0" class="space-y-2">
<h3 class="text-sm font-semibold">Transcript</h3>
<div class="max-h-40 overflow-y-auto p-3 rounded-lg border bg-gray-50 space-y-1">
<p
v-for="(item, index) in softphone.transcript.value.slice(-10)"
:key="index"
class="text-sm"
:class="{ 'text-gray-400': !item.isFinal }"
>
{{ item.text }}
</p>
</div>
</div>
<!-- AI Suggestions -->
<div v-if="softphone.aiSuggestions.value.length > 0" class="space-y-2">
<h3 class="text-sm font-semibold">AI Suggestions</h3>
<div class="space-y-2 max-h-32 overflow-y-auto">
<div
v-for="(suggestion, index) in softphone.aiSuggestions.value.slice(0, 5)"
:key="index"
class="p-2 rounded-lg border text-sm"
:class="{
'bg-blue-50 border-blue-200': suggestion.type === 'response',
'bg-green-50 border-green-200': suggestion.type === 'action',
'bg-purple-50 border-purple-200': suggestion.type === 'insight'
}"
>
<span class="text-xs font-medium uppercase text-gray-600">{{ suggestion.type }}</span>
<p class="mt-1">{{ suggestion.text }}</p>
<!-- AI Suggestions - Show whenever there are suggestions, not just during active call -->
<div v-if="softphone.aiSuggestions.value.length > 0" class="space-y-2">
<h3 class="text-sm font-semibold flex items-center gap-2">
<span>AI Assistant</span>
<span class="px-2 py-0.5 text-xs bg-blue-100 text-blue-700 rounded-full">
{{ softphone.aiSuggestions.value.length }}
</span>
</h3>
<div class="space-y-2 max-h-40 overflow-y-auto">
<div
v-for="(suggestion, index) in softphone.aiSuggestions.value.slice(0, 5)"
:key="index"
class="p-3 rounded-lg border text-sm transition-all"
:class="{
'bg-blue-50 border-blue-200 animate-pulse': suggestion.type === 'response' && index === 0,
'bg-blue-50 border-blue-200': suggestion.type === 'response' && index !== 0,
'bg-green-50 border-green-200 animate-pulse': suggestion.type === 'action' && index === 0,
'bg-green-50 border-green-200': suggestion.type === 'action' && index !== 0,
'bg-purple-50 border-purple-200 animate-pulse': suggestion.type === 'insight' && index === 0,
'bg-purple-50 border-purple-200': suggestion.type === 'insight' && index !== 0
}"
>
<div class="flex items-center gap-2 mb-1">
<span class="text-xs font-semibold uppercase" :class="{
'text-blue-700': suggestion.type === 'response',
'text-green-700': suggestion.type === 'action',
'text-purple-700': suggestion.type === 'insight'
}">{{ suggestion.type }}</span>
<span class="text-xs text-gray-400">just now</span>
</div>
<p class="leading-relaxed">{{ suggestion.text }}</p>
</div>
</div>
</div>
@@ -156,6 +156,11 @@
</Button>
</div>
<!-- Debug: Test AI Suggestions -->
<Button @click="testAiSuggestion" variant="outline" size="sm" class="w-full">
🧪 Test AI Suggestion
</Button>
<!-- Recent Calls -->
<div v-if="softphone.callHistory.value.length > 0" class="space-y-2">
<h3 class="text-sm font-semibold">Recent Calls</h3>
@@ -243,6 +248,21 @@ const handleEndCall = async () => {
}
};
// Debug: Test AI suggestions display
const testAiSuggestion = () => {
console.log('🧪 Testing AI suggestion display');
console.log('Current suggestions:', softphone.aiSuggestions.value);
// Add a test suggestion
softphone.aiSuggestions.value.unshift({
type: 'response',
text: '💡 Test suggestion: This is a test AI suggestion to verify UI display'
});
console.log('After test:', softphone.aiSuggestions.value);
toast.success('Test suggestion added');
};
const handleDtmf = async (digit: string) => {
if (!softphone.currentCall.value) return;

19
frontend/composables/useSoftphone.ts
View File

@@ -259,7 +259,8 @@ export function useSoftphone() {
// Connection events
socket.value.on('connect', () => {
console.log('Softphone WebSocket connected');
console.log('🔌 Softphone WebSocket connected');
console.log('📋 Token payload (check userId):', parseJwt(token));
isConnected.value = true;
// Initialize Twilio Device after WebSocket connects
@@ -288,7 +289,10 @@ export function useSoftphone() {
// AI events
socket.value.on('ai:transcript', handleAiTranscript);
socket.value.on('ai:suggestion', handleAiSuggestion);
socket.value.on('ai:suggestion', (data: any) => {
console.log('🎯 AI Suggestion received:', data.text);
handleAiSuggestion(data);
});
socket.value.on('ai:action', handleAiAction);
isInitialized.value = true;
@@ -509,7 +513,6 @@ export function useSoftphone() {
};
const handleAiTranscript = (data: { transcript: string; isFinal: boolean }) => {
console.log('AI transcript:', data);
transcript.value.push({
text: data.transcript,
isFinal: data.isFinal,
@@ -523,7 +526,6 @@ export function useSoftphone() {
};
const handleAiSuggestion = (data: AiSuggestion) => {
console.log('AI suggestion:', data);
aiSuggestions.value.unshift(data);
// Keep only last 10 suggestions
@@ -532,6 +534,15 @@ export function useSoftphone() {
}
};
// Helper to parse JWT (for debugging)
const parseJwt = (token: string) => {
try {
return JSON.parse(atob(token.split('.')[1]));
} catch (e) {
return null;
}
};
const handleAiAction = (data: any) => {
console.log('AI action:', data);
toast.info(`AI: ${data.action}`);