@memberjunction/ng-conversations 6.2.0-edge.2 → 6.2.0-edge.4

package/dist/lib/components/thread/thread-panel.component.js

@@ -1,440 +0,0 @@
-import { Component, Input, Output, EventEmitter } from '@angular/core';
-import { BaseAngularComponent } from '@memberjunction/ng-base-types';
-import { RunView } from '@memberjunction/core';
-import { Subject } from 'rxjs';
-import * as i0 from "@angular/core";
-import * as i1 from "../../services/data-cache.service";
-import * as i2 from "@angular/forms";
-const _forTrack0 = ($index, $item) => $item.ID;
-function ThreadPanelComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 7);
-    i0.ɵɵelement(1, "i", 9);
-    i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3, "Loading thread...");
-    i0.ɵɵelementEnd()();
-} }
-function ThreadPanelComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 8);
-    i0.ɵɵelement(1, "i", 10);
-    i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(ctx_r0.errorMessage);
-} }
-function ThreadPanelComponent_Conditional_11_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 20);
-    i0.ɵɵelement(1, "i", 27);
-    i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3, "No replies yet. Be the first to reply!");
-    i0.ɵɵelementEnd()();
-} }
-function ThreadPanelComponent_Conditional_11_For_16_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 28)(1, "div", 29)(2, "span", 30);
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "span", 31);
-    i0.ɵɵtext(5);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "div", 32);
-    i0.ɵɵtext(7);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const reply_r3 = ctx.$implicit;
-    const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("ai-reply", reply_r3.Role === "AI");
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(ctx_r0.getSenderName(reply_r3));
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r0.getMessageTime(reply_r3));
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", ctx_r0.getMessageText(reply_r3), " ");
-} }
-function ThreadPanelComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 11)(1, "div", 12)(2, "div", 13)(3, "span", 14);
-    i0.ɵɵtext(4);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "span", 15);
-    i0.ɵɵtext(6);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 16);
-    i0.ɵɵtext(8);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "div", 17);
-    i0.ɵɵelement(10, "i", 18);
-    i0.ɵɵelementStart(11, "span");
-    i0.ɵɵtext(12);
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(13, "div", 19);
-    i0.ɵɵconditionalCreate(14, ThreadPanelComponent_Conditional_11_Conditional_14_Template, 4, 0, "div", 20);
-    i0.ɵɵrepeaterCreate(15, ThreadPanelComponent_Conditional_11_For_16_Template, 8, 5, "div", 21, _forTrack0);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(17, "div", 22)(18, "textarea", 23);
-    i0.ɵɵtwoWayListener("ngModelChange", function ThreadPanelComponent_Conditional_11_Template_textarea_ngModelChange_18_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r0.replyText, $event) || (ctx_r0.replyText = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵlistener("keydown.control.enter", function ThreadPanelComponent_Conditional_11_Template_textarea_keydown_control_enter_18_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSendReply()); })("keydown.meta.enter", function ThreadPanelComponent_Conditional_11_Template_textarea_keydown_meta_enter_18_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSendReply()); });
-    i0.ɵɵtext(19, "      ");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(20, "div", 24)(21, "button", 25);
-    i0.ɵɵlistener("click", function ThreadPanelComponent_Conditional_11_Template_button_click_21_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSendReply()); });
-    i0.ɵɵelement(22, "i", 26);
-    i0.ɵɵelementStart(23, "span");
-    i0.ɵɵtext(24);
-    i0.ɵɵelementEnd()()()();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(ctx_r0.getSenderName(ctx_r0.parentMessage));
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r0.getMessageTime(ctx_r0.parentMessage));
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", ctx_r0.getMessageText(ctx_r0.parentMessage), " ");
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(ctx_r0.replyCountText);
-    i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r0.replies.length === 0 ? 14 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵrepeater(ctx_r0.replies);
-    i0.ɵɵadvance(3);
-    i0.ɵɵtwoWayProperty("ngModel", ctx_r0.replyText);
-    i0.ɵɵproperty("disabled", ctx_r0.isSending);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("disabled", !ctx_r0.canSendReply);
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(ctx_r0.isSending ? "Sending..." : "Reply");
-} }
-/**
- * Side panel component for displaying and managing threaded message replies
- * Shows parent message at top with all replies in chronological order
- */
-export class ThreadPanelComponent extends BaseAngularComponent {
-    dataCache;
-    cdRef;
-    ParentMessageId;
-    /** @deprecated Use {@link ParentMessageId}. */
-    set parentMessageId(value) {
-        this.ParentMessageId = value;
-    }
-    /** @deprecated Use {@link ParentMessageId}. */
-    get parentMessageId() {
-        return this.ParentMessageId;
-    }
-    ConversationId;
-    /** @deprecated Use {@link ConversationId}. */
-    set conversationId(value) {
-        this.ConversationId = value;
-    }
-    /** @deprecated Use {@link ConversationId}. */
-    get conversationId() {
-        return this.ConversationId;
-    }
-    CurrentUser;
-    /** @deprecated Use {@link CurrentUser}. */
-    set currentUser(value) {
-        this.CurrentUser = value;
-    }
-    /** @deprecated Use {@link CurrentUser}. */
-    get currentUser() {
-        return this.CurrentUser;
-    }
-    Closed = new EventEmitter();
-    /**
-     * @deprecated Use {@link Closed}.
-     *
-     * The same emitter under the old binding name, so a template still binding
-     * (closed) keeps working. Must stay AFTER Closed: class fields
-     * initialise in order, and the other way round this captures undefined.
-     */
-    closed = this.Closed;
-    ReplyAdded = new EventEmitter();
-    /**
-     * @deprecated Use {@link ReplyAdded}.
-     *
-     * The same emitter under the old binding name, so a template still binding
-     * (replyAdded) keeps working. Must stay AFTER ReplyAdded: class fields
-     * initialise in order, and the other way round this captures undefined.
-     */
-    replyAdded = this.ReplyAdded;
-    ParentMessage = null;
-    /** @deprecated Use {@link ParentMessage}. */
-    get parentMessage() {
-        return this.ParentMessage;
-    }
-    /** @deprecated Use {@link ParentMessage}. */
-    set parentMessage(value) {
-        this.ParentMessage = value;
-    }
-    Replies = [];
-    /** @deprecated Use {@link Replies}. */
-    get replies() {
-        return this.Replies;
-    }
-    /** @deprecated Use {@link Replies}. */
-    set replies(value) {
-        this.Replies = value;
-    }
-    ReplyText = '';
-    /** @deprecated Use {@link ReplyText}. */
-    get replyText() {
-        return this.ReplyText;
-    }
-    /** @deprecated Use {@link ReplyText}. */
-    set replyText(value) {
-        this.ReplyText = value;
-    }
-    isLoading = false;
-    IsSending = false;
-    /** @deprecated Use {@link IsSending}. */
-    get isSending() {
-        return this.IsSending;
-    }
-    /** @deprecated Use {@link IsSending}. */
-    set isSending(value) {
-        this.IsSending = value;
-    }
-    errorMessage = '';
-    destroy$ = new Subject();
-    constructor(dataCache, cdRef) {
-        super();
-        this.dataCache = dataCache;
-        this.cdRef = cdRef;
-    }
-    async ngOnInit() {
-        this.dataCache.Provider = this.ProviderToUse;
-        await this.loadThreadData();
-    }
-    ngOnDestroy() {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
-    /**
-     * Loads the parent message and all replies
-     */
-    async loadThreadData() {
-        this.isLoading = true;
-        this.errorMessage = '';
-        try {
-            // Load parent message from cache
-            const parent = await this.dataCache.getConversationDetail(this.ParentMessageId, this.CurrentUser);
-            if (!parent) {
-                this.errorMessage = 'Failed to load parent message';
-                this.isLoading = false;
-                return;
-            }
-            this.ParentMessage = parent;
-            // Load all replies
-            await this.loadReplies();
-        }
-        catch (error) {
-            console.error('Error loading thread data:', error);
-            this.errorMessage = 'Error loading thread. Please try again.';
-        }
-        finally {
-            this.isLoading = false;
-            this.cdRef.detectChanges();
-        }
-    }
-    /**
-     * Loads all replies for the parent message
-     */
-    async loadReplies() {
-        try {
-            const rv = RunView.FromMetadataProvider(this.ProviderToUse);
-            const result = await rv.RunView({
-                EntityName: 'MJ: Conversation Details',
-                ExtraFilter: `ParentID='${this.ParentMessageId}'`,
-                OrderBy: '__mj_CreatedAt ASC',
-                ResultType: 'entity_object'
-            }, this.CurrentUser);
-            if (result.Success) {
-                this.Replies = result.Results || [];
-            }
-            else {
-                console.error('Failed to load replies:', result.ErrorMessage);
-                this.errorMessage = 'Failed to load replies';
-            }
-        }
-        catch (error) {
-            console.error('Error loading replies:', error);
-            this.errorMessage = 'Error loading replies';
-        }
-    }
-    /**
-     * Handles sending a new reply
-     */
-    async OnSendReply() {
-        if (!this.CanSendReply)
-            return;
-        this.IsSending = true;
-        this.errorMessage = '';
-        try {
-            const reply = await this.dataCache.createConversationDetail(this.CurrentUser);
-            reply.ConversationID = this.ConversationId;
-            reply.ParentID = this.ParentMessageId;
-            reply.Message = this.ReplyText.trim();
-            reply.Role = 'User';
-            const saved = await reply.Save();
-            if (saved) {
-                // Add to local list
-                this.Replies = [...this.Replies, reply];
-                this.ReplyText = '';
-                // Emit event to parent
-                this.ReplyAdded.emit(reply);
-                // Update parent message thread count
-                if (this.ParentMessage) {
-                    this.ParentMessage.ThreadCount = (this.ParentMessage.ThreadCount || 0) + 1; // TODO: ThreadCount field doesn't exist on MJConversationDetailEntity yet
-                }
-                this.cdRef.detectChanges();
-            }
-            else {
-                console.error('Failed to save reply:', reply.LatestResult?.Message);
-                this.errorMessage = 'Failed to send reply. Please try again.';
-            }
-        }
-        catch (error) {
-            console.error('Error sending reply:', error);
-            this.errorMessage = 'Error sending reply. Please try again.';
-        }
-        finally {
-            this.IsSending = false;
-            this.cdRef.detectChanges();
-        }
-    }
-    /** @deprecated Use {@link OnSendReply}. */
-    async onSendReply() {
-        return this.OnSendReply();
-    }
-    /**
-     * Handles closing the thread panel
-     */
-    OnClose() {
-        this.Closed.emit();
-    }
-    /** @deprecated Use {@link OnClose}. */
-    onClose() {
-        return this.OnClose();
-    }
-    /**
-     * Gets the display text for a message
-     */
-    GetMessageText(message) {
-        return message.Message || '';
-    }
-    /** @deprecated Use {@link GetMessageText}. */
-    getMessageText(message) {
-        return this.GetMessageText(message);
-    }
-    /**
-     * Gets the timestamp display for a message
-     */
-    GetMessageTime(message) {
-        if (!message.__mj_CreatedAt)
-            return '';
-        const date = new Date(message.__mj_CreatedAt);
-        const now = new Date();
-        const diffMs = now.getTime() - date.getTime();
-        const diffMins = Math.floor(diffMs / 60000);
-        const diffHours = Math.floor(diffMs / 3600000);
-        const diffDays = Math.floor(diffMs / 86400000);
-        if (diffMins < 1)
-            return 'Just now';
-        if (diffMins < 60)
-            return `${diffMins}m ago`;
-        if (diffHours < 24)
-            return `${diffHours}h ago`;
-        if (diffDays < 7)
-            return `${diffDays}d ago`;
-        return date.toLocaleDateString();
-    }
-    /** @deprecated Use {@link GetMessageTime}. */
-    getMessageTime(message) {
-        return this.GetMessageTime(message);
-    }
-    /**
-     * Gets the sender name for a message
-     */
-    GetSenderName(message) {
-        if (message.Role === 'AI')
-            return 'AI Assistant';
-        return message.User || 'User';
-    }
-    /** @deprecated Use {@link GetSenderName}. */
-    getSenderName(message) {
-        return this.GetSenderName(message);
-    }
-    /**
-     * Checks if current user can send reply
-     */
-    get CanSendReply() {
-        return !this.IsSending && !this.isLoading && this.ReplyText.trim().length > 0;
-    }
-    /** @deprecated Use {@link CanSendReply}. */
-    get canSendReply() {
-        return this.CanSendReply;
-    }
-    /**
-     * Gets the reply count text
-     */
-    get ReplyCountText() {
-        const count = this.Replies.length;
-        return count === 1 ? '1 reply' : `${count} replies`;
-    }
-    /** @deprecated Use {@link ReplyCountText}. */
-    get replyCountText() {
-        return this.ReplyCountText;
-    }
-    static ɵfac = function ThreadPanelComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ThreadPanelComponent)(i0.ɵɵdirectiveInject(i1.DataCacheService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ThreadPanelComponent, selectors: [["mj-thread-panel"]], inputs: { ParentMessageId: "ParentMessageId", parentMessageId: "parentMessageId", ConversationId: "ConversationId", conversationId: "conversationId", CurrentUser: "CurrentUser", currentUser: "currentUser" }, outputs: { Closed: "Closed", closed: "closed", ReplyAdded: "ReplyAdded", replyAdded: "replyAdded" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 12, vars: 3, consts: [[1, "thread-panel-overlay", 3, "click"], [1, "thread-panel"], [1, "thread-header"], [1, "thread-title"], [1, "fa-solid", "fa-comments"], ["title", "Close thread", 1, "close-btn", 3, "click"], [1, "fa-solid", "fa-times"], [1, "thread-loading"], [1, "thread-error"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "fa-solid", "fa-exclamation-circle"], [1, "thread-content"], [1, "parent-message"], [1, "message-header"], [1, "message-sender"], [1, "message-time"], [1, "message-body"], [1, "reply-count"], [1, "fa-solid", "fa-reply"], [1, "replies-container"], [1, "no-replies"], [1, "reply-item", 3, "ai-reply"], [1, "reply-input-container"], ["placeholder", "Reply to thread...", "rows", "3", 1, "reply-input", 3, "ngModelChange", "keydown.control.enter", "keydown.meta.enter", "ngModel", "disabled"], [1, "reply-actions"], [1, "btn-send-reply", 3, "click", "disabled"], [1, "fa-solid", "fa-paper-plane"], [1, "fa-solid", "fa-message"], [1, "reply-item"], [1, "reply-header"], [1, "reply-sender"], [1, "reply-time"], [1, "reply-body"]], template: function ThreadPanelComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "div", 0);
-            i0.ɵɵlistener("click", function ThreadPanelComponent_Template_div_click_0_listener() { return ctx.onClose(); });
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(1, "div", 1)(2, "div", 2)(3, "div", 3);
-            i0.ɵɵelement(4, "i", 4);
-            i0.ɵɵelementStart(5, "span");
-            i0.ɵɵtext(6, "Thread");
-            i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(7, "button", 5);
-            i0.ɵɵlistener("click", function ThreadPanelComponent_Template_button_click_7_listener() { return ctx.onClose(); });
-            i0.ɵɵelement(8, "i", 6);
-            i0.ɵɵelementEnd()();
-            i0.ɵɵconditionalCreate(9, ThreadPanelComponent_Conditional_9_Template, 4, 0, "div", 7);
-            i0.ɵɵconditionalCreate(10, ThreadPanelComponent_Conditional_10_Template, 4, 1, "div", 8);
-            i0.ɵɵconditionalCreate(11, ThreadPanelComponent_Conditional_11_Template, 25, 9);
-            i0.ɵɵelementEnd();
-        } if (rf & 2) {
-            i0.ɵɵadvance(9);
-            i0.ɵɵconditional(ctx.isLoading ? 9 : -1);
-            i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.errorMessage && !ctx.isLoading ? 10 : -1);
-            i0.ɵɵadvance();
-            i0.ɵɵconditional(!ctx.isLoading && !ctx.errorMessage && ctx.parentMessage ? 11 : -1);
-        } }, dependencies: [i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgModel], styles: ["\n.thread-panel-overlay[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: var(--mj-bg-overlay);\n  z-index: 999;\n  animation: _ngcontent-%COMP%_fadeIn 200ms ease;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n\n.thread-panel[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  width: 450px;\n  max-width: 90vw;\n  background: var(--mj-bg-surface-card);\n  box-shadow: -2px 0 8px color-mix(in srgb, var(--mj-text-primary) 15%, transparent);\n  z-index: 1000;\n  display: flex;\n  flex-direction: column;\n  animation: _ngcontent-%COMP%_slideIn 250ms ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideIn {\n  from {\n    transform: translateX(100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n\n\n.thread-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.thread-title[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.thread-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-text-secondary);\n}\n\n.close-btn[_ngcontent-%COMP%] {\n  padding: 6px;\n  background: transparent;\n  border: none;\n  border-radius: 4px;\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  font-size: 18px;\n  transition: all 150ms ease;\n}\n\n.close-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-border-default);\n  color: var(--mj-text-primary);\n}\n\n\n.thread-loading[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 40px;\n  color: var(--mj-text-secondary);\n}\n\n.thread-loading[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 24px;\n}\n\n\n.thread-error[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 16px 20px;\n  background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n  border-left: 3px solid var(--mj-status-error);\n  color: var(--mj-status-error);\n  margin: 16px 20px;\n  border-radius: 4px;\n}\n\n\n.thread-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px;\n}\n\n\n.parent-message[_ngcontent-%COMP%] {\n  padding: 16px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  margin-bottom: 20px;\n}\n\n.message-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 8px;\n}\n\n.message-sender[_ngcontent-%COMP%] {\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  font-size: 14px;\n}\n\n.message-time[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--mj-text-secondary);\n}\n\n.message-body[_ngcontent-%COMP%] {\n  color: var(--mj-text-primary);\n  line-height: 1.6;\n  white-space: pre-wrap;\n  word-break: break-word;\n  font-size: 14px;\n  margin-bottom: 12px;\n}\n\n.reply-count[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding-top: 12px;\n  border-top: 1px solid var(--mj-border-default);\n  font-size: 13px;\n  color: var(--mj-text-secondary);\n  font-weight: 500;\n}\n\n.reply-count[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n\n.replies-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.no-replies[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 8px;\n  padding: 40px 20px;\n  color: var(--mj-text-muted);\n  text-align: center;\n}\n\n.no-replies[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 32px;\n  opacity: 0.5;\n}\n\n.no-replies[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-size: 14px;\n}\n\n\n.reply-item[_ngcontent-%COMP%] {\n  padding: 12px;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  transition: all 150ms ease;\n}\n\n.reply-item[_ngcontent-%COMP%]:hover {\n  border-color: var(--mj-border-strong);\n  box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-text-primary) 5%, transparent);\n}\n\n.reply-item.ai-reply[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 20%, var(--mj-bg-surface));\n}\n\n.reply-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 6px;\n}\n\n.reply-sender[_ngcontent-%COMP%] {\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  font-size: 13px;\n}\n\n.reply-time[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n.reply-body[_ngcontent-%COMP%] {\n  color: var(--mj-text-primary);\n  line-height: 1.5;\n  white-space: pre-wrap;\n  word-break: break-word;\n  font-size: 13px;\n}\n\n\n.reply-input-container[_ngcontent-%COMP%] {\n  padding: 16px 20px;\n  border-top: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.reply-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 10px 12px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  resize: vertical;\n  font-family: inherit;\n  font-size: 14px;\n  min-height: 60px;\n  transition: all 150ms ease;\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-primary);\n}\n\n.reply-input[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.reply-input[_ngcontent-%COMP%]:disabled {\n  background: var(--mj-bg-surface-sunken);\n  cursor: not-allowed;\n  opacity: 0.6;\n}\n\n.reply-actions[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: flex-end;\n  margin-top: 10px;\n}\n\n.btn-send-reply[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 16px;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border: none;\n  border-radius: 6px;\n  cursor: pointer;\n  font-weight: 600;\n  font-size: 13px;\n  transition: all 150ms ease;\n}\n\n.btn-send-reply[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: var(--mj-brand-primary-hover);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px color-mix(in srgb, var(--mj-brand-primary) 20%, transparent);\n}\n\n.btn-send-reply[_ngcontent-%COMP%]:disabled {\n  background: var(--mj-border-default);\n  cursor: not-allowed;\n  opacity: 0.6;\n}\n\n.btn-send-reply[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n\n.thread-content[_ngcontent-%COMP%]::-webkit-scrollbar {\n  width: 6px;\n}\n\n.thread-content[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.thread-content[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n  background: var(--mj-border-default);\n  border-radius: 3px;\n}\n\n.thread-content[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n  background: var(--mj-text-muted);\n}"] });
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ThreadPanelComponent, [{
-        type: Component,
-        args: [{ standalone: false, selector: 'mj-thread-panel', template: "<div class=\"thread-panel-overlay\" (click)=\"onClose()\"></div>\n\n<div class=\"thread-panel\">\n  <div class=\"thread-header\">\n    <div class=\"thread-title\">\n      <i class=\"fa-solid fa-comments\"></i>\n      <span>Thread</span>\n    </div>\n    <button class=\"close-btn\" (click)=\"onClose()\" title=\"Close thread\">\n      <i class=\"fa-solid fa-times\"></i>\n    </button>\n  </div>\n\n  @if (isLoading) {\n    <div class=\"thread-loading\">\n      <i class=\"fa-solid fa-spinner fa-spin\"></i>\n      <span>Loading thread...</span>\n    </div>\n  }\n\n  @if (errorMessage && !isLoading) {\n    <div class=\"thread-error\">\n      <i class=\"fa-solid fa-exclamation-circle\"></i>\n      <span>{{ errorMessage }}</span>\n    </div>\n  }\n\n  @if (!isLoading && !errorMessage && parentMessage) {\n    <div class=\"thread-content\">\n      <!-- Parent Message -->\n      <div class=\"parent-message\">\n        <div class=\"message-header\">\n          <span class=\"message-sender\">{{ getSenderName(parentMessage) }}</span>\n          <span class=\"message-time\">{{ getMessageTime(parentMessage) }}</span>\n        </div>\n        <div class=\"message-body\">\n          {{ getMessageText(parentMessage) }}\n        </div>\n        <div class=\"reply-count\">\n          <i class=\"fa-solid fa-reply\"></i>\n          <span>{{ replyCountText }}</span>\n        </div>\n      </div>\n\n      <!-- Replies List -->\n      <div class=\"replies-container\">\n        @if (replies.length === 0) {\n          <div class=\"no-replies\">\n            <i class=\"fa-solid fa-message\"></i>\n            <span>No replies yet. Be the first to reply!</span>\n          </div>\n        }\n\n        @for (reply of replies; track reply.ID) {\n          <div class=\"reply-item\" [class.ai-reply]=\"reply.Role === 'AI'\">\n            <div class=\"reply-header\">\n              <span class=\"reply-sender\">{{ getSenderName(reply) }}</span>\n              <span class=\"reply-time\">{{ getMessageTime(reply) }}</span>\n            </div>\n            <div class=\"reply-body\">\n              {{ getMessageText(reply) }}\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <!-- Reply Input -->\n    <div class=\"reply-input-container\">\n      <textarea\n        class=\"reply-input\"\n        [(ngModel)]=\"replyText\"\n        [disabled]=\"isSending\"\n        placeholder=\"Reply to thread...\"\n        rows=\"3\"\n        (keydown.control.enter)=\"onSendReply()\"\n        (keydown.meta.enter)=\"onSendReply()\">\n      </textarea>\n      <div class=\"reply-actions\">\n        <button\n          class=\"btn-send-reply\"\n          [disabled]=\"!canSendReply\"\n          (click)=\"onSendReply()\">\n          <i class=\"fa-solid fa-paper-plane\"></i>\n          <span>{{ isSending ? 'Sending...' : 'Reply' }}</span>\n        </button>\n      </div>\n    </div>\n  }\n</div>\n", styles: ["/* Thread Panel Overlay */\n.thread-panel-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: var(--mj-bg-overlay);\n  z-index: 999;\n  animation: fadeIn 200ms ease;\n}\n\n@keyframes fadeIn {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n/* Thread Panel Container */\n.thread-panel {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  width: 450px;\n  max-width: 90vw;\n  background: var(--mj-bg-surface-card);\n  box-shadow: -2px 0 8px color-mix(in srgb, var(--mj-text-primary) 15%, transparent);\n  z-index: 1000;\n  display: flex;\n  flex-direction: column;\n  animation: slideIn 250ms ease;\n}\n\n@keyframes slideIn {\n  from {\n    transform: translateX(100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n\n/* Header */\n.thread-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.thread-title {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.thread-title i {\n  color: var(--mj-text-secondary);\n}\n\n.close-btn {\n  padding: 6px;\n  background: transparent;\n  border: none;\n  border-radius: 4px;\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  font-size: 18px;\n  transition: all 150ms ease;\n}\n\n.close-btn:hover {\n  background: var(--mj-border-default);\n  color: var(--mj-text-primary);\n}\n\n/* Loading State */\n.thread-loading {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 40px;\n  color: var(--mj-text-secondary);\n}\n\n.thread-loading i {\n  font-size: 24px;\n}\n\n/* Error State */\n.thread-error {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 16px 20px;\n  background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n  border-left: 3px solid var(--mj-status-error);\n  color: var(--mj-status-error);\n  margin: 16px 20px;\n  border-radius: 4px;\n}\n\n/* Content Container */\n.thread-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px;\n}\n\n/* Parent Message */\n.parent-message {\n  padding: 16px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  margin-bottom: 20px;\n}\n\n.message-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 8px;\n}\n\n.message-sender {\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  font-size: 14px;\n}\n\n.message-time {\n  font-size: 12px;\n  color: var(--mj-text-secondary);\n}\n\n.message-body {\n  color: var(--mj-text-primary);\n  line-height: 1.6;\n  white-space: pre-wrap;\n  word-break: break-word;\n  font-size: 14px;\n  margin-bottom: 12px;\n}\n\n.reply-count {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding-top: 12px;\n  border-top: 1px solid var(--mj-border-default);\n  font-size: 13px;\n  color: var(--mj-text-secondary);\n  font-weight: 500;\n}\n\n.reply-count i {\n  font-size: 12px;\n}\n\n/* Replies Container */\n.replies-container {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.no-replies {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 8px;\n  padding: 40px 20px;\n  color: var(--mj-text-muted);\n  text-align: center;\n}\n\n.no-replies i {\n  font-size: 32px;\n  opacity: 0.5;\n}\n\n.no-replies span {\n  font-size: 14px;\n}\n\n/* Reply Item */\n.reply-item {\n  padding: 12px;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  transition: all 150ms ease;\n}\n\n.reply-item:hover {\n  border-color: var(--mj-border-strong);\n  box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-text-primary) 5%, transparent);\n}\n\n.reply-item.ai-reply {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 20%, var(--mj-bg-surface));\n}\n\n.reply-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 6px;\n}\n\n.reply-sender {\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  font-size: 13px;\n}\n\n.reply-time {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n.reply-body {\n  color: var(--mj-text-primary);\n  line-height: 1.5;\n  white-space: pre-wrap;\n  word-break: break-word;\n  font-size: 13px;\n}\n\n/* Reply Input */\n.reply-input-container {\n  padding: 16px 20px;\n  border-top: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.reply-input {\n  width: 100%;\n  padding: 10px 12px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  resize: vertical;\n  font-family: inherit;\n  font-size: 14px;\n  min-height: 60px;\n  transition: all 150ms ease;\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-primary);\n}\n\n.reply-input:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.reply-input:disabled {\n  background: var(--mj-bg-surface-sunken);\n  cursor: not-allowed;\n  opacity: 0.6;\n}\n\n.reply-actions {\n  display: flex;\n  justify-content: flex-end;\n  margin-top: 10px;\n}\n\n.btn-send-reply {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 16px;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border: none;\n  border-radius: 6px;\n  cursor: pointer;\n  font-weight: 600;\n  font-size: 13px;\n  transition: all 150ms ease;\n}\n\n.btn-send-reply:hover:not(:disabled) {\n  background: var(--mj-brand-primary-hover);\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px color-mix(in srgb, var(--mj-brand-primary) 20%, transparent);\n}\n\n.btn-send-reply:disabled {\n  background: var(--mj-border-default);\n  cursor: not-allowed;\n  opacity: 0.6;\n}\n\n.btn-send-reply i {\n  font-size: 12px;\n}\n\n/* Scrollbar Styling */\n.thread-content::-webkit-scrollbar {\n  width: 6px;\n}\n\n.thread-content::-webkit-scrollbar-track {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.thread-content::-webkit-scrollbar-thumb {\n  background: var(--mj-border-default);\n  border-radius: 3px;\n}\n\n.thread-content::-webkit-scrollbar-thumb:hover {\n  background: var(--mj-text-muted);\n}\n"] }]
-    }], () => [{ type: i1.DataCacheService }, { type: i0.ChangeDetectorRef }], { ParentMessageId: [{
-            type: Input
-        }], parentMessageId: [{
-            type: Input
-        }], ConversationId: [{
-            type: Input
-        }], conversationId: [{
-            type: Input
-        }], CurrentUser: [{
-            type: Input
-        }], currentUser: [{
-            type: Input
-        }], Closed: [{
-            type: Output
-        }], closed: [{
-            type: Output
-        }], ReplyAdded: [{
-            type: Output
-        }], replyAdded: [{
-            type: Output
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ThreadPanelComponent, { className: "ThreadPanelComponent", filePath: "src/lib/components/thread/thread-panel.component.ts", lineNumber: 19 }); })();
-//# sourceMappingURL=thread-panel.component.js.map

