@memberjunction/ng-conversations 2.122.1 → 2.123.0

package/dist/lib/components/conversation/conversation-chat-area.component.js

@@ -6,7 +6,7 @@ import { ArtifactViewerPanelComponent } from '@memberjunction/ng-artifacts';
 import { TestFeedbackDialogComponent } from '@memberjunction/ng-testing';
 import { Subject } from 'rxjs';
 import * as i0 from "@angular/core";
-import * as i1 from "../../services/conversation-state.service";
+import * as i1 from "../../services/conversation-data.service";
 import * as i2 from "../../services/agent-state.service";
 import * as i3 from "../../services/conversation-agent.service";
 import * as i4 from "../../services/active-tasks.service";
@@ -41,23 +41,23 @@ function ConversationChatAreaComponent_div_1_button_4_Template(rf, ctx) { if (rf
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const conversation_r4 = i0.ɵɵnextContext().ngIf;
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(conversation_r4.Project || "Project");
+    i0.ɵɵtextInterpolate(ctx_r2.conversation.Project || "Project");
 } }
 function ConversationChatAreaComponent_div_1_button_5_Template(rf, ctx) { if (rf & 1) {
-    const _r5 = i0.ɵɵgetCurrentView();
+    const _r4 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "button", 32);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_button_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const conversation_r4 = i0.ɵɵnextContext().ngIf; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.viewTestRun(conversation_r4.TestRunID)); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_button_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.viewTestRun(ctx_r2.conversation.TestRunID)); });
     i0.ɵɵelement(1, "i", 33);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "Test");
     i0.ɵɵelementEnd()();
 } }
 function ConversationChatAreaComponent_div_1_button_12_Template(rf, ctx) { if (rf & 1) {
-    const _r6 = i0.ɵɵgetCurrentView();
+    const _r5 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "button", 34);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_button_12_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.viewArtifacts()); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_div_1_button_12_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.viewArtifacts()); });
     i0.ɵɵelement(1, "i", 35);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
@@ -97,30 +97,29 @@ function ConversationChatAreaComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(20, " Share ");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const conversation_r4 = ctx.ngIf;
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(conversation_r4.Name);
+    i0.ɵɵtextInterpolate(ctx_r2.conversation.Name);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", conversation_r4.ProjectID);
+    i0.ɵɵproperty("ngIf", ctx_r2.conversation.ProjectID);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", conversation_r4.TestRunID);
+    i0.ɵɵproperty("ngIf", ctx_r2.conversation.TestRunID);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("conversationId", ctx_r2.conversationState.activeConversation.ID)("currentUser", ctx_r2.currentUser);
+    i0.ɵɵproperty("conversationId", ctx_r2.conversation.ID)("currentUser", ctx_r2.currentUser);
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate2("", ctx_r2.memberCount, " member", ctx_r2.memberCount !== 1 ? "s" : "", "");
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", ctx_r2.artifactCountDisplay > 0);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("conversationId", ctx_r2.conversationState.activeConversation.ID)("currentUser", ctx_r2.currentUser);
+    i0.ɵɵproperty("conversationId", ctx_r2.conversation.ID)("currentUser", ctx_r2.currentUser);
     i0.ɵɵadvance(5);
     i0.ɵɵclassProp("shared", ctx_r2.isShared);
     i0.ɵɵproperty("title", ctx_r2.isShared ? "Manage sharing" : "Share conversation");
 } }
 function ConversationChatAreaComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    const _r7 = i0.ɵɵgetCurrentView();
+    const _r6 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "mj-conversation-empty-state", 36);
-    i0.ɵɵlistener("messageSent", function ConversationChatAreaComponent_Conditional_4_Template_mj_conversation_empty_state_messageSent_0_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onEmptyStateMessageSent($event)); });
+    i0.ɵɵlistener("messageSent", function ConversationChatAreaComponent_Conditional_4_Template_mj_conversation_empty_state_messageSent_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onEmptyStateMessageSent($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
@@ -132,9 +131,9 @@ function ConversationChatAreaComponent_Conditional_5_Template(rf, ctx) { if (rf
     i0.ɵɵelementEnd();
 } }
 function ConversationChatAreaComponent_Conditional_6_span_4_Template(rf, ctx) { if (rf & 1) {
-    const _r9 = i0.ɵɵgetCurrentView();
+    const _r8 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "span", 44);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_6_span_4_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.scrollToBottomAnimate()); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_6_span_4_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.scrollToBottomAnimate()); });
     i0.ɵɵelement(1, "i", 45);
     i0.ɵɵelementEnd();
 } }
@@ -144,14 +143,14 @@ function ConversationChatAreaComponent_Conditional_6_Conditional_6_Template(rf,
     i0.ɵɵelementEnd();
 } }
 function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r10 = i0.ɵɵgetCurrentView();
+    const _r9 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "mj-message-input", 48, 1);
-    i0.ɵɵlistener("messageSent", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_messageSent_0_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onMessageSent($event)); })("agentResponse", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_agentResponse_0_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onAgentResponse($event)); })("agentRunDetected", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_agentRunDetected_0_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onAgentRunDetected($event)); })("agentRunUpdate", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_agentRunUpdate_0_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onAgentRunUpdate($event)); })("messageComplete", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_messageComplete_0_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onMessageComplete($event)); })("artifactCreated", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_artifactCreated_0_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onArtifactCreated($event)); })("conversationRenamed", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_conversationRenamed_0_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onConversationRenamed($event)); })("intentCheckStarted", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_intentCheckStarted_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onIntentCheckStarted()); })("intentCheckCompleted", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_intentCheckCompleted_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onIntentCheckCompleted()); });
+    i0.ɵɵlistener("messageSent", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_messageSent_0_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onMessageSent($event)); })("agentResponse", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_agentResponse_0_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onAgentResponse($event)); })("agentRunDetected", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_agentRunDetected_0_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onAgentRunDetected($event)); })("agentRunUpdate", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_agentRunUpdate_0_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onAgentRunUpdate($event)); })("messageComplete", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_messageComplete_0_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onMessageComplete($event)); })("artifactCreated", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_artifactCreated_0_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onArtifactCreated($event)); })("conversationRenamed", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_conversationRenamed_0_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onConversationRenamed($event)); })("intentCheckStarted", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_intentCheckStarted_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onIntentCheckStarted()); })("intentCheckCompleted", function ConversationChatAreaComponent_Conditional_6_Conditional_7_For_2_Template_mj_message_input_intentCheckCompleted_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onIntentCheckCompleted()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const inputRef_r11 = ctx.$implicit;
+    const inputRef_r10 = ctx.$implicit;
     const ctx_r2 = i0.ɵɵnextContext(3);
-    i0.ɵɵproperty("hidden", inputRef_r11.conversationId !== ctx_r2.conversationState.activeConversation.ID)("conversationId", inputRef_r11.conversationId)("conversationName", inputRef_r11.conversationName)("currentUser", ctx_r2.currentUser)("conversationHistory", inputRef_r11.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.messages : i0.ɵɵpureFunction0(11, _c2))("artifactsByDetailId", inputRef_r11.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.artifactsByDetailId : ctx_r2.emptyArtifactsMap)("systemArtifactsByDetailId", inputRef_r11.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.systemArtifactsByDetailId : ctx_r2.emptyArtifactsMap)("agentRunsByDetailId", inputRef_r11.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.agentRunsByDetailId : ctx_r2.emptyAgentRunsMap)("inProgressMessageIds", inputRef_r11.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.inProgressMessageIds : ctx_r2.emptyInProgressIds)("disabled", ctx_r2.isProcessing)("initialMessage", inputRef_r11.conversationId === ctx_r2.conversationState.activeConversation.ID ? ctx_r2.conversationState.pendingMessageToSend : null);
+    i0.ɵɵproperty("hidden", inputRef_r10.conversationId !== ctx_r2.conversationId)("conversationId", inputRef_r10.conversationId)("conversationName", inputRef_r10.conversationName)("currentUser", ctx_r2.currentUser)("conversationHistory", inputRef_r10.conversationId === ctx_r2.conversationId ? ctx_r2.messages : i0.ɵɵpureFunction0(11, _c2))("artifactsByDetailId", inputRef_r10.conversationId === ctx_r2.conversationId ? ctx_r2.artifactsByDetailId : ctx_r2.emptyArtifactsMap)("systemArtifactsByDetailId", inputRef_r10.conversationId === ctx_r2.conversationId ? ctx_r2.systemArtifactsByDetailId : ctx_r2.emptyArtifactsMap)("agentRunsByDetailId", inputRef_r10.conversationId === ctx_r2.conversationId ? ctx_r2.agentRunsByDetailId : ctx_r2.emptyAgentRunsMap)("inProgressMessageIds", inputRef_r10.conversationId === ctx_r2.conversationId ? ctx_r2.inProgressMessageIds : ctx_r2.emptyInProgressIds)("disabled", ctx_r2.isProcessing)("initialMessage", inputRef_r10.conversationId === ctx_r2.conversationId ? ctx_r2.pendingMessage : null);
 } }
 function ConversationChatAreaComponent_Conditional_6_Conditional_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 43);
@@ -163,11 +162,11 @@ function ConversationChatAreaComponent_Conditional_6_Conditional_7_Template(rf,
     i0.ɵɵrepeater(ctx_r2.getCachedInputs());
 } }
 function ConversationChatAreaComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    const _r8 = i0.ɵɵgetCurrentView();
+    const _r7 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 8)(1, "div", 38, 0);
-    i0.ɵɵlistener("scroll", function ConversationChatAreaComponent_Conditional_6_Template_div_scroll_1_listener() { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.checkScroll()); });
+    i0.ɵɵlistener("scroll", function ConversationChatAreaComponent_Conditional_6_Template_div_scroll_1_listener() { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.checkScroll()); });
     i0.ɵɵelementStart(3, "mj-conversation-message-list", 39);
-    i0.ɵɵlistener("replyInThread", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_replyInThread_3_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onReplyInThread($event)); })("viewThread", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_viewThread_3_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onViewThread($event)); })("retryMessage", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_retryMessage_3_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onRetryMessage($event)); })("testFeedbackMessage", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_testFeedbackMessage_3_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onTestFeedbackMessage($event)); })("artifactClicked", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_artifactClicked_3_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onArtifactClicked($event)); })("messageEdited", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_messageEdited_3_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onMessageEdited($event)); })("openEntityRecord", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_openEntityRecord_3_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onOpenEntityRecord($event)); })("suggestedResponseSelected", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_suggestedResponseSelected_3_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onSuggestedResponseSelected($event)); });
+    i0.ɵɵlistener("replyInThread", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_replyInThread_3_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onReplyInThread($event)); })("viewThread", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_viewThread_3_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onViewThread($event)); })("retryMessage", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_retryMessage_3_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onRetryMessage($event)); })("testFeedbackMessage", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_testFeedbackMessage_3_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onTestFeedbackMessage($event)); })("artifactClicked", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_artifactClicked_3_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onArtifactClicked($event)); })("messageEdited", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_messageEdited_3_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onMessageEdited($event)); })("openEntityRecord", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_openEntityRecord_3_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onOpenEntityRecord($event)); })("suggestedResponseSelected", function ConversationChatAreaComponent_Conditional_6_Template_mj_conversation_message_list_suggestedResponseSelected_3_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onSuggestedResponseSelected($event)); });
     i0.ɵɵelementEnd();
     i0.ɵɵtemplate(4, ConversationChatAreaComponent_Conditional_6_span_4_Template, 2, 0, "span", 40);
     i0.ɵɵelementEnd();
@@ -177,23 +176,23 @@ function ConversationChatAreaComponent_Conditional_6_Template(rf, ctx) { if (rf
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("messages", ctx_r2.messages)("conversation", ctx_r2.conversationState.activeConversation)("currentUser", ctx_r2.currentUser)("isProcessing", ctx_r2.isProcessing)("artifactMap", ctx_r2.effectiveArtifactsMap)("agentRunMap", ctx_r2.agentRunsByDetailId)("ratingsMap", ctx_r2.ratingsByDetailId)("userAvatarMap", ctx_r2.userAvatarMap);
+    i0.ɵɵproperty("messages", ctx_r2.messages)("conversation", ctx_r2.conversation)("currentUser", ctx_r2.currentUser)("isProcessing", ctx_r2.isProcessing)("artifactMap", ctx_r2.effectiveArtifactsMap)("agentRunMap", ctx_r2.agentRunsByDetailId)("ratingsMap", ctx_r2.ratingsByDetailId)("userAvatarMap", ctx_r2.userAvatarMap);
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", ctx_r2.showScrollToBottomIcon && ctx_r2.messages && ctx_r2.messages.length > 0);
     i0.ɵɵadvance(2);
     i0.ɵɵconditional(ctx_r2.isLoadingPeripheralData ? 6 : 7);
 } }
 function ConversationChatAreaComponent_Conditional_7_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    const _r13 = i0.ɵɵgetCurrentView();
+    const _r12 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 52);
-    i0.ɵɵlistener("mousedown", function ConversationChatAreaComponent_Conditional_7_Conditional_0_Template_div_mousedown_0_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onResizeStart($event)); })("touchstart", function ConversationChatAreaComponent_Conditional_7_Conditional_0_Template_div_touchstart_0_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onResizeTouchStart($event)); });
+    i0.ɵɵlistener("mousedown", function ConversationChatAreaComponent_Conditional_7_Conditional_0_Template_div_mousedown_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onResizeStart($event)); })("touchstart", function ConversationChatAreaComponent_Conditional_7_Conditional_0_Template_div_touchstart_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onResizeTouchStart($event)); });
     i0.ɵɵelementEnd();
 } }
 function ConversationChatAreaComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    const _r12 = i0.ɵɵgetCurrentView();
+    const _r11 = i0.ɵɵgetCurrentView();
     i0.ɵɵtemplate(0, ConversationChatAreaComponent_Conditional_7_Conditional_0_Template, 1, 0, "div", 49);
     i0.ɵɵelementStart(1, "div", 50)(2, "mj-artifact-viewer-panel", 51);
-    i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_closed_2_listener() { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onCloseArtifactPanel()); })("saveToCollectionRequested", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_saveToCollectionRequested_2_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onSaveToCollectionRequested($event)); })("navigateToLink", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_navigateToLink_2_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onArtifactLinkNavigation($event)); })("shareRequested", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_shareRequested_2_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onArtifactShareRequested($event)); })("maximizeToggled", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_maximizeToggled_2_listener() { i0.ɵɵrestoreView(_r12); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleMaximizeArtifactPane()); });
+    i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_closed_2_listener() { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onCloseArtifactPanel()); })("saveToCollectionRequested", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_saveToCollectionRequested_2_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onSaveToCollectionRequested($event)); })("navigateToLink", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_navigateToLink_2_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onArtifactLinkNavigation($event)); })("shareRequested", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_shareRequested_2_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onArtifactShareRequested($event)); })("maximizeToggled", function ConversationChatAreaComponent_Conditional_7_Template_mj_artifact_viewer_panel_maximizeToggled_2_listener() { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleMaximizeArtifactPane()); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
@@ -205,39 +204,39 @@ function ConversationChatAreaComponent_Conditional_7_Template(rf, ctx) { if (rf
     i0.ɵɵproperty("artifactId", ctx_r2.selectedArtifactId)("currentUser", ctx_r2.currentUser)("environmentId", ctx_r2.environmentId)("versionNumber", ctx_r2.selectedVersionNumber)("viewContext", "conversation")("canShare", ctx_r2.canShareSelectedArtifact)("canEdit", ctx_r2.canEditSelectedArtifact)("isMaximized", ctx_r2.isArtifactPaneMaximized)("refreshTrigger", ctx_r2.artifactViewerRefresh$);
 } }
 function ConversationChatAreaComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
+    const _r13 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "mj-thread-panel", 53);
-    i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_9_Template_mj_thread_panel_closed_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onThreadClosed()); })("replyAdded", function ConversationChatAreaComponent_Conditional_9_Template_mj_thread_panel_replyAdded_0_listener($event) { i0.ɵɵrestoreView(_r14); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onThreadReplyAdded($event)); });
+    i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_9_Template_mj_thread_panel_closed_0_listener() { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onLocalThreadClosed()); })("replyAdded", function ConversationChatAreaComponent_Conditional_9_Template_mj_thread_panel_replyAdded_0_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onThreadReplyAdded($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("parentMessageId", ctx_r2.conversationState.activeThreadId)("conversationId", (ctx_r2.conversationState.activeConversation == null ? null : ctx_r2.conversationState.activeConversation.ID) || "")("currentUser", ctx_r2.currentUser);
+    i0.ɵɵproperty("parentMessageId", ctx_r2.threadId)("conversationId", ctx_r2.conversationId || "")("currentUser", ctx_r2.currentUser);
 } }
 function ConversationChatAreaComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    const _r15 = i0.ɵɵgetCurrentView();
