@memberjunction/ng-conversations 2.104.0 → 2.106.0

package/dist/lib/components/tasks/tasks-dropdown.component.js

@@ -1,8 +1,12 @@
-import { Component, Input } from '@angular/core';
+import { Component, Input, Output, EventEmitter } from '@angular/core';
 import { RunView } from '@memberjunction/core';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
 import * as i0 from "@angular/core";
 import * as i1 from "../../services/conversation-state.service";
-import * as i2 from "@angular/common";
+import * as i2 from "../../services/active-tasks.service";
+import * as i3 from "@angular/common";
+import * as i4 from "./task-widget.component";
 function TasksDropdownComponent_span_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 5);
     i0.ɵɵtext(1);
@@ -10,106 +14,148 @@ function TasksDropdownComponent_span_5_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r0.taskCount);
+    i0.ɵɵtextInterpolate(ctx_r0.totalTaskCount);
 } }
-function TasksDropdownComponent_div_6_div_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 14);
-    i0.ɵɵelement(1, "i", 2);
-    i0.ɵɵelementStart(2, "p");
-    i0.ɵɵtext(3, "No active tasks");
-    i0.ɵɵelementEnd()();
-} }
-function TasksDropdownComponent_div_6_div_10_span_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 22);
-    i0.ɵɵelement(1, "i", 23);
-    i0.ɵɵtext(2);
+function TasksDropdownComponent_div_6_div_9_div_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 18);
+    i0.ɵɵelement(1, "div", 19);
+    i0.ɵɵelementStart(2, "div", 20)(3, "div", 21);
+    i0.ɵɵelement(4, "i", 22);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "div", 23);
+    i0.ɵɵtext(7);
     i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "div", 24);
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const task_r3 = i0.ɵɵnextContext().$implicit;
+    const task_r3 = ctx.$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate1(" ", task_r3.agentName, " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r0.getTrimmedStatus(task_r3.status));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", task_r3.PercentComplete, "% ");
+    i0.ɵɵtextInterpolate(ctx_r0.getElapsedTime(task_r3));
 } }
-function TasksDropdownComponent_div_6_div_10_span_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 24);
-    i0.ɵɵelement(1, "i", 25);
-    i0.ɵɵtext(2);
+function TasksDropdownComponent_div_6_div_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 14)(1, "div", 15);
+    i0.ɵɵelement(2, "i", 16);
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(5, TasksDropdownComponent_div_6_div_9_div_5_Template, 10, 3, "div", 17);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const task_r3 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", task_r3.User, " ");
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1("Active (", ctx_r0.activeTasks.length, ")");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngForOf", ctx_r0.activeTasks);
 } }
-function TasksDropdownComponent_div_6_div_10_span_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 24);
-    i0.ɵɵelement(1, "i", 26);
-    i0.ɵɵtext(2);
+function TasksDropdownComponent_div_6_div_10_mj_task_widget_5_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-task-widget", 27);
+    i0.ɵɵlistener("taskClick", function TasksDropdownComponent_div_6_div_10_mj_task_widget_5_Template_mj_task_widget_taskClick_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onTaskClick($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const task_r3 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", task_r3.Agent, " ");
+    const task_r5 = ctx.$implicit;
+    i0.ɵɵproperty("task", task_r5)("compact", true)("clickable", true)("showProgress", true)("showDuration", false);
 } }
 function TasksDropdownComponent_div_6_div_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 15);
-    i0.ɵɵelement(1, "div", 16);
-    i0.ɵɵelementStart(2, "div", 17)(3, "div", 18);
+    i0.ɵɵelementStart(0, "div", 14)(1, "div", 15);
+    i0.ɵɵelement(2, "i", 25);
+    i0.ɵɵelementStart(3, "span");
     i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(5, TasksDropdownComponent_div_6_div_10_mj_task_widget_5_Template, 1, 5, "mj-task-widget", 26);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "div", 19);
-    i0.ɵɵtemplate(6, TasksDropdownComponent_div_6_div_10_span_6_Template, 3, 1, "span", 20)(7, TasksDropdownComponent_div_6_div_10_span_7_Template, 3, 1, "span", 21)(8, TasksDropdownComponent_div_6_div_10_span_8_Template, 3, 1, "span", 21);
-    i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const task_r3 = ctx.$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1("In Progress (", ctx_r0.dbTasks.length, ")");
     i0.ɵɵadvance();
-    i0.ɵɵattribute("data-status", task_r3.Status);
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(task_r3.Name);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", task_r3.PercentComplete != null);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", task_r3.User);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", task_r3.Agent);
+    i0.ɵɵproperty("ngForOf", ctx_r0.dbTasks);
+} }
+function TasksDropdownComponent_div_6_div_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 28);
+    i0.ɵɵelement(1, "i", 2);
+    i0.ɵɵelementStart(2, "p");
+    i0.ɵɵtext(3, "No active tasks");
+    i0.ɵɵelementEnd()();
 } }
 function TasksDropdownComponent_div_6_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 6)(1, "div", 7)(2, "div", 8);
     i0.ɵɵelement(3, "i", 2);
     i0.ɵɵelementStart(4, "span");
