@c8y/ngx-components 1023.78.7 → 1023.80.0

package/fesm2022/c8y-ngx-components-ai-agent-chat.mjs

@@ -1,6 +1,6 @@
 import { NgComponentOutlet, AsyncPipe } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Injectable, inject, input, computed, output, signal, viewChildren, Component, Injector, Input } from '@angular/core';
+import { Injectable, inject, input, computed, output, signal, viewChildren, ChangeDetectionStrategy, Component, Injector, Input } from '@angular/core';
 import { GainsightService, DatePipe, ModalService, AlertService, C8Y_PLUGIN_CONTEXT_PATH, AppStateService, Status, LoadingComponent, EmptyStateComponent, C8yTranslateDirective, GuideDocsComponent, GuideHrefDirective, MarkdownToHtmlPipe, C8yTranslatePipe, ContextRouteService } from '@c8y/ngx-components';
 import { TranslateService } from '@ngx-translate/core';
 import { AIService, defaultPruneMessagesForAgent } from '@c8y/ngx-components/ai';
@@ -12,64 +12,95 @@ import { of, isObservable } from 'rxjs';
 
 /** A stateless service used by agent-chat for managing chat history. Not public. */
 class ChatHistoryService {
+    /**
+     * Returns a message pruner function suitable for passing to `save()`, configured by the given options.
+     *
+     * The returned function:
+     * - Limits the total number of messages kept (if `config.maxMessages` is set)
+     * - Strips transient streaming parts (`tool-input-streaming`, `tool-executing`) from all assistant messages
+     * - Strips `reasoning` and `tool-result` parts from assistant messages older than the 10 most recent
+     * - Strips `tool-result` parts whose `toolName` is in `config.transientToolNames`
+     *
+     * @param config Optional configuration
+     */
+    static createDefaultSerializationMessagePruner(config) {
+        return (messages) => {
+            let msgs = messages;
+            // Apply maxMessages limit - keep most recent messages
+            if (config?.maxMessages && msgs.length > config.maxMessages) {
+                msgs = msgs.slice(-config.maxMessages);
+            }
+            const transientToolNames = new Set(config?.transientToolNames ?? []);
+            // NB: in future we could use tool metadata from the MCP servers to identify transient tools automatically
+            // Only keep tool results and reasoning for the most recent N messages
+            const recentMessageStartIndex = msgs.length - Math.min(10, msgs.length);
+            return msgs.map((msg, msgIndex) => {
+                if (msg.role !== 'assistant') {
+                    return msg;
+                }
+                const isRecentMessage = msgIndex >= recentMessageStartIndex;
+                const filteredContent = msg.content.filter((part) => {
+                    // Always strip transient streaming states
+                    if (part.type === 'tool-input-streaming' || part.type === 'tool-executing') {
+                        return false;
+                    }
+                    if (!isRecentMessage) {
+                        // For older messages, only keep text and step-start
+                        return part.type === 'text' || part.type === 'step-start';
+                    }
+                    // For recent messages, additionally filter transient tool results
+                    if (part.type === 'tool-result') {
+                        return !transientToolNames.has(part.toolName);
+                    }
+                    return true;
+                });
+                return { ...msg, content: filteredContent };
+            });
+        };
+    }
     /**
      * Save messages and suggestions to an opaque, versioned, JSON-serializable snapshot for persistence.
      *
-     * Only recent tool results and reasoning are included to save space.
-     * Additional options for compressing the history can be provided using the config parameters.
+     * By default, uses `createDefaultSerializationMessagePruner()` to strip transient content and limit
+     * the size of the serialized history. Pass a custom `pruneMessages` function to override this behaviour,
+     * for example to configure `maxMessages` or `transientToolNames`, or pass `msgs => msgs` to disable pruning.
      *
      * @param messages The current conversation messages to save
      * @param suggestions The current suggestions to include in the snapshot
-     * @param config Optional configuration to limit what gets saved
+     * @param pruneMessages Optional function to prune/transform messages before serialization. If not specified, createDefaultSerializationMessagePruner is used.
      */
-    save(messages, suggestions, config) {
-        let msgs = messages;
-        // Apply maxMessages limit - keep most recent messages
-        if (config?.maxMessages && msgs.length > config.maxMessages) {
-            msgs = msgs.slice(-config.maxMessages);
-        }
-        const transientToolNames = new Set(config?.transientToolNames || []);
-        // NB: in future we could use tool metadata from the MCP servers to identify transient tools automatically
-        // Only keep tool results and reasoning for the most recent N messages (=N/2 assistant messages)
-        const recentMessageStartIndex = msgs.length - Math.min(10, msgs.length);
+    save(messages, suggestions, pruneMessages) {
+        const prune = pruneMessages ?? ChatHistoryService.createDefaultSerializationMessagePruner();
+        const msgs = prune(messages);
         const history = {
-            messages: msgs.map((msg, msgIndex) => {
-                const isRecentMessage = msgIndex >= recentMessageStartIndex;
+            messages: msgs.map(msg => {
+                if (msg.role === 'assistant') {
+                    return {
+                        role: msg.role,
+                        // Note: AIMessagePart[] cannot be statically checked as JSON-safe because
+                        // ToolCallPart.output is typed as `unknown`. Serializability is enforced at
+                        // the boundary by the outer `as ChatHistory` (= JsonValue) cast.
+                        content: msg.content,
+                        ...(msg.timestamp ? { timestamp: msg.timestamp } : {})
+                    };
+                }
                 return {
                     role: msg.role,
                     content: msg.content,
-                    ...(msg.timestamp ? { timestamp: msg.timestamp } : {}),
-                    ...(msg.steps
-                        ? {
-                            steps: msg.steps.map(step => ({
-                                // Specifically include just the fields we're interested in
-                                type: step.type,
-                                text: step.text,
-                                aborted: step.aborted,
-                                // Strip out ALL toolCalls, since these are anyway transient
-                                toolCalls: undefined,
-                                // Keep recent reasoning only
-                                reasoning: isRecentMessage ? step.reasoning : undefined,
-                                // Keep toolResults only if: in recent 10 messages AND not transient
-                                toolResults: isRecentMessage && step.toolResults
-                                    ? step.toolResults.filter(result => !transientToolNames.has(result.toolName))
-                                    : undefined
-                            }))
-                        }
-                        : {})
+                    ...('timestamp' in msg && msg.timestamp ? { timestamp: msg.timestamp } : {})
                 };
             }),
-            suggestions: suggestions,
-            chatHistoryVersion: 1
+            suggestions,
+            chatHistoryVersion: 2
         };
-        //console.debug("Saving chat history as: ", history);
         return history;
     }
     /**
      * Restore a previously saved chat history snapshot.
      *
      * Validates the snapshot format and returns the messages and suggestions.
-     * Throws an error if the snapshot is invalid.
+     * Throws an error if the snapshot is invalid or the version is not supported.
+     * For a short time, version 1 snapshots are automatically migrated to the current format.
      *
      * @param history A snapshot previously returned by `save()`
      */
@@ -81,11 +112,22 @@ class ChatHistoryService {
             !Array.isArray(history['messages'])) {
             throw new Error('Invalid chat history format');
         }
-        if (history['chatHistoryVersion'] !== 1) {
-            throw new Error(`Cannot load chat history - expected version 1 but got ${history['chatHistoryVersion']}`);
+        const version = history['chatHistoryVersion'];
+        // TODO: remove v1 migration after a month or so once stored histories have been migrated
+        if (version === 1) {
+            return this.restoreV1(history);
+        }
+        if (version !== 2) {
+            throw new Error(`Cannot load chat history - expected version 2 but got ${version}`);
         }
         const messagesArray = history['messages'];
-        if (messagesArray.some((msg, _) => !msg || typeof msg !== 'object' || !msg.role || typeof msg.content !== 'string')) {
+        if (messagesArray.some(msg => {
+            if (!msg || typeof msg !== 'object' || !msg.role)
+                return true;
+            if (msg.role === 'assistant')
+                return !Array.isArray(msg.content);
+            return typeof msg.content !== 'string';
+        })) {
             throw new Error('Invalid message format in chat history');
         }
         const suggestions = Array.isArray(history['suggestions'])
@@ -96,6 +138,51 @@ class ChatHistoryService {
             suggestions
         };
     }
+    restoreV1(history) {
+        const messagesArray = history['messages'];
+        if (messagesArray.some((msg) => !msg || typeof msg !== 'object' || !msg.role || typeof msg.content !== 'string')) {
+            throw new Error('Invalid message format in chat history');
+        }
+        const messages = messagesArray.map((msg) => {
+            if (msg.role !== 'assistant') {
+                return { role: msg.role, content: msg.content };
+            }
+            const parts = [];
+            const steps = msg.steps ?? [];
+            if (steps.length === 0) {
+                // No steps saved — fall back to the v1 string content
+                if (msg.content) {
+                    parts.push({ type: 'text', text: msg.content });
+                }
+            }
+            else {
+                steps.forEach((step, i) => {
+                    // step-start is a boundary between steps, never before the first
+                    if (i > 0) {
+                        parts.push({ type: 'step-start' });
+                    }
+                    if (step.reasoning) {
+                        parts.push({ type: 'reasoning', text: step.reasoning });
+                    }
+                    if (step.text) {
+                        parts.push({ type: 'text', text: step.text });
+                    }
+                    for (const toolResult of step.toolResults ?? []) {
+                        parts.push(toolResult);
+                    }
+                });
+            }
+            return {
+                role: 'assistant',
+                content: parts,
+                ...(msg.timestamp ? { timestamp: msg.timestamp } : {})
+            };
+        });
+        const suggestions = Array.isArray(history['suggestions'])
+            ? history['suggestions']
+            : [];
+        return { messages, suggestions };
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ChatHistoryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ChatHistoryService, providedIn: 'root' }); }
 }
@@ -110,6 +197,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
 class UserAnalyticsService {
     constructor() {
         this.gainsightService = inject(GainsightService);
+        this.maxAnalyticsMessageLength = 4000;
         /** If needed we could set this to false in production to only include hashes of the messages,
          * if there's a decision that customer data shouldn't be uploaded to GainSight. */
         this.includeCustomerSensitiveDataInAnalytics = true;
@@ -146,16 +234,23 @@ class UserAnalyticsService {
         // NB: Do NOT send any message content to GainSight servers because that's proprietary/personal customer-owned data that we must protect
         // except when includeCustomerSensitiveDataInAnalytics is set;
         // include hashes of messages so we can always correlate with the history stored on our own servers if available
-        const allAssistantText = assistantMessage.steps
-            ? assistantMessage.steps
-                ?.filter(s => s.text)
-                .map(s => s.text || '')
-                .join('\n---\n') || ''
-            : assistantMessage.content;
-        // Collect all unique tool names from each step's toolResults
-        const toolNames = assistantMessage.steps
-            ?.flatMap(s => s.toolResults?.map(tr => tr.toolName) || [])
-            ?.filter((name, index, self) => self.indexOf(name) === index) || [];
+        const allTextParts = assistantMessage.content
+            .filter((p) => p.type === 'text')
+            .map(p => p.text);
+        const allText = allTextParts.join('\n---\n');
+        // If the full text is very long, prioritize the final step's text to keep analytics payloads under the limit
+        const lastStepStartIdx = assistantMessage.content.reduce((last, p, i) => (p.type === 'step-start' ? i : last), 0);
+        const finalStepText = assistantMessage.content
+            .slice(lastStepStartIdx + 1)
+            .filter((p) => p.type === 'text')
+            .map(p => p.text)
+            .join('\n---\n');
+        const allAssistantText = allText.length > this.maxAnalyticsMessageLength ? finalStepText : allText;
+        // Collect all unique tool names from tool-result parts
+        const toolResultParts = assistantMessage.content.filter((p) => p.type === 'tool-result');
+        const toolNames = toolResultParts
+            .map(tr => tr.toolName)
+            .filter((name, index, self) => self.indexOf(name) === index);
         return {
             assistantMessageTimestamp: assistantMessage.timestamp,
             // Track how long we're spending waiting for the AI
@@ -172,9 +267,9 @@ class UserAnalyticsService {
                 : undefined,
             userMessageHash: userMessage ? await this._computeHash(userMessage.content) : '',
             userMessage: this.includeCustomerSensitiveDataInAnalytics ? userMessage.content : undefined,
-            assistantMessageSteps: assistantMessage.steps?.length || 0,
             // nb: toolCalls here refers to completed calls (i.e. toolResults), we shouldn't have any calls still in progress at this point
-            assistantMessageToolCallsCount: assistantMessage.steps?.reduce((sum, s) => sum + (s.toolResults?.length || 0), 0) || 0,
+            assistantMessageSteps: assistantMessage.content.filter(p => p.type === 'step-start').length,
+            assistantMessageToolCallsCount: toolResultParts.length,
             assistantMessageToolNames: toolNames.length === 0 ? undefined : toolNames.join(','),
             assistantMessageLines: allAssistantText.split('\n').length,
             userMessageLength: userMessage.content.length,
@@ -300,7 +395,7 @@ class AgentChatComponent {
          * that change detection works correctly. This is not necessary for changedPart.
          *
          * @param message The message from the AI assistant.
-         * @param changedPart The part of the message that has changed, which can be modified in-place if desired. Currently only tool calls are included here.
+         * @param changedPart The part of the message that has changed, which can be modified in-place if desired.
          */
         this.preprocessAgentMessage = input(undefined, ...(ngDevMode ? [{ debugName: "preprocessAgentMessage" }] : []));
         /** Optional function to override how the message history is prepared and compacted ready for sending with
@@ -347,7 +442,7 @@ class AgentChatComponent {
         this._isLoading = signal(true, ...(ngDevMode ? [{ debugName: "_isLoading" }] : [])); // initially true while we do our initial ping of the agent health - prevents message flashing up before ready
         this.aiAgentManagerApplicationName = gettext('AI Agent Manager');
         /** Stores any error with the agent or backend microservice. This error message is already translated. */
-        this._agentHealthError = signal(this.translateService.instant(gettext('Connecting to AI agent...')), ...(ngDevMode ? [{ debugName: "_agentHealthError" }] : []));
+        this._agentHealthError = signal(this.translateService.instant(gettext('Connecting to AI agent…')), ...(ngDevMode ? [{ debugName: "_agentHealthError" }] : []));
         /** Stores the most recent agent health check response, or `undefined` while the initial check is in progress. */
         this._agentHealth = signal(undefined, ...(ngDevMode ? [{ debugName: "_agentHealth" }] : []));
         /** Stores any detailed error messages from the backend. */
@@ -363,6 +458,24 @@ class AgentChatComponent {
         // NB: this is NOT part of the API of this component and may change in future
         // (e.g. we may improve AIMessage class)
         this.messages = signal([], ...(ngDevMode ? [{ debugName: "messages" }] : []));
+        /**
+         * Computed signal holding the last assistant message, which is the one which may be rapidly changing as we
+         * stream it back. This allows us to update the UI reactively without affecting the rest of the message history.
+         */
+        this.lastAssistantMessageContext = computed(() => {
+            const msgs = this.messages();
+            const lastMsg = msgs[msgs.length - 1];
+            const config = this.assistantMessageDisplayConfig();
+            const isLoadingAiResponse = this.isLoadingAiResponse();
+            if (lastMsg?.role !== 'assistant')
+                return null;
+            return {
+                message: lastMsg,
+                config: config,
+                isMessageLoading: isLoadingAiResponse,
+                messageDisplayIndex: 0
+            };
+        }, ...(ngDevMode ? [{ debugName: "lastAssistantMessageContext" }] : []));
         /** If the create agent button should be shown to the user. */
         this.canCreate = false;
         this.prompt = '';
@@ -427,10 +540,11 @@ class AgentChatComponent {
      * To save space, only recent tool results and reasoning are included.
      * Additional options for compressing the history can be provided using the config parameters.
      *
-     * @param config Optional configuration to limit what gets saved (e.g., filter out specific tools, limit total message count)
+     * @param pruner Optional function to prune/transform messages before serialization.
+     * If not specified, `ChatHistoryService.createDefaultSerializationMessagePruner()` is used.
      */
-    saveChatHistory(config) {
-        return this.chatHistoryService.save(this.messages(), this.suggestions(), config);
+    saveChatHistory(pruner) {
+        return this.chatHistoryService.save(this.messages(), this.suggestions(), pruner);
     }
     /** Sends a message to the AI */
     async sendMessage(message) {
@@ -450,10 +564,6 @@ class AgentChatComponent {
         this.agentStreamError.set(undefined); // Clear any previous stream errors
         this.abortController = new AbortController();
         this._clientToolOutputs = {};
-        const currentAssistantMessage = {
-            role: 'assistant',
-            content: ''
-        };
         // Prepare messages for AI service, optionally including grounding message
         const pruneMessagesForAgent = this.pruneMessagesForAgent() || defaultPruneMessagesForAgent;
         const messagesForAI = pruneMessagesForAgent(this.messages());
@@ -466,13 +576,13 @@ class AgentChatComponent {
             };
             messagesForAI.splice(messagesForAI.length - 1, 0, groundingMsg);
         }
-        this.messages.set([...this.messages(), currentAssistantMessage]);
+        this.messages.set([...this.messages(), { role: 'assistant', content: [] }]);
         const stream = await this.aiService.stream$(this.agentDefinition || this.agentName, messagesForAI, this.variables(), this.abortController, this.currentContextPath);
         if (this.assistantSubscription) {
             this.assistantSubscription.unsubscribe();
         }
         this.assistantSubscription = stream.subscribe({
-            next: (response) => {
+            next: async (response) => {
                 if (response?.changedPart?.type === 'response-metadata') {
                     if (response.changedPart.model) {
                         this.model = response.changedPart.model;
@@ -482,7 +592,17 @@ class AgentChatComponent {
                     }
                 }
                 else {
-                    this.processAgentMessage(currentAssistantMessage, response.message, response.changedPart);
+                    try {
+                        await this.processAgentMessage(response.message, response.changedPart);
+                    }
+                    catch (error) {
+                        console.error('Error processing agent message:', error, response.changedPart, response.message);
+                        this.cancel();
+                        const errorMessage = error instanceof Error
+                            ? error.message
+                            : gettext('An error occurred while processing the response from the AI agent.');
+                        this.agentStreamError.set(errorMessage);
+                    }
                 }
             },
             complete: () => {
@@ -503,7 +623,7 @@ class AgentChatComponent {
                 this.agentStreamError.set(errorMessage);
                 // Remove the empty assistant message that was added
                 const messages = this.messages();
-                if (messages[messages.length - 1] === currentAssistantMessage) {
+                if (messages[messages.length - 1]?.role === 'assistant') {
                     this.messages.set(messages.slice(0, -1));
                 }
                 this._isLoading.set(false);
@@ -572,6 +692,7 @@ class AgentChatComponent {
      * This can be used to provide output for tool calls that are implemented on the client,
      * and is typically called from `onToolResult`.
      *
+     * @param output: A string or JSON-serializable object.
      */
     addToolOutput(toolCallId, output, error) {
         // No validation of the id is performed here; validation is done when applying the override in processAgentMessage
@@ -636,96 +757,83 @@ class AgentChatComponent {
             this.canCreate = true;
             if (this.autoCreateAgents() && this.agentDefinition) {
                 this.createAgent();
-                return this.translateService.instant(gettext('Creating the "{{agentName}}" AI agent now...'), { agentName: this.agentName });
+                return this.translateService.instant(gettext('Creating the "{{agentName}}" AI agent now…'), { agentName: this.agentName });
             }
             // In this case we show a "Create agent" button
             return this.translateService.instant(gettext('Create the "{{agentName}}" AI agent to get started.'), { agentName: this.agentName });
         }
         return this.translateService.instant(gettext('Configure the "{{agentName}}" agent using the {{agentManager}} to get started.'), { agentName: this.agentName, agentManager });
     }
-    makeChangedPartNewInstance(updatedAssistantMsg, changedPart) {
-        if (!changedPart || !updatedAssistantMsg.steps)
-            return changedPart;
-        const newInstance = { ...changedPart };
-        // For tool calls we often want to modify the output in-place based on client-side information,
-        // so we need to ensure changedPart is a new instance to avoid change detection issues
-        if (typeof changedPart.type === 'string' && changedPart.type.startsWith('tool-')) {
-            for (const step of updatedAssistantMsg.steps) {
-                if (step.toolCalls) {
-                    const toolCallIndex = step.toolCalls.findIndex(tool => tool === changedPart);
-                    if (toolCallIndex !== -1) {
-                        step.toolCalls[toolCallIndex] = newInstance;
-                        return newInstance;
-                    }
-                }
-                if (step.toolResults) {
-                    const toolResultIndex = step.toolResults.findIndex(tool => tool === changedPart);
-                    if (toolResultIndex !== -1) {
-                        step.toolResults[toolResultIndex] = newInstance;
-                        return newInstance;
-                    }
-                }
-            }
-        }
-        // Should never happen; if we does we need to know
-        console.error('Internal error - changed part not found in updated assistant message steps', changedPart, updatedAssistantMsg);
-        return changedPart;
-    }
     /**
      * Called as responses are incrementally streamed from the agent.
-     * @param currentAssistantMsg The message already added to the messages array rendered by the UI,
-     * and dynamically updated by this function as more output comes from the agent.
+     * Reads the current assistant message from the end of the messages array, processes the update,
+     * and replaces it with a new immutable message object to trigger change detection.
      * @param updatedAssistantMsg contains the latest data received from the agent
      * @param changedPart if provided, indicates which part of the message was changed in this update
      */
-    async processAgentMessage(currentAssistantMsg, updatedAssistantMsg, changedPart) {
-        // Apply preprocessing if provided
+    async processAgentMessage(updatedAssistantMsg, changedPart) {
+        const currentAssistantMsg = this.messages()[this.messages().length - 1];
+        // Must ensure changedPart is a new instance, otherwise change detection can be missed
+        if (changedPart && changedPart?.type !== 'response-metadata') {
+            const newInstance = { ...changedPart };
+            const idx = updatedAssistantMsg.content.findIndex(p => p === changedPart);
+            if (idx !== -1) {
+                updatedAssistantMsg.content[idx] = newInstance;
+            }
+            else {
+                // Should never happen; if it does we need to know
+                console.error('Internal error - changed part not found in updated assistant message content', changedPart, updatedAssistantMsg);
+            }
+            changedPart = newInstance;
+        }
+        // Apply preprocessing if provided. Is permitted to modify updatedAssistantMsg.content array
         const preprocess = this.preprocessAgentMessage();
         if (preprocess) {
             updatedAssistantMsg = preprocess(updatedAssistantMsg, changedPart);
         }
-        // Must ensure changedPart is a new instance, otherwise change detection can fail
-        // For now this only applies to tools
-        changedPart = this.makeChangedPartNewInstance(updatedAssistantMsg, changedPart);
-        currentAssistantMsg.content = updatedAssistantMsg.content;
         // Invoke tool callback - which may call addToolOutput
         if (changedPart?.type === 'tool-result') {
             this.debugLog(`Received tool result: ${changedPart.toolName}`, changedPart);
             this.onToolResult.emit(changedPart);
         }
-        if (updatedAssistantMsg.steps) {
-            currentAssistantMsg.steps = updatedAssistantMsg.steps; // don't need a deep copy for this use case, and must avoid that so pre-processor can add steps
-            // Apply any pending tool output overrides to the incoming steps - and check that none of them refers to a non-existent item
-            if (currentAssistantMsg.steps && Object.keys(this._clientToolOutputs).length > 0) {
-                for (const [toolCallId, override] of Object.entries(this._clientToolOutputs)) {
-                    const toolResult = currentAssistantMsg.steps
-                        ?.flatMap(step => step.toolResults || [])
-                        .find(result => result.toolCallId === toolCallId);
-                    if (toolResult) {
-                        toolResult.output = override.output;
-                        toolResult.error = override.error;
-                    }
-                    else {
-                        throw new Error(`addToolOutput was called with a toolCallId '${toolCallId}' that does not exist in the current assistant message`);
-                    }
+        // Create new message object with updated content (immutable update)
+        // don't need a deep copy for content itself, and must avoid that so pre-processor can add steps
+        const newMsg = {
+            ...currentAssistantMsg,
+            content: updatedAssistantMsg.content
+        };
+        // Apply any pending tool output overrides - and check that none of them refers to a non-existent item
+        if (Object.keys(this._clientToolOutputs).length > 0) {
+            for (const [toolCallId, override] of Object.entries(this._clientToolOutputs)) {
+                const toolResult = newMsg.content.find((p) => p.type === 'tool-result' && p.toolCallId === toolCallId);
+                if (toolResult) {
+                    toolResult.output = override.output;
+                    toolResult.error = override.error;
+                }
+                else {
+                    throw new Error(`addToolOutput was called with a toolCallId '${toolCallId}' that does not exist in the current assistant message`);
                 }
             }
         }
         if (updatedAssistantMsg.finishReason) {
-            this.debugLog(`Received assistant message with ${updatedAssistantMsg.steps?.length || 0} steps: `, updatedAssistantMsg);
+            this.debugLog(`Received assistant message with ${updatedAssistantMsg.content.filter(p => p.type === 'step-start').length} steps: `, updatedAssistantMsg);
             try {
-                this.handleMessageFinish(currentAssistantMsg, updatedAssistantMsg);
+                this.handleMessageFinish(newMsg, updatedAssistantMsg);
             }
             finally {
                 this._isLoading.set(false);
             }
         }
-        // as we are mutating the currentAssistantMessage object
-        // which is already in the messages array we need to emit a new array reference
-        this.messages.set([...this.messages()]);
+        // Replace streaming message with new immutable instance to trigger change detection
+        this.messages.update(msgs => [...msgs.slice(0, -1), newMsg]);
     }
     handleMessageFinish(currentAssistantMsg, updatedAssistantMsg) {
         currentAssistantMsg.timestamp = new Date().toISOString();
+        for (const part of currentAssistantMsg.content) {
+            if (part.type === 'tool-input-streaming' || part.type === 'tool-executing') {
+                part.error = true;
+            }
+        }
         if (updatedAssistantMsg.finishReason === 'stop') {
             this.onMessageFinish.emit(currentAssistantMsg);
             void this.getAnalyticsMetadataContext()
@@ -735,24 +843,24 @@ class AgentChatComponent {
                 .catch(error => {
                 console.error('Error sending analytics:', error);
             });
-            if (currentAssistantMsg.content.trim().length === 0) {
+            if (currentAssistantMsg.content.length === 0) {
                 // Should be impossible, but adding this as a debugging aid, as it was seen once by a user
                 console.warn('Received finish reason "stop" but assistant message content is empty. This may indicate an issue with the AI service or agent configuration.', currentAssistantMsg);
             }
         }
         else if (updatedAssistantMsg.finishReason === 'error') {
-            if (currentAssistantMsg.content.trim().length === 0) {
+            if (currentAssistantMsg.content.length === 0) {
                 // Should be impossible, but adding this as a debugging aid, as it was seen once by a user
                 console.warn('Received finish reason "error" but assistant message content is empty. This may indicate an issue with the AI service or agent configuration.', currentAssistantMsg);
             }
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: AgentChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: AgentChatComponent, isStandalone: true, selector: "c8y-agent-chat", inputs: { agent: { classPropertyName: "agent", publicName: "agent", isSignal: true, isRequired: true, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: true, isRequired: false, transformFunction: null }, chatConfig: { classPropertyName: "chatConfig", publicName: "chatConfig", isSignal: true, isRequired: false, transformFunction: null }, welcomeTemplate: { classPropertyName: "welcomeTemplate", publicName: "welcomeTemplate", isSignal: true, isRequired: false, transformFunction: null }, autoCreateAgents: { classPropertyName: "autoCreateAgents", publicName: "autoCreateAgents", isSignal: true, isRequired: false, transformFunction: null }, variables: { classPropertyName: "variables", publicName: "variables", isSignal: true, isRequired: false, transformFunction: null }, assistantMessageComponent: { classPropertyName: "assistantMessageComponent", publicName: "assistantMessageComponent", isSignal: true, isRequired: false, transformFunction: null }, assistantMessageDisplayConfig: { classPropertyName: "assistantMessageDisplayConfig", publicName: "assistantMessageDisplayConfig", isSignal: true, isRequired: false, transformFunction: null }, preprocessAgentMessage: { classPropertyName: "preprocessAgentMessage", publicName: "preprocessAgentMessage", isSignal: true, isRequired: false, transformFunction: null }, pruneMessagesForAgent: { classPropertyName: "pruneMessagesForAgent", publicName: "pruneMessagesForAgent", isSignal: true, isRequired: false, transformFunction: null }, initialChatHistory: { classPropertyName: "initialChatHistory", publicName: "initialChatHistory", isSignal: true, isRequired: false, transformFunction: null }, groundingContextProvider: { classPropertyName: "groundingContextProvider", publicName: "groundingContextProvider", isSignal: true, isRequired: false, transformFunction: null }, userAnalyticsContext: { classPropertyName: "userAnalyticsContext", publicName: "userAnalyticsContext", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onMessageFinish: "onMessageFinish", onToolResult: "onToolResult", onFeedback: "onFeedback" }, viewQueries: [{ propertyName: "assistantMessageComponents", predicate: AiChatAssistantMessageComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@let agentHealthErrorMsg = _agentHealthError();\n@if (agentHealthErrorMsg) {\n  @if (isLoadingAiResponse()) {\n    <c8y-loading class=\"m-auto\"></c8y-loading>\n  } @else {\n    <c8y-ui-empty-state\n      class=\"m-auto\"\n      [icon]=\"'settings'\"\n      [title]=\"'AI agent is not available.' | translate\"\n    >\n      <span>{{ agentHealthErrorMsg }}</span>\n\n      @if (canCreate) {\n        <div class=\"text-center m-t-16 m-b-16\">\n          <button\n            class=\"btn btn-primary\"\n            (click)=\"createAgent()\"\n          >\n            {{ 'Create agent' | translate }}\n          </button>\n        </div>\n      } @else {\n        <p\n          class=\"text-pre-wrap m-t-8\"\n          data-cy=\"agent-health-detailed-messages\"\n        >\n          <small>{{ agentHealthDetailedMessages() }}</small>\n        </p>\n      }\n\n      <p c8y-guide-docs>\n        <small\n          translate\n          ngNonBindable\n        >\n          Find out more in the\n          <a c8y-guide-href=\"/docs/ai\">user documentation</a>.\n        </small>\n      </p>\n    </c8y-ui-empty-state>\n  }\n}\n\n@if (!agentHealthErrorMsg) {\n  <c8y-ai-chat\n    (onMessage)=\"sendMessage($event)\"\n    [isLoading]=\"isLoadingAiResponse()\"\n    (onCancel)=\"cancel()\"\n    [config]=\"chatConfig() ?? {}\"\n    [prompt]=\"prompt\"\n    [suggestionsTemplate]=\"suggestionsRef\"\n    [welcomeTemplate]=\"welcomeTemplate()\"\n  >\n    @let messages$ = messages();\n    @for (message of messages$; track $index; let i = $index) {\n      <c8y-ai-chat-message [message]=\"message\">\n        @if (message.role !== 'user' && model) {\n          <!-- Visually hidden label included when users copy-paste from the chat, e.g. to report issues. It's quite helpful to know the model. -->\n          <span\n            class=\"hidden-copy-label\"\n            aria-hidden=\"true\"\n          >\n            {{ `(Using model: ${model})` }}</span\n          >\n        }\n\n        @if (message.role === 'user') {\n          <div\n            class=\"message-content\"\n            data-cy=\"user-message-content\"\n            [innerHTML]=\"message.content | markdownToHtml | async\"\n          ></div>\n        } @else {\n          <ng-container\n            [ngComponentOutlet]=\"assistantMessageComponent()\"\n            [ngComponentOutletInputs]=\"{\n              assistantMessageContext: {\n                message: message,\n                config: assistantMessageDisplayConfig(),\n                isMessageLoading: isLoadingAiResponse() && i === messages$.length - 1,\n                messageDisplayIndex: messages$.length - 1 - i\n              }\n            }\"\n          ></ng-container>\n        }\n\n        @let isLastMessage = i === messages$.length - 1;\n\n        @if (message.role === 'user') {\n          <c8y-ai-chat-message-action\n            icon=\"pencil\"\n            [tooltip]=\"'Edit and resend this message' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reprompt(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-up\"\n            [tooltip]=\"'This is useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, true)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-down\"\n            [tooltip]=\"'This is not useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, false)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        <!-- Only allow regenerating the last message, otherwise we could be deleting a lot of useful message history -->\n        @if (message.role === 'assistant' && i > 0 && isLastMessage && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"refresh\"\n            [tooltip]=\"'Regenerate this response' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reload(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n      </c8y-ai-chat-message>\n    }\n\n    @let agentErrorMsg = agentStreamError();\n    @if (agentErrorMsg) {\n      <c8y-ai-chat-message [message]=\"{ role: 'assistant', content: agentErrorMsg }\">\n        <div\n          class=\"alert alert-danger d-flex a-i-center gap-8\"\n          role=\"alert\"\n        >\n          <i\n            class=\"c8y-icon c8y-icon-warning text-danger\"\n            aria-hidden=\"true\"\n          ></i>\n          <!-- Since errors come from the backend the only translation is for the fallback error message supplied by the UI. -->\n          <div class=\"flex-grow text-pre-wrap\">{{ agentErrorMsg | translate }}</div>\n        </div>\n      </c8y-ai-chat-message>\n    }\n\n    <ng-template #suggestionsRef>\n      @if (!isLoadingAiResponse()) {\n        <!-- As soon as we have any suggestions (even empty) these take priority over what we restored from history -->\n        @let activeSuggestions = suggestions() === undefined ? _restoredSuggestions : suggestions();\n        @for (suggestion of activeSuggestions; track $index) {\n          <c8y-ai-chat-suggestion\n            [icon]=\"suggestion.icon || 'c8y-bulb'\"\n            [useAiButtons]=\"true\"\n            [prompt]=\"suggestion.prompt\"\n            [label]=\"suggestion.label ?? suggestion.prompt\"\n            (suggestionClicked)=\"sendMessage($event)\"\n            [disabled]=\"isLoadingAiResponse()\"\n          ></c8y-ai-chat-suggestion>\n        }\n      }\n    </ng-template>\n  </c8y-ai-chat>\n}\n", styles: ["@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-in-out{animation:fadeIn .2s ease-in}.fade-in-out.ng-leave-active{animation:fadeOut .2s ease-out}.hidden-copy-label{display:block;font-size:0;line-height:0;-webkit-user-select:text;user-select:text}\n"], dependencies: [{ kind: "component", type: AiChatComponent, selector: "c8y-ai-chat", inputs: ["isLoading", "disabled", "prompt", "suggestionsTemplate", "welcomeTemplate", "config"], outputs: ["onMessage", "onCancel"] }, { kind: "component", type: AiChatSuggestionComponent, selector: "c8y-ai-chat-suggestion", inputs: ["label", "prompt", "icon", "useAiButtons", "disabled"], outputs: ["suggestionClicked"] }, { kind: "component", type: AiChatMessageComponent, selector: "c8y-ai-chat-message", inputs: ["role", "message"] }, { kind: "component", type: AiChatMessageActionComponent, selector: "c8y-ai-chat-message-action", inputs: ["custom", "disabled", "tooltip", "icon"], outputs: ["actionClicked"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "pipe", type: MarkdownToHtmlPipe, name: "markdownToHtml" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: AgentChatComponent, isStandalone: true, selector: "c8y-agent-chat", inputs: { agent: { classPropertyName: "agent", publicName: "agent", isSignal: true, isRequired: true, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: true, isRequired: false, transformFunction: null }, chatConfig: { classPropertyName: "chatConfig", publicName: "chatConfig", isSignal: true, isRequired: false, transformFunction: null }, welcomeTemplate: { classPropertyName: "welcomeTemplate", publicName: "welcomeTemplate", isSignal: true, isRequired: false, transformFunction: null }, autoCreateAgents: { classPropertyName: "autoCreateAgents", publicName: "autoCreateAgents", isSignal: true, isRequired: false, transformFunction: null }, variables: { classPropertyName: "variables", publicName: "variables", isSignal: true, isRequired: false, transformFunction: null }, assistantMessageComponent: { classPropertyName: "assistantMessageComponent", publicName: "assistantMessageComponent", isSignal: true, isRequired: false, transformFunction: null }, assistantMessageDisplayConfig: { classPropertyName: "assistantMessageDisplayConfig", publicName: "assistantMessageDisplayConfig", isSignal: true, isRequired: false, transformFunction: null }, preprocessAgentMessage: { classPropertyName: "preprocessAgentMessage", publicName: "preprocessAgentMessage", isSignal: true, isRequired: false, transformFunction: null }, pruneMessagesForAgent: { classPropertyName: "pruneMessagesForAgent", publicName: "pruneMessagesForAgent", isSignal: true, isRequired: false, transformFunction: null }, initialChatHistory: { classPropertyName: "initialChatHistory", publicName: "initialChatHistory", isSignal: true, isRequired: false, transformFunction: null }, groundingContextProvider: { classPropertyName: "groundingContextProvider", publicName: "groundingContextProvider", isSignal: true, isRequired: false, transformFunction: null }, userAnalyticsContext: { classPropertyName: "userAnalyticsContext", publicName: "userAnalyticsContext", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onMessageFinish: "onMessageFinish", onToolResult: "onToolResult", onFeedback: "onFeedback" }, viewQueries: [{ propertyName: "assistantMessageComponents", predicate: AiChatAssistantMessageComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@let agentHealthErrorMsg = _agentHealthError();\n@if (agentHealthErrorMsg) {\n  @if (isLoadingAiResponse()) {\n    <c8y-loading class=\"m-auto\"></c8y-loading>\n  } @else {\n    <c8y-ui-empty-state\n      class=\"m-auto\"\n      [icon]=\"'settings'\"\n      [title]=\"'AI agent is not available.' | translate\"\n    >\n      <span>{{ agentHealthErrorMsg }}</span>\n\n      @if (canCreate) {\n        <div class=\"text-center m-t-16 m-b-16\">\n          <button\n            class=\"btn btn-primary\"\n            (click)=\"createAgent()\"\n          >\n            {{ 'Create agent' | translate }}\n          </button>\n        </div>\n      } @else {\n        <p\n          class=\"text-pre-wrap m-t-8\"\n          data-cy=\"agent-health-detailed-messages\"\n        >\n          <small>{{ agentHealthDetailedMessages() }}</small>\n        </p>\n      }\n\n      <p c8y-guide-docs>\n        <small\n          translate\n          ngNonBindable\n        >\n          Find out more in the\n          <a c8y-guide-href=\"/docs/ai\">user documentation</a>.\n        </small>\n      </p>\n    </c8y-ui-empty-state>\n  }\n}\n\n@if (!agentHealthErrorMsg) {\n  <c8y-ai-chat\n    (onMessage)=\"sendMessage($event)\"\n    [isLoading]=\"isLoadingAiResponse()\"\n    (onCancel)=\"cancel()\"\n    [config]=\"chatConfig() ?? {}\"\n    [prompt]=\"prompt\"\n    [suggestionsTemplate]=\"suggestionsRef\"\n    [welcomeTemplate]=\"welcomeTemplate()\"\n  >\n    @let messages$ = messages();\n    @for (message of messages$; track $index; let i = $index) {\n      <c8y-ai-chat-message [message]=\"message\">\n        @if (message.role !== 'user' && model) {\n          <!-- Visually hidden label included when users copy-paste from the chat, e.g. to report issues. It's quite helpful to know the model. -->\n          <span\n            class=\"hidden-copy-label\"\n            aria-hidden=\"true\"\n          >\n            {{ `(Using model: ${model})` }}</span\n          >\n        }\n\n        @if (message.role === 'user') {\n          <div\n            class=\"message-content\"\n            data-cy=\"user-message-content\"\n            [innerHTML]=\"message.content | markdownToHtml | async\"\n          ></div>\n        } @else if (\n          message.role === 'assistant' && isLoadingAiResponse() && i === messages$.length - 1\n        ) {\n          <div>\n            <!-- Last assistant message uses reactive computed context -->\n            <ng-container\n              [ngComponentOutlet]=\"assistantMessageComponent()\"\n              [ngComponentOutletInputs]=\"{ assistantMessageContext: lastAssistantMessageContext() }\"\n            ></ng-container>\n          </div>\n        } @else {\n          <ng-container\n            [ngComponentOutlet]=\"assistantMessageComponent()\"\n            [ngComponentOutletInputs]=\"{\n              assistantMessageContext: {\n                message: message,\n                config: assistantMessageDisplayConfig(),\n                isMessageLoading: isLoadingAiResponse() && i === messages$.length - 1,\n                messageDisplayIndex: messages$.length - 1 - i\n              }\n            }\"\n          ></ng-container>\n        }\n\n        @let isLastMessage = i === messages$.length - 1;\n\n        @if (message.role === 'user') {\n          <c8y-ai-chat-message-action\n            icon=\"pencil\"\n            [tooltip]=\"'Edit and resend this message' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reprompt(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-up\"\n            [tooltip]=\"'This is useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, true)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-down\"\n            [tooltip]=\"'This is not useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, false)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        <!-- Only allow regenerating the last message, otherwise we could be deleting a lot of useful message history -->\n        @if (message.role === 'assistant' && i > 0 && isLastMessage && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"refresh\"\n            [tooltip]=\"'Regenerate this response' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reload(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n      </c8y-ai-chat-message>\n    }\n\n    @let agentErrorMsg = agentStreamError();\n    @if (agentErrorMsg) {\n      <c8y-ai-chat-message [message]=\"{ role: 'assistant', content: agentErrorMsg }\">\n        <div\n          class=\"alert alert-danger d-flex a-i-center gap-8\"\n          role=\"alert\"\n        >\n          <i\n            class=\"c8y-icon c8y-icon-warning text-danger\"\n            aria-hidden=\"true\"\n          ></i>\n          <!-- Since errors come from the backend the only translation is for the fallback error message supplied by the UI. -->\n          <div class=\"flex-grow text-pre-wrap\">{{ agentErrorMsg | translate }}</div>\n        </div>\n      </c8y-ai-chat-message>\n    }\n\n    <ng-template #suggestionsRef>\n      @if (!isLoadingAiResponse()) {\n        <!-- As soon as we have any suggestions (even empty) these take priority over what we restored from history -->\n        @let activeSuggestions = suggestions() === undefined ? _restoredSuggestions : suggestions();\n        @for (suggestion of activeSuggestions; track $index) {\n          <c8y-ai-chat-suggestion\n            [icon]=\"suggestion.icon || 'c8y-bulb'\"\n            [useAiButtons]=\"true\"\n            [prompt]=\"suggestion.prompt\"\n            [label]=\"suggestion.label ?? suggestion.prompt\"\n            (suggestionClicked)=\"sendMessage($event)\"\n            [disabled]=\"isLoadingAiResponse()\"\n          ></c8y-ai-chat-suggestion>\n        }\n      }\n    </ng-template>\n  </c8y-ai-chat>\n}\n", styles: ["@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-in-out{animation:fadeIn .2s ease-in}.fade-in-out.ng-leave-active{animation:fadeOut .2s ease-out}.hidden-copy-label{display:block;font-size:0;line-height:0;-webkit-user-select:text;user-select:text}\n"], dependencies: [{ kind: "component", type: AiChatComponent, selector: "c8y-ai-chat", inputs: ["isLoading", "disabled", "prompt", "suggestionsTemplate", "welcomeTemplate", "config"], outputs: ["onMessage", "onCancel"] }, { kind: "component", type: AiChatSuggestionComponent, selector: "c8y-ai-chat-suggestion", inputs: ["label", "prompt", "icon", "useAiButtons", "disabled"], outputs: ["suggestionClicked"] }, { kind: "component", type: AiChatMessageComponent, selector: "c8y-ai-chat-message", inputs: ["role", "message"] }, { kind: "component", type: AiChatMessageActionComponent, selector: "c8y-ai-chat-message-action", inputs: ["custom", "disabled", "tooltip", "icon"], outputs: ["actionClicked"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "pipe", type: MarkdownToHtmlPipe, name: "markdownToHtml" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: AgentChatComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-agent-chat', imports: [
+            args: [{ selector: 'c8y-agent-chat', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         AiChatComponent,
                         AiChatSuggestionComponent,
                         AiChatMessageComponent,
@@ -767,7 +875,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         C8yTranslateDirective,
                         GuideDocsComponent,
                         GuideHrefDirective
-                    ], template: "@let agentHealthErrorMsg = _agentHealthError();\n@if (agentHealthErrorMsg) {\n  @if (isLoadingAiResponse()) {\n    <c8y-loading class=\"m-auto\"></c8y-loading>\n  } @else {\n    <c8y-ui-empty-state\n      class=\"m-auto\"\n      [icon]=\"'settings'\"\n      [title]=\"'AI agent is not available.' | translate\"\n    >\n      <span>{{ agentHealthErrorMsg }}</span>\n\n      @if (canCreate) {\n        <div class=\"text-center m-t-16 m-b-16\">\n          <button\n            class=\"btn btn-primary\"\n            (click)=\"createAgent()\"\n          >\n            {{ 'Create agent' | translate }}\n          </button>\n        </div>\n      } @else {\n        <p\n          class=\"text-pre-wrap m-t-8\"\n          data-cy=\"agent-health-detailed-messages\"\n        >\n          <small>{{ agentHealthDetailedMessages() }}</small>\n        </p>\n      }\n\n      <p c8y-guide-docs>\n        <small\n          translate\n          ngNonBindable\n        >\n          Find out more in the\n          <a c8y-guide-href=\"/docs/ai\">user documentation</a>.\n        </small>\n      </p>\n    </c8y-ui-empty-state>\n  }\n}\n\n@if (!agentHealthErrorMsg) {\n  <c8y-ai-chat\n    (onMessage)=\"sendMessage($event)\"\n    [isLoading]=\"isLoadingAiResponse()\"\n    (onCancel)=\"cancel()\"\n    [config]=\"chatConfig() ?? {}\"\n    [prompt]=\"prompt\"\n    [suggestionsTemplate]=\"suggestionsRef\"\n    [welcomeTemplate]=\"welcomeTemplate()\"\n  >\n    @let messages$ = messages();\n    @for (message of messages$; track $index; let i = $index) {\n      <c8y-ai-chat-message [message]=\"message\">\n        @if (message.role !== 'user' && model) {\n          <!-- Visually hidden label included when users copy-paste from the chat, e.g. to report issues. It's quite helpful to know the model. -->\n          <span\n            class=\"hidden-copy-label\"\n            aria-hidden=\"true\"\n          >\n            {{ `(Using model: ${model})` }}</span\n          >\n        }\n\n        @if (message.role === 'user') {\n          <div\n            class=\"message-content\"\n            data-cy=\"user-message-content\"\n            [innerHTML]=\"message.content | markdownToHtml | async\"\n          ></div>\n        } @else {\n          <ng-container\n            [ngComponentOutlet]=\"assistantMessageComponent()\"\n            [ngComponentOutletInputs]=\"{\n              assistantMessageContext: {\n                message: message,\n                config: assistantMessageDisplayConfig(),\n                isMessageLoading: isLoadingAiResponse() && i === messages$.length - 1,\n                messageDisplayIndex: messages$.length - 1 - i\n              }\n            }\"\n          ></ng-container>\n        }\n\n        @let isLastMessage = i === messages$.length - 1;\n\n        @if (message.role === 'user') {\n          <c8y-ai-chat-message-action\n            icon=\"pencil\"\n            [tooltip]=\"'Edit and resend this message' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reprompt(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-up\"\n            [tooltip]=\"'This is useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, true)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-down\"\n            [tooltip]=\"'This is not useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, false)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        <!-- Only allow regenerating the last message, otherwise we could be deleting a lot of useful message history -->\n        @if (message.role === 'assistant' && i > 0 && isLastMessage && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"refresh\"\n            [tooltip]=\"'Regenerate this response' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reload(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n      </c8y-ai-chat-message>\n    }\n\n    @let agentErrorMsg = agentStreamError();\n    @if (agentErrorMsg) {\n      <c8y-ai-chat-message [message]=\"{ role: 'assistant', content: agentErrorMsg }\">\n        <div\n          class=\"alert alert-danger d-flex a-i-center gap-8\"\n          role=\"alert\"\n        >\n          <i\n            class=\"c8y-icon c8y-icon-warning text-danger\"\n            aria-hidden=\"true\"\n          ></i>\n          <!-- Since errors come from the backend the only translation is for the fallback error message supplied by the UI. -->\n          <div class=\"flex-grow text-pre-wrap\">{{ agentErrorMsg | translate }}</div>\n        </div>\n      </c8y-ai-chat-message>\n    }\n\n    <ng-template #suggestionsRef>\n      @if (!isLoadingAiResponse()) {\n        <!-- As soon as we have any suggestions (even empty) these take priority over what we restored from history -->\n        @let activeSuggestions = suggestions() === undefined ? _restoredSuggestions : suggestions();\n        @for (suggestion of activeSuggestions; track $index) {\n          <c8y-ai-chat-suggestion\n            [icon]=\"suggestion.icon || 'c8y-bulb'\"\n            [useAiButtons]=\"true\"\n            [prompt]=\"suggestion.prompt\"\n            [label]=\"suggestion.label ?? suggestion.prompt\"\n            (suggestionClicked)=\"sendMessage($event)\"\n            [disabled]=\"isLoadingAiResponse()\"\n          ></c8y-ai-chat-suggestion>\n        }\n      }\n    </ng-template>\n  </c8y-ai-chat>\n}\n", styles: ["@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-in-out{animation:fadeIn .2s ease-in}.fade-in-out.ng-leave-active{animation:fadeOut .2s ease-out}.hidden-copy-label{display:block;font-size:0;line-height:0;-webkit-user-select:text;user-select:text}\n"] }]
+                    ], template: "@let agentHealthErrorMsg = _agentHealthError();\n@if (agentHealthErrorMsg) {\n  @if (isLoadingAiResponse()) {\n    <c8y-loading class=\"m-auto\"></c8y-loading>\n  } @else {\n    <c8y-ui-empty-state\n      class=\"m-auto\"\n      [icon]=\"'settings'\"\n      [title]=\"'AI agent is not available.' | translate\"\n    >\n      <span>{{ agentHealthErrorMsg }}</span>\n\n      @if (canCreate) {\n        <div class=\"text-center m-t-16 m-b-16\">\n          <button\n            class=\"btn btn-primary\"\n            (click)=\"createAgent()\"\n          >\n            {{ 'Create agent' | translate }}\n          </button>\n        </div>\n      } @else {\n        <p\n          class=\"text-pre-wrap m-t-8\"\n          data-cy=\"agent-health-detailed-messages\"\n        >\n          <small>{{ agentHealthDetailedMessages() }}</small>\n        </p>\n      }\n\n      <p c8y-guide-docs>\n        <small\n          translate\n          ngNonBindable\n        >\n          Find out more in the\n          <a c8y-guide-href=\"/docs/ai\">user documentation</a>.\n        </small>\n      </p>\n    </c8y-ui-empty-state>\n  }\n}\n\n@if (!agentHealthErrorMsg) {\n  <c8y-ai-chat\n    (onMessage)=\"sendMessage($event)\"\n    [isLoading]=\"isLoadingAiResponse()\"\n    (onCancel)=\"cancel()\"\n    [config]=\"chatConfig() ?? {}\"\n    [prompt]=\"prompt\"\n    [suggestionsTemplate]=\"suggestionsRef\"\n    [welcomeTemplate]=\"welcomeTemplate()\"\n  >\n    @let messages$ = messages();\n    @for (message of messages$; track $index; let i = $index) {\n      <c8y-ai-chat-message [message]=\"message\">\n        @if (message.role !== 'user' && model) {\n          <!-- Visually hidden label included when users copy-paste from the chat, e.g. to report issues. It's quite helpful to know the model. -->\n          <span\n            class=\"hidden-copy-label\"\n            aria-hidden=\"true\"\n          >\n            {{ `(Using model: ${model})` }}</span\n          >\n        }\n\n        @if (message.role === 'user') {\n          <div\n            class=\"message-content\"\n            data-cy=\"user-message-content\"\n            [innerHTML]=\"message.content | markdownToHtml | async\"\n          ></div>\n        } @else if (\n          message.role === 'assistant' && isLoadingAiResponse() && i === messages$.length - 1\n        ) {\n          <div>\n            <!-- Last assistant message uses reactive computed context -->\n            <ng-container\n              [ngComponentOutlet]=\"assistantMessageComponent()\"\n              [ngComponentOutletInputs]=\"{ assistantMessageContext: lastAssistantMessageContext() }\"\n            ></ng-container>\n          </div>\n        } @else {\n          <ng-container\n            [ngComponentOutlet]=\"assistantMessageComponent()\"\n            [ngComponentOutletInputs]=\"{\n              assistantMessageContext: {\n                message: message,\n                config: assistantMessageDisplayConfig(),\n                isMessageLoading: isLoadingAiResponse() && i === messages$.length - 1,\n                messageDisplayIndex: messages$.length - 1 - i\n              }\n            }\"\n          ></ng-container>\n        }\n\n        @let isLastMessage = i === messages$.length - 1;\n\n        @if (message.role === 'user') {\n          <c8y-ai-chat-message-action\n            icon=\"pencil\"\n            [tooltip]=\"'Edit and resend this message' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reprompt(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-up\"\n            [tooltip]=\"'This is useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, true)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-down\"\n            [tooltip]=\"'This is not useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, false)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        <!-- Only allow regenerating the last message, otherwise we could be deleting a lot of useful message history -->\n        @if (message.role === 'assistant' && i > 0 && isLastMessage && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"refresh\"\n            [tooltip]=\"'Regenerate this response' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reload(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n      </c8y-ai-chat-message>\n    }\n\n    @let agentErrorMsg = agentStreamError();\n    @if (agentErrorMsg) {\n      <c8y-ai-chat-message [message]=\"{ role: 'assistant', content: agentErrorMsg }\">\n        <div\n          class=\"alert alert-danger d-flex a-i-center gap-8\"\n          role=\"alert\"\n        >\n          <i\n            class=\"c8y-icon c8y-icon-warning text-danger\"\n            aria-hidden=\"true\"\n          ></i>\n          <!-- Since errors come from the backend the only translation is for the fallback error message supplied by the UI. -->\n          <div class=\"flex-grow text-pre-wrap\">{{ agentErrorMsg | translate }}</div>\n        </div>\n      </c8y-ai-chat-message>\n    }\n\n    <ng-template #suggestionsRef>\n      @if (!isLoadingAiResponse()) {\n        <!-- As soon as we have any suggestions (even empty) these take priority over what we restored from history -->\n        @let activeSuggestions = suggestions() === undefined ? _restoredSuggestions : suggestions();\n        @for (suggestion of activeSuggestions; track $index) {\n          <c8y-ai-chat-suggestion\n            [icon]=\"suggestion.icon || 'c8y-bulb'\"\n            [useAiButtons]=\"true\"\n            [prompt]=\"suggestion.prompt\"\n            [label]=\"suggestion.label ?? suggestion.prompt\"\n            (suggestionClicked)=\"sendMessage($event)\"\n            [disabled]=\"isLoadingAiResponse()\"\n          ></c8y-ai-chat-suggestion>\n        }\n      }\n    </ng-template>\n  </c8y-ai-chat>\n}\n", styles: ["@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-in-out{animation:fadeIn .2s ease-in}.fade-in-out.ng-leave-active{animation:fadeOut .2s ease-out}.hidden-copy-label{display:block;font-size:0;line-height:0;-webkit-user-select:text;user-select:text}\n"] }]
         }], propDecorators: { agent: [{ type: i0.Input, args: [{ isSignal: true, alias: "agent", required: true }] }], suggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "suggestions", required: false }] }], chatConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "chatConfig", required: false }] }], welcomeTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "welcomeTemplate", required: false }] }], autoCreateAgents: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoCreateAgents", required: false }] }], variables: [{ type: i0.Input, args: [{ isSignal: true, alias: "variables", required: false }] }], assistantMessageComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "assistantMessageComponent", required: false }] }], assistantMessageDisplayConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "assistantMessageDisplayConfig", required: false }] }], preprocessAgentMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "preprocessAgentMessage", required: false }] }], pruneMessagesForAgent: [{ type: i0.Input, args: [{ isSignal: true, alias: "pruneMessagesForAgent", required: false }] }], initialChatHistory: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialChatHistory", required: false }] }], groundingContextProvider: [{ type: i0.Input, args: [{ isSignal: true, alias: "groundingContextProvider", required: false }] }], userAnalyticsContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "userAnalyticsContext", required: false }] }], onMessageFinish: [{ type: i0.Output, args: ["onMessageFinish"] }], onToolResult: [{ type: i0.Output, args: ["onToolResult"] }], onFeedback: [{ type: i0.Output, args: ["onFeedback"] }], assistantMessageComponents: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => AiChatAssistantMessageComponent), { isSignal: true }] }] } });
 
 class WidgetAiChatSectionComponent {