+    const _r14 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 54);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_12_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r15); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showProjectSelector = false); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_12_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showProjectSelector = false); });
     i0.ɵɵelementStart(1, "div", 55);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_12_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r15); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_12_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r14); return i0.ɵɵresetView($event.stopPropagation()); });
     i0.ɵɵelementStart(2, "div", 56)(3, "h3");
     i0.ɵɵtext(4, "Assign Project");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(5, "button", 57);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_12_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r15); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showProjectSelector = false); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_12_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r14); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showProjectSelector = false); });
     i0.ɵɵelement(6, "i", 58);
     i0.ɵɵelementEnd()();
     i0.ɵɵelementStart(7, "div", 59)(8, "mj-project-selector", 60);
-    i0.ɵɵlistener("projectSelected", function ConversationChatAreaComponent_Conditional_12_Template_mj_project_selector_projectSelected_8_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onProjectSelected($event)); });
+    i0.ɵɵlistener("projectSelected", function ConversationChatAreaComponent_Conditional_12_Template_mj_project_selector_projectSelected_8_listener($event) { i0.ɵɵrestoreView(_r14); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onProjectSelected($event)); });
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵadvance(8);
-    i0.ɵɵproperty("environmentId", ctx_r2.environmentId)("currentUser", ctx_r2.currentUser)("selectedProjectId", ctx_r2.conversationState.activeConversation.ProjectID);
+    i0.ɵɵproperty("environmentId", ctx_r2.environmentId)("currentUser", ctx_r2.currentUser)("selectedProjectId", ctx_r2.conversation.ProjectID);
 } }
 function ConversationChatAreaComponent_Conditional_13_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    const _r17 = i0.ɵɵgetCurrentView();
+    const _r16 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "button", 67);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.toggleSystemArtifacts()); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.toggleSystemArtifacts()); });
     i0.ɵɵelement(1, "i", 68);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
@@ -258,28 +257,28 @@ function ConversationChatAreaComponent_Conditional_13_Conditional_10_Template(rf
 function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_8_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
 } if (rf & 2) {
-    const artifact_r19 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵtextInterpolate1(" ", artifact_r19.versionCount, " versions ");
+    const artifact_r18 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵtextInterpolate1(" ", artifact_r18.versionCount, " versions ");
 } }
 function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_9_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0, " 1 version ");
 } }
 function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    const _r20 = i0.ɵɵgetCurrentView();
+    const _r19 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "button", 82);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_10_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r20); const artifact_r19 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.toggleArtifactExpansion(artifact_r19.artifactId, $event)); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_10_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r19); const artifact_r18 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.toggleArtifactExpansion(artifact_r18.artifactId, $event)); });
     i0.ɵɵelement(1, "i", 83);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const artifact_r19 = i0.ɵɵnextContext().$implicit;
+    const artifact_r18 = i0.ɵɵnextContext().$implicit;
     const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("fa-chevron-down", ctx_r2.expandedArtifactId !== artifact_r19.artifactId)("fa-chevron-up", ctx_r2.expandedArtifactId === artifact_r19.artifactId);
+    i0.ɵɵclassProp("fa-chevron-down", ctx_r2.expandedArtifactId !== artifact_r18.artifactId)("fa-chevron-up", ctx_r2.expandedArtifactId === artifact_r18.artifactId);
 } }
 function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_13_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r21 = i0.ɵɵgetCurrentView();
+    const _r20 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 85);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_13_For_2_Template_div_click_0_listener($event) { const version_r22 = i0.ɵɵrestoreView(_r21).$implicit; const artifact_r19 = i0.ɵɵnextContext(2).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); ctx_r2.openArtifactFromModal(artifact_r19.artifactId, version_r22.versionNumber); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_13_For_2_Template_div_click_0_listener($event) { const version_r21 = i0.ɵɵrestoreView(_r20).$implicit; const artifact_r18 = i0.ɵɵnextContext(2).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); ctx_r2.openArtifactFromModal(artifact_r18.artifactId, version_r21.versionNumber); return i0.ɵɵresetView($event.stopPropagation()); });
     i0.ɵɵelementStart(1, "span", 86);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
@@ -289,23 +288,23 @@ function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_13_For_
     i0.ɵɵelement(5, "i", 88);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const version_r22 = ctx.$implicit;
+    const version_r21 = ctx.$implicit;
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1("v", version_r22.versionNumber, "");
+    i0.ɵɵtextInterpolate1("v", version_r21.versionNumber, "");
 } }
 function ConversationChatAreaComponent_Conditional_13_For_12_Conditional_13_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 81);
     i0.ɵɵrepeaterCreate(1, ConversationChatAreaComponent_Conditional_13_For_12_Conditional_13_For_2_Template, 6, 1, "div", 84, _forTrack2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const artifact_r19 = i0.ɵɵnextContext().$implicit;
+    const artifact_r18 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵrepeater(artifact_r19.versions);
+    i0.ɵɵrepeater(artifact_r18.versions);
 } }
 function ConversationChatAreaComponent_Conditional_13_For_12_Template(rf, ctx) { if (rf & 1) {
-    const _r18 = i0.ɵɵgetCurrentView();
+    const _r17 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 71)(1, "div", 72);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_For_12_Template_div_click_1_listener() { const artifact_r19 = i0.ɵɵrestoreView(_r18).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.openArtifactFromModal(artifact_r19.artifactId)); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_For_12_Template_div_click_1_listener() { const artifact_r18 = i0.ɵɵrestoreView(_r17).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.openArtifactFromModal(artifact_r18.artifactId)); });
     i0.ɵɵelementStart(2, "div", 73);
     i0.ɵɵelement(3, "i", 74);
     i0.ɵɵelementEnd();
@@ -322,31 +321,31 @@ function ConversationChatAreaComponent_Conditional_13_For_12_Template(rf, ctx) {
     i0.ɵɵtemplate(13, ConversationChatAreaComponent_Conditional_13_For_12_Conditional_13_Template, 3, 0, "div", 81);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const artifact_r19 = ctx.$implicit;
+    const artifact_r18 = ctx.$implicit;
     const ctx_r2 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("expanded", ctx_r2.expandedArtifactId === artifact_r19.artifactId)("system-artifact", artifact_r19.visibility === "System Only");
+    i0.ɵɵclassProp("expanded", ctx_r2.expandedArtifactId === artifact_r18.artifactId)("system-artifact", artifact_r18.visibility === "System Only");
     i0.ɵɵadvance(6);
-    i0.ɵɵtextInterpolate(artifact_r19.name);
+    i0.ɵɵtextInterpolate(artifact_r18.name);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(artifact_r19.versionCount > 1 ? 8 : 9);
+    i0.ɵɵconditional(artifact_r18.versionCount > 1 ? 8 : 9);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(artifact_r19.versionCount > 1 ? 10 : -1);
+    i0.ɵɵconditional(artifact_r18.versionCount > 1 ? 10 : -1);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r2.expandedArtifactId === artifact_r19.artifactId && artifact_r19.versionCount > 1 ? 13 : -1);
+    i0.ɵɵconditional(ctx_r2.expandedArtifactId === artifact_r18.artifactId && artifact_r18.versionCount > 1 ? 13 : -1);
 } }
 function ConversationChatAreaComponent_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    const _r16 = i0.ɵɵgetCurrentView();
+    const _r15 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 54);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showArtifactsModal = false); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r15); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showArtifactsModal = false); });
     i0.ɵɵelementStart(1, "div", 61);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r16); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r15); return i0.ɵɵresetView($event.stopPropagation()); });
     i0.ɵɵelementStart(2, "div", 56)(3, "h3");
     i0.ɵɵtext(4, "Conversation Artifacts");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(5, "div", 62);
     i0.ɵɵtemplate(6, ConversationChatAreaComponent_Conditional_13_Conditional_6_Template, 4, 3, "button", 63);
     i0.ɵɵelementStart(7, "button", 57);
-    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showArtifactsModal = false); });
+    i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_13_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r15); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.showArtifactsModal = false); });
     i0.ɵɵelement(8, "i", 58);
     i0.ɵɵelementEnd()()();
     i0.ɵɵelementStart(9, "div", 64);
@@ -363,16 +362,16 @@ function ConversationChatAreaComponent_Conditional_13_Template(rf, ctx) { if (rf
     i0.ɵɵrepeater(ctx_r2.getArtifactsArray());
 } }
 function ConversationChatAreaComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    const _r23 = i0.ɵɵgetCurrentView();