package/dist/lib/components/thread/thread-panel.component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"thread-panel.component.js","sourceRoot":"","sources":["../../../../src/lib/components/thread/thread-panel.component.ts","../../../../src/lib/components/thread/thread-panel.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input, Output, EventEmitter, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\nimport { MJConversationDetailEntity } from '@memberjunction/core-entities';\nimport { UserInfo, RunView, Metadata } from '@memberjunction/core';\nimport { DataCacheService } from '../../services/data-cache.service';\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\n/**\n * Side panel component for displaying and managing threaded message replies\n * Shows parent message at top with all replies in chronological order\n */\n@Component({\n  standalone: false,\n  selector: 'mj-thread-panel',\n  templateUrl: './thread-panel.component.html',\n  styleUrls: ['./thread-panel.component.css']\n})\nexport class ThreadPanelComponent extends BaseAngularComponent implements OnInit, OnDestroy  {\n  @Input() ParentMessageId!: string;\n\n  /** @deprecated Use {@link ParentMessageId}. */\n  @Input() set parentMessageId(value: string) {\n    this.ParentMessageId = value;\n  }\n  /** @deprecated Use {@link ParentMessageId}. */\n  get parentMessageId(): string {\n    return this.ParentMessageId;\n  }\n  @Input() ConversationId!: string;\n\n  /** @deprecated Use {@link ConversationId}. */\n  @Input() set conversationId(value: string) {\n    this.ConversationId = value;\n  }\n  /** @deprecated Use {@link ConversationId}. */\n  get conversationId(): string {\n    return this.ConversationId;\n  }\n  @Input() CurrentUser!: UserInfo;\n\n  /** @deprecated Use {@link CurrentUser}. */\n  @Input() set currentUser(value: UserInfo) {\n    this.CurrentUser = value;\n  }\n  /** @deprecated Use {@link CurrentUser}. */\n  get currentUser(): UserInfo {\n    return this.CurrentUser;\n  }\n\n  @Output() Closed = new EventEmitter<void>();\n\n  /**\n   * @deprecated Use {@link Closed}.\n   *\n   * The same emitter under the old binding name, so a template still binding\n   * (closed) keeps working. Must stay AFTER Closed: class fields\n   * initialise in order, and the other way round this captures undefined.\n   */\n  @Output() closed = this.Closed;\n  @Output() ReplyAdded = new EventEmitter<MJConversationDetailEntity>();\n\n  /**\n   * @deprecated Use {@link ReplyAdded}.\n   *\n   * The same emitter under the old binding name, so a template still binding\n   * (replyAdded) keeps working. Must stay AFTER ReplyAdded: class fields\n   * initialise in order, and the other way round this captures undefined.\n   */\n  @Output() replyAdded = this.ReplyAdded;\n\n  public ParentMessage: MJConversationDetailEntity | null = null;\n\n  /** @deprecated Use {@link ParentMessage}. */\n  public get parentMessage(): MJConversationDetailEntity | null {\n    return this.ParentMessage;\n  }\n  /** @deprecated Use {@link ParentMessage}. */\n  public set parentMessage(value: MJConversationDetailEntity | null) {\n    this.ParentMessage = value;\n  }\n  public Replies: MJConversationDetailEntity[] = [];\n\n  /** @deprecated Use {@link Replies}. */\n  public get replies(): MJConversationDetailEntity[] {\n    return this.Replies;\n  }\n  /** @deprecated Use {@link Replies}. */\n  public set replies(value: MJConversationDetailEntity[]) {\n    this.Replies = value;\n  }\n  public ReplyText: string = '';\n\n  /** @deprecated Use {@link ReplyText}. */\n  public get replyText(): string {\n    return this.ReplyText;\n  }\n  /** @deprecated Use {@link ReplyText}. */\n  public set replyText(value: string) {\n    this.ReplyText = value;\n  }\n  public isLoading: boolean = false;\n  public IsSending: boolean = false;\n\n  /** @deprecated Use {@link IsSending}. */\n  public get isSending(): boolean {\n    return this.IsSending;\n  }\n  /** @deprecated Use {@link IsSending}. */\n  public set isSending(value: boolean) {\n    this.IsSending = value;\n  }\n  public errorMessage: string = '';\n\n  private destroy$ = new Subject<void>();\n\n  constructor(\n    private dataCache: DataCacheService,\n    private cdRef: ChangeDetectorRef\n  ) {\n  super();}\n\n  async ngOnInit() {\n    this.dataCache.Provider = this.ProviderToUse;\n    await this.loadThreadData();\n  }\n\n  ngOnDestroy() {\n    this.destroy$.next();\n    this.destroy$.complete();\n  }\n\n  /**\n   * Loads the parent message and all replies\n   */\n  private async loadThreadData(): Promise<void> {\n    this.isLoading = true;\n    this.errorMessage = '';\n\n    try {\n      // Load parent message from cache\n      const parent = await this.dataCache.getConversationDetail(this.ParentMessageId, this.CurrentUser);\n\n      if (!parent) {\n        this.errorMessage = 'Failed to load parent message';\n        this.isLoading = false;\n        return;\n      }\n\n      this.ParentMessage = parent;\n\n      // Load all replies\n      await this.loadReplies();\n    } catch (error) {\n      console.error('Error loading thread data:', error);\n      this.errorMessage = 'Error loading thread. Please try again.';\n    } finally {\n      this.isLoading = false;\n      this.cdRef.detectChanges();\n    }\n  }\n\n  /**\n   * Loads all replies for the parent message\n   */\n  private async loadReplies(): Promise<void> {\n    try {\n      const rv = RunView.FromMetadataProvider(this.ProviderToUse);\n      const result = await rv.RunView<MJConversationDetailEntity>(\n        {\n          EntityName: 'MJ: Conversation Details',\n          ExtraFilter: `ParentID='${this.ParentMessageId}'`,\n          OrderBy: '__mj_CreatedAt ASC',\n          ResultType: 'entity_object'\n        },\n        this.CurrentUser\n      );\n\n      if (result.Success) {\n        this.Replies = result.Results || [];\n      } else {\n        console.error('Failed to load replies:', result.ErrorMessage);\n        this.errorMessage = 'Failed to load replies';\n      }\n    } catch (error) {\n      console.error('Error loading replies:', error);\n      this.errorMessage = 'Error loading replies';\n    }\n  }\n\n  /**\n   * Handles sending a new reply\n   */\n  async OnSendReply(): Promise<void> {\n    if (!this.CanSendReply) return;\n\n    this.IsSending = true;\n    this.errorMessage = '';\n\n    try {\n      const reply = await this.dataCache.createConversationDetail(this.CurrentUser);\n\n      reply.ConversationID = this.ConversationId;\n      reply.ParentID = this.ParentMessageId;\n      reply.Message = this.ReplyText.trim();\n      reply.Role = 'User';\n\n      const saved = await reply.Save();\n\n      if (saved) {\n        // Add to local list\n        this.Replies = [...this.Replies, reply];\n        this.ReplyText = '';\n\n        // Emit event to parent\n        this.ReplyAdded.emit(reply);\n\n        // Update parent message thread count\n        if (this.ParentMessage) {\n          (this.ParentMessage as any).ThreadCount = ((this.ParentMessage as any).ThreadCount || 0) + 1; // TODO: ThreadCount field doesn't exist on MJConversationDetailEntity yet\n        }\n\n        this.cdRef.detectChanges();\n      } else {\n        console.error('Failed to save reply:', reply.LatestResult?.Message);\n        this.errorMessage = 'Failed to send reply. Please try again.';\n      }\n    } catch (error) {\n      console.error('Error sending reply:', error);\n      this.errorMessage = 'Error sending reply. Please try again.';\n    } finally {\n      this.IsSending = false;\n      this.cdRef.detectChanges();\n    }\n  }\n\n  /** @deprecated Use {@link OnSendReply}. */\n  async onSendReply(): Promise<void> {\n    return this.OnSendReply();\n  }\n\n  /**\n   * Handles closing the thread panel\n   */\n  OnClose(): void {\n    this.Closed.emit();\n  }\n\n  /** @deprecated Use {@link OnClose}. */\n  onClose(): void {\n    return this.OnClose();\n  }\n\n  /**\n   * Gets the display text for a message\n   */\n  GetMessageText(message: MJConversationDetailEntity): string {\n    return message.Message || '';\n  }\n\n  /** @deprecated Use {@link GetMessageText}. */\n  getMessageText(message: MJConversationDetailEntity): string {\n    return this.GetMessageText(message);\n  }\n\n  /**\n   * Gets the timestamp display for a message\n   */\n  GetMessageTime(message: MJConversationDetailEntity): string {\n    if (!message.__mj_CreatedAt) return '';\n\n    const date = new Date(message.__mj_CreatedAt);\n    const now = new Date();\n    const diffMs = now.getTime() - date.getTime();\n    const diffMins = Math.floor(diffMs / 60000);\n    const diffHours = Math.floor(diffMs / 3600000);\n    const diffDays = Math.floor(diffMs / 86400000);\n\n    if (diffMins < 1) return 'Just now';\n    if (diffMins < 60) return `${diffMins}m ago`;\n    if (diffHours < 24) return `${diffHours}h ago`;\n    if (diffDays < 7) return `${diffDays}d ago`;\n\n    return date.toLocaleDateString();\n  }\n\n  /** @deprecated Use {@link GetMessageTime}. */\n  getMessageTime(message: MJConversationDetailEntity): string {\n    return this.GetMessageTime(message);\n  }\n\n  /**\n   * Gets the sender name for a message\n   */\n  GetSenderName(message: MJConversationDetailEntity): string {\n    if (message.Role === 'AI') return 'AI Assistant';\n    return message.User || 'User';\n  }\n\n  /** @deprecated Use {@link GetSenderName}. */\n  getSenderName(message: MJConversationDetailEntity): string {\n    return this.GetSenderName(message);\n  }\n\n  /**\n   * Checks if current user can send reply\n   */\n  get CanSendReply(): boolean {\n    return !this.IsSending && !this.isLoading && this.ReplyText.trim().length > 0;\n  }\n\n  /** @deprecated Use {@link CanSendReply}. */\n  get canSendReply(): boolean {\n    return this.CanSendReply;\n  }\n\n  /**\n   * Gets the reply count text\n   */\n  get ReplyCountText(): string {\n    const count = this.Replies.length;\n    return count === 1 ? '1 reply' : `${count} replies`;\n  }\n\n  /** @deprecated Use {@link ReplyCountText}. */\n  get replyCountText(): string {\n    return this.ReplyCountText;\n  }\n}\n","<div class=\"thread-panel-overlay\" (click)=\"onClose()\"></div>\n\n<div class=\"thread-panel\">\n  <div class=\"thread-header\">\n    <div class=\"thread-title\">\n      <i class=\"fa-solid fa-comments\"></i>\n      <span>Thread</span>\n    </div>\n    <button class=\"close-btn\" (click)=\"onClose()\" title=\"Close thread\">\n      <i class=\"fa-solid fa-times\"></i>\n    </button>\n  </div>\n\n  @if (isLoading) {\n    <div class=\"thread-loading\">\n      <i class=\"fa-solid fa-spinner fa-spin\"></i>\n      <span>Loading thread...</span>\n    </div>\n  }\n\n  @if (errorMessage && !isLoading) {\n    <div class=\"thread-error\">\n      <i class=\"fa-solid fa-exclamation-circle\"></i>\n      <span>{{ errorMessage }}</span>\n    </div>\n  }\n\n  @if (!isLoading && !errorMessage && parentMessage) {\n    <div class=\"thread-content\">\n      <!-- Parent Message -->\n      <div class=\"parent-message\">\n        <div class=\"message-header\">\n          <span class=\"message-sender\">{{ getSenderName(parentMessage) }}</span>\n          <span class=\"message-time\">{{ getMessageTime(parentMessage) }}</span>\n        </div>\n        <div class=\"message-body\">\n          {{ getMessageText(parentMessage) }}\n        </div>\n        <div class=\"reply-count\">\n          <i class=\"fa-solid fa-reply\"></i>\n          <span>{{ replyCountText }}</span>\n        </div>\n      </div>\n\n      <!-- Replies List -->\n      <div class=\"replies-container\">\n        @if (replies.length === 0) {\n          <div class=\"no-replies\">\n            <i class=\"fa-solid fa-message\"></i>\n            <span>No replies yet. Be the first to reply!</span>\n          </div>\n        }\n\n        @for (reply of replies; track reply.ID) {\n          <div class=\"reply-item\" [class.ai-reply]=\"reply.Role === 'AI'\">\n            <div class=\"reply-header\">\n              <span class=\"reply-sender\">{{ getSenderName(reply) }}</span>\n              <span class=\"reply-time\">{{ getMessageTime(reply) }}</span>\n            </div>\n            <div class=\"reply-body\">\n              {{ getMessageText(reply) }}\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <!-- Reply Input -->\n    <div class=\"reply-input-container\">\n      <textarea\n        class=\"reply-input\"\n        [(ngModel)]=\"replyText\"\n        [disabled]=\"isSending\"\n        placeholder=\"Reply to thread...\"\n        rows=\"3\"\n        (keydown.control.enter)=\"onSendReply()\"\n        (keydown.meta.enter)=\"onSendReply()\">\n      </textarea>\n      <div class=\"reply-actions\">\n        <button\n          class=\"btn-send-reply\"\n          [disabled]=\"!canSendReply\"\n          (click)=\"onSendReply()\">\n          <i class=\"fa-solid fa-paper-plane\"></i>\n          <span>{{ isSending ? 'Sending...' : 'Reply' }}</span>\n        </button>\n      </div>\n    </div>\n  }\n</div>\n"]}