-    i0.ɵɵtext(5, "Active Tasks");
+    i0.ɵɵtext(5, "Tasks");
     i0.ɵɵelementEnd()();
     i0.ɵɵelementStart(6, "button", 9);
     i0.ɵɵlistener("click", function TasksDropdownComponent_div_6_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.closeDropdown()); });
     i0.ɵɵelement(7, "i", 10);
     i0.ɵɵelementEnd()();
     i0.ɵɵelementStart(8, "div", 11);
-    i0.ɵɵtemplate(9, TasksDropdownComponent_div_6_div_9_Template, 4, 0, "div", 12)(10, TasksDropdownComponent_div_6_div_10_Template, 9, 5, "div", 13);
+    i0.ɵɵtemplate(9, TasksDropdownComponent_div_6_div_9_Template, 6, 2, "div", 12)(10, TasksDropdownComponent_div_6_div_10_Template, 6, 2, "div", 12)(11, TasksDropdownComponent_div_6_div_11_Template, 4, 0, "div", 13);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance(9);
-    i0.ɵɵproperty("ngIf", ctx_r0.tasks.length === 0);
+    i0.ɵɵproperty("ngIf", ctx_r0.activeTasks.length > 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r0.dbTasks.length > 0);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r0.tasks);
+    i0.ɵɵproperty("ngIf", ctx_r0.activeTasks.length === 0 && ctx_r0.dbTasks.length === 0);
 } }
 /**
- * Tasks dropdown component for chat header
- * Displays active tasks from the current conversation
+ * Enhanced tasks dropdown component for chat header.
+ * Shows both:
+ * 1. Active (running) tasks from ActiveTasksService
+ * 2. Database tasks for the current conversation
  */
 export class TasksDropdownComponent {
     conversationState;
+    activeTasksService;
     currentUser;
+    taskClicked = new EventEmitter();
     isOpen = false;
-    tasks = [];
-    taskCount = 0;
+    activeTasks = [];
+    dbTasks = [];
+    totalTaskCount = 0;
     previousConversationId = null;
-    constructor(conversationState) {
+    destroy$ = new Subject();
+    pollingInterval = null;
+    constructor(conversationState, activeTasksService) {
         this.conversationState = conversationState;
+        this.activeTasksService = activeTasksService;
     }
     ngOnInit() {
+        // Subscribe to active tasks from the service
+        this.activeTasksService.tasks$
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(tasks => {
+            this.activeTasks = tasks;
+            this.updateTotalCount();
+        });
         // Initial load if there's an active conversation
         if (this.conversationState.activeConversationId) {
-            this.loadTasks();
+            this.loadDatabaseTasks();
+        }
+        // Poll for task updates every 3 seconds when conversation is active
+        this.startPolling();
+    }
+    startPolling() {
+        this.pollingInterval = setInterval(() => {
+            if (this.conversationState.activeConversationId) {
+                this.loadDatabaseTasks();
+            }
+        }, 3000); // Poll every 3 seconds
+    }
+    stopPolling() {
+        if (this.pollingInterval) {
+            clearInterval(this.pollingInterval);
+            this.pollingInterval = null;
         }
     }
     ngDoCheck() {
@@ -118,24 +164,33 @@ export class TasksDropdownComponent {
         if (currentId !== this.previousConversationId) {
             this.previousConversationId = currentId;
             if (currentId) {
-                this.loadTasks();
+                this.loadDatabaseTasks();
             }
             else {
-                this.tasks = [];
-                this.taskCount = 0;
+                this.dbTasks = [];
+                this.updateTotalCount();
             }
         }
     }
     ngOnDestroy() {
-        // Cleanup if needed
+        this.stopPolling();
+        this.destroy$.next();
+        this.destroy$.complete();
     }
     toggleDropdown() {
         this.isOpen = !this.isOpen;
+        if (this.isOpen) {
+            // Refresh database tasks when opening
+            this.loadDatabaseTasks();
+        }
     }
     closeDropdown() {
         this.isOpen = false;
     }
-    async loadTasks() {
+    updateTotalCount() {
+        this.totalTaskCount = this.activeTasks.length + this.dbTasks.length;
+    }
+    async loadDatabaseTasks() {
         const activeId = this.conversationState.activeConversationId;
         if (!activeId) {
             return;
@@ -150,31 +205,52 @@ export class TasksDropdownComponent {
                 ResultType: 'entity_object'
             }, this.currentUser);
             if (!detailsResult.Success || !detailsResult.Results || detailsResult.Results.length === 0) {
-                this.tasks = [];
-                this.taskCount = 0;
+                this.dbTasks = [];
+                this.updateTotalCount();
                 return;
             }
             // Get all conversation detail IDs
             const detailIds = detailsResult.Results.map(d => `'${d.ID}'`).join(',');
-            // Load tasks for these conversation details
+            // Load tasks for these conversation details (only top-level active ones)
             const result = await rv.RunView({
                 EntityName: 'MJ: Tasks',
-                ExtraFilter: `ConversationDetailID IN (${detailIds}) AND Status IN ('Pending', 'In Progress')`,
+                ExtraFilter: `ConversationDetailID IN (${detailIds}) AND Status IN ('Pending', 'In Progress') AND ParentID IS NULL`,
                 OrderBy: '__mj_CreatedAt DESC',
                 MaxRows: 50,
                 ResultType: 'entity_object'
             }, this.currentUser);
             if (result.Success) {
-                this.tasks = result.Results || [];
-                this.taskCount = this.tasks.length;
+                this.dbTasks = result.Results || [];
+                this.updateTotalCount();
             }
         }
         catch (error) {
-            console.error('Failed to load tasks:', error);
+            console.error('Failed to load database tasks:', error);
+        }
+    }
+    getElapsedTime(task) {
+        const elapsed = Date.now() - task.startTime;
+        const seconds = Math.floor(elapsed / 1000);
+        if (seconds < 60) {
+            return `${seconds}s`;
         }
+        const minutes = Math.floor(seconds / 60);
+        const remainingSeconds = seconds % 60;
+        return `${minutes}:${remainingSeconds.toString().padStart(2, '0')}`;
+    }
+    getTrimmedStatus(status) {
+        const maxLength = 60;
+        if (status.length <= maxLength) {
+            return status;
+        }
+        return status.substring(0, maxLength) + '...';
+    }
+    onTaskClick(task) {
+        this.taskClicked.emit(task);
+        this.closeDropdown();
     }
-    static ɵfac = function TasksDropdownComponent_Factory(t) { return new (t || TasksDropdownComponent)(i0.ɵɵdirectiveInject(i1.ConversationStateService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TasksDropdownComponent, selectors: [["mj-tasks-dropdown"]], inputs: { currentUser: "currentUser" }, decls: 7, vars: 4, consts: [[1, "tasks-dropdown-container"], ["title", "View active tasks", 1, "active-tasks-btn", 3, "click"], [1, "fas", "fa-tasks"], ["class", "task-count-badge", 4, "ngIf"], ["class", "active-tasks-dropdown", 4, "ngIf"], [1, "task-count-badge"], [1, "active-tasks-dropdown"], [1, "dropdown-header"], [1, "header-left"], [1, "close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "dropdown-content"], ["class", "no-tasks", 4, "ngIf"], ["class", "task-item", 4, "ngFor", "ngForOf"], [1, "no-tasks"], [1, "task-item"], [1, "task-status"], [1, "task-content"], [1, "task-title"], [1, "task-meta"], ["class", "task-progress", 4, "ngIf"], ["class", "task-assigned", 4, "ngIf"], [1, "task-progress"], [1, "fas", "fa-chart-line"], [1, "task-assigned"], [1, "fas", "fa-user"], [1, "fas", "fa-robot"]], template: function TasksDropdownComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵfac = function TasksDropdownComponent_Factory(t) { return new (t || TasksDropdownComponent)(i0.ɵɵdirectiveInject(i1.ConversationStateService), i0.ɵɵdirectiveInject(i2.ActiveTasksService)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TasksDropdownComponent, selectors: [["mj-tasks-dropdown"]], inputs: { currentUser: "currentUser" }, outputs: { taskClicked: "taskClicked" }, decls: 7, vars: 4, consts: [[1, "tasks-dropdown-container"], ["title", "View tasks", 1, "active-tasks-btn", 3, "click"], [1, "fas", "fa-tasks"], ["class", "task-count-badge", 4, "ngIf"], ["class", "active-tasks-dropdown", 4, "ngIf"], [1, "task-count-badge"], [1, "active-tasks-dropdown"], [1, "dropdown-header"], [1, "header-left"], [1, "close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "dropdown-content"], ["class", "section", 4, "ngIf"], ["class", "no-tasks", 4, "ngIf"], [1, "section"], [1, "section-header"], [1, "fas", "fa-circle-notch", "fa-spin"], ["class", "active-task-item", 4, "ngFor", "ngForOf"], [1, "active-task-item"], [1, "task-status-indicator", "active"], [1, "task-content"], [1, "task-title"], [1, "fas", "fa-robot"], [1, "task-status-text"], [1, "task-elapsed"], [1, "fas", "fa-list-check"], [3, "task", "compact", "clickable", "showProgress", "showDuration", "taskClick", 4, "ngFor", "ngForOf"], [3, "taskClick", "task", "compact", "clickable", "showProgress", "showDuration"], [1, "no-tasks"]], template: function TasksDropdownComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "button", 1);
             i0.ɵɵlistener("click", function TasksDropdownComponent_Template_button_click_1_listener() { return ctx.toggleDropdown(); });
             i0.ɵɵelement(2, "i", 2);
@@ -183,16 +259,16 @@ export class TasksDropdownComponent {
             i0.ɵɵelementEnd();
             i0.ɵɵtemplate(5, TasksDropdownComponent_span_5_Template, 2, 1, "span", 3);
             i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(6, TasksDropdownComponent_div_6_Template, 11, 2, "div", 4);
+            i0.ɵɵtemplate(6, TasksDropdownComponent_div_6_Template, 12, 3, "div", 4);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵadvance();
             i0.ɵɵclassProp("active", ctx.isOpen);
             i0.ɵɵadvance(4);
-            i0.ɵɵproperty("ngIf", ctx.taskCount > 0);
+            i0.ɵɵproperty("ngIf", ctx.totalTaskCount > 0);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.isOpen);
-        } }, dependencies: [i2.NgForOf, i2.NgIf], styles: [".tasks-dropdown-container[_ngcontent-%COMP%] {\n      position: relative;\n    }\n\n    .active-tasks-btn[_ngcontent-%COMP%] {\n      background: var(--gray-700, #374151);\n      color: white;\n      padding: 6px 12px;\n      border-radius: 6px;\n      font-size: 13px;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      border: 1px solid #E5E7EB;\n      cursor: pointer;\n      transition: all 150ms ease;\n    }\n\n    .active-tasks-btn[_ngcontent-%COMP%]:hover {\n      background: var(--gray-600, #4B5563);\n    }\n\n    .active-tasks-btn.active[_ngcontent-%COMP%] {\n      background: var(--navy, #1e40af);\n    }\n\n    .task-count-badge[_ngcontent-%COMP%] {\n      background: var(--navy, #1e40af);\n      color: white;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 11px;\n      font-weight: bold;\n      min-width: 18px;\n      text-align: center;\n    }\n\n    .active-tasks-dropdown[_ngcontent-%COMP%] {\n      position: absolute;\n      top: calc(100% + 8px);\n      right: 0;\n      background: white;\n      border: 1px solid #E5E7EB;\n      border-radius: 8px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n      z-index: 1000;\n      min-width: 400px;\n      max-width: 500px;\n    }\n\n    .dropdown-header[_ngcontent-%COMP%] {\n      padding: 12px 16px;\n      border-bottom: 1px solid #E5E7EB;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .header-left[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-weight: 600;\n      color: #111827;\n    }\n\n    .header-left[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--accent, #1e40af);\n    }\n\n    .close-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      color: #6B7280;\n      cursor: pointer;\n      font-size: 18px;\n      padding: 0;\n      width: 24px;\n      height: 24px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 4px;\n    }\n\n    .close-btn[_ngcontent-%COMP%]:hover {\n      background: #F3F4F6;\n      color: #111827;\n    }\n\n    .dropdown-content[_ngcontent-%COMP%] {\n      max-height: 400px;\n      overflow-y: auto;\n      padding: 8px;\n    }\n\n    .no-tasks[_ngcontent-%COMP%] {\n      padding: 32px 16px;\n      text-align: center;\n      color: #9CA3AF;\n    }\n\n    .no-tasks[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 32px;\n      margin-bottom: 8px;\n      opacity: 0.5;\n    }\n\n    .no-tasks[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 14px;\n    }\n\n    .task-item[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 12px;\n      padding: 12px;\n      border-radius: 6px;\n      margin-bottom: 4px;\n      cursor: pointer;\n      transition: background 150ms ease;\n    }\n\n    .task-item[_ngcontent-%COMP%]:hover {\n      background: #F9FAFB;\n    }\n\n    .task-status[_ngcontent-%COMP%] {\n      width: 8px;\n      height: 8px;\n      border-radius: 50%;\n      margin-top: 6px;\n      flex-shrink: 0;\n    }\n\n    .task-status[data-status=\"Pending\"][_ngcontent-%COMP%] {\n      background: #9CA3AF;\n    }\n\n    .task-status[data-status=\"In Progress\"][_ngcontent-%COMP%] {\n      background: #3B82F6;\n    }\n\n    .task-status[data-status=\"Complete\"][_ngcontent-%COMP%] {\n      background: #10B981;\n    }\n\n    .task-status[data-status=\"Blocked\"][_ngcontent-%COMP%] {\n      background: #EF4444;\n    }\n\n    .task-status[data-status=\"Failed\"][_ngcontent-%COMP%] {\n      background: #DC2626;\n    }\n\n    .task-status[data-status=\"Cancelled\"][_ngcontent-%COMP%], .task-status[data-status=\"Deferred\"][_ngcontent-%COMP%] {\n      background: #6B7280;\n    }\n\n    .task-content[_ngcontent-%COMP%] {\n      flex: 1;\n      min-width: 0;\n    }\n\n    .task-title[_ngcontent-%COMP%] {\n      font-size: 14px;\n      font-weight: 500;\n      color: #111827;\n      margin-bottom: 4px;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .task-meta[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 12px;\n      font-size: 12px;\n      color: #6B7280;\n    }\n\n    .task-progress[_ngcontent-%COMP%], .task-assigned[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .task-progress[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], .task-assigned[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n    }"] });
+        } }, dependencies: [i3.NgForOf, i3.NgIf, i4.TaskWidgetComponent], styles: [".tasks-dropdown-container[_ngcontent-%COMP%] {\n      position: relative;\n    }\n\n    .active-tasks-btn[_ngcontent-%COMP%] {\n      background: var(--gray-700, #374151);\n      color: white;\n      padding: 6px 12px;\n      border-radius: 6px;\n      font-size: 13px;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      border: 1px solid #E5E7EB;\n      cursor: pointer;\n      transition: all 150ms ease;\n    }\n\n    .active-tasks-btn[_ngcontent-%COMP%]:hover {\n      background: var(--gray-600, #4B5563);\n    }\n\n    .active-tasks-btn.active[_ngcontent-%COMP%] {\n      background: var(--navy, #1e40af);\n    }\n\n    .task-count-badge[_ngcontent-%COMP%] {\n      background: var(--navy, #1e40af);\n      color: white;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 11px;\n      font-weight: bold;\n      min-width: 18px;\n      text-align: center;\n    }\n\n    .active-tasks-dropdown[_ngcontent-%COMP%] {\n      position: absolute;\n      top: calc(100% + 8px);\n      right: 0;\n      background: white;\n      border: 1px solid #E5E7EB;\n      border-radius: 8px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n      z-index: 1000;\n      min-width: 400px;\n      max-width: 500px;\n    }\n\n    .dropdown-header[_ngcontent-%COMP%] {\n      padding: 12px 16px;\n      border-bottom: 1px solid #E5E7EB;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .header-left[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-weight: 600;\n      color: #111827;\n    }\n\n    .header-left[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--accent, #1e40af);\n    }\n\n    .close-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      color: #6B7280;\n      cursor: pointer;\n      font-size: 18px;\n      padding: 0;\n      width: 24px;\n      height: 24px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 4px;\n    }\n\n    .close-btn[_ngcontent-%COMP%]:hover {\n      background: #F3F4F6;\n      color: #111827;\n    }\n\n    .dropdown-content[_ngcontent-%COMP%] {\n      max-height: 500px;\n      overflow-y: auto;\n    }\n\n    .section[_ngcontent-%COMP%] {\n      padding: 12px;\n      border-bottom: 1px solid #F3F4F6;\n    }\n\n    .section[_ngcontent-%COMP%]:last-child {\n      border-bottom: none;\n    }\n\n    .section-header[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-size: 12px;\n      font-weight: 600;\n      color: #6B7280;\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n      margin-bottom: 12px;\n      padding: 0 4px;\n    }\n\n    .section-header[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 11px;\n    }\n\n    .active-task-item[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 12px;\n      padding: 10px 12px;\n      border-radius: 6px;\n      background: #F9FAFB;\n      border: 1px solid #E5E7EB;\n      margin-bottom: 8px;\n    }\n\n    .active-task-item[_ngcontent-%COMP%]:last-child {\n      margin-bottom: 0;\n    }\n\n    .task-status-indicator[_ngcontent-%COMP%] {\n      width: 4px;\n      border-radius: 2px;\n      flex-shrink: 0;\n    }\n\n    .task-status-indicator.active[_ngcontent-%COMP%] {\n      background: #3B82F6;\n      animation: _ngcontent-%COMP%_pulse 2s ease-in-out infinite;\n    }\n\n    @keyframes _ngcontent-%COMP%_pulse {\n      0%, 100% { opacity: 1; }\n      50% { opacity: 0.5; }\n    }\n\n    .task-content[_ngcontent-%COMP%] {\n      flex: 1;\n      min-width: 0;\n      display: flex;\n      flex-direction: column;\n      gap: 4px;\n    }\n\n    .task-title[_ngcontent-%COMP%] {\n      font-size: 14px;\n      font-weight: 600;\n      color: #111827;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .task-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: #3B82F6;\n      font-size: 12px;\n    }\n\n    .task-status-text[_ngcontent-%COMP%] {\n      font-size: 12px;\n      color: #6B7280;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .task-elapsed[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: #3B82F6;\n      font-weight: 600;\n    }\n\n    .no-tasks[_ngcontent-%COMP%] {\n      padding: 40px 16px;\n      text-align: center;\n      color: #9CA3AF;\n    }\n\n    .no-tasks[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 32px;\n      margin-bottom: 8px;\n      opacity: 0.5;\n    }\n\n    .no-tasks[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 14px;\n    }\n\n    mj-task-widget[_ngcontent-%COMP%] {\n      display: block;\n      margin-bottom: 8px;\n    }\n\n    mj-task-widget[_ngcontent-%COMP%]:last-child {\n      margin-bottom: 0;\n    }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TasksDropdownComponent, [{
         type: Component,
@@ -202,53 +278,73 @@ export class TasksDropdownComponent {
         class="active-tasks-btn"
         (click)="toggleDropdown()"
         [class.active]="isOpen"
-        title="View active tasks">
+        title="View tasks">
         <i class="fas fa-tasks"></i>
         <span>Tasks</span>
-        <span class="task-count-badge" *ngIf="taskCount > 0">{{ taskCount }}</span>
+        <span class="task-count-badge" *ngIf="totalTaskCount > 0">{{ totalTaskCount }}</span>
       </button>
 
       <div class="active-tasks-dropdown" *ngIf="isOpen">
         <div class="dropdown-header">
           <div class="header-left">
             <i class="fas fa-tasks"></i>
-            <span>Active Tasks</span>
+            <span>Tasks</span>
           </div>
           <button class="close-btn" (click)="closeDropdown()">
             <i class="fas fa-times"></i>
           </button>
         </div>
+
         <div class="dropdown-content">
-          <div *ngIf="tasks.length === 0" class="no-tasks">
-            <i class="fas fa-tasks"></i>
-            <p>No active tasks</p>
-          </div>
-          <div *ngFor="let task of tasks" class="task-item">
-            <div class="task-status" [attr.data-status]="task.Status"></div>
-            <div class="task-content">
-              <div class="task-title">{{ task.Name }}</div>
-              <div class="task-meta">
-                <span class="task-progress" *ngIf="task.PercentComplete != null">
-                  <i class="fas fa-chart-line"></i>
-                  {{ task.PercentComplete }}%
-                </span>
-                <span class="task-assigned" *ngIf="task.User">
-                  <i class="fas fa-user"></i>
-                  {{ task.User }}
-                </span>
-                <span class="task-assigned" *ngIf="task.Agent">
+          <!-- Active Running Tasks Section -->
+          <div class="section" *ngIf="activeTasks.length > 0">
+            <div class="section-header">
+              <i class="fas fa-circle-notch fa-spin"></i>
+              <span>Active ({{ activeTasks.length }})</span>
+            </div>
+            <div class="active-task-item" *ngFor="let task of activeTasks">
+              <div class="task-status-indicator active"></div>
+              <div class="task-content">
+                <div class="task-title">
                   <i class="fas fa-robot"></i>
-                  {{ task.Agent }}
-                </span>
+                  {{ task.agentName }}
+                </div>
+                <div class="task-status-text">{{ getTrimmedStatus(task.status) }}</div>
+                <div class="task-elapsed">{{ getElapsedTime(task) }}</div>
               </div>
             </div>
           </div>
+
+          <!-- Database Tasks Section -->
+          <div class="section" *ngIf="dbTasks.length > 0">
+            <div class="section-header">
+              <i class="fas fa-list-check"></i>
+              <span>In Progress ({{ dbTasks.length }})</span>
+            </div>
+            <mj-task-widget
+              *ngFor="let task of dbTasks"
+              [task]="task"
+              [compact]="true"
+              [clickable]="true"
+              [showProgress]="true"
+              [showDuration]="false"
+              (taskClick)="onTaskClick($event)">
+            </mj-task-widget>
+          </div>
+
+          <!-- No Tasks State -->
+          <div *ngIf="activeTasks.length === 0 && dbTasks.length === 0" class="no-tasks">
+            <i class="fas fa-tasks"></i>
+            <p>No active tasks</p>
+          </div>
         </div>
       </div>
     </div>
-  `, styles: ["\n    .tasks-dropdown-container {\n      position: relative;\n    }\n\n    .active-tasks-btn {\n      background: var(--gray-700, #374151);\n      color: white;\n      padding: 6px 12px;\n      border-radius: 6px;\n      font-size: 13px;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      border: 1px solid #E5E7EB;\n      cursor: pointer;\n      transition: all 150ms ease;\n    }\n\n    .active-tasks-btn:hover {\n      background: var(--gray-600, #4B5563);\n    }\n\n    .active-tasks-btn.active {\n      background: var(--navy, #1e40af);\n    }\n\n    .task-count-badge {\n      background: var(--navy, #1e40af);\n      color: white;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 11px;\n      font-weight: bold;\n      min-width: 18px;\n      text-align: center;\n    }\n\n    .active-tasks-dropdown {\n      position: absolute;\n      top: calc(100% + 8px);\n      right: 0;\n      background: white;\n      border: 1px solid #E5E7EB;\n      border-radius: 8px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n      z-index: 1000;\n      min-width: 400px;\n      max-width: 500px;\n    }\n\n    .dropdown-header {\n      padding: 12px 16px;\n      border-bottom: 1px solid #E5E7EB;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .header-left {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-weight: 600;\n      color: #111827;\n    }\n\n    .header-left i {\n      color: var(--accent, #1e40af);\n    }\n\n    .close-btn {\n      background: none;\n      border: none;\n      color: #6B7280;\n      cursor: pointer;\n      font-size: 18px;\n      padding: 0;\n      width: 24px;\n      height: 24px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 4px;\n    }\n\n    .close-btn:hover {\n      background: #F3F4F6;\n      color: #111827;\n    }\n\n    .dropdown-content {\n      max-height: 400px;\n      overflow-y: auto;\n      padding: 8px;\n    }\n\n    .no-tasks {\n      padding: 32px 16px;\n      text-align: center;\n      color: #9CA3AF;\n    }\n\n    .no-tasks i {\n      font-size: 32px;\n      margin-bottom: 8px;\n      opacity: 0.5;\n    }\n\n    .no-tasks p {\n      margin: 0;\n      font-size: 14px;\n    }\n\n    .task-item {\n      display: flex;\n      gap: 12px;\n      padding: 12px;\n      border-radius: 6px;\n      margin-bottom: 4px;\n      cursor: pointer;\n      transition: background 150ms ease;\n    }\n\n    .task-item:hover {\n      background: #F9FAFB;\n    }\n\n    .task-status {\n      width: 8px;\n      height: 8px;\n      border-radius: 50%;\n      margin-top: 6px;\n      flex-shrink: 0;\n    }\n\n    .task-status[data-status=\"Pending\"] {\n      background: #9CA3AF;\n    }\n\n    .task-status[data-status=\"In Progress\"] {\n      background: #3B82F6;\n    }\n\n    .task-status[data-status=\"Complete\"] {\n      background: #10B981;\n    }\n\n    .task-status[data-status=\"Blocked\"] {\n      background: #EF4444;\n    }\n\n    .task-status[data-status=\"Failed\"] {\n      background: #DC2626;\n    }\n\n    .task-status[data-status=\"Cancelled\"], .task-status[data-status=\"Deferred\"] {\n      background: #6B7280;\n    }\n\n    .task-content {\n      flex: 1;\n      min-width: 0;\n    }\n\n    .task-title {\n      font-size: 14px;\n      font-weight: 500;\n      color: #111827;\n      margin-bottom: 4px;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .task-meta {\n      display: flex;\n      gap: 12px;\n      font-size: 12px;\n      color: #6B7280;\n    }\n\n    .task-progress, .task-assigned {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .task-progress i, .task-assigned i {\n      font-size: 10px;\n    }\n  "] }]
-    }], () => [{ type: i1.ConversationStateService }], { currentUser: [{
+  `, styles: ["\n    .tasks-dropdown-container {\n      position: relative;\n    }\n\n    .active-tasks-btn {\n      background: var(--gray-700, #374151);\n      color: white;\n      padding: 6px 12px;\n      border-radius: 6px;\n      font-size: 13px;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      border: 1px solid #E5E7EB;\n      cursor: pointer;\n      transition: all 150ms ease;\n    }\n\n    .active-tasks-btn:hover {\n      background: var(--gray-600, #4B5563);\n    }\n\n    .active-tasks-btn.active {\n      background: var(--navy, #1e40af);\n    }\n\n    .task-count-badge {\n      background: var(--navy, #1e40af);\n      color: white;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 11px;\n      font-weight: bold;\n      min-width: 18px;\n      text-align: center;\n    }\n\n    .active-tasks-dropdown {\n      position: absolute;\n      top: calc(100% + 8px);\n      right: 0;\n      background: white;\n      border: 1px solid #E5E7EB;\n      border-radius: 8px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n      z-index: 1000;\n      min-width: 400px;\n      max-width: 500px;\n    }\n\n    .dropdown-header {\n      padding: 12px 16px;\n      border-bottom: 1px solid #E5E7EB;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .header-left {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-weight: 600;\n      color: #111827;\n    }\n\n    .header-left i {\n      color: var(--accent, #1e40af);\n    }\n\n    .close-btn {\n      background: none;\n      border: none;\n      color: #6B7280;\n      cursor: pointer;\n      font-size: 18px;\n      padding: 0;\n      width: 24px;\n      height: 24px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 4px;\n    }\n\n    .close-btn:hover {\n      background: #F3F4F6;\n      color: #111827;\n    }\n\n    .dropdown-content {\n      max-height: 500px;\n      overflow-y: auto;\n    }\n\n    .section {\n      padding: 12px;\n      border-bottom: 1px solid #F3F4F6;\n    }\n\n    .section:last-child {\n      border-bottom: none;\n    }\n\n    .section-header {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-size: 12px;\n      font-weight: 600;\n      color: #6B7280;\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n      margin-bottom: 12px;\n      padding: 0 4px;\n    }\n\n    .section-header i {\n      font-size: 11px;\n    }\n\n    .active-task-item {\n      display: flex;\n      gap: 12px;\n      padding: 10px 12px;\n      border-radius: 6px;\n      background: #F9FAFB;\n      border: 1px solid #E5E7EB;\n      margin-bottom: 8px;\n    }\n\n    .active-task-item:last-child {\n      margin-bottom: 0;\n    }\n\n    .task-status-indicator {\n      width: 4px;\n      border-radius: 2px;\n      flex-shrink: 0;\n    }\n\n    .task-status-indicator.active {\n      background: #3B82F6;\n      animation: pulse 2s ease-in-out infinite;\n    }\n\n    @keyframes pulse {\n      0%, 100% { opacity: 1; }\n      50% { opacity: 0.5; }\n    }\n\n    .task-content {\n      flex: 1;\n      min-width: 0;\n      display: flex;\n      flex-direction: column;\n      gap: 4px;\n    }\n\n    .task-title {\n      font-size: 14px;\n      font-weight: 600;\n      color: #111827;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .task-title i {\n      color: #3B82F6;\n      font-size: 12px;\n    }\n\n    .task-status-text {\n      font-size: 12px;\n      color: #6B7280;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .task-elapsed {\n      font-size: 11px;\n      color: #3B82F6;\n      font-weight: 600;\n    }\n\n    .no-tasks {\n      padding: 40px 16px;\n      text-align: center;\n      color: #9CA3AF;\n    }\n\n    .no-tasks i {\n      font-size: 32px;\n      margin-bottom: 8px;\n      opacity: 0.5;\n    }\n\n    .no-tasks p {\n      margin: 0;\n      font-size: 14px;\n    }\n\n    mj-task-widget {\n      display: block;\n      margin-bottom: 8px;\n    }\n\n    mj-task-widget:last-child {\n      margin-bottom: 0;\n    }\n  "] }]
+    }], () => [{ type: i1.ConversationStateService }, { type: i2.ActiveTasksService }], { currentUser: [{
             type: Input
+        }], taskClicked: [{
+            type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TasksDropdownComponent, { className: "TasksDropdownComponent", filePath: "src/lib/components/tasks/tasks-dropdown.component.ts", lineNumber: 256 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TasksDropdownComponent, { className: "TasksDropdownComponent", filePath: "src/lib/components/tasks/tasks-dropdown.component.ts", lineNumber: 301 }); })();
 //# sourceMappingURL=tasks-dropdown.component.js.map

package/dist/lib/components/tasks/tasks-dropdown.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"tasks-dropdown.component.js","sourceRoot":"","sources":["../../../../src/lib/components/tasks/tasks-dropdown.component.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"tasks-dropdown.component.js","sourceRoot":"","sources":["../../../../src/lib/components/tasks/tasks-dropdown.component.ts"],"names":[],"mappings":"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"}

package/dist/lib/components/thread/thread-panel.component.d.ts

@@ -1,12 +1,14 @@
 import { EventEmitter, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';
 import { ConversationDetailEntity } from '@memberjunction/core-entities';
 import { UserInfo } from '@memberjunction/core';
+import { DataCacheService } from '../../services/data-cache.service';
 import * as i0 from "@angular/core";
 /**
  * Side panel component for displaying and managing threaded message replies
  * Shows parent message at top with all replies in chronological order
  */
 export declare class ThreadPanelComponent implements OnInit, OnDestroy {
+    private dataCache;
     private cdRef;
     parentMessageId: string;
     conversationId: string;
@@ -20,7 +22,7 @@ export declare class ThreadPanelComponent implements OnInit, OnDestroy {
     isSending: boolean;
     errorMessage: string;
     private destroy$;
-    constructor(cdRef: ChangeDetectorRef);
+    constructor(dataCache: DataCacheService, cdRef: ChangeDetectorRef);
     ngOnInit(): Promise<void>;
     ngOnDestroy(): void;
     /**

package/dist/lib/components/thread/thread-panel.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"thread-panel.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/thread/thread-panel.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,YAAY,EAAE,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAC7G,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAqB,MAAM,sBAAsB,CAAC;;AAInE;;;GAGG;AACH,qBAKa,oBAAqB,YAAW,MAAM,EAAE,SAAS;IAiBhD,OAAO,CAAC,KAAK;IAhBhB,eAAe,EAAG,MAAM,CAAC;IACzB,cAAc,EAAG,MAAM,CAAC;IACxB,WAAW,EAAG,QAAQ,CAAC;IAEtB,MAAM,qBAA4B;IAClC,UAAU,yCAAgD;IAE7D,aAAa,EAAE,wBAAwB,GAAG,IAAI,CAAQ;IACtD,OAAO,EAAE,wBAAwB,EAAE,CAAM;IACzC,SAAS,EAAE,MAAM,CAAM;IACvB,SAAS,EAAE,OAAO,CAAS;IAC3B,SAAS,EAAE,OAAO,CAAS;IAC3B,YAAY,EAAE,MAAM,CAAM;IAEjC,OAAO,CAAC,QAAQ,CAAuB;gBAEnB,KAAK,EAAE,iBAAiB;IAEtC,QAAQ;IAId,WAAW;IAKX;;OAEG;YACW,cAAc;IA6B5B;;OAEG;YACW,WAAW;IAyBzB;;OAEG;IACG,WAAW,IAAI,OAAO,CAAC,IAAI,CAAC;IA4ClC;;OAEG;IACH,OAAO,IAAI,IAAI;IAIf;;OAEG;IACH,cAAc,CAAC,OAAO,EAAE,wBAAwB,GAAG,MAAM;IAIzD;;OAEG;IACH,cAAc,CAAC,OAAO,EAAE,wBAAwB,GAAG,MAAM;IAkBzD;;OAEG;IACH,aAAa,CAAC,OAAO,EAAE,wBAAwB,GAAG,MAAM;IAKxD;;OAEG;IACH,IAAI,YAAY,IAAI,OAAO,CAE1B;IAED;;OAEG;IACH,IAAI,cAAc,IAAI,MAAM,CAG3B;yCA/LU,oBAAoB;2CAApB,oBAAoB;CAgMhC"}
+{"version":3,"file":"thread-panel.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/thread/thread-panel.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,YAAY,EAAE,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAC7G,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAqB,MAAM,sBAAsB,CAAC;AACnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;;AAIrE;;;GAGG;AACH,qBAKa,oBAAqB,YAAW,MAAM,EAAE,SAAS;IAkB1D,OAAO,CAAC,SAAS;IACjB,OAAO,CAAC,KAAK;IAlBN,eAAe,EAAG,MAAM,CAAC;IACzB,cAAc,EAAG,MAAM,CAAC;IACxB,WAAW,EAAG,QAAQ,CAAC;IAEtB,MAAM,qBAA4B;IAClC,UAAU,yCAAgD;IAE7D,aAAa,EAAE,wBAAwB,GAAG,IAAI,CAAQ;IACtD,OAAO,EAAE,wBAAwB,EAAE,CAAM;IACzC,SAAS,EAAE,MAAM,CAAM;IACvB,SAAS,EAAE,OAAO,CAAS;IAC3B,SAAS,EAAE,OAAO,CAAS;IAC3B,YAAY,EAAE,MAAM,CAAM;IAEjC,OAAO,CAAC,QAAQ,CAAuB;gBAG7B,SAAS,EAAE,gBAAgB,EAC3B,KAAK,EAAE,iBAAiB;IAG5B,QAAQ;IAId,WAAW;IAKX;;OAEG;YACW,cAAc;IA2B5B;;OAEG;YACW,WAAW;IAyBzB;;OAEG;IACG,WAAW,IAAI,OAAO,CAAC,IAAI,CAAC;IA2ClC;;OAEG;IACH,OAAO,IAAI,IAAI;IAIf;;OAEG;IACH,cAAc,CAAC,OAAO,EAAE,wBAAwB,GAAG,MAAM;IAIzD;;OAEG;IACH,cAAc,CAAC,OAAO,EAAE,wBAAwB,GAAG,MAAM;IAkBzD;;OAEG;IACH,aAAa,CAAC,OAAO,EAAE,wBAAwB,GAAG,MAAM;IAKxD;;OAEG;IACH,IAAI,YAAY,IAAI,OAAO,CAE1B;IAED;;OAEG;IACH,IAAI,cAAc,IAAI,MAAM,CAG3B;yCA/LU,oBAAoB;2CAApB,oBAAoB;CAgMhC"}