+    const _r22 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "mj-artifact-collection-picker-modal", 89);
-    i0.ɵɵlistener("saved", function ConversationChatAreaComponent_Conditional_14_Template_mj_artifact_collection_picker_modal_saved_0_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onCollectionPickerSaved($event)); })("cancelled", function ConversationChatAreaComponent_Conditional_14_Template_mj_artifact_collection_picker_modal_cancelled_0_listener() { i0.ɵɵrestoreView(_r23); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onCollectionPickerCancelled()); });
+    i0.ɵɵlistener("saved", function ConversationChatAreaComponent_Conditional_14_Template_mj_artifact_collection_picker_modal_saved_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onCollectionPickerSaved($event)); })("cancelled", function ConversationChatAreaComponent_Conditional_14_Template_mj_artifact_collection_picker_modal_cancelled_0_listener() { i0.ɵɵrestoreView(_r22); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onCollectionPickerCancelled()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵproperty("isOpen", ctx_r2.showCollectionPicker)("environmentId", ctx_r2.environmentId)("currentUser", ctx_r2.currentUser)("excludeCollectionIds", ctx_r2.collectionPickerExcludedIds);
 } }
 export class ConversationChatAreaComponent {
-    conversationState;
+    conversationData;
     agentStateService;
     conversationAgentService;
     activeTasks;
@@ -382,18 +381,46 @@ export class ConversationChatAreaComponent {
     dialogService;
     environmentId;
     currentUser;
+    // LOCAL STATE INPUTS - passed from parent workspace
+    _conversationId = null;
+    set conversationId(value) {
+        if (value !== this._conversationId) {
+            this._conversationId = value;
+            // Trigger change handler after initialization is complete
+            // Only skip during Angular's initial binding before ngOnInit completes
+            if (this.isInitialized) {
+                this.onConversationChanged(value);
+            }
+        }
+    }
+    get conversationId() {
+        return this._conversationId;
+    }
+    conversation = null;
+    threadId = null;
+    isNewConversation = false;
+    pendingMessage = null;
+    pendingArtifactId = null;
+    pendingArtifactVersionNumber = null;
     conversationRenamed = new EventEmitter();
     openEntityRecord = new EventEmitter();
     taskClicked = new EventEmitter();
     artifactLinkClicked = new EventEmitter();
+    // STATE CHANGE OUTPUTS - notify parent of state changes
+    conversationCreated = new EventEmitter();
+    threadOpened = new EventEmitter();
+    threadClosed = new EventEmitter();
+    pendingArtifactConsumed = new EventEmitter();
+    pendingMessageConsumed = new EventEmitter();
+    pendingMessageRequested = new EventEmitter();
     scrollContainer;
     messageInputComponent;
     artifactViewerComponent;
     messages = [];
     showScrollToBottomIcon = false;
     scrollToBottom = false;
-    previousConversationId = null;
     lastLoadedConversationId = null; // Track which conversation's peripheral data was loaded
+    currentlyLoadingConversationId = null; // Track which conversation is currently being loaded
     isProcessing = false;
     intentCheckMessage = null; // Temporary message shown during intent checking
     isLoadingConversation = true; // True while loading initial conversation messages
@@ -473,8 +500,8 @@ export class ConversationChatAreaComponent {
     startWidth = 0;
     // LocalStorage key
     ARTIFACT_PANE_WIDTH_KEY = 'mj-conversations-artifact-pane-width';
-    constructor(conversationState, agentStateService, conversationAgentService, activeTasks, cdr, mentionAutocompleteService, artifactPermissionService, dialogService) {
-        this.conversationState = conversationState;
+    constructor(conversationData, agentStateService, conversationAgentService, activeTasks, cdr, mentionAutocompleteService, artifactPermissionService, dialogService) {
+        this.conversationData = conversationData;
         this.agentStateService = agentStateService;
         this.conversationAgentService = conversationAgentService;
         this.activeTasks = activeTasks;
@@ -494,11 +521,11 @@ export class ConversationChatAreaComponent {
         }
         // Load saved artifact pane width
         this.loadArtifactPaneWidth();
-        // Mark as initialized so ngDoCheck can proceed
+        // Mark as initialized so setter can trigger conversation changes
         this.isInitialized = true;
         // Initial load if there's already an active conversation
-        if (this.conversationState.activeConversationId) {
-            await this.onConversationChanged(this.conversationState.activeConversationId);
+        if (this.conversationId) {
+            await this.onConversationChanged(this.conversationId);
         }
         // Setup resize listeners
         window.addEventListener('mousemove', this.onResizeMove.bind(this));
@@ -506,19 +533,6 @@ export class ConversationChatAreaComponent {
         window.addEventListener('touchmove', this.onResizeTouchMove.bind(this));
         window.addEventListener('touchend', this.onResizeTouchEnd.bind(this));
     }
-    ngDoCheck() {
-        // Don't process conversation changes until initialization is complete
-        // This prevents race condition where messages load before agents are ready
-        if (!this.isInitialized) {
-            return;
-        }
-        // Detect conversation ID changes using change detection
-        const currentId = this.conversationState.activeConversationId;
-        if (currentId !== this.previousConversationId) {
-            this.previousConversationId = currentId;
-            this.onConversationChanged(currentId);
-        }
-    }
     ngAfterViewChecked() {
         if (this.scrollToBottom) {
             this.scrollToBottom = false;
@@ -545,44 +559,56 @@ export class ConversationChatAreaComponent {
         window.removeEventListener('touchend', this.onResizeTouchEnd.bind(this));
     }
     async onConversationChanged(conversationId) {
-        // Do NOT clear activeTasks here - they are workspace-level and should persist across conversation switches
-        // Tasks will be automatically removed when agents complete (via markMessageComplete in MessageInputComponent)
-        // Clearing here causes bugs: global tasks panel blanks out, no notifications when switching, spinners disappear
-        // Clear message status tracking for previous conversation
+        // Prevent double-loading if we're already loading this same conversation
+        // (ngDoCheck can fire multiple times during state changes)
+        if (this.currentlyLoadingConversationId === conversationId && conversationId !== null) {
+            return;
+        }
+        // Do NOT clear activeTasks - they are workspace-level and persist across conversations
+        // Clearing causes bugs: global tasks panel blanks out, no notifications when switching
         this.previousMessageStatuses.clear();
-        // Hide artifact panel when conversation changes
         this.showArtifactPanel = false;
         this.selectedArtifactId = null;
         if (conversationId) {
-            // Add conversation to message-input cache if not already present
+            this.currentlyLoadingConversationId = conversationId;
             if (!this.messageInputMetadataCache.has(conversationId)) {
-                const conversation = this.conversationState.activeConversation;
                 this.messageInputMetadataCache.set(conversationId, {
                     conversationId: conversationId,
-                    conversationName: conversation?.Name || null
+                    conversationName: this.conversation?.Name || null
                 });
             }
-            // Show loading state
             this.isLoadingConversation = true;
-            this.messages = []; // Clear messages to avoid showing stale data
+            this.messages = [];
             this.cdr.detectChanges();
             try {
                 await this.loadMessages(conversationId);
                 await this.restoreActiveTasks(conversationId);
                 this.agentStateService.startPolling(this.currentUser, conversationId);
             }
+            catch (error) {
+                console.error('Error loading conversation:', error);
+                this.messages = [];
+            }
             finally {
-                // Hide loading state
+                this.currentlyLoadingConversationId = null;
                 this.isLoadingConversation = false;
+                // Create new array reference to trigger Angular change detection
+                this.messages = [...this.messages];
                 this.cdr.detectChanges();
-                // Pending message will be passed to message-input component via [initialMessage] Input
-                // The component will handle sending it when it initializes
+                // Defensive fallback: force another change detection cycle after async ops complete
+                setTimeout(() => {
+                    if (conversationId === this._conversationId && this.messages.length > 0) {
+                        this.messages = [...this.messages];
+                        this.cdr.detectChanges();
+                    }
+                }, 50);
             }
         }
         else {
             // No active conversation - show empty state
             this.messages = [];
             this.isLoadingConversation = false;
+            this.currentlyLoadingConversationId = null;
             this.agentStateService.stopPolling();
         }
     }
@@ -596,15 +622,12 @@ export class ConversationChatAreaComponent {
     }
     async loadMessages(conversationId) {
         try {
-            // Check if we have cached data for this conversation
             const cachedData = this.conversationDataCache.get(conversationId);
             if (cachedData) {
-                // Use cached data - instant load!
-                this.buildMessagesFromCache(cachedData);
-                this.loadPeripheralData(conversationId); // Process cached data for maps
+                await this.buildMessagesFromCache(cachedData);
+                await this.loadPeripheralData(conversationId);
             }
             else {
-                // Load from database with single optimized query
                 const rq = new RunQuery();
                 const result = await rq.RunQuery({
                     QueryName: 'GetConversationComplete',
@@ -616,20 +639,15 @@ export class ConversationChatAreaComponent {
                     this.messages = [];
                     return;
                 }
-                // Cache the raw results for future use
                 const conversationData = result.Results;
                 this.conversationDataCache.set(conversationId, conversationData);
-                // Build messages and show immediately
-                this.buildMessagesFromCache(conversationData);
-                // Process peripheral data (agent runs & artifacts) in background
+                await this.buildMessagesFromCache(conversationData);
                 this.isLoadingPeripheralData = true;
                 await this.loadPeripheralData(conversationId);
                 this.isLoadingPeripheralData = false;
                 this.cdr.detectChanges();
             }
-            // After loading messages, check for in-progress runs and ensure we're receiving updates
             await this.detectAndReconnectToInProgressRuns(conversationId);
-            // Check for pending artifact navigation (from collection link)
             await this.handlePendingArtifactNavigation();
         }
         catch (error) {
@@ -644,23 +662,17 @@ export class ConversationChatAreaComponent {
     async buildMessagesFromCache(conversationData) {
         const md = new Metadata();
         const messages = [];
-        // Store raw conversation data for access to query-specific fields
         this.rawConversationData = conversationData;
-        // Build user avatar map for fast lookups
         this.buildUserAvatarMap(conversationData);
         for (const row of conversationData) {
             if (!row.ID)
                 continue;
-            // Create entity object and load from raw data
             const message = await md.GetEntityObject('Conversation Details', this.currentUser);
-            // LoadFromData expects the same structure as the query result
-            // Since we're using SELECT *, all fields should be present
             message.LoadFromData(row);
             messages.push(message);
         }
         this.messages = messages;
-        // CRITICAL: Initialize status tracking map BEFORE any callbacks fire
-        // This captures the initial state so the completion detector can see transitions
+        // Initialize status tracking to detect message completion
         this.previousMessageStatuses.clear();
         for (const message of messages) {
             if (message.ID && message.Status) {
@@ -668,19 +680,16 @@ export class ConversationChatAreaComponent {
             }
         }
         // Detect in-progress messages for streaming reconnection
-        // IMPORTANT: Always create NEW array reference to trigger Input setter in message-input component
+        // Always create NEW array reference to trigger Input setter in message-input component
         this.inProgressMessageIds = [...messages
                 .filter(m => m.Status === 'In-Progress')
                 .map(m => m.ID)];
         if (this.inProgressMessageIds.length > 0) {
             LogStatusEx({ message: `🔌 Detected ${this.inProgressMessageIds.length} in-progress messages for reconnection`, verboseOnly: true });
-            // Note: Reconnection now happens automatically via Input setter in message-input component
-            // CRITICAL: Restart the timer to monitor these in-progress messages for completion
-            // This ensures the completion detector runs even if the timer stopped before tracking was initialized
             this.startAgentRunUpdateTimer();
         }
         this.scrollToBottom = true;
-        this.cdr.detectChanges(); // Show messages immediately
+        LogStatusEx({ message: `✅ Built ${messages.length} messages from cache`, verboseOnly: true });
     }
     /**
      * Builds a map of UserID -> Avatar data for fast lookups
@@ -825,9 +834,9 @@ export class ConversationChatAreaComponent {
         // Database tasks are loaded separately by TasksDropdownComponent
     }
     onMessageSent(message) {
-        // Clear pending message if it was sent
-        if (this.conversationState.pendingMessageToSend) {
-            this.conversationState.pendingMessageToSend = null;
+        // Clear pending message if it was sent - notify parent via output
+        if (this.pendingMessage) {
+            this.pendingMessageConsumed.emit();
         }
         // Check if message already exists in the array (by ID) to prevent duplicates
         // Messages can be emitted multiple times as they're updated (e.g., status changes)
@@ -974,7 +983,7 @@ export class ConversationChatAreaComponent {
      * Called when completion is detected to discover newly delegated agent messages
      */
     async reloadMessagesForActiveConversation() {
-        const conversationId = this.conversationState.activeConversationId;
+        const conversationId = this.conversationId;
         if (!conversationId) {
             return;
         }
@@ -1084,9 +1093,8 @@ export class ConversationChatAreaComponent {
         // Add the agent's response message to the conversation
         this.messages = [...this.messages, event.message];
         // Invalidate cache for this conversation since we have new messages
-        const conversationId = this.conversationState.activeConversationId;
-        if (conversationId) {
-            this.invalidateConversationCache(conversationId);
+        if (this.conversationId) {
+            this.invalidateConversationCache(this.conversationId);
         }
         // Scroll to bottom when agent responds
         this.scrollToBottom = true;
@@ -1367,7 +1375,7 @@ export class ConversationChatAreaComponent {
         await this.loadArtifactPermissions(artifactId);
     }
     exportConversation() {
-        if (this.conversationState.activeConversation) {
+        if (this.conversation) {
             this.showExportModal = true;
         }
     }
@@ -1378,20 +1386,19 @@ export class ConversationChatAreaComponent {
         this.showExportModal = false;
     }
     async onProjectSelected(project) {
-        const activeConv = this.conversationState.activeConversation;
-        if (activeConv && project) {
+        if (this.conversation && project) {
             try {
-                await this.conversationState.saveConversation(activeConv.ID, { ProjectID: project.ID }, this.currentUser);
+                await this.conversationData.saveConversation(this.conversation.ID, { ProjectID: project.ID }, this.currentUser);
                 this.showProjectSelector = false;
             }
             catch (error) {
                 console.error('Failed to assign project:', error);
             }
         }
-        else if (activeConv && !project) {
+        else if (this.conversation && !project) {
             // Remove project assignment
             try {
-                await this.conversationState.saveConversation(activeConv.ID, { ProjectID: null }, this.currentUser);
+                await this.conversationData.saveConversation(this.conversation.ID, { ProjectID: null }, this.currentUser);
                 this.showProjectSelector = false;
             }
             catch (error) {
@@ -1404,25 +1411,24 @@ export class ConversationChatAreaComponent {
         LogStatusEx({ message: 'Share conversation', verboseOnly: true });
     }
     onReplyInThread(message) {
-        // Open thread panel for this message
-        this.conversationState.openThread(message.ID);
+        // Open thread panel for this message - emit to parent
+        this.threadOpened.emit(message.ID);
     }
     onViewThread(message) {
-        // Open thread panel for this message
-        this.conversationState.openThread(message.ID);
+        // Open thread panel for this message - emit to parent
+        this.threadOpened.emit(message.ID);
     }
-    onThreadClosed() {
-        // Close the thread panel
-        this.conversationState.closeThread();
+    onLocalThreadClosed() {
+        // Close the thread panel - emit to parent
+        this.threadClosed.emit();
     }
     onThreadReplyAdded(reply) {
         // Optionally refresh the message list to update thread counts
         // For now, we'll just log it
         LogStatusEx({ message: 'Thread reply added', verboseOnly: true, additionalArgs: [reply] });
         // Reload messages to get updated thread counts
-        const activeConv = this.conversationState.activeConversation;
-        if (activeConv) {
-            this.loadMessages(activeConv.ID);
+        if (this.conversationId) {
+            this.loadMessages(this.conversationId);
         }
     }
     onToggleAgentPanel() {
@@ -1448,10 +1454,10 @@ export class ConversationChatAreaComponent {
     async onSuggestedResponseSelected(event) {
         const messageText = event.customInput || event.text;
         // If we have an active conversation with message input available, use it
-        if (this.messageInputComponent && !this.conversationState.isNewUnsavedConversation) {
+        if (this.messageInputComponent && !this.isNewConversation) {
             await this.messageInputComponent.sendMessageWithText(messageText);
         }
-        else if (!this.conversationState.activeConversation || this.conversationState.isNewUnsavedConversation) {
+        else if (!this.conversation || this.isNewConversation) {
             // If no conversation or in new unsaved state, route through empty state handler
             // This will create the conversation and send the message
             await this.onEmptyStateMessageSent(messageText);
@@ -1677,7 +1683,7 @@ export class ConversationChatAreaComponent {
     }
     /**
      * Handle message sent from empty state component
-     * Creates a new conversation and sends the message
+     * Creates a new conversation and emits to parent to update selection
      */
     async onEmptyStateMessageSent(messageText) {
         if (!messageText || !messageText.trim()) {
@@ -1686,27 +1692,23 @@ export class ConversationChatAreaComponent {
         LogStatusEx({ message: '📨 Empty state message received', verboseOnly: true, additionalArgs: [messageText] });
         try {
             this.isProcessing = true;
-            // Store the message to send after conversation loads (in service to persist across component lifecycle)
-            this.conversationState.pendingMessageToSend = messageText.trim();
-            LogStatusEx({ message: '💾 Stored pending message in service', verboseOnly: true, additionalArgs: [this.conversationState.pendingMessageToSend] });
-            // Create a new conversation
-            const newConversation = await this.conversationState.createConversation('New Conversation', // Temporary name - will be auto-named after first message
+            // Create a new conversation using the data service
+            const newConversation = await this.conversationData.createConversation('New Conversation', // Temporary name - will be auto-named after first message
             this.environmentId, this.currentUser);
             if (!newConversation) {
                 console.error('❌ Failed to create new conversation');
-                this.conversationState.pendingMessageToSend = null;
                 this.isProcessing = false;
                 return;
             }
             LogStatusEx({ message: '✅ Created new conversation', verboseOnly: true, additionalArgs: [newConversation.ID] });
-            // Clear the new unsaved conversation state since we've now created it
-            this.conversationState.clearNewConversationState();
-            // Set as active conversation (this will trigger onConversationChanged which will send the message)
-            this.conversationState.activeConversationId = newConversation.ID;
+            // Emit to parent with the new conversation AND the pending message
+            // Parent will update its state and pass back the message via pendingMessage input
+            this.conversationCreated.emit(newConversation);
+            // Also emit the pending message to be sent (parent will pass it back via input)
+            this.pendingMessageRequested.emit(messageText.trim());
         }
         catch (error) {
             console.error('❌ Error creating conversation from empty state:', error);
-            this.conversationState.pendingMessageToSend = null;
         }
         finally {
             this.isProcessing = false;
@@ -1757,8 +1759,11 @@ export class ConversationChatAreaComponent {
         this.taskClicked.emit(task);
     }
     onNavigateToConversation(event) {
-        // Navigate to the conversation with the active task
-        this.conversationState.setActiveConversation(event.conversationId);
+        // Navigate to the conversation with the active task - emit to parent
+        // Parent will update its selection state
+        // For now, we can't navigate to a different conversation from within chat area
+        // This would require emitting an event to the parent
+        console.log('Navigate to conversation requested:', event.conversationId);
     }
     /**
      * Handle navigation request from artifact viewer Links tab
@@ -1894,22 +1899,22 @@ export class ConversationChatAreaComponent {
      * Opens the artifact and scrolls to the message containing it
      */
     async handlePendingArtifactNavigation() {
-        const pendingArtifactId = this.conversationState.pendingArtifactId;
-        const pendingVersionNumber = this.conversationState.pendingArtifactVersionNumber;
-        if (!pendingArtifactId) {
+        if (!this.pendingArtifactId) {
             return; // No pending navigation
         }
-        console.log('📦 Processing pending artifact navigation:', pendingArtifactId, 'v' + pendingVersionNumber);
-        // Clear pending values immediately to prevent re-processing
-        this.conversationState.pendingArtifactId = null;
-        this.conversationState.pendingArtifactVersionNumber = null;
+        console.log('📦 Processing pending artifact navigation:', this.pendingArtifactId, 'v' + this.pendingArtifactVersionNumber);
+        // Capture values before emitting consumed event
+        const artifactIdToOpen = this.pendingArtifactId;
+        const versionNumberToOpen = this.pendingArtifactVersionNumber;
+        // Notify parent that we consumed the pending artifact
+        this.pendingArtifactConsumed.emit();
         // Find the message containing this artifact version
         let messageIdWithArtifact = null;
         for (const [detailId, artifactList] of this.artifactsByDetailId.entries()) {
             for (const artifactInfo of artifactList) {
-                if (artifactInfo.artifactId === pendingArtifactId) {
+                if (artifactInfo.artifactId === artifactIdToOpen) {
                     // Found the artifact - check if version matches (if specified)
-                    if (pendingVersionNumber == null || artifactInfo.versionNumber === pendingVersionNumber) {
+                    if (versionNumberToOpen == null || artifactInfo.versionNumber === versionNumberToOpen) {
                         messageIdWithArtifact = detailId;
                         console.log('✅ Found artifact in message:', detailId);
                         break;
@@ -1920,15 +1925,15 @@ export class ConversationChatAreaComponent {
                 break;
         }
         if (!messageIdWithArtifact) {
-            console.warn('⚠️ Could not find message containing artifact:', pendingArtifactId);
+            console.warn('⚠️ Could not find message containing artifact:', artifactIdToOpen);
             return;
         }
         // Open the artifact panel
-        this.selectedArtifactId = pendingArtifactId;
-        this.selectedVersionNumber = pendingVersionNumber ?? undefined;
+        this.selectedArtifactId = artifactIdToOpen;
+        this.selectedVersionNumber = versionNumberToOpen ?? undefined;
         this.showArtifactPanel = true;
         // Load permissions for the artifact
-        await this.loadArtifactPermissions(pendingArtifactId);
+        await this.loadArtifactPermissions(artifactIdToOpen);
         // Scroll to the message
         this.scrollToMessage(messageIdWithArtifact);
         console.log('✅ Opened artifact and scrolled to message:', messageIdWithArtifact);
@@ -1984,7 +1989,7 @@ export class ConversationChatAreaComponent {
             this.cdr.detectChanges();
         }
     }
-    static ɵfac = function ConversationChatAreaComponent_Factory(t) { return new (t || ConversationChatAreaComponent)(i0.ɵɵdirectiveInject(i1.ConversationStateService), i0.ɵɵdirectiveInject(i2.AgentStateService), i0.ɵɵdirectiveInject(i3.ConversationAgentService), i0.ɵɵdirectiveInject(i4.ActiveTasksService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i5.MentionAutocompleteService), i0.ɵɵdirectiveInject(i6.ArtifactPermissionService), i0.ɵɵdirectiveInject(i7.DialogService)); };
+    static ɵfac = function ConversationChatAreaComponent_Factory(t) { return new (t || ConversationChatAreaComponent)(i0.ɵɵdirectiveInject(i1.ConversationDataService), i0.ɵɵdirectiveInject(i2.AgentStateService), i0.ɵɵdirectiveInject(i3.ConversationAgentService), i0.ɵɵdirectiveInject(i4.ActiveTasksService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i5.MentionAutocompleteService), i0.ɵɵdirectiveInject(i6.ArtifactPermissionService), i0.ɵɵdirectiveInject(i7.DialogService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ConversationChatAreaComponent, selectors: [["mj-conversation-chat-area"]], viewQuery: function ConversationChatAreaComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0, 5);
             i0.ɵɵviewQuery(_c1, 5);
@@ -1994,7 +1999,7 @@ export class ConversationChatAreaComponent {
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.scrollContainer = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.messageInputComponent = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.artifactViewerComponent = _t.first);
-        } }, inputs: { environmentId: "environmentId", currentUser: "currentUser" }, outputs: { conversationRenamed: "conversationRenamed", openEntityRecord: "openEntityRecord", taskClicked: "taskClicked", artifactLinkClicked: "artifactLinkClicked" }, decls: 15, vars: 20, consts: [["scrollContainer", ""], ["messageInput", ""], [1, "chat-area"], ["class", "chat-header", 4, "ngIf"], [1, "chat-content-area"], [1, "chat-messages-pane"], [3, "currentUser", "disabled"], [1, "conversation-loading-state"], [1, "chat-messages-wrapper"], [1, "chat-artifact-pane", 3, "width", "maximized"], [3, "saved", "cancelled", "isOpen", "artifact", "currentUser"], [3, "parentMessageId", "conversationId", "currentUser"], [3, "cancelled", "exported", "isVisible", "conversation", "currentUser"], [3, "cancelled", "membersChanged", "isVisible", "conversation", "currentUser"], [1, "modal-overlay"], [3, "isOpen", "environmentId", "currentUser", "excludeCollectionIds"], [1, "chat-header"], [1, "chat-info"], [1, "chat-title"], ["class", "project-tag", "title", "Assign to project", 3, "click", 4, "ngIf"], ["class", "test-indicator", "title", "View Test Run", 3, "click", 4, "ngIf"], [3, "togglePanel", "agentSelected", "conversationId", "currentUser"], [1, "chat-actions"], ["title", "View members", 1, "chat-members", 3, "click"], [1, "fas", "fa-users"], ["class", "artifact-indicator", "title", "View artifacts", 3, "click", 4, "ngIf"], ["title", "Export conversation", 1, "action-btn", 3, "click"], [1, "fas", "fa-download"], [1, "action-btn", "share-btn", 3, "click", "title"], [1, "fas", "fa-share-nodes"], ["title", "Assign to project", 1, "project-tag", 3, "click"], [1, "fas", "fa-folder"], ["title", "View Test Run", 1, "test-indicator", 3, "click"], [1, "fas", "fa-flask"], ["title", "View artifacts", 1, "artifact-indicator", 3, "click"], [1, "fas", "fa-cube"], [3, "messageSent", "currentUser", "disabled"], ["text", "Loading conversation...", "size", "large"], [1, "chat-messages-container", 3, "scroll"], [3, "replyInThread", "viewThread", "retryMessage", "testFeedbackMessage", "artifactClicked", "messageEdited", "openEntityRecord", "suggestedResponseSelected", "messages", "conversation", "currentUser", "isProcessing", "artifactMap", "agentRunMap", "ratingsMap", "userAvatarMap"], ["class", "scroll-to-bottom-icon", "style", "left: 50%;", 3, "click", 4, "ngIf"], [1, "chat-input-container"], [1, "loading-peripheral-placeholder"], [1, "message-input-container-wrapper"], [1, "scroll-to-bottom-icon", 2, "left", "50%", 3, "click"], [1, "fas", "fa-arrow-down"], ["text", "Loading conversation data...", "size", "medium"], [3, "hidden", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "inProgressMessageIds", "disabled", "initialMessage"], [3, "messageSent", "agentResponse", "agentRunDetected", "agentRunUpdate", "messageComplete", "artifactCreated", "conversationRenamed", "intentCheckStarted", "intentCheckCompleted", "hidden", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "inProgressMessageIds", "disabled", "initialMessage"], [1, "resize-handle"], [1, "chat-artifact-pane"], [3, "closed", "saveToCollectionRequested", "navigateToLink", "shareRequested", "maximizeToggled", "artifactId", "currentUser", "environmentId", "versionNumber", "viewContext", "canShare", "canEdit", "isMaximized", "refreshTrigger"], [1, "resize-handle", 3, "mousedown", "touchstart"], [3, "closed", "replyAdded", "parentMessageId", "conversationId", "currentUser"], [1, "modal-overlay", 3, "click"], [1, "modal-content", "project-selector-modal", 3, "click"], [1, "modal-header"], [1, "modal-close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "modal-body"], [3, "projectSelected", "environmentId", "currentUser", "selectedProjectId"], [1, "modal-content", "artifacts-modal", 3, "click"], [1, "modal-header-actions"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "active"], [1, "modal-body", "artifacts-grid"], [1, "empty-state"], [1, "artifact-modal-card", 3, "expanded", "system-artifact"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "click"], [1, "fas", "fa-cog"], [1, "fas", "fa-cube", 2, "font-size", "48px", "color", "#D1D5DB", "margin-bottom", "16px"], [2, "color", "#6B7280", "font-size", "14px"], [1, "artifact-modal-card"], [1, "artifact-card-header", 3, "click"], [1, "artifact-modal-icon"], [1, "fas", "fa-file-code"], [1, "artifact-modal-info"], [1, "artifact-modal-title"], [1, "artifact-modal-meta"], [1, "expand-btn"], [1, "artifact-modal-action"], [1, "fas", "fa-external-link-alt"], [1, "artifact-versions-list"], [1, "expand-btn", 3, "click"], [1, "fas"], [1, "artifact-version-item"], [1, "artifact-version-item", 3, "click"], [1, "version-badge"], [1, "version-open-text"], [1, "fas", "fa-arrow-right"], [3, "saved", "cancelled", "isOpen", "environmentId", "currentUser", "excludeCollectionIds"]], template: function ConversationChatAreaComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { environmentId: "environmentId", currentUser: "currentUser", conversationId: "conversationId", conversation: "conversation", threadId: "threadId", isNewConversation: "isNewConversation", pendingMessage: "pendingMessage", pendingArtifactId: "pendingArtifactId", pendingArtifactVersionNumber: "pendingArtifactVersionNumber" }, outputs: { conversationRenamed: "conversationRenamed", openEntityRecord: "openEntityRecord", taskClicked: "taskClicked", artifactLinkClicked: "artifactLinkClicked", conversationCreated: "conversationCreated", threadOpened: "threadOpened", threadClosed: "threadClosed", pendingArtifactConsumed: "pendingArtifactConsumed", pendingMessageConsumed: "pendingMessageConsumed", pendingMessageRequested: "pendingMessageRequested" }, decls: 15, vars: 20, consts: [["scrollContainer", ""], ["messageInput", ""], [1, "chat-area"], ["class", "chat-header", 4, "ngIf"], [1, "chat-content-area"], [1, "chat-messages-pane"], [3, "currentUser", "disabled"], [1, "conversation-loading-state"], [1, "chat-messages-wrapper"], [1, "chat-artifact-pane", 3, "width", "maximized"], [3, "saved", "cancelled", "isOpen", "artifact", "currentUser"], [3, "parentMessageId", "conversationId", "currentUser"], [3, "cancelled", "exported", "isVisible", "conversation", "currentUser"], [3, "cancelled", "membersChanged", "isVisible", "conversation", "currentUser"], [1, "modal-overlay"], [3, "isOpen", "environmentId", "currentUser", "excludeCollectionIds"], [1, "chat-header"], [1, "chat-info"], [1, "chat-title"], ["class", "project-tag", "title", "Assign to project", 3, "click", 4, "ngIf"], ["class", "test-indicator", "title", "View Test Run", 3, "click", 4, "ngIf"], [3, "togglePanel", "agentSelected", "conversationId", "currentUser"], [1, "chat-actions"], ["title", "View members", 1, "chat-members", 3, "click"], [1, "fas", "fa-users"], ["class", "artifact-indicator", "title", "View artifacts", 3, "click", 4, "ngIf"], ["title", "Export conversation", 1, "action-btn", 3, "click"], [1, "fas", "fa-download"], [1, "action-btn", "share-btn", 3, "click", "title"], [1, "fas", "fa-share-nodes"], ["title", "Assign to project", 1, "project-tag", 3, "click"], [1, "fas", "fa-folder"], ["title", "View Test Run", 1, "test-indicator", 3, "click"], [1, "fas", "fa-flask"], ["title", "View artifacts", 1, "artifact-indicator", 3, "click"], [1, "fas", "fa-cube"], [3, "messageSent", "currentUser", "disabled"], ["text", "Loading conversation...", "size", "large"], [1, "chat-messages-container", 3, "scroll"], [3, "replyInThread", "viewThread", "retryMessage", "testFeedbackMessage", "artifactClicked", "messageEdited", "openEntityRecord", "suggestedResponseSelected", "messages", "conversation", "currentUser", "isProcessing", "artifactMap", "agentRunMap", "ratingsMap", "userAvatarMap"], ["class", "scroll-to-bottom-icon", "style", "left: 50%;", 3, "click", 4, "ngIf"], [1, "chat-input-container"], [1, "loading-peripheral-placeholder"], [1, "message-input-container-wrapper"], [1, "scroll-to-bottom-icon", 2, "left", "50%", 3, "click"], [1, "fas", "fa-arrow-down"], ["text", "Loading conversation data...", "size", "medium"], [3, "hidden", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "inProgressMessageIds", "disabled", "initialMessage"], [3, "messageSent", "agentResponse", "agentRunDetected", "agentRunUpdate", "messageComplete", "artifactCreated", "conversationRenamed", "intentCheckStarted", "intentCheckCompleted", "hidden", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "inProgressMessageIds", "disabled", "initialMessage"], [1, "resize-handle"], [1, "chat-artifact-pane"], [3, "closed", "saveToCollectionRequested", "navigateToLink", "shareRequested", "maximizeToggled", "artifactId", "currentUser", "environmentId", "versionNumber", "viewContext", "canShare", "canEdit", "isMaximized", "refreshTrigger"], [1, "resize-handle", 3, "mousedown", "touchstart"], [3, "closed", "replyAdded", "parentMessageId", "conversationId", "currentUser"], [1, "modal-overlay", 3, "click"], [1, "modal-content", "project-selector-modal", 3, "click"], [1, "modal-header"], [1, "modal-close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "modal-body"], [3, "projectSelected", "environmentId", "currentUser", "selectedProjectId"], [1, "modal-content", "artifacts-modal", 3, "click"], [1, "modal-header-actions"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "active"], [1, "modal-body", "artifacts-grid"], [1, "empty-state"], [1, "artifact-modal-card", 3, "expanded", "system-artifact"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "click"], [1, "fas", "fa-cog"], [1, "fas", "fa-cube", 2, "font-size", "48px", "color", "#D1D5DB", "margin-bottom", "16px"], [2, "color", "#6B7280", "font-size", "14px"], [1, "artifact-modal-card"], [1, "artifact-card-header", 3, "click"], [1, "artifact-modal-icon"], [1, "fas", "fa-file-code"], [1, "artifact-modal-info"], [1, "artifact-modal-title"], [1, "artifact-modal-meta"], [1, "expand-btn"], [1, "artifact-modal-action"], [1, "fas", "fa-external-link-alt"], [1, "artifact-versions-list"], [1, "expand-btn", 3, "click"], [1, "fas"], [1, "artifact-version-item"], [1, "artifact-version-item", 3, "click"], [1, "version-badge"], [1, "version-open-text"], [1, "fas", "fa-arrow-right"], [3, "saved", "cancelled", "isOpen", "environmentId", "currentUser", "excludeCollectionIds"]], template: function ConversationChatAreaComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 2);
             i0.ɵɵtemplate(1, ConversationChatAreaComponent_div_1_Template, 21, 13, "div", 3);
             i0.ɵɵelementStart(2, "div", 4)(3, "div", 5);
@@ -2014,23 +2019,23 @@ export class ConversationChatAreaComponent {
             i0.ɵɵtemplate(12, ConversationChatAreaComponent_Conditional_12_Template, 9, 3, "div", 14)(13, ConversationChatAreaComponent_Conditional_13_Template, 13, 2, "div", 14)(14, ConversationChatAreaComponent_Conditional_14_Template, 1, 4, "mj-artifact-collection-picker-modal", 15);
         } if (rf & 2) {
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.conversationState.activeConversation);
+            i0.ɵɵproperty("ngIf", ctx.conversation);
             i0.ɵɵadvance(2);
             i0.ɵɵclassProp("full-width", !ctx.showArtifactPanel)("hidden", ctx.isArtifactPaneMaximized);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(!ctx.conversationState.activeConversation || ctx.conversationState.isNewUnsavedConversation ? 4 : ctx.isLoadingConversation ? 5 : 6);
+            i0.ɵɵconditional(ctx.isNewConversation || !ctx.conversationId ? 4 : ctx.isLoadingConversation ? 5 : 6);
             i0.ɵɵadvance(3);
             i0.ɵɵconditional(ctx.showArtifactPanel && ctx.selectedArtifactId ? 7 : -1);
             i0.ɵɵadvance();
             i0.ɵɵproperty("isOpen", ctx.isArtifactShareModalOpen)("artifact", ctx.artifactToShare)("currentUser", ctx.currentUser);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.conversationState.activeThreadId ? 9 : -1);
+            i0.ɵɵconditional(ctx.threadId ? 9 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("isVisible", ctx.showExportModal)("conversation", ctx.conversationState.activeConversation || undefined)("currentUser", ctx.currentUser);
+            i0.ɵɵproperty("isVisible", ctx.showExportModal)("conversation", ctx.conversation || undefined)("currentUser", ctx.currentUser);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("isVisible", ctx.showMembersModal)("conversation", ctx.conversationState.activeConversation || undefined)("currentUser", ctx.currentUser);
+            i0.ɵɵproperty("isVisible", ctx.showMembersModal)("conversation", ctx.conversation || undefined)("currentUser", ctx.currentUser);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.showProjectSelector && ctx.conversationState.activeConversation ? 12 : -1);
+            i0.ɵɵconditional(ctx.showProjectSelector && ctx.conversation ? 12 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.showArtifactsModal ? 13 : -1);
             i0.ɵɵadvance();
@@ -2039,11 +2044,25 @@ export class ConversationChatAreaComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ConversationChatAreaComponent, [{
         type: Component,
-        args: [{ selector: 'mj-conversation-chat-area', template: "<div class=\"chat-area\">\n    <!-- Fixed Header -->\n    <div class=\"chat-header\" *ngIf=\"conversationState.activeConversation as conversation\">\n    <div class=\"chat-info\">\n        <div class=\"chat-title\">{{ conversation.Name }}</div>\n        <button class=\"project-tag\" (click)=\"openProjectSelector()\" title=\"Assign to project\" *ngIf=\"conversation.ProjectID\">\n        <i class=\"fas fa-folder\"></i>\n        <span>{{ conversation.Project || 'Project' }}</span>\n        </button>\n        <button class=\"test-indicator\" (click)=\"viewTestRun(conversation.TestRunID)\" title=\"View Test Run\" *ngIf=\"conversation.TestRunID\">\n        <i class=\"fas fa-flask\"></i>\n        <span>Test</span>\n        </button>\n        <mj-active-agent-indicator\n        [conversationId]=\"conversationState.activeConversation.ID\"\n        [currentUser]=\"currentUser\"\n        (togglePanel)=\"onToggleAgentPanel()\"\n        (agentSelected)=\"onAgentSelected($event)\">\n        </mj-active-agent-indicator>\n    </div>\n    <div class=\"chat-actions\">\n        <button class=\"chat-members\" (click)=\"toggleMembersModal()\" title=\"View members\">\n        <i class=\"fas fa-users\"></i>\n        <span>{{ memberCount }} member{{ memberCount !== 1 ? 's' : '' }}</span>\n        </button>\n        <button class=\"artifact-indicator\" (click)=\"viewArtifacts()\" title=\"View artifacts\" *ngIf=\"artifactCountDisplay > 0\">\n        <i class=\"fas fa-cube\"></i>\n        <span>{{ artifactCountDisplay }} artifact{{ artifactCountDisplay !== 1 ? 's' : '' }}</span>\n        </button>\n        <mj-active-agent-indicator\n        [conversationId]=\"conversationState.activeConversation.ID\"\n        [currentUser]=\"currentUser\"\n        (togglePanel)=\"onToggleAgentPanel()\"\n        (agentSelected)=\"onAgentSelected($event)\">\n        </mj-active-agent-indicator>\n    </div>\n    <div class=\"chat-actions\">\n        <button class=\"action-btn\" (click)=\"exportConversation()\" title=\"Export conversation\">\n        <i class=\"fas fa-download\"></i>\n        Export\n        </button>\n        <button class=\"action-btn share-btn\"\n                [class.shared]=\"isShared\"\n                (click)=\"shareConversation()\"\n                [title]=\"isShared ? 'Manage sharing' : 'Share conversation'\">\n        <i class=\"fas fa-share-nodes\"></i>\n        Share\n        </button>\n    </div>\n    </div>\n\n    <!-- Messages and Artifact Split Layout -->\n    <div class=\"chat-content-area\">\n    <!-- Messages Pane -->\n    <div class=\"chat-messages-pane\"\n         [class.full-width]=\"!showArtifactPanel\"\n         [class.hidden]=\"isArtifactPaneMaximized\">\n        @if (!conversationState.activeConversation || conversationState.isNewUnsavedConversation) {\n          <!-- Empty State - No conversation selected OR new unsaved conversation -->\n          <mj-conversation-empty-state\n            [currentUser]=\"currentUser\"\n            [disabled]=\"isProcessing\"\n            (messageSent)=\"onEmptyStateMessageSent($event)\">\n          </mj-conversation-empty-state>\n        } @else if (isLoadingConversation) {\n          <!-- Loading State - Show centered spinner while conversation loads -->\n          <div class=\"conversation-loading-state\">\n            <mj-loading text=\"Loading conversation...\" size=\"large\"></mj-loading>\n          </div>\n        } @else {\n          <!-- Normal Message View -->\n          <div class=\"chat-messages-wrapper\">\n          <div class=\"chat-messages-container\" #scrollContainer (scroll)=\"checkScroll()\">\n              <mj-conversation-message-list\n              [messages]=\"messages\"\n              [conversation]=\"conversationState.activeConversation\"\n              [currentUser]=\"currentUser\"\n              [isProcessing]=\"isProcessing\"\n              [artifactMap]=\"effectiveArtifactsMap\"\n              [agentRunMap]=\"agentRunsByDetailId\"\n              [ratingsMap]=\"ratingsByDetailId\"\n              [userAvatarMap]=\"userAvatarMap\"\n              (replyInThread)=\"onReplyInThread($event)\"\n              (viewThread)=\"onViewThread($event)\"\n              (retryMessage)=\"onRetryMessage($event)\"\n              (testFeedbackMessage)=\"onTestFeedbackMessage($event)\"\n              (artifactClicked)=\"onArtifactClicked($event)\"\n              (messageEdited)=\"onMessageEdited($event)\"\n              (openEntityRecord)=\"onOpenEntityRecord($event)\"\n              (suggestedResponseSelected)=\"onSuggestedResponseSelected($event)\">\n              </mj-conversation-message-list>\n\n              <!-- Scroll to Bottom Icon (positioned within scroll container for proper centering) -->\n              <span class=\"scroll-to-bottom-icon\" style=\"left: 50%;\"\n                    *ngIf=\"showScrollToBottomIcon && messages && messages.length > 0\"\n                    (click)=\"scrollToBottomAnimate()\">\n                  <i class=\"fas fa-arrow-down\"></i>\n              </span>\n          </div>\n\n          <!-- Fixed Input Area -->\n          <div class=\"chat-input-container\">\n              @if (isLoadingPeripheralData) {\n                <!-- Loading State -->\n                <div class=\"loading-peripheral-placeholder\">\n                  <mj-loading text=\"Loading conversation data...\" size=\"medium\"></mj-loading>\n                </div>\n              } @else {\n                <!-- Input Component - Multiple instances cached, only one visible -->\n                <div class=\"message-input-container-wrapper\">\n                  @for (inputRef of getCachedInputs(); track inputRef.conversationId) {\n                    <mj-message-input\n                      #messageInput\n                      [hidden]=\"inputRef.conversationId !== conversationState.activeConversation.ID\"\n                      [conversationId]=\"inputRef.conversationId\"\n                      [conversationName]=\"inputRef.conversationName\"\n                      [currentUser]=\"currentUser\"\n                      [conversationHistory]=\"inputRef.conversationId === conversationState.activeConversation.ID ? messages : []\"\n                      [artifactsByDetailId]=\"inputRef.conversationId === conversationState.activeConversation.ID ? artifactsByDetailId : emptyArtifactsMap\"\n                      [systemArtifactsByDetailId]=\"inputRef.conversationId === conversationState.activeConversation.ID ? systemArtifactsByDetailId : emptyArtifactsMap\"\n                      [agentRunsByDetailId]=\"inputRef.conversationId === conversationState.activeConversation.ID ? agentRunsByDetailId : emptyAgentRunsMap\"\n                      [inProgressMessageIds]=\"inputRef.conversationId === conversationState.activeConversation.ID ? inProgressMessageIds : emptyInProgressIds\"\n                      [disabled]=\"isProcessing\"\n                      [initialMessage]=\"inputRef.conversationId === conversationState.activeConversation.ID ? conversationState.pendingMessageToSend : null\"\n                      (messageSent)=\"onMessageSent($event)\"\n                      (agentResponse)=\"onAgentResponse($event)\"\n                      (agentRunDetected)=\"onAgentRunDetected($event)\"\n                      (agentRunUpdate)=\"onAgentRunUpdate($event)\"\n                      (messageComplete)=\"onMessageComplete($event)\"\n                      (artifactCreated)=\"onArtifactCreated($event)\"\n                      (conversationRenamed)=\"onConversationRenamed($event)\"\n                      (intentCheckStarted)=\"onIntentCheckStarted()\"\n                      (intentCheckCompleted)=\"onIntentCheckCompleted()\">\n                    </mj-message-input>\n                  }\n                </div>\n              }\n          </div>\n          </div>\n        }\n    </div>\n\n    <!-- Artifact Viewer Pane -->\n    @if (showArtifactPanel && selectedArtifactId) {\n        @if (!isArtifactPaneMaximized) {\n            <div class=\"resize-handle\" (mousedown)=\"onResizeStart($event)\" (touchstart)=\"onResizeTouchStart($event)\"></div>\n        }\n        <div class=\"chat-artifact-pane\"\n             [style.width.%]=\"artifactPaneWidth\"\n             [class.maximized]=\"isArtifactPaneMaximized\">\n        <mj-artifact-viewer-panel\n            [artifactId]=\"selectedArtifactId\"\n            [currentUser]=\"currentUser\"\n            [environmentId]=\"environmentId\"\n            [versionNumber]=\"selectedVersionNumber\"\n            [viewContext]=\"'conversation'\"\n            [canShare]=\"canShareSelectedArtifact\"\n            [canEdit]=\"canEditSelectedArtifact\"\n            [isMaximized]=\"isArtifactPaneMaximized\"\n            [refreshTrigger]=\"artifactViewerRefresh$\"\n            (closed)=\"onCloseArtifactPanel()\"\n            (saveToCollectionRequested)=\"onSaveToCollectionRequested($event)\"\n            (navigateToLink)=\"onArtifactLinkNavigation($event)\"\n            (shareRequested)=\"onArtifactShareRequested($event)\"\n            (maximizeToggled)=\"toggleMaximizeArtifactPane()\">\n        </mj-artifact-viewer-panel>\n        </div>\n    }\n\n    <!-- Artifact Share Modal -->\n    <mj-artifact-share-modal\n      [isOpen]=\"isArtifactShareModalOpen\"\n      [artifact]=\"artifactToShare\"\n      [currentUser]=\"currentUser\"\n      (saved)=\"onArtifactShared()\"\n      (cancelled)=\"onArtifactShareModalClose()\">\n    </mj-artifact-share-modal>\n    </div>\n</div>\n\n<!-- Thread Panel -->\n@if (conversationState.activeThreadId) {\n    <mj-thread-panel\n    [parentMessageId]=\"conversationState.activeThreadId\"\n    [conversationId]=\"conversationState.activeConversation?.ID || ''\"\n    [currentUser]=\"currentUser\"\n    (closed)=\"onThreadClosed()\"\n    (replyAdded)=\"onThreadReplyAdded($event)\">\n    </mj-thread-panel>\n}\n\n<!-- Export Modal -->\n<mj-export-modal\n    [isVisible]=\"showExportModal\"\n    [conversation]=\"conversationState.activeConversation || undefined\"\n    [currentUser]=\"currentUser\"\n    (cancelled)=\"onExportModalCancelled()\"\n    (exported)=\"onExportModalComplete()\">\n</mj-export-modal>\n\n<!-- Members Modal -->\n<mj-members-modal\n    [isVisible]=\"showMembersModal\"\n    [conversation]=\"conversationState.activeConversation || undefined\"\n    [currentUser]=\"currentUser\"\n    (cancelled)=\"showMembersModal = false\"\n    (membersChanged)=\"showMembersModal = false\">\n</mj-members-modal>\n\n<!-- Project Selector Modal -->\n@if (showProjectSelector && conversationState.activeConversation) {\n    <div class=\"modal-overlay\" (click)=\"showProjectSelector = false\">\n    <div class=\"modal-content project-selector-modal\" (click)=\"$event.stopPropagation()\">\n        <div class=\"modal-header\">\n        <h3>Assign Project</h3>\n        <button class=\"modal-close-btn\" (click)=\"showProjectSelector = false\">\n            <i class=\"fas fa-times\"></i>\n        </button>\n        </div>\n        <div class=\"modal-body\">\n        <mj-project-selector\n            [environmentId]=\"environmentId\"\n            [currentUser]=\"currentUser\"\n            [selectedProjectId]=\"conversationState.activeConversation.ProjectID\"\n            (projectSelected)=\"onProjectSelected($event)\">\n        </mj-project-selector>\n        </div>\n    </div>\n    </div>\n}\n\n<!-- Artifacts Modal -->\n@if (showArtifactsModal) {\n    <div class=\"modal-overlay\" (click)=\"showArtifactsModal = false\">\n    <div class=\"modal-content artifacts-modal\" (click)=\"$event.stopPropagation()\">\n        <div class=\"modal-header\">\n        <h3>Conversation Artifacts</h3>\n        <div class=\"modal-header-actions\">\n            @if (hasSystemArtifacts) {\n              <button class=\"toggle-system-btn\"\n                      [class.active]=\"showSystemArtifacts\"\n                      (click)=\"toggleSystemArtifacts()\"\n                      title=\"Toggle system artifacts visibility\">\n              <i class=\"fas fa-cog\"></i>\n              <span>{{ showSystemArtifacts ? 'Hide' : 'Show' }} System</span>\n              </button>\n            }\n            <button class=\"modal-close-btn\" (click)=\"showArtifactsModal = false\">\n            <i class=\"fas fa-times\"></i>\n            </button>\n        </div>\n        </div>\n        <div class=\"modal-body artifacts-grid\">\n        @if (artifactsByDetailId.size === 0) {\n            <div class=\"empty-state\">\n            <i class=\"fas fa-cube\" style=\"font-size: 48px; color: #D1D5DB; margin-bottom: 16px;\"></i>\n            <p style=\"color: #6B7280; font-size: 14px;\">No artifacts in this conversation yet</p>\n            </div>\n        }\n        @for (artifact of getArtifactsArray(); track artifact.artifactId) {\n            <div class=\"artifact-modal-card\"\n                 [class.expanded]=\"expandedArtifactId === artifact.artifactId\"\n                 [class.system-artifact]=\"artifact.visibility === 'System Only'\">\n              <!-- Main card header - click to open latest version -->\n              <div class=\"artifact-card-header\" (click)=\"openArtifactFromModal(artifact.artifactId)\">\n                <div class=\"artifact-modal-icon\">\n                    <i class=\"fas fa-file-code\"></i>\n                </div>\n                <div class=\"artifact-modal-info\">\n                    <div class=\"artifact-modal-title\">{{artifact.name}}</div>\n                    <div class=\"artifact-modal-meta\">\n                      @if (artifact.versionCount > 1) {\n                        {{artifact.versionCount}} versions\n                      } @else {\n                        1 version\n                      }\n                    </div>\n                </div>\n                @if (artifact.versionCount > 1) {\n                  <button class=\"expand-btn\" (click)=\"toggleArtifactExpansion(artifact.artifactId, $event)\">\n                    <i class=\"fas\" [class.fa-chevron-down]=\"expandedArtifactId !== artifact.artifactId\"\n                       [class.fa-chevron-up]=\"expandedArtifactId === artifact.artifactId\"></i>\n                  </button>\n                }\n                <div class=\"artifact-modal-action\">\n                    <i class=\"fas fa-external-link-alt\"></i>\n                </div>\n              </div>\n\n              <!-- Expanded version list -->\n              @if (expandedArtifactId === artifact.artifactId && artifact.versionCount > 1) {\n                <div class=\"artifact-versions-list\">\n                  @for (version of artifact.versions; track version.versionId) {\n                    <div class=\"artifact-version-item\" (click)=\"openArtifactFromModal(artifact.artifactId, version.versionNumber); $event.stopPropagation()\">\n                      <span class=\"version-badge\">v{{version.versionNumber}}</span>\n                      <span class=\"version-open-text\">Open this version</span>\n                      <i class=\"fas fa-arrow-right\"></i>\n                    </div>\n                  }\n                </div>\n              }\n            </div>\n        }\n        </div>\n    </div>\n    </div>\n}\n\n<!-- Collection Picker Modal -->\n@if (showCollectionPicker) {\n  <mj-artifact-collection-picker-modal\n    [isOpen]=\"showCollectionPicker\"\n    [environmentId]=\"environmentId\"\n    [currentUser]=\"currentUser\"\n    [excludeCollectionIds]=\"collectionPickerExcludedIds\"\n    (saved)=\"onCollectionPickerSaved($event)\"\n    (cancelled)=\"onCollectionPickerCancelled()\">\n  </mj-artifact-collection-picker-modal>\n}", styles: [":host {\n  display: flex;\n  width: 100%;\n  height: 100%;\n}\n\n.chat-area {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n\n.chat-header {\n  flex-shrink: 0;\n  padding: 12px 20px;\n  border-bottom: 1px solid #D9D9D9;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  gap: 16px;\n  background: #FFF;\n  z-index: 10;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n}\n\n.chat-info {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n}\n\n.chat-title {\n  font-size: 16px;\n  font-weight: 600;\n  color: #333;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.project-tag {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: #F4F4F4;\n  border: 1px solid #D9D9D9;\n  border-radius: 16px;\n  font-size: 11px;\n  font-weight: 600;\n  color: #AAA;\n  cursor: pointer;\n  transition: all 0.2s;\n  height: 28px;\n  margin-left: 12px;\n}\n\n.project-tag:hover {\n  background: #D9D9D9;\n  border-color: #AAA;\n}\n\n.project-tag i {\n  font-size: 10px;\n}\n\n.test-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: #FFF8E1;\n  border: 1px solid #FFD54F;\n  border-radius: 16px;\n  font-size: 11px;\n  font-weight: 600;\n  color: #F57C00;\n  cursor: pointer;\n  transition: all 0.2s;\n  height: 28px;\n  margin-left: 8px;\n}\n\n.test-indicator:hover {\n  background: #FFE082;\n  border-color: #FFA000;\n}\n\n.test-indicator i {\n  font-size: 10px;\n}\n\n.chat-members {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 12px;\n  background: transparent;\n  border: 1px solid #E5E7EB;\n  border-radius: 6px;\n  font-size: 13px;\n  color: #6B7280;\n  cursor: pointer;\n  transition: all 150ms ease;\n}\n\n.chat-members:hover {\n  background: #F9FAFB;\n  color: #111827;\n}\n\n.artifact-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 12px;\n  background: transparent;\n  border: 1px solid #E5E7EB;\n  border-radius: 6px;\n  font-size: 13px;\n  color: #6B7280;\n  cursor: pointer;\n  transition: all 150ms ease;\n}\n\n.artifact-indicator:hover {\n  background: #F9FAFB;\n  color: #111827;\n}\n\n.ambient-agent-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  background: #F3F4F6;\n  border: 1px solid #D1D5DB;\n  border-radius: 6px;\n  font-size: 13px;\n  color: #6B7280;\n  animation: pulse 2s ease-in-out infinite;\n}\n\n.ambient-agent-indicator i {\n  color: #0076B6;\n}\n\n@keyframes pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.7;\n  }\n}\n.chat-actions {\n  display: flex;\n  gap: 8px;\n}\n\n.action-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 12px;\n  background: transparent;\n  border: 1px solid #E5E7EB;\n  cursor: pointer;\n  border-radius: 6px;\n  font-size: 13px;\n  color: #6B7280;\n  transition: all 150ms ease;\n}\n\n.action-btn:hover {\n  background: #F9FAFB;\n  color: #111827;\n}\n\n.share-btn.shared {\n  background: #EFF6FF;\n  border-color: #1e40af;\n  color: #1e40af;\n}\n\n.share-btn.shared:hover {\n  background: #DBEAFE;\n  color: #1e3a8a;\n}\n\n.chat-content-area {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n  display: flex;\n  flex-direction: row;\n  position: relative;\n}\n\n.chat-messages-pane {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  min-width: 300px;\n  overflow: hidden;\n  transition: width 0.3s ease;\n}\n\n.chat-messages-pane.full-width {\n  width: 100%;\n}\n\n.chat-messages-pane:not(.full-width) {\n  flex: 1;\n}\n\n.chat-messages-pane.hidden {\n  display: none;\n}\n\n.resize-handle {\n  width: 4px;\n  background: transparent;\n  cursor: col-resize;\n  flex-shrink: 0;\n  position: relative;\n  transition: background-color 0.2s;\n}\n\n.resize-handle:hover {\n  background: #3B82F6;\n}\n\n.resize-handle::before {\n  content: \"\";\n  position: absolute;\n  left: -4px;\n  right: -4px;\n  top: 0;\n  bottom: 0;\n}\n\n.chat-artifact-pane {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  background: #FAFAFA;\n  overflow: hidden;\n  flex-shrink: 0;\n}\n\n.chat-artifact-pane.maximized {\n  width: 100% !important;\n}\n\n.chat-artifact-pane > mj-artifact-viewer-panel {\n  display: flex;\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.chat-messages-wrapper {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.chat-messages-container {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  background: #FFF;\n  min-height: 0;\n  position: relative;\n}\n\n.scroll-to-bottom-icon {\n  position: sticky;\n  bottom: 21px;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 40px;\n  height: 40px;\n  margin-top: -40px;\n  margin-left: auto;\n  margin-right: auto;\n  background: white;\n  border: 1px solid #D1D5DB;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n  transition: all 0.2s ease;\n  z-index: 100;\n  pointer-events: auto;\n}\n\n.scroll-to-bottom-icon:hover {\n  background: #F3F4F6;\n  border-color: #3B82F6;\n  transform: translateX(-50%) translateY(-2px);\n  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);\n}\n\n.scroll-to-bottom-icon i {\n  color: #6B7280;\n  font-size: 16px;\n  transition: color 0.2s;\n}\n\n.scroll-to-bottom-icon:hover i {\n  color: #3B82F6;\n}\n\n.chat-input-container {\n  flex-shrink: 0;\n  background: #FFF;\n  padding: 0 1.25rem 1.25rem 1.25rem;\n  overflow: visible;\n}\n\n.loading-peripheral-placeholder {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 140px;\n  padding: 24px;\n  background: rgba(255, 255, 255, 0.5);\n  backdrop-filter: blur(2px);\n  border-radius: 12px;\n  margin: 12px;\n  animation: fadeIn 0.2s ease-in-out;\n}\n\n.modal-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n}\n\n.modal-content {\n  background: white;\n  border-radius: 8px;\n  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n  max-width: 90vw;\n  max-height: 90vh;\n  display: flex;\n  flex-direction: column;\n}\n\n.project-selector-modal {\n  width: 600px;\n  height: 500px;\n}\n\n.modal-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px 20px;\n  border-bottom: 1px solid #E5E7EB;\n}\n\n.modal-header h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n}\n\n.modal-header-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.toggle-system-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  background: #F3F4F6;\n  border: 1px solid #E5E7EB;\n  cursor: pointer;\n  color: #6B7280;\n  padding: 6px 12px;\n  border-radius: 6px;\n  font-size: 13px;\n  font-weight: 500;\n  transition: all 0.2s;\n}\n\n.toggle-system-btn:hover {\n  background: #E5E7EB;\n  border-color: #D1D5DB;\n  color: #374151;\n}\n\n.toggle-system-btn.active {\n  background: #3B82F6;\n  border-color: #3B82F6;\n  color: white;\n}\n\n.toggle-system-btn.active:hover {\n  background: #2563EB;\n  border-color: #2563EB;\n}\n\n.toggle-system-btn i {\n  font-size: 12px;\n}\n\n.modal-close-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: #6B7280;\n  padding: 4px 8px;\n  border-radius: 4px;\n  transition: all 0.2s;\n}\n\n.modal-close-btn:hover {\n  background: #F3F4F6;\n  color: #111827;\n}\n\n.modal-body {\n  flex: 1;\n  overflow: auto;\n  padding: 20px;\n}\n\n.artifacts-modal {\n  width: 700px;\n  max-height: 600px;\n}\n\n.artifacts-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n  gap: 16px;\n}\n\n.empty-state {\n  grid-column: 1/-1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 60px 20px;\n}\n\n.artifact-modal-card {\n  display: flex;\n  flex-direction: column;\n  background: white;\n  border: 1.5px solid #E5E7EB;\n  border-radius: 12px;\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  overflow: hidden;\n}\n\n.artifact-modal-card.expanded {\n  border-color: #3B82F6;\n}\n\n.artifact-modal-card.system-artifact {\n  opacity: 0.85;\n  border-color: #D1D5DB;\n  border-style: dashed;\n  position: relative;\n}\n\n.artifact-modal-card.system-artifact::before {\n  content: \"SYSTEM\";\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  font-size: 9px;\n  font-weight: 600;\n  color: #9CA3AF;\n  background: #F3F4F6;\n  padding: 2px 6px;\n  border-radius: 3px;\n  letter-spacing: 0.5px;\n  z-index: 10;\n}\n\n.artifact-modal-card.system-artifact:hover {\n  border-color: #9CA3AF;\n  box-shadow: 0 4px 12px rgba(156, 163, 175, 0.15);\n}\n\n.artifact-card-header {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 16px;\n  cursor: pointer;\n}\n\n.artifact-card-header:hover {\n  background: #F9FAFB;\n}\n\n.artifact-modal-card:hover {\n  border-color: #3B82F6;\n  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);\n  transform: translateY(-2px);\n}\n\n.artifact-modal-icon {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);\n  border-radius: 10px;\n  color: #3B82F6;\n  flex-shrink: 0;\n}\n\n.artifact-modal-icon i {\n  font-size: 18px;\n}\n\n.artifact-modal-info {\n  flex: 1;\n  min-width: 0;\n}\n\n.artifact-modal-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: #1F2937;\n  margin-bottom: 4px;\n}\n\n.artifact-modal-meta {\n  font-size: 12px;\n  color: #6B7280;\n}\n\n.artifact-modal-action {\n  color: #9CA3AF;\n  transition: color 0.2s;\n}\n\n.artifact-modal-card:hover .artifact-modal-action {\n  color: #3B82F6;\n}\n\n.expand-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  color: #6B7280;\n  cursor: pointer;\n  border-radius: 6px;\n  transition: all 0.2s;\n}\n.expand-btn:hover {\n  background: #F3F4F6;\n  color: #3B82F6;\n}\n\n.artifact-versions-list {\n  display: flex;\n  flex-direction: column;\n  padding: 0 1rem 1rem 1rem;\n  background: #F9FAFB;\n}\n\n.artifact-version-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px 12px 68px;\n  cursor: pointer;\n  transition: background 0.15s;\n}\n.artifact-version-item:hover {\n  background: #F3F4F6;\n}\n.artifact-version-item .version-badge {\n  display: inline-block;\n  padding: 4px 8px;\n  background: #EEF2FF;\n  color: #4F46E5;\n  font-size: 12px;\n  font-weight: 600;\n  font-family: monospace;\n  border-radius: 4px;\n}\n.artifact-version-item .version-open-text {\n  flex: 1;\n  font-size: 13px;\n  color: #6B7280;\n}\n.artifact-version-item i {\n  color: #9CA3AF;\n  font-size: 12px;\n}\n.artifact-version-item:hover .version-badge {\n  background: #4F46E5;\n  color: white;\n}\n.artifact-version-item:hover .version-open-text {\n  color: #3B82F6;\n}\n.artifact-version-item:hover i {\n  color: #3B82F6;\n}\n\n.loading-peripheral-content {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 16px 24px;\n  background: white;\n  border: 2px solid #E5E7EB;\n  border-radius: 12px;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n  color: #4B5563;\n  font-size: 14px;\n  font-weight: 500;\n}\n.loading-peripheral-content i {\n  font-size: 20px;\n  color: #9333EA;\n}\n\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.conversation-loading-state {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n}\n\n.loading-content {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding-top: 20px;\n  gap: 16px;\n  color: #6B7280;\n  font-size: 15px;\n}\n.loading-content i {\n  font-size: 32px;\n  color: #3B82F6;\n}\n.loading-content span {\n  font-weight: 500;\n}\n\n/* Mobile adjustments: 481px - 768px */\n@media (max-width: 768px) {\n  .chat-header {\n    padding: 8px 12px;\n    gap: 8px;\n    flex-direction: column;\n    align-items: stretch;\n  }\n  .chat-info {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 8px;\n  }\n  .chat-title {\n    font-size: 14px;\n    width: 100%;\n    white-space: normal;\n  }\n  .project-tag {\n    margin-left: 0;\n    font-size: 10px;\n    padding: 3px 8px;\n    height: 24px;\n  }\n  .test-indicator {\n    margin-left: 0;\n    font-size: 10px;\n    padding: 3px 8px;\n    height: 24px;\n  }\n  .chat-actions {\n    flex-wrap: wrap;\n    justify-content: flex-start;\n    width: 100%;\n  }\n  .chat-members,\n  .artifact-indicator,\n  .action-btn {\n    padding: 6px 10px;\n    font-size: 12px;\n  }\n  .ambient-agent-indicator {\n    font-size: 12px;\n    padding: 4px 8px;\n  }\n  .project-selector-modal {\n    width: min(95vw, 600px);\n    height: auto;\n  }\n  .artifacts-modal {\n    width: min(95vw, 700px);\n  }\n  .artifacts-grid {\n    grid-template-columns: 1fr;\n  }\n  .chat-input-container {\n    padding: 0 0.75rem 0.75rem 0.75rem;\n  }\n  .scroll-to-bottom-icon {\n    bottom: 16px;\n    width: 36px;\n    height: 36px;\n  }\n  /* Artifact pane - full width overlay on mobile */\n  .chat-content-area {\n    position: relative;\n  }\n  .chat-artifact-pane {\n    position: fixed;\n    left: 0;\n    right: 0;\n    top: 80px;\n    bottom: 0;\n    width: 100% !important;\n    z-index: 100;\n    background: #FFF;\n  }\n  .resize-handle {\n    display: none;\n  }\n}\n/* Small Phone adjustments: <= 480px */\n@media (max-width: 480px) {\n  .chat-header {\n    padding: 6px 8px;\n    gap: 6px;\n  }\n  .chat-title {\n    font-size: 13px;\n  }\n  .project-tag {\n    font-size: 9px;\n    padding: 2px 6px;\n    height: 20px;\n  }\n  .test-indicator {\n    font-size: 9px;\n    padding: 2px 6px;\n    height: 20px;\n  }\n  .chat-members,\n  .artifact-indicator,\n  .action-btn {\n    padding: 4px 8px;\n    font-size: 11px;\n  }\n  .ambient-agent-indicator {\n    font-size: 11px;\n    padding: 3px 6px;\n  }\n  .project-selector-modal,\n  .artifacts-modal {\n    width: 100vw;\n    height: 100vh;\n    border-radius: 0;\n  }\n  .chat-input-container {\n    padding: 0 0.5rem 0.5rem 0.5rem;\n  }\n  .scroll-to-bottom-icon {\n    bottom: 12px;\n    width: 32px;\n    height: 32px;\n  }\n  .scroll-to-bottom-icon i {\n    font-size: 14px;\n  }\n}\n"] }]
-    }], () => [{ type: i1.ConversationStateService }, { type: i2.AgentStateService }, { type: i3.ConversationAgentService }, { type: i4.ActiveTasksService }, { type: i0.ChangeDetectorRef }, { type: i5.MentionAutocompleteService }, { type: i6.ArtifactPermissionService }, { type: i7.DialogService }], { environmentId: [{
+        args: [{ selector: 'mj-conversation-chat-area', template: "<div class=\"chat-area\">\n    <!-- Fixed Header -->\n    <div class=\"chat-header\" *ngIf=\"conversation\">\n    <div class=\"chat-info\">\n        <div class=\"chat-title\">{{ conversation.Name }}</div>\n        <button class=\"project-tag\" (click)=\"openProjectSelector()\" title=\"Assign to project\" *ngIf=\"conversation.ProjectID\">\n        <i class=\"fas fa-folder\"></i>\n        <span>{{ conversation.Project || 'Project' }}</span>\n        </button>\n        <button class=\"test-indicator\" (click)=\"viewTestRun(conversation.TestRunID)\" title=\"View Test Run\" *ngIf=\"conversation.TestRunID\">\n        <i class=\"fas fa-flask\"></i>\n        <span>Test</span>\n        </button>\n        <mj-active-agent-indicator\n        [conversationId]=\"conversation.ID\"\n        [currentUser]=\"currentUser\"\n        (togglePanel)=\"onToggleAgentPanel()\"\n        (agentSelected)=\"onAgentSelected($event)\">\n        </mj-active-agent-indicator>\n    </div>\n    <div class=\"chat-actions\">\n        <button class=\"chat-members\" (click)=\"toggleMembersModal()\" title=\"View members\">\n        <i class=\"fas fa-users\"></i>\n        <span>{{ memberCount }} member{{ memberCount !== 1 ? 's' : '' }}</span>\n        </button>\n        <button class=\"artifact-indicator\" (click)=\"viewArtifacts()\" title=\"View artifacts\" *ngIf=\"artifactCountDisplay > 0\">\n        <i class=\"fas fa-cube\"></i>\n        <span>{{ artifactCountDisplay }} artifact{{ artifactCountDisplay !== 1 ? 's' : '' }}</span>\n        </button>\n        <mj-active-agent-indicator\n        [conversationId]=\"conversation.ID\"\n        [currentUser]=\"currentUser\"\n        (togglePanel)=\"onToggleAgentPanel()\"\n        (agentSelected)=\"onAgentSelected($event)\">\n        </mj-active-agent-indicator>\n    </div>\n    <div class=\"chat-actions\">\n        <button class=\"action-btn\" (click)=\"exportConversation()\" title=\"Export conversation\">\n        <i class=\"fas fa-download\"></i>\n        Export\n        </button>\n        <button class=\"action-btn share-btn\"\n                [class.shared]=\"isShared\"\n                (click)=\"shareConversation()\"\n                [title]=\"isShared ? 'Manage sharing' : 'Share conversation'\">\n        <i class=\"fas fa-share-nodes\"></i>\n        Share\n        </button>\n    </div>\n    </div>\n\n    <!-- Messages and Artifact Split Layout -->\n    <div class=\"chat-content-area\">\n    <!-- Messages Pane -->\n    <div class=\"chat-messages-pane\"\n         [class.full-width]=\"!showArtifactPanel\"\n         [class.hidden]=\"isArtifactPaneMaximized\">\n        @if (isNewConversation || !conversationId) {\n          <!-- Empty State - No conversation selected OR new unsaved conversation -->\n          <mj-conversation-empty-state\n            [currentUser]=\"currentUser\"\n            [disabled]=\"isProcessing\"\n            (messageSent)=\"onEmptyStateMessageSent($event)\">\n          </mj-conversation-empty-state>\n        } @else if (isLoadingConversation) {\n          <!-- Loading State - Show centered spinner while conversation loads -->\n          <div class=\"conversation-loading-state\">\n            <mj-loading text=\"Loading conversation...\" size=\"large\"></mj-loading>\n          </div>\n        } @else {\n          <!-- Normal Message View -->\n          <div class=\"chat-messages-wrapper\">\n          <div class=\"chat-messages-container\" #scrollContainer (scroll)=\"checkScroll()\">\n              <mj-conversation-message-list\n              [messages]=\"messages\"\n              [conversation]=\"conversation\"\n              [currentUser]=\"currentUser\"\n              [isProcessing]=\"isProcessing\"\n              [artifactMap]=\"effectiveArtifactsMap\"\n              [agentRunMap]=\"agentRunsByDetailId\"\n              [ratingsMap]=\"ratingsByDetailId\"\n              [userAvatarMap]=\"userAvatarMap\"\n              (replyInThread)=\"onReplyInThread($event)\"\n              (viewThread)=\"onViewThread($event)\"\n              (retryMessage)=\"onRetryMessage($event)\"\n              (testFeedbackMessage)=\"onTestFeedbackMessage($event)\"\n              (artifactClicked)=\"onArtifactClicked($event)\"\n              (messageEdited)=\"onMessageEdited($event)\"\n              (openEntityRecord)=\"onOpenEntityRecord($event)\"\n              (suggestedResponseSelected)=\"onSuggestedResponseSelected($event)\">\n              </mj-conversation-message-list>\n\n              <!-- Scroll to Bottom Icon (positioned within scroll container for proper centering) -->\n              <span class=\"scroll-to-bottom-icon\" style=\"left: 50%;\"\n                    *ngIf=\"showScrollToBottomIcon && messages && messages.length > 0\"\n                    (click)=\"scrollToBottomAnimate()\">\n                  <i class=\"fas fa-arrow-down\"></i>\n              </span>\n          </div>\n\n          <!-- Fixed Input Area -->\n          <div class=\"chat-input-container\">\n              @if (isLoadingPeripheralData) {\n                <!-- Loading State -->\n                <div class=\"loading-peripheral-placeholder\">\n                  <mj-loading text=\"Loading conversation data...\" size=\"medium\"></mj-loading>\n                </div>\n              } @else {\n                <!-- Input Component - Multiple instances cached, only one visible -->\n                <div class=\"message-input-container-wrapper\">\n                  @for (inputRef of getCachedInputs(); track inputRef.conversationId) {\n                    <mj-message-input\n                      #messageInput\n                      [hidden]=\"inputRef.conversationId !== conversationId\"\n                      [conversationId]=\"inputRef.conversationId\"\n                      [conversationName]=\"inputRef.conversationName\"\n                      [currentUser]=\"currentUser\"\n                      [conversationHistory]=\"inputRef.conversationId === conversationId ? messages : []\"\n                      [artifactsByDetailId]=\"inputRef.conversationId === conversationId ? artifactsByDetailId : emptyArtifactsMap\"\n                      [systemArtifactsByDetailId]=\"inputRef.conversationId === conversationId ? systemArtifactsByDetailId : emptyArtifactsMap\"\n                      [agentRunsByDetailId]=\"inputRef.conversationId === conversationId ? agentRunsByDetailId : emptyAgentRunsMap\"\n                      [inProgressMessageIds]=\"inputRef.conversationId === conversationId ? inProgressMessageIds : emptyInProgressIds\"\n                      [disabled]=\"isProcessing\"\n                      [initialMessage]=\"inputRef.conversationId === conversationId ? pendingMessage : null\"\n                      (messageSent)=\"onMessageSent($event)\"\n                      (agentResponse)=\"onAgentResponse($event)\"\n                      (agentRunDetected)=\"onAgentRunDetected($event)\"\n                      (agentRunUpdate)=\"onAgentRunUpdate($event)\"\n                      (messageComplete)=\"onMessageComplete($event)\"\n                      (artifactCreated)=\"onArtifactCreated($event)\"\n                      (conversationRenamed)=\"onConversationRenamed($event)\"\n                      (intentCheckStarted)=\"onIntentCheckStarted()\"\n                      (intentCheckCompleted)=\"onIntentCheckCompleted()\">\n                    </mj-message-input>\n                  }\n                </div>\n              }\n          </div>\n          </div>\n        }\n    </div>\n\n    <!-- Artifact Viewer Pane -->\n    @if (showArtifactPanel && selectedArtifactId) {\n        @if (!isArtifactPaneMaximized) {\n            <div class=\"resize-handle\" (mousedown)=\"onResizeStart($event)\" (touchstart)=\"onResizeTouchStart($event)\"></div>\n        }\n        <div class=\"chat-artifact-pane\"\n             [style.width.%]=\"artifactPaneWidth\"\n             [class.maximized]=\"isArtifactPaneMaximized\">\n        <mj-artifact-viewer-panel\n            [artifactId]=\"selectedArtifactId\"\n            [currentUser]=\"currentUser\"\n            [environmentId]=\"environmentId\"\n            [versionNumber]=\"selectedVersionNumber\"\n            [viewContext]=\"'conversation'\"\n            [canShare]=\"canShareSelectedArtifact\"\n            [canEdit]=\"canEditSelectedArtifact\"\n            [isMaximized]=\"isArtifactPaneMaximized\"\n            [refreshTrigger]=\"artifactViewerRefresh$\"\n            (closed)=\"onCloseArtifactPanel()\"\n            (saveToCollectionRequested)=\"onSaveToCollectionRequested($event)\"\n            (navigateToLink)=\"onArtifactLinkNavigation($event)\"\n            (shareRequested)=\"onArtifactShareRequested($event)\"\n            (maximizeToggled)=\"toggleMaximizeArtifactPane()\">\n        </mj-artifact-viewer-panel>\n        </div>\n    }\n\n    <!-- Artifact Share Modal -->\n    <mj-artifact-share-modal\n      [isOpen]=\"isArtifactShareModalOpen\"\n      [artifact]=\"artifactToShare\"\n      [currentUser]=\"currentUser\"\n      (saved)=\"onArtifactShared()\"\n      (cancelled)=\"onArtifactShareModalClose()\">\n    </mj-artifact-share-modal>\n    </div>\n</div>\n\n<!-- Thread Panel -->\n@if (threadId) {\n    <mj-thread-panel\n    [parentMessageId]=\"threadId\"\n    [conversationId]=\"conversationId || ''\"\n    [currentUser]=\"currentUser\"\n    (closed)=\"onLocalThreadClosed()\"\n    (replyAdded)=\"onThreadReplyAdded($event)\">\n    </mj-thread-panel>\n}\n\n<!-- Export Modal -->\n<mj-export-modal\n    [isVisible]=\"showExportModal\"\n    [conversation]=\"conversation || undefined\"\n    [currentUser]=\"currentUser\"\n    (cancelled)=\"onExportModalCancelled()\"\n    (exported)=\"onExportModalComplete()\">\n</mj-export-modal>\n\n<!-- Members Modal -->\n<mj-members-modal\n    [isVisible]=\"showMembersModal\"\n    [conversation]=\"conversation || undefined\"\n    [currentUser]=\"currentUser\"\n    (cancelled)=\"showMembersModal = false\"\n    (membersChanged)=\"showMembersModal = false\">\n</mj-members-modal>\n\n<!-- Project Selector Modal -->\n@if (showProjectSelector && conversation) {\n    <div class=\"modal-overlay\" (click)=\"showProjectSelector = false\">\n    <div class=\"modal-content project-selector-modal\" (click)=\"$event.stopPropagation()\">\n        <div class=\"modal-header\">\n        <h3>Assign Project</h3>\n        <button class=\"modal-close-btn\" (click)=\"showProjectSelector = false\">\n            <i class=\"fas fa-times\"></i>\n        </button>\n        </div>\n        <div class=\"modal-body\">\n        <mj-project-selector\n            [environmentId]=\"environmentId\"\n            [currentUser]=\"currentUser\"\n            [selectedProjectId]=\"conversation.ProjectID\"\n            (projectSelected)=\"onProjectSelected($event)\">\n        </mj-project-selector>\n        </div>\n    </div>\n    </div>\n}\n\n<!-- Artifacts Modal -->\n@if (showArtifactsModal) {\n    <div class=\"modal-overlay\" (click)=\"showArtifactsModal = false\">\n    <div class=\"modal-content artifacts-modal\" (click)=\"$event.stopPropagation()\">\n        <div class=\"modal-header\">\n        <h3>Conversation Artifacts</h3>\n        <div class=\"modal-header-actions\">\n            @if (hasSystemArtifacts) {\n              <button class=\"toggle-system-btn\"\n                      [class.active]=\"showSystemArtifacts\"\n                      (click)=\"toggleSystemArtifacts()\"\n                      title=\"Toggle system artifacts visibility\">\n              <i class=\"fas fa-cog\"></i>\n              <span>{{ showSystemArtifacts ? 'Hide' : 'Show' }} System</span>\n              </button>\n            }\n            <button class=\"modal-close-btn\" (click)=\"showArtifactsModal = false\">\n            <i class=\"fas fa-times\"></i>\n            </button>\n        </div>\n        </div>\n        <div class=\"modal-body artifacts-grid\">\n        @if (artifactsByDetailId.size === 0) {\n            <div class=\"empty-state\">\n            <i class=\"fas fa-cube\" style=\"font-size: 48px; color: #D1D5DB; margin-bottom: 16px;\"></i>\n            <p style=\"color: #6B7280; font-size: 14px;\">No artifacts in this conversation yet</p>\n            </div>\n        }\n        @for (artifact of getArtifactsArray(); track artifact.artifactId) {\n            <div class=\"artifact-modal-card\"\n                 [class.expanded]=\"expandedArtifactId === artifact.artifactId\"\n                 [class.system-artifact]=\"artifact.visibility === 'System Only'\">\n              <!-- Main card header - click to open latest version -->\n              <div class=\"artifact-card-header\" (click)=\"openArtifactFromModal(artifact.artifactId)\">\n                <div class=\"artifact-modal-icon\">\n                    <i class=\"fas fa-file-code\"></i>\n                </div>\n                <div class=\"artifact-modal-info\">\n                    <div class=\"artifact-modal-title\">{{artifact.name}}</div>\n                    <div class=\"artifact-modal-meta\">\n                      @if (artifact.versionCount > 1) {\n                        {{artifact.versionCount}} versions\n                      } @else {\n                        1 version\n                      }\n                    </div>\n                </div>\n                @if (artifact.versionCount > 1) {\n                  <button class=\"expand-btn\" (click)=\"toggleArtifactExpansion(artifact.artifactId, $event)\">\n                    <i class=\"fas\" [class.fa-chevron-down]=\"expandedArtifactId !== artifact.artifactId\"\n                       [class.fa-chevron-up]=\"expandedArtifactId === artifact.artifactId\"></i>\n                  </button>\n                }\n                <div class=\"artifact-modal-action\">\n                    <i class=\"fas fa-external-link-alt\"></i>\n                </div>\n              </div>\n\n              <!-- Expanded version list -->\n              @if (expandedArtifactId === artifact.artifactId && artifact.versionCount > 1) {\n                <div class=\"artifact-versions-list\">\n                  @for (version of artifact.versions; track version.versionId) {\n                    <div class=\"artifact-version-item\" (click)=\"openArtifactFromModal(artifact.artifactId, version.versionNumber); $event.stopPropagation()\">\n                      <span class=\"version-badge\">v{{version.versionNumber}}</span>\n                      <span class=\"version-open-text\">Open this version</span>\n                      <i class=\"fas fa-arrow-right\"></i>\n                    </div>\n                  }\n                </div>\n              }\n            </div>\n        }\n        </div>\n    </div>\n    </div>\n}\n\n<!-- Collection Picker Modal -->\n@if (showCollectionPicker) {\n  <mj-artifact-collection-picker-modal\n    [isOpen]=\"showCollectionPicker\"\n    [environmentId]=\"environmentId\"\n    [currentUser]=\"currentUser\"\n    [excludeCollectionIds]=\"collectionPickerExcludedIds\"\n    (saved)=\"onCollectionPickerSaved($event)\"\n    (cancelled)=\"onCollectionPickerCancelled()\">\n  </mj-artifact-collection-picker-modal>\n}", styles: [":host {\n  display: flex;\n  width: 100%;\n  height: 100%;\n}\n\n.chat-area {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n\n.chat-header {\n  flex-shrink: 0;\n  padding: 12px 20px;\n  border-bottom: 1px solid #D9D9D9;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  gap: 16px;\n  background: #FFF;\n  z-index: 10;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n}\n\n.chat-info {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n}\n\n.chat-title {\n  font-size: 16px;\n  font-weight: 600;\n  color: #333;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.project-tag {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: #F4F4F4;\n  border: 1px solid #D9D9D9;\n  border-radius: 16px;\n  font-size: 11px;\n  font-weight: 600;\n  color: #AAA;\n  cursor: pointer;\n  transition: all 0.2s;\n  height: 28px;\n  margin-left: 12px;\n}\n\n.project-tag:hover {\n  background: #D9D9D9;\n  border-color: #AAA;\n}\n\n.project-tag i {\n  font-size: 10px;\n}\n\n.test-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: #FFF8E1;\n  border: 1px solid #FFD54F;\n  border-radius: 16px;\n  font-size: 11px;\n  font-weight: 600;\n  color: #F57C00;\n  cursor: pointer;\n  transition: all 0.2s;\n  height: 28px;\n  margin-left: 8px;\n}\n\n.test-indicator:hover {\n  background: #FFE082;\n  border-color: #FFA000;\n}\n\n.test-indicator i {\n  font-size: 10px;\n}\n\n.chat-members {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 12px;\n  background: transparent;\n  border: 1px solid #E5E7EB;\n  border-radius: 6px;\n  font-size: 13px;\n  color: #6B7280;\n  cursor: pointer;\n  transition: all 150ms ease;\n}\n\n.chat-members:hover {\n  background: #F9FAFB;\n  color: #111827;\n}\n\n.artifact-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 12px;\n  background: transparent;\n  border: 1px solid #E5E7EB;\n  border-radius: 6px;\n  font-size: 13px;\n  color: #6B7280;\n  cursor: pointer;\n  transition: all 150ms ease;\n}\n\n.artifact-indicator:hover {\n  background: #F9FAFB;\n  color: #111827;\n}\n\n.ambient-agent-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  background: #F3F4F6;\n  border: 1px solid #D1D5DB;\n  border-radius: 6px;\n  font-size: 13px;\n  color: #6B7280;\n  animation: pulse 2s ease-in-out infinite;\n}\n\n.ambient-agent-indicator i {\n  color: #0076B6;\n}\n\n@keyframes pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.7;\n  }\n}\n.chat-actions {\n  display: flex;\n  gap: 8px;\n}\n\n.action-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 12px;\n  background: transparent;\n  border: 1px solid #E5E7EB;\n  cursor: pointer;\n  border-radius: 6px;\n  font-size: 13px;\n  color: #6B7280;\n  transition: all 150ms ease;\n}\n\n.action-btn:hover {\n  background: #F9FAFB;\n  color: #111827;\n}\n\n.share-btn.shared {\n  background: #EFF6FF;\n  border-color: #1e40af;\n  color: #1e40af;\n}\n\n.share-btn.shared:hover {\n  background: #DBEAFE;\n  color: #1e3a8a;\n}\n\n.chat-content-area {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n  display: flex;\n  flex-direction: row;\n  position: relative;\n}\n\n.chat-messages-pane {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  min-width: 300px;\n  overflow: hidden;\n  transition: width 0.3s ease;\n}\n\n.chat-messages-pane.full-width {\n  width: 100%;\n}\n\n.chat-messages-pane:not(.full-width) {\n  flex: 1;\n}\n\n.chat-messages-pane.hidden {\n  display: none;\n}\n\n.resize-handle {\n  width: 4px;\n  background: transparent;\n  cursor: col-resize;\n  flex-shrink: 0;\n  position: relative;\n  transition: background-color 0.2s;\n}\n\n.resize-handle:hover {\n  background: #3B82F6;\n}\n\n.resize-handle::before {\n  content: \"\";\n  position: absolute;\n  left: -4px;\n  right: -4px;\n  top: 0;\n  bottom: 0;\n}\n\n.chat-artifact-pane {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  background: #FAFAFA;\n  overflow: hidden;\n  flex-shrink: 0;\n}\n\n.chat-artifact-pane.maximized {\n  width: 100% !important;\n}\n\n.chat-artifact-pane > mj-artifact-viewer-panel {\n  display: flex;\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.chat-messages-wrapper {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.chat-messages-container {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  background: #FFF;\n  min-height: 0;\n  position: relative;\n}\n\n.scroll-to-bottom-icon {\n  position: sticky;\n  bottom: 21px;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 40px;\n  height: 40px;\n  margin-top: -40px;\n  margin-left: auto;\n  margin-right: auto;\n  background: white;\n  border: 1px solid #D1D5DB;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n  transition: all 0.2s ease;\n  z-index: 100;\n  pointer-events: auto;\n}\n\n.scroll-to-bottom-icon:hover {\n  background: #F3F4F6;\n  border-color: #3B82F6;\n  transform: translateX(-50%) translateY(-2px);\n  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);\n}\n\n.scroll-to-bottom-icon i {\n  color: #6B7280;\n  font-size: 16px;\n  transition: color 0.2s;\n}\n\n.scroll-to-bottom-icon:hover i {\n  color: #3B82F6;\n}\n\n.chat-input-container {\n  flex-shrink: 0;\n  background: #FFF;\n  padding: 0 1.25rem 1.25rem 1.25rem;\n  overflow: visible;\n}\n\n.loading-peripheral-placeholder {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 140px;\n  padding: 24px;\n  background: rgba(255, 255, 255, 0.5);\n  backdrop-filter: blur(2px);\n  border-radius: 12px;\n  margin: 12px;\n  animation: fadeIn 0.2s ease-in-out;\n}\n\n.modal-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n}\n\n.modal-content {\n  background: white;\n  border-radius: 8px;\n  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n  max-width: 90vw;\n  max-height: 90vh;\n  display: flex;\n  flex-direction: column;\n}\n\n.project-selector-modal {\n  width: 600px;\n  height: 500px;\n}\n\n.modal-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px 20px;\n  border-bottom: 1px solid #E5E7EB;\n}\n\n.modal-header h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n}\n\n.modal-header-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.toggle-system-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  background: #F3F4F6;\n  border: 1px solid #E5E7EB;\n  cursor: pointer;\n  color: #6B7280;\n  padding: 6px 12px;\n  border-radius: 6px;\n  font-size: 13px;\n  font-weight: 500;\n  transition: all 0.2s;\n}\n\n.toggle-system-btn:hover {\n  background: #E5E7EB;\n  border-color: #D1D5DB;\n  color: #374151;\n}\n\n.toggle-system-btn.active {\n  background: #3B82F6;\n  border-color: #3B82F6;\n  color: white;\n}\n\n.toggle-system-btn.active:hover {\n  background: #2563EB;\n  border-color: #2563EB;\n}\n\n.toggle-system-btn i {\n  font-size: 12px;\n}\n\n.modal-close-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: #6B7280;\n  padding: 4px 8px;\n  border-radius: 4px;\n  transition: all 0.2s;\n}\n\n.modal-close-btn:hover {\n  background: #F3F4F6;\n  color: #111827;\n}\n\n.modal-body {\n  flex: 1;\n  overflow: auto;\n  padding: 20px;\n}\n\n.artifacts-modal {\n  width: 700px;\n  max-height: 600px;\n}\n\n.artifacts-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n  gap: 16px;\n}\n\n.empty-state {\n  grid-column: 1/-1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 60px 20px;\n}\n\n.artifact-modal-card {\n  display: flex;\n  flex-direction: column;\n  background: white;\n  border: 1.5px solid #E5E7EB;\n  border-radius: 12px;\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  overflow: hidden;\n}\n\n.artifact-modal-card.expanded {\n  border-color: #3B82F6;\n}\n\n.artifact-modal-card.system-artifact {\n  opacity: 0.85;\n  border-color: #D1D5DB;\n  border-style: dashed;\n  position: relative;\n}\n\n.artifact-modal-card.system-artifact::before {\n  content: \"SYSTEM\";\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  font-size: 9px;\n  font-weight: 600;\n  color: #9CA3AF;\n  background: #F3F4F6;\n  padding: 2px 6px;\n  border-radius: 3px;\n  letter-spacing: 0.5px;\n  z-index: 10;\n}\n\n.artifact-modal-card.system-artifact:hover {\n  border-color: #9CA3AF;\n  box-shadow: 0 4px 12px rgba(156, 163, 175, 0.15);\n}\n\n.artifact-card-header {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 16px;\n  cursor: pointer;\n}\n\n.artifact-card-header:hover {\n  background: #F9FAFB;\n}\n\n.artifact-modal-card:hover {\n  border-color: #3B82F6;\n  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);\n  transform: translateY(-2px);\n}\n\n.artifact-modal-icon {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);\n  border-radius: 10px;\n  color: #3B82F6;\n  flex-shrink: 0;\n}\n\n.artifact-modal-icon i {\n  font-size: 18px;\n}\n\n.artifact-modal-info {\n  flex: 1;\n  min-width: 0;\n}\n\n.artifact-modal-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: #1F2937;\n  margin-bottom: 4px;\n}\n\n.artifact-modal-meta {\n  font-size: 12px;\n  color: #6B7280;\n}\n\n.artifact-modal-action {\n  color: #9CA3AF;\n  transition: color 0.2s;\n}\n\n.artifact-modal-card:hover .artifact-modal-action {\n  color: #3B82F6;\n}\n\n.expand-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  color: #6B7280;\n  cursor: pointer;\n  border-radius: 6px;\n  transition: all 0.2s;\n}\n.expand-btn:hover {\n  background: #F3F4F6;\n  color: #3B82F6;\n}\n\n.artifact-versions-list {\n  display: flex;\n  flex-direction: column;\n  padding: 0 1rem 1rem 1rem;\n  background: #F9FAFB;\n}\n\n.artifact-version-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px 12px 68px;\n  cursor: pointer;\n  transition: background 0.15s;\n}\n.artifact-version-item:hover {\n  background: #F3F4F6;\n}\n.artifact-version-item .version-badge {\n  display: inline-block;\n  padding: 4px 8px;\n  background: #EEF2FF;\n  color: #4F46E5;\n  font-size: 12px;\n  font-weight: 600;\n  font-family: monospace;\n  border-radius: 4px;\n}\n.artifact-version-item .version-open-text {\n  flex: 1;\n  font-size: 13px;\n  color: #6B7280;\n}\n.artifact-version-item i {\n  color: #9CA3AF;\n  font-size: 12px;\n}\n.artifact-version-item:hover .version-badge {\n  background: #4F46E5;\n  color: white;\n}\n.artifact-version-item:hover .version-open-text {\n  color: #3B82F6;\n}\n.artifact-version-item:hover i {\n  color: #3B82F6;\n}\n\n.loading-peripheral-content {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 16px 24px;\n  background: white;\n  border: 2px solid #E5E7EB;\n  border-radius: 12px;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n  color: #4B5563;\n  font-size: 14px;\n  font-weight: 500;\n}\n.loading-peripheral-content i {\n  font-size: 20px;\n  color: #9333EA;\n}\n\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.conversation-loading-state {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n}\n\n.loading-content {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding-top: 20px;\n  gap: 16px;\n  color: #6B7280;\n  font-size: 15px;\n}\n.loading-content i {\n  font-size: 32px;\n  color: #3B82F6;\n}\n.loading-content span {\n  font-weight: 500;\n}\n\n/* Mobile adjustments: 481px - 768px */\n@media (max-width: 768px) {\n  .chat-header {\n    padding: 8px 12px;\n    gap: 8px;\n    flex-direction: column;\n    align-items: stretch;\n  }\n  .chat-info {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 8px;\n  }\n  .chat-title {\n    font-size: 14px;\n    width: 100%;\n    white-space: normal;\n  }\n  .project-tag {\n    margin-left: 0;\n    font-size: 10px;\n    padding: 3px 8px;\n    height: 24px;\n  }\n  .test-indicator {\n    margin-left: 0;\n    font-size: 10px;\n    padding: 3px 8px;\n    height: 24px;\n  }\n  .chat-actions {\n    flex-wrap: wrap;\n    justify-content: flex-start;\n    width: 100%;\n  }\n  .chat-members,\n  .artifact-indicator,\n  .action-btn {\n    padding: 6px 10px;\n    font-size: 12px;\n  }\n  .ambient-agent-indicator {\n    font-size: 12px;\n    padding: 4px 8px;\n  }\n  .project-selector-modal {\n    width: min(95vw, 600px);\n    height: auto;\n  }\n  .artifacts-modal {\n    width: min(95vw, 700px);\n  }\n  .artifacts-grid {\n    grid-template-columns: 1fr;\n  }\n  .chat-input-container {\n    padding: 0 0.75rem 0.75rem 0.75rem;\n  }\n  .scroll-to-bottom-icon {\n    bottom: 16px;\n    width: 36px;\n    height: 36px;\n  }\n  /* Artifact pane - full width overlay on mobile */\n  .chat-content-area {\n    position: relative;\n  }\n  .chat-artifact-pane {\n    position: fixed;\n    left: 0;\n    right: 0;\n    top: 80px;\n    bottom: 0;\n    width: 100% !important;\n    z-index: 100;\n    background: #FFF;\n  }\n  .resize-handle {\n    display: none;\n  }\n}\n/* Small Phone adjustments: <= 480px */\n@media (max-width: 480px) {\n  .chat-header {\n    padding: 6px 8px;\n    gap: 6px;\n  }\n  .chat-title {\n    font-size: 13px;\n  }\n  .project-tag {\n    font-size: 9px;\n    padding: 2px 6px;\n    height: 20px;\n  }\n  .test-indicator {\n    font-size: 9px;\n    padding: 2px 6px;\n    height: 20px;\n  }\n  .chat-members,\n  .artifact-indicator,\n  .action-btn {\n    padding: 4px 8px;\n    font-size: 11px;\n  }\n  .ambient-agent-indicator {\n    font-size: 11px;\n    padding: 3px 6px;\n  }\n  .project-selector-modal,\n  .artifacts-modal {\n    width: 100vw;\n    height: 100vh;\n    border-radius: 0;\n  }\n  .chat-input-container {\n    padding: 0 0.5rem 0.5rem 0.5rem;\n  }\n  .scroll-to-bottom-icon {\n    bottom: 12px;\n    width: 32px;\n    height: 32px;\n  }\n  .scroll-to-bottom-icon i {\n    font-size: 14px;\n  }\n}\n"] }]
+    }], () => [{ type: i1.ConversationDataService }, { type: i2.AgentStateService }, { type: i3.ConversationAgentService }, { type: i4.ActiveTasksService }, { type: i0.ChangeDetectorRef }, { type: i5.MentionAutocompleteService }, { type: i6.ArtifactPermissionService }, { type: i7.DialogService }], { environmentId: [{
             type: Input
         }], currentUser: [{
             type: Input
+        }], conversationId: [{
+            type: Input
+        }], conversation: [{
+            type: Input
+        }], threadId: [{
+            type: Input
+        }], isNewConversation: [{
+            type: Input
+        }], pendingMessage: [{
+            type: Input
+        }], pendingArtifactId: [{
+            type: Input
+        }], pendingArtifactVersionNumber: [{
+            type: Input
         }], conversationRenamed: [{
             type: Output
         }], openEntityRecord: [{
@@ -2052,6 +2071,18 @@ export class ConversationChatAreaComponent {
             type: Output
         }], artifactLinkClicked: [{
             type: Output
+        }], conversationCreated: [{
+            type: Output
+        }], threadOpened: [{
+            type: Output
+        }], threadClosed: [{
+            type: Output
+        }], pendingArtifactConsumed: [{
+            type: Output
+        }], pendingMessageConsumed: [{
+            type: Output
+        }], pendingMessageRequested: [{
+            type: Output
         }], scrollContainer: [{
             type: ViewChild,
             args: ['scrollContainer']