@memberjunction/ng-conversations 2.106.0 → 2.108.0

package/dist/lib/components/message/message-input.component.js

@@ -19,8 +19,12 @@ function MessageInputComponent_div_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 10);
     i0.ɵɵelement(1, "i", 11);
     i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3, "AI is responding...");
+    i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r1.processingMessage);
 } }
 export class MessageInputComponent {
     dialogService;
@@ -48,6 +52,7 @@ export class MessageInputComponent {
     messageText = '';
     isSending = false;
     isProcessing = false; // True when waiting for agent/naming response
+    processingMessage = 'AI is responding...'; // Message shown during processing
     converationManagerAgent = null;
     // Mention autocomplete state
     showMentionDropdown = false;
@@ -60,6 +65,8 @@ export class MessageInputComponent {
     pushStatusSubscription;
     // Track active task execution message IDs for real-time updates
     activeTaskExecutionMessageIds = new Set();
+    // Track completion timestamps to prevent race conditions with late progress updates
+    completionTimestamps = new Map();
     constructor(dialogService, toastService, agentService, conversationState, dataCache, activeTasks, mentionAutocomplete, mentionParser) {
         this.dialogService = dialogService;
         this.toastService = toastService;
@@ -297,95 +304,210 @@ export class MessageInputComponent {
         if (!this.canSend)
             return;
         this.isSending = true;
+        try {
+            const messageDetail = await this.createMessageDetail();
+            const saved = await messageDetail.Save();
+            if (saved) {
+                await this.handleSuccessfulSend(messageDetail);
+            }
+            else {
+                this.handleSendFailure(messageDetail);
+            }
+        }
+        catch (error) {
+            this.handleSendError(error);
+        }
+        finally {
+            this.isSending = false;
+        }
+    }
+    /**
+     * Send a message with custom text WITHOUT modifying the visible messageText input
+     * Used for suggested responses - sends message silently without affecting user's current input
+     */
+    async sendMessageWithText(text) {
+        if (!text || !text.trim()) {
+            return;
+        }
+        if (this.isSending) {
+            return;
+        }
+        this.isSending = true;
         try {
             const detail = await this.dataCache.createConversationDetail(this.currentUser);
             detail.ConversationID = this.conversationId;
-            detail.Message = this.messageText.trim();
+            detail.Message = text.trim();
             detail.Role = 'User';
-            // Parse mentions from message (not stored, used for routing only)
-            const mentionResult = this.mentionParser.parseMentions(detail.Message, this.mentionAutocomplete.getAvailableAgents(), this.mentionAutocomplete.getAvailableUsers());
-            console.log('[MentionInput] Parsing message for routing:', detail.Message);
-            console.log('[MentionInput] Found mentions:', mentionResult);
-            console.log('[MentionInput] Agent mention:', mentionResult.agentMention);
-            // Set ParentID if this is a thread reply
             if (this.parentMessageId) {
                 detail.ParentID = this.parentMessageId;
             }
             const saved = await detail.Save();
             if (saved) {
                 this.messageSent.emit(detail);
-                this.messageText = '';
-                // Check if this is the first message in the conversation
+                const mentionResult = this.parseMentionsFromMessage(detail.Message);
                 const isFirstMessage = this.conversationHistory.length === 0;
-                // Determine routing: @mention > last agent context > Sage
-                if (mentionResult.agentMention) {
-                    // Direct @mention - skip Sage, invoke agent directly
-                    console.log('🎯 Direct @mention detected, bypassing Sage');
-                    if (isFirstMessage) {
-                        Promise.all([
-                            this.invokeAgentDirectly(detail, mentionResult.agentMention, this.conversationId),
-                            this.nameConversation(detail.Message)
-                        ]);
-                    }
-                    else {
-                        this.invokeAgentDirectly(detail, mentionResult.agentMention, this.conversationId);
-                    }
-                }
-                else {
-                    // Check if user is replying to an agent (implicit continuation)
-                    const lastAIMessage = this.conversationHistory
-                        .slice()
-                        .reverse()
-                        .find(msg => msg.Role === 'AI' &&
-                        msg.AgentID &&
-                        msg.AgentID !== this.converationManagerAgent?.ID);
-                    if (lastAIMessage && lastAIMessage.AgentID) {
-                        // Continue with same agent - skip Sage
-                        console.log('🔄 Implicit continuation detected, continuing with last agent');
-                        if (isFirstMessage) {
-                            Promise.all([
-                                this.continueWithAgent(detail, lastAIMessage.AgentID, this.conversationId),
-                                this.nameConversation(detail.Message)
-                            ]);
-                        }
-                        else {
-                            this.continueWithAgent(detail, lastAIMessage.AgentID, this.conversationId);
-                        }
-                    }
-                    else {
-                        // No context - use Sage
-                        console.log('🤖 No agent context, using Sage');
-                        if (isFirstMessage) {
-                            Promise.all([
-                                this.processMessageThroughAgent(detail, mentionResult),
-                                this.nameConversation(detail.Message)
-                            ]);
-                        }
-                        else {
-                            this.processMessageThroughAgent(detail, mentionResult);
-                        }
-                    }
-                }
-                // Focus back on textarea
-                setTimeout(() => {
-                    if (this.messageTextarea && this.messageTextarea.nativeElement) {
-                        this.messageTextarea.nativeElement.focus();
-                    }
-                }, 100);
+                await this.routeMessage(detail, mentionResult, isFirstMessage);
             }
             else {
-                console.error('Failed to send message:', detail.LatestResult?.Message);
-                this.toastService.error('Failed to send message. Please try again.');
+                this.handleSendFailure(detail);
             }
         }
         catch (error) {
-            console.error('Error sending message:', error);
-            this.toastService.error('Error sending message. Please try again.');
+            this.handleSendError(error);
         }
         finally {
             this.isSending = false;
         }
     }
+    /**
+     * Creates and configures a new conversation detail message
+     */
+    async createMessageDetail() {
+        const detail = await this.dataCache.createConversationDetail(this.currentUser);
+        detail.ConversationID = this.conversationId;
+        detail.Message = this.messageText.trim();
+        detail.Role = 'User';
+        if (this.parentMessageId) {
+            detail.ParentID = this.parentMessageId;
+        }
+        return detail;
+    }
+    /**
+     * Handles successful message send - routes to appropriate agent
+     */
+    async handleSuccessfulSend(messageDetail) {
+        this.messageSent.emit(messageDetail);
+        this.messageText = '';
+        const mentionResult = this.parseMentionsFromMessage(messageDetail.Message);
+        const isFirstMessage = this.conversationHistory.length === 0;
+        await this.routeMessage(messageDetail, mentionResult, isFirstMessage);
+        this.refocusTextarea();
+    }
+    /**
+     * Parses mentions from the message for routing decisions
+     */
+    parseMentionsFromMessage(message) {
+        const mentionResult = this.mentionParser.parseMentions(message, this.mentionAutocomplete.getAvailableAgents(), this.mentionAutocomplete.getAvailableUsers());
+        return mentionResult;
+    }
+    /**
+     * Routes the message to the appropriate agent or Sage based on context
+     * Priority: @mention > intent check > Sage
+     */
+    async routeMessage(messageDetail, mentionResult, isFirstMessage) {
+        // Priority 1: Direct @mention
+        if (mentionResult.agentMention) {
+            await this.handleDirectMention(messageDetail, mentionResult.agentMention, isFirstMessage);
+            return;
+        }
+        // Priority 2: Check for previous agent with intent check
+        const lastAgentId = this.findLastNonSageAgentId();
+        if (lastAgentId) {
+            await this.handleAgentContinuity(messageDetail, lastAgentId, mentionResult, isFirstMessage);
+            return;
+        }
+        // Priority 3: No context - use Sage
+        await this.handleNoAgentContext(messageDetail, mentionResult, isFirstMessage);
+    }
+    /**
+     * Handles routing when user directly mentions an agent with @
+     */
+    async handleDirectMention(messageDetail, agentMention, isFirstMessage) {
+        console.log('🎯 Direct @mention detected, bypassing Sage');
+        await this.executeRouteWithNaming(() => this.invokeAgentDirectly(messageDetail, agentMention, this.conversationId), messageDetail.Message, isFirstMessage);
+    }
+    /**
+     * Handles routing when there's a previous agent - checks intent first
+     */
+    async handleAgentContinuity(messageDetail, lastAgentId, mentionResult, isFirstMessage) {
+        console.log('🔍 Previous agent found, checking continuity intent...');
+        const intent = await this.checkContinuityIntent(lastAgentId, messageDetail.Message);
+        if (intent === 'YES') {
+            console.log('✅ Intent check: YES - continuing with previous agent');
+            await this.executeRouteWithNaming(() => this.continueWithAgent(messageDetail, lastAgentId, this.conversationId), messageDetail.Message, isFirstMessage);
+        }
+        else {
+            console.log(`🤖 Intent check: ${intent} - routing through Sage for evaluation`);
+            await this.executeRouteWithNaming(() => this.processMessageThroughAgent(messageDetail, mentionResult), messageDetail.Message, isFirstMessage);
+        }
+    }
+    /**
+     * Handles routing when there's no previous agent context
+     */
+    async handleNoAgentContext(messageDetail, mentionResult, isFirstMessage) {
+        console.log('🤖 No agent context, using Sage');
+        await this.executeRouteWithNaming(() => this.processMessageThroughAgent(messageDetail, mentionResult), messageDetail.Message, isFirstMessage);
+    }
+    /**
+     * Finds the last agent ID that isn't Sage
+     */
+    findLastNonSageAgentId() {
+        const lastAIMessage = this.conversationHistory
+            .slice()
+            .reverse()
+            .find(msg => msg.Role === 'AI' &&
+            msg.AgentID &&
+            msg.AgentID !== this.converationManagerAgent?.ID);
+        return lastAIMessage?.AgentID || null;
+    }
+    /**
+     * Checks if message should continue with the previous agent
+     * Shows UI indicator during check
+     */
+    async checkContinuityIntent(agentId, message) {
+        this.processingMessage = 'Analyzing intent...';
+        this.isProcessing = true;
+        try {
+            const intent = await this.agentService.checkAgentContinuityIntent(agentId, message, this.conversationHistory);
+            return intent;
+        }
+        catch (error) {
+            console.error('❌ Intent check failed, defaulting to UNSURE:', error);
+            return 'UNSURE';
+        }
+        finally {
+            this.processingMessage = 'AI is responding...';
+            this.isProcessing = false;
+        }
+    }
+    /**
+     * Executes a routing function, optionally with conversation naming for first message
+     */
+    async executeRouteWithNaming(routeFunction, userMessage, isFirstMessage) {
+        if (isFirstMessage) {
+            await Promise.all([
+                routeFunction(),
+                this.nameConversation(userMessage)
+            ]);
+        }
+        else {
+            await routeFunction();
+        }
+    }
+    /**
+     * Returns focus to the message textarea
+     */
+    refocusTextarea() {
+        setTimeout(() => {
+            if (this.messageTextarea?.nativeElement) {
+                this.messageTextarea.nativeElement.focus();
+            }
+        }, 100);
+    }
+    /**
+     * Handles message send failure
+     */
+    handleSendFailure(messageDetail) {
+        console.error('Failed to send message:', messageDetail.LatestResult?.Message);
+        this.toastService.error('Failed to send message. Please try again.');
+    }
+    /**
+     * Handles message send error
+     */
+    handleSendError(error) {
+        console.error('Error sending message:', error);
+        this.toastService.error('Error sending message. Please try again.');
+    }
     /**
      * Safe save for ConversationDetail - prevents overwrites of completed/errored messages
      * Use this ONLY in progress update paths to prevent race conditions
@@ -408,9 +530,23 @@ export class MessageInputComponent {
      * IMPORTANT: Filters by agentRunId to prevent cross-contamination when multiple agents run in parallel
      */
     createProgressCallback(conversationDetail, agentName) {
+        // Use closure to capture the agent run ID from the first progress message
+        // This allows us to filter out progress messages from other concurrent agents
+        let capturedAgentRunId = null;
         return async (progress) => {
             // Extract agentRunId from progress metadata
             const progressAgentRunId = progress.metadata?.agentRunId;
+            // Capture the agent run ID from the first progress message
+            if (!capturedAgentRunId && progressAgentRunId) {
+                capturedAgentRunId = progressAgentRunId;
+                console.log(`[${agentName}] 📌 Captured agent run ID: ${capturedAgentRunId} for conversation detail: ${conversationDetail.ID}`);
+            }
+            // Filter out progress messages from other concurrent agents
+            // This prevents cross-contamination when multiple agents run in parallel
+            if (capturedAgentRunId && progressAgentRunId && progressAgentRunId !== capturedAgentRunId) {
+                console.log(`[${agentName}] 🚫 Ignoring progress from different agent run (expected: ${capturedAgentRunId}, got: ${progressAgentRunId})`);
+                return;
+            }
             // Format progress message with visual indicator
             const progressText = progress.message;
             // Update the active task with progress details (if it exists)
@@ -419,10 +555,16 @@ export class MessageInputComponent {
             try {
                 if (conversationDetail) {
                     console.log(`[${agentName}] Got conversation detail from cache - Status: ${conversationDetail.Status}, ID: ${conversationDetail.ID}`);
-                    // Skip progress updates if message is already complete
-                    // Since we're using the cached instance, this check sees the ACTUAL current state
-                    if (conversationDetail.Status === 'Complete') {
-                        console.log(`[${agentName}] ⛔ Skipping progress update - message already complete`);
+                    // Check 1: Skip if message is already complete or errored
+                    if (conversationDetail.Status === 'Complete' || conversationDetail.Status === 'Error') {
+                        console.log(`[${agentName}] ⛔ Skipping progress update - message status is ${conversationDetail.Status}`);
+                        return;
+                    }
+                    // Check 2: Skip if message was marked as completed (prevents race condition)
+                    // Once a message is marked complete, we reject ALL further progress updates
+                    const completionTime = this.completionTimestamps.get(conversationDetail.ID);
+                    if (completionTime) {
+                        console.log(`[${agentName}] ⛔ Skipping progress update - message was marked complete at ${completionTime}`);
                         return;
                     }
                     // Emit agentRunId if we have it (for parent to track)
@@ -492,7 +634,8 @@ export class MessageInputComponent {
                 taskId = null;
             }
             if (!result || !result.success) {
-                // Evaluation failed
+                // Evaluation failed - mark as complete to stop progress updates
+                this.markMessageComplete(conversationManagerMessage);
                 conversationManagerMessage.Status = 'Error';
                 conversationManagerMessage.Message = `❌ Evaluation failed`;
                 conversationManagerMessage.Error = result?.agentRun?.ErrorMessage || 'Agent evaluation failed';
@@ -502,6 +645,8 @@ export class MessageInputComponent {
                 await userMessage.Save();
                 this.messageSent.emit(userMessage);
                 console.warn('⚠️ Sage failed:', result?.agentRun?.ErrorMessage);
+                // Clean up completion timestamp
+                this.cleanupCompletionTimestamp(conversationManagerMessage.ID);
                 return;
             }
             console.log('🤖 Sage Response:', {
@@ -509,7 +654,8 @@ export class MessageInputComponent {
                 hasPayload: !!result.payload,
                 hasMessage: !!result.agentRun.Message,
                 payloadKeys: result.payload ? Object.keys(result.payload) : [],
-                payload: result.payload // Full payload for debugging
+                payload: result.payload, // Full payload for debugging,
+                suggestedResponses: result.suggestedResponses
             });
             // Stage 2: Check for task graph (multi-step orchestration)
             if (result.payload?.taskGraph) {
@@ -531,11 +677,11 @@ export class MessageInputComponent {
             }
             // Stage 4: Direct chat response from Sage
             else if (result.agentRun.FinalStep === 'Chat' && result.agentRun.Message) {
+                // Mark message as completing BEFORE setting final content (prevents race condition)
+                this.markMessageComplete(conversationManagerMessage);
                 // Normal chat response
-                conversationManagerMessage.Message = result.agentRun.Message;
-                conversationManagerMessage.Status = 'Complete';
-                await conversationManagerMessage.Save();
-                this.messageSent.emit(conversationManagerMessage);
+                // use update helper to ensure that if there is a race condition with more streaming updates we don't allow that to override this final message
+                await this.updateConversationDetail(conversationManagerMessage, result.agentRun.Message, 'Complete', result.suggestedResponses);
                 // Handle artifacts if any (but NOT task graphs - those are intermediate work products)
                 if (result.payload && Object.keys(result.payload).length > 0) {
                     await this.createArtifactFromPayload(result.payload, conversationManagerMessage, result.agentRun.AgentID);
@@ -549,26 +695,35 @@ export class MessageInputComponent {
                 if (taskId) {
                     this.activeTasks.remove(taskId);
                 }
+                // Clean up completion timestamp after delay
+                this.cleanupCompletionTimestamp(conversationManagerMessage.ID);
             }
             // Stage 5: Silent observation - but check for message content first
             else {
                 // Check if there's a message to display even without payload/taskGraph
                 if (result.agentRun.Message) {
                     console.log('💬 Sage provided a message without payload');
-                    conversationManagerMessage.Message = result.agentRun.Message;
-                    conversationManagerMessage.Status = 'Complete';
+                    // Mark message as completing BEFORE setting final content
+                    this.markMessageComplete(conversationManagerMessage);
                     conversationManagerMessage.HiddenToUser = false;
-                    await conversationManagerMessage.Save();
+                    // use update helper to ensure that if there is a race condition with more streaming updates we don't allow that to override this final message
+                    await this.updateConversationDetail(conversationManagerMessage, result.agentRun.Message, 'Complete', result.suggestedResponses);
                     this.messageSent.emit(conversationManagerMessage);
+                    // Clean up completion timestamp after delay
+                    this.cleanupCompletionTimestamp(conversationManagerMessage.ID);
                 }
                 else {
                     console.log('🔇 Sage chose to observe silently');
+                    // Mark message as completing
+                    this.markMessageComplete(conversationManagerMessage);
                     // Hide the Sage message
                     conversationManagerMessage.HiddenToUser = true;
-                    conversationManagerMessage.Status = 'Complete';
-                    await conversationManagerMessage.Save();
+                    // use update helper to ensure that if there is a race condition with more streaming updates we don't allow that to override this final message
+                    await this.updateConversationDetail(conversationManagerMessage, conversationManagerMessage.Message, 'Complete');
                     this.messageSent.emit(conversationManagerMessage);
                     await this.handleSilentObservation(userMessage, this.conversationId);
+                    // Clean up completion timestamp after delay
+                    this.cleanupCompletionTimestamp(conversationManagerMessage.ID);
                 }
                 // Remove CM from active tasks
                 if (taskId) {
@@ -580,11 +735,15 @@ export class MessageInputComponent {
             console.error('❌ Error processing message through agents:', error);
             // Update conversationManagerMessage status to Error
             if (conversationManagerMessage && conversationManagerMessage.ID) {
+                // Mark as complete to stop progress updates
+                this.markMessageComplete(conversationManagerMessage);
                 conversationManagerMessage.Status = 'Error';
                 conversationManagerMessage.Message = `❌ Error: ${String(error)}`;
                 conversationManagerMessage.Error = String(error);
                 await conversationManagerMessage.Save();
                 this.messageSent.emit(conversationManagerMessage);
+                // Clean up completion timestamp
+                this.cleanupCompletionTimestamp(conversationManagerMessage.ID);
             }
             // Mark user message as complete
             userMessage.Status = 'Complete';
@@ -685,27 +844,20 @@ export class MessageInputComponent {
             };
             const result = await GraphQLDataProvider.Instance.ExecuteGQL(mutation, variables);
             console.log('📊 ExecuteTaskGraph result:', {
-                hasData: !!result?.data,
-                hasErrors: !!result?.errors,
-                data: result?.data,
-                errors: result?.errors
+                hasExecuteTaskGraph: !!result?.ExecuteTaskGraph,
+                success: result?.ExecuteTaskGraph?.success,
+                resultsCount: result?.ExecuteTaskGraph?.results?.length,
+                result: result
             });
             // Step 4: Update task execution message with results
-            // Check for GraphQL errors first
-            if (result?.errors && result.errors.length > 0) {
-                const errorMsg = result.errors.map((e) => e.message).join(', ');
-                console.error('❌ GraphQL errors:', result.errors);
-                taskExecutionMessage.Message = `❌ **${workflowName}** failed: ${errorMsg}`;
-                taskExecutionMessage.Status = 'Error';
-                taskExecutionMessage.Error = errorMsg;
-            }
-            else if (result?.data?.ExecuteTaskGraph?.success) {
+            // ExecuteGQL returns data directly (not wrapped in {data, errors})
+            if (result?.ExecuteTaskGraph?.success) {
                 console.log('✅ Task graph execution completed successfully');
                 taskExecutionMessage.Message = `✅ **${workflowName}** completed successfully`;
                 taskExecutionMessage.Status = 'Complete';
             }
             else {
-                const errorMsg = result?.data?.ExecuteTaskGraph?.errorMessage || 'Unknown error';
+                const errorMsg = result?.ExecuteTaskGraph?.errorMessage || 'Unknown error';
                 console.error('❌ Task graph execution failed:', errorMsg);
                 taskExecutionMessage.Message = `❌ **${workflowName}** failed: ${errorMsg}`;
                 taskExecutionMessage.Status = 'Error';
@@ -713,6 +865,16 @@ export class MessageInputComponent {
             }
             await taskExecutionMessage.Save();
             this.messageSent.emit(taskExecutionMessage);
+            // Trigger artifact reload for this message
+            // Artifacts were created on server during task execution and linked to this message
+            // This event triggers the parent component to reload artifacts from the database
+            this.artifactCreated.emit({
+                artifactId: '', // Placeholder - reload will fetch actual artifacts from DB
+                versionId: '',
+                versionNumber: 1,
+                conversationDetailId: taskExecutionMessage.ID,
+                name: ''
+            });
             // Unregister from real-time updates (task complete)
             this.activeTaskExecutionMessageIds.delete(taskExecutionMessage.ID);
             // Mark user message as complete
@@ -727,6 +889,14 @@ export class MessageInputComponent {
             taskExecutionMessage.Error = String(error);
             await taskExecutionMessage.Save();
             this.messageSent.emit(taskExecutionMessage);
+            // Trigger artifact reload even on error - partial artifacts may have been created
+            this.artifactCreated.emit({
+                artifactId: '',
+                versionId: '',
+                versionNumber: 1,
+                conversationDetailId: taskExecutionMessage.ID,
+                name: ''
+            });
             // Unregister from real-time updates (task failed)
             this.activeTaskExecutionMessageIds.delete(taskExecutionMessage.ID);
             userMessage.Status = 'Complete';
@@ -734,15 +904,22 @@ export class MessageInputComponent {
             this.messageSent.emit(userMessage);
         }
     }
-    async updateConversationDetail(convoDetail, message, status) {
+    async updateConversationDetail(convoDetail, message, status, suggestedResponses) {
         if (convoDetail.Status === 'Complete' || convoDetail.Status === 'Error') {
             return; // Do not update completed or errored messages
         }
+        // Mark as completing BEFORE updating if status is Complete or Error
+        if (status === 'Complete' || status === 'Error') {
+            this.markMessageComplete(convoDetail);
+        }
         const maxAttempts = 2;
         let attempts = 0, done = false;
         while (attempts < maxAttempts && !done) {
             convoDetail.Message = message;
             convoDetail.Status = status;
+            if (suggestedResponses !== undefined) {
+                convoDetail.SuggestedResponses = JSON.stringify(suggestedResponses);
+            }
             await convoDetail.Save();
             if (convoDetail.Message === message && convoDetail.Status === status) {
                 done = true;
@@ -753,6 +930,10 @@ export class MessageInputComponent {
             }
             attempts++;
         }
+        // Clean up completion timestamp after delay
+        if (status === 'Complete' || status === 'Error') {
+            this.cleanupCompletionTimestamp(convoDetail.ID);
+        }
     }
     /**
      * Handle single task execution from task graph using direct agent execution
@@ -1445,13 +1626,30 @@ export class MessageInputComponent {
             // Don't show error to user - naming failures should be silent
         }
     }
+    /**
+     * Marks a conversation detail as complete and records timestamp to prevent race conditions
+     */
+    markMessageComplete(conversationDetail) {
+        const now = Date.now();
+        this.completionTimestamps.set(conversationDetail.ID, now);
+        console.log(`🏁 Marked message ${conversationDetail.ID} as complete at ${now}`);
+    }
+    /**
+     * Cleans up completion timestamps for completed messages (prevents memory leak)
+     */
+    cleanupCompletionTimestamp(conversationDetailId) {
+        // Keep timestamp for a short period to catch any late progress updates
+        setTimeout(() => {
+            this.completionTimestamps.delete(conversationDetailId);
+        }, 5000); // 5 seconds should be more than enough
+    }
     static ɵfac = function MessageInputComponent_Factory(t) { return new (t || MessageInputComponent)(i0.ɵɵdirectiveInject(i1.DialogService), i0.ɵɵdirectiveInject(i2.ToastService), i0.ɵɵdirectiveInject(i3.ConversationAgentService), i0.ɵɵdirectiveInject(i4.ConversationStateService), i0.ɵɵdirectiveInject(i5.DataCacheService), i0.ɵɵdirectiveInject(i6.ActiveTasksService), i0.ɵɵdirectiveInject(i7.MentionAutocompleteService), i0.ɵɵdirectiveInject(i8.MentionParserService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MessageInputComponent, selectors: [["mj-message-input"]], viewQuery: function MessageInputComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.messageTextarea = _t.first);
-        } }, inputs: { conversationId: "conversationId", currentUser: "currentUser", disabled: "disabled", placeholder: "placeholder", parentMessageId: "parentMessageId", conversationHistory: "conversationHistory" }, outputs: { messageSent: "messageSent", agentResponse: "agentResponse", agentRunDetected: "agentRunDetected", artifactCreated: "artifactCreated", conversationRenamed: "conversationRenamed" }, decls: 11, vars: 11, consts: [["messageTextarea", ""], [1, "message-input-container"], ["rows", "3", 1, "message-input", 3, "ngModelChange", "keydown", "input", "ngModel", "placeholder", "disabled"], [3, "suggestionSelected", "closed", "suggestions", "position", "visible", "showAbove"], [1, "input-actions"], ["class", "processing-indicator", 4, "ngIf"], ["title", "Attach file (coming soon)", 1, "btn-attach", 3, "disabled"], [1, "fas", "fa-paperclip"], [1, "btn-send", 3, "click", "disabled", "title"], [1, "fas", "fa-paper-plane"], [1, "processing-indicator"], [1, "fas", "fa-circle-notch", "fa-spin"]], template: function MessageInputComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { conversationId: "conversationId", currentUser: "currentUser", disabled: "disabled", placeholder: "placeholder", parentMessageId: "parentMessageId", conversationHistory: "conversationHistory" }, outputs: { messageSent: "messageSent", agentResponse: "agentResponse", agentRunDetected: "agentRunDetected", artifactCreated: "artifactCreated", conversationRenamed: "conversationRenamed" }, decls: 11, vars: 13, consts: [["messageTextarea", ""], [1, "message-input-container"], ["rows", "3", 1, "message-input", 3, "ngModelChange", "keydown", "input", "ngModel", "placeholder", "disabled"], [3, "suggestionSelected", "closed", "suggestions", "position", "visible", "showAbove"], [1, "input-actions"], ["class", "processing-indicator", 4, "ngIf"], ["title", "Attach file (coming soon)", 1, "btn-attach", 3, "disabled"], [1, "fas", "fa-paperclip"], [1, "btn-send", 3, "click", "disabled", "title"], [1, "fas", "fa-paper-plane"], [1, "processing-indicator"], [1, "fas", "fa-circle-notch", "fa-spin"]], template: function MessageInputComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "div", 1)(1, "textarea", 2, 0);
             i0.ɵɵtwoWayListener("ngModelChange", function MessageInputComponent_Template_textarea_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r1); i0.ɵɵtwoWayBindingSet(ctx.messageText, $event) || (ctx.messageText = $event); return i0.ɵɵresetView($event); });
@@ -1462,7 +1660,7 @@ export class MessageInputComponent {
             i0.ɵɵlistener("suggestionSelected", function MessageInputComponent_Template_mj_mention_dropdown_suggestionSelected_4_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onMentionSelected($event)); })("closed", function MessageInputComponent_Template_mj_mention_dropdown_closed_4_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.closeMentionDropdown()); });
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(5, "div", 4);
-            i0.ɵɵtemplate(6, MessageInputComponent_div_6_Template, 4, 0, "div", 5);
+            i0.ɵɵtemplate(6, MessageInputComponent_div_6_Template, 4, 1, "div", 5);
             i0.ɵɵelementStart(7, "button", 6);
             i0.ɵɵelement(8, "i", 7);
             i0.ɵɵelementEnd();
@@ -1472,8 +1670,9 @@ export class MessageInputComponent {
             i0.ɵɵelementEnd()()();
         } if (rf & 2) {
             i0.ɵɵadvance();
+            i0.ɵɵclassProp("intent-checking", ctx.isProcessing);
             i0.ɵɵtwoWayProperty("ngModel", ctx.messageText);
-            i0.ɵɵproperty("placeholder", ctx.placeholder)("disabled", ctx.disabled || ctx.isSending);
+            i0.ɵɵproperty("placeholder", ctx.placeholder)("disabled", ctx.disabled || ctx.isProcessing);
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("suggestions", ctx.mentionSuggestions)("position", ctx.mentionDropdownPosition)("visible", ctx.showMentionDropdown)("showAbove", ctx.mentionDropdownShowAbove);
             i0.ɵɵadvance(2);
@@ -1482,11 +1681,11 @@ export class MessageInputComponent {
             i0.ɵɵproperty("disabled", ctx.disabled);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("disabled", !ctx.canSend)("title", ctx.isSending ? "Sending..." : "Send message");
-        } }, dependencies: [i9.NgIf, i10.DefaultValueAccessor, i10.NgControlStatus, i10.NgModel, i11.MentionDropdownComponent], styles: [".message-input-container[_ngcontent-%COMP%] {\n  position: relative;\n  padding: 16px 24px;\n  border-top: 1px solid #D9D9D9;\n  background: #FFF;\n}\n\n.message-input-wrapper[_ngcontent-%COMP%] {\n  border: 2px solid #D9D9D9;\n  border-radius: 8px;\n  padding: 12px;\n  transition: border-color 0.2s, box-shadow 0.2s;\n  background: #FFF;\n}\n\n.message-input-wrapper[_ngcontent-%COMP%]:focus-within {\n  border-color: #0076B6;\n  box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.message-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 0;\n  border: none;\n  resize: none;\n  font-family: inherit;\n  font-size: 14px;\n  min-height: 40px;\n  max-height: 200px;\n  line-height: 1.5;\n}\n\n.message-input[_ngcontent-%COMP%]:focus {\n  outline: none;\n}\n\n.message-input[_ngcontent-%COMP%]:disabled {\n  background: #F4F4F4;\n  cursor: not-allowed;\n}\n.input-actions[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-top: 12px;\n}\n.btn-attach[_ngcontent-%COMP%] {\n  padding: 8px 16px;\n  background: transparent;\n  border: 1px solid #D9D9D9;\n  border-radius: 6px;\n  cursor: pointer;\n  color: #333;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.btn-attach[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: #F4F4F4;\n  border-color: #AAA;\n}\n.btn-attach[_ngcontent-%COMP%]:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.btn-send[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  background: #3B82F6;\n  color: white;\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background 0.2s;\n  flex-shrink: 0;\n}\n.btn-send[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: #2563EB;\n}\n.btn-send[_ngcontent-%COMP%]:disabled {\n  background: #D9D9D9;\n  color: #AAA;\n  cursor: not-allowed;\n}\n.btn-send[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n}\n.processing-indicator[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 13px;\n  color: #6B7280;\n  margin-right: auto;\n}\n.processing-indicator[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #0076B6;\n}"] });
+        } }, dependencies: [i9.NgIf, i10.DefaultValueAccessor, i10.NgControlStatus, i10.NgModel, i11.MentionDropdownComponent], styles: [".message-input-container[_ngcontent-%COMP%] {\n  position: relative;\n  padding: 16px 24px;\n  border-top: 1px solid #D9D9D9;\n  background: #FFF;\n}\n\n.message-input-wrapper[_ngcontent-%COMP%] {\n  border: 2px solid #D9D9D9;\n  border-radius: 8px;\n  padding: 12px;\n  transition: border-color 0.2s, box-shadow 0.2s;\n  background: #FFF;\n}\n\n.message-input-wrapper[_ngcontent-%COMP%]:focus-within {\n  border-color: #0076B6;\n  box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.message-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 0;\n  border: none;\n  resize: none;\n  font-family: inherit;\n  font-size: 14px;\n  min-height: 40px;\n  max-height: 200px;\n  line-height: 1.5;\n}\n\n.message-input[_ngcontent-%COMP%]:focus {\n  outline: none;\n}\n\n.message-input[_ngcontent-%COMP%]:disabled {\n  background: transparent;\n  cursor: wait;\n}\n\n//[_ngcontent-%COMP%]   Subtle[_ngcontent-%COMP%]   visual[_ngcontent-%COMP%]   feedback[_ngcontent-%COMP%]   when[_ngcontent-%COMP%]   checking[_ngcontent-%COMP%]   intent[_ngcontent-%COMP%]   (no[_ngcontent-%COMP%]   ugly[_ngcontent-%COMP%]   gray[_ngcontent-%COMP%]   background)\n.message-input.intent-checking[_ngcontent-%COMP%] {\n  opacity: 0.6;\n  transition: opacity 0.2s;\n}\n.input-actions[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-top: 12px;\n}\n.btn-attach[_ngcontent-%COMP%] {\n  padding: 8px 16px;\n  background: transparent;\n  border: 1px solid #D9D9D9;\n  border-radius: 6px;\n  cursor: pointer;\n  color: #333;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.btn-attach[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: #F4F4F4;\n  border-color: #AAA;\n}\n.btn-attach[_ngcontent-%COMP%]:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.btn-send[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  background: #3B82F6;\n  color: white;\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background 0.2s;\n  flex-shrink: 0;\n}\n.btn-send[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: #2563EB;\n}\n.btn-send[_ngcontent-%COMP%]:disabled {\n  background: #D9D9D9;\n  color: #AAA;\n  cursor: not-allowed;\n}\n.btn-send[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n}\n.processing-indicator[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 13px;\n  color: #6B7280;\n  margin-right: auto;\n}\n.processing-indicator[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #0076B6;\n}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MessageInputComponent, [{
         type: Component,
-        args: [{ selector: 'mj-message-input', template: "<div class=\"message-input-container\">\n  <textarea\n    #messageTextarea\n    class=\"message-input\"\n    [(ngModel)]=\"messageText\"\n    [placeholder]=\"placeholder\"\n    [disabled]=\"disabled || isSending\"\n    (keydown)=\"onKeyDown($event)\"\n    (input)=\"onInput($event)\"\n    rows=\"3\">\n  </textarea>\n\n  <!-- Mention Autocomplete Dropdown -->\n  <mj-mention-dropdown\n    [suggestions]=\"mentionSuggestions\"\n    [position]=\"mentionDropdownPosition\"\n    [visible]=\"showMentionDropdown\"\n    [showAbove]=\"mentionDropdownShowAbove\"\n    (suggestionSelected)=\"onMentionSelected($event)\"\n    (closed)=\"closeMentionDropdown()\">\n  </mj-mention-dropdown>\n\n  <div class=\"input-actions\">\n    <div class=\"processing-indicator\" *ngIf=\"isProcessing\">\n      <i class=\"fas fa-circle-notch fa-spin\"></i>\n      <span>AI is responding...</span>\n    </div>\n    <button\n      class=\"btn-attach\"\n      [disabled]=\"disabled\"\n      title=\"Attach file (coming soon)\">\n      <i class=\"fas fa-paperclip\"></i>\n    </button>\n    <button\n      class=\"btn-send\"\n      [disabled]=\"!canSend\"\n      (click)=\"onSend()\"\n      [title]=\"isSending ? 'Sending...' : 'Send message'\">\n      <i class=\"fas fa-paper-plane\"></i>\n    </button>\n  </div>\n</div>", styles: [".message-input-container {\n  position: relative;\n  padding: 16px 24px;\n  border-top: 1px solid #D9D9D9;\n  background: #FFF;\n}\n\n.message-input-wrapper {\n  border: 2px solid #D9D9D9;\n  border-radius: 8px;\n  padding: 12px;\n  transition: border-color 0.2s, box-shadow 0.2s;\n  background: #FFF;\n}\n\n.message-input-wrapper:focus-within {\n  border-color: #0076B6;\n  box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.message-input {\n  width: 100%;\n  padding: 0;\n  border: none;\n  resize: none;\n  font-family: inherit;\n  font-size: 14px;\n  min-height: 40px;\n  max-height: 200px;\n  line-height: 1.5;\n}\n\n.message-input:focus {\n  outline: none;\n}\n\n.message-input:disabled {\n  background: #F4F4F4;\n  cursor: not-allowed;\n}\n.input-actions {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-top: 12px;\n}\n.btn-attach {\n  padding: 8px 16px;\n  background: transparent;\n  border: 1px solid #D9D9D9;\n  border-radius: 6px;\n  cursor: pointer;\n  color: #333;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.btn-attach:hover:not(:disabled) {\n  background: #F4F4F4;\n  border-color: #AAA;\n}\n.btn-attach:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.btn-send {\n  width: 40px;\n  height: 40px;\n  background: #3B82F6;\n  color: white;\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background 0.2s;\n  flex-shrink: 0;\n}\n.btn-send:hover:not(:disabled) {\n  background: #2563EB;\n}\n.btn-send:disabled {\n  background: #D9D9D9;\n  color: #AAA;\n  cursor: not-allowed;\n}\n.btn-send i {\n  font-size: 16px;\n}\n.processing-indicator {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 13px;\n  color: #6B7280;\n  margin-right: auto;\n}\n.processing-indicator i {\n  color: #0076B6;\n}"] }]
+        args: [{ selector: 'mj-message-input', template: "<div class=\"message-input-container\">\n  <textarea\n    #messageTextarea\n    class=\"message-input\"\n    [class.intent-checking]=\"isProcessing\"\n    [(ngModel)]=\"messageText\"\n    [placeholder]=\"placeholder\"\n    [disabled]=\"disabled || isProcessing\"\n    (keydown)=\"onKeyDown($event)\"\n    (input)=\"onInput($event)\"\n    rows=\"3\">\n  </textarea>\n\n  <!-- Mention Autocomplete Dropdown -->\n  <mj-mention-dropdown\n    [suggestions]=\"mentionSuggestions\"\n    [position]=\"mentionDropdownPosition\"\n    [visible]=\"showMentionDropdown\"\n    [showAbove]=\"mentionDropdownShowAbove\"\n    (suggestionSelected)=\"onMentionSelected($event)\"\n    (closed)=\"closeMentionDropdown()\">\n  </mj-mention-dropdown>\n\n  <div class=\"input-actions\">\n    <div class=\"processing-indicator\" *ngIf=\"isProcessing\">\n      <i class=\"fas fa-circle-notch fa-spin\"></i>\n      <span>{{ processingMessage }}</span>\n    </div>\n    <button\n      class=\"btn-attach\"\n      [disabled]=\"disabled\"\n      title=\"Attach file (coming soon)\">\n      <i class=\"fas fa-paperclip\"></i>\n    </button>\n    <button\n      class=\"btn-send\"\n      [disabled]=\"!canSend\"\n      (click)=\"onSend()\"\n      [title]=\"isSending ? 'Sending...' : 'Send message'\">\n      <i class=\"fas fa-paper-plane\"></i>\n    </button>\n  </div>\n</div>", styles: [".message-input-container {\n  position: relative;\n  padding: 16px 24px;\n  border-top: 1px solid #D9D9D9;\n  background: #FFF;\n}\n\n.message-input-wrapper {\n  border: 2px solid #D9D9D9;\n  border-radius: 8px;\n  padding: 12px;\n  transition: border-color 0.2s, box-shadow 0.2s;\n  background: #FFF;\n}\n\n.message-input-wrapper:focus-within {\n  border-color: #0076B6;\n  box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.message-input {\n  width: 100%;\n  padding: 0;\n  border: none;\n  resize: none;\n  font-family: inherit;\n  font-size: 14px;\n  min-height: 40px;\n  max-height: 200px;\n  line-height: 1.5;\n}\n\n.message-input:focus {\n  outline: none;\n}\n\n.message-input:disabled {\n  background: transparent;\n  cursor: wait;\n}\n\n// Subtle visual feedback when checking intent (no ugly gray background)\n.message-input.intent-checking {\n  opacity: 0.6;\n  transition: opacity 0.2s;\n}\n.input-actions {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-top: 12px;\n}\n.btn-attach {\n  padding: 8px 16px;\n  background: transparent;\n  border: 1px solid #D9D9D9;\n  border-radius: 6px;\n  cursor: pointer;\n  color: #333;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.btn-attach:hover:not(:disabled) {\n  background: #F4F4F4;\n  border-color: #AAA;\n}\n.btn-attach:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.btn-send {\n  width: 40px;\n  height: 40px;\n  background: #3B82F6;\n  color: white;\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background 0.2s;\n  flex-shrink: 0;\n}\n.btn-send:hover:not(:disabled) {\n  background: #2563EB;\n}\n.btn-send:disabled {\n  background: #D9D9D9;\n  color: #AAA;\n  cursor: not-allowed;\n}\n.btn-send i {\n  font-size: 16px;\n}\n.processing-indicator {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 13px;\n  color: #6B7280;\n  margin-right: auto;\n}\n.processing-indicator i {\n  color: #0076B6;\n}"] }]
     }], () => [{ type: i1.DialogService }, { type: i2.ToastService }, { type: i3.ConversationAgentService }, { type: i4.ConversationStateService }, { type: i5.DataCacheService }, { type: i6.ActiveTasksService }, { type: i7.MentionAutocompleteService }, { type: i8.MentionParserService }], { conversationId: [{
             type: Input
         }], currentUser: [{