@memberjunction/ng-conversations 6.1.4 → 6.2.0-edge.1

package/dist/lib/components/conversation/conversation-list.component.js

@@ -1,6 +1,7 @@
-import { Component, Input, Output, EventEmitter, HostListener } from '@angular/core';
+import { Component, Input, Output, EventEmitter, HostListener, ViewChild } from '@angular/core';
 import { ConversationEngine, UserInfoEngine } from '@memberjunction/core-entities';
 import { ProjectFormModalComponent } from '../project/project-form-modal.component';
+import { MJResourcePermissionShareAdapter } from '@memberjunction/ng-resource-permissions';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
 import { UUIDsEqual, NormalizeUUID } from '@memberjunction/global';
@@ -11,578 +12,724 @@ import * as i3 from "../../services/active-tasks.service";
 import * as i4 from "@memberjunction/ng-ui-components";
 import * as i5 from "@angular/common";
 import * as i6 from "@angular/forms";
-import * as i7 from "../notification/notification-badge.component";
-const _c0 = a0 => ({ $implicit: a0 });
-const _c1 = (a0, a1) => ({ $implicit: a0, depth: a1 });
+import * as i7 from "@memberjunction/ng-resource-permissions";
+import * as i8 from "../notification/notification-badge.component";
+const _c0 = ["searchInput"];
+const _c1 = ["contextMenuEl"];
+const _c2 = a0 => ({ $implicit: a0 });
+const _c3 = (a0, a1) => ({ $implicit: a0, depth: a1 });
 const _forTrack0 = ($index, $item) => $item.ID;
 const _forTrack1 = ($index, $item) => $item.project.ID;
 function ConversationListComponent_Conditional_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "input", 12);
-    i0.ɵɵtwoWayListener("ngModelChange", function ConversationListComponent_Conditional_1_Conditional_2_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.searchQuery, $event) || (ctx_r1.searchQuery = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(0, "div", 14)(1, "button", 16);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_2_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ClearSelection()); });
+    i0.ɵɵelement(2, "i", 17);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "span", 18);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "button", 19);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_2_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.BarSetPinned()); });
+    i0.ɵɵelement(6, "i", 20);
     i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "button", 21);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_2_Template_button_click_7_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.BarOpenMoveMenu($event)); });
+    i0.ɵɵelement(8, "i", 22);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "button", 23);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_2_Template_button_click_9_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.BarShare()); });
+    i0.ɵɵelement(10, "i", 24);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(11, "button", 25);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_2_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.BarDelete()); });
+    i0.ɵɵelement(12, "i", 26);
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.searchQuery);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1("", ctx_r1.SelectedConversationIds.size, " selected");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("disabled", !ctx_r1.CanChangeAny(ctx_r1.SelectedIds))("title", ctx_r1.CanChangeAny(ctx_r1.SelectedIds) ? ctx_r1.SelectionHasUnpinned() ? "Pin" : "Unpin" : ctx_r1.ChangeRefusedReason);
+    i0.ɵɵattribute("aria-label", ctx_r1.SelectionHasUnpinned() ? "Pin" : "Unpin");
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("fa-rotate-90", !ctx_r1.SelectionHasUnpinned());
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("disabled", !ctx_r1.CanChangeAny(ctx_r1.SelectedIds))("title", ctx_r1.CanChangeAny(ctx_r1.SelectedIds) ? "Move to folder" : ctx_r1.ChangeRefusedReason);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("disabled", !ctx_r1.CanShareAny(ctx_r1.SelectedIds))("title", ctx_r1.CanShareAny(ctx_r1.SelectedIds) ? "Share" : ctx_r1.ShareRefusedReason);
 } }
-function ConversationListComponent_Conditional_1_Conditional_3_Conditional_3_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 18);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_3_Conditional_13_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onUnpinSidebarClick($event)); });
-    i0.ɵɵelement(1, "i", 22);
+function ConversationListComponent_Conditional_1_Conditional_3_Conditional_0_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 31);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_0_Conditional_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.ClearSearch()); });
+    i0.ɵɵelement(1, "i", 17);
+    i0.ɵɵelementEnd();
+} }
+function ConversationListComponent_Conditional_1_Conditional_3_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 27)(1, "input", 29, 2);
+    i0.ɵɵtwoWayListener("ngModelChange", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_0_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.SearchQuery, $event) || (ctx_r1.SearchQuery = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("keydown", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_0_Template_input_keydown_1_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnSearchKeydown($event)); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(3, ConversationListComponent_Conditional_1_Conditional_3_Conditional_0_Conditional_3_Template, 2, 0, "button", 30);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance();
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.SearchQuery);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.IsSearching ? 3 : -1);
+} }
+function ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Conditional_3_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 37);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Conditional_3_Conditional_9_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.OnUnpinSidebarClick($event)); });
+    i0.ɵɵelement(1, "i", 40);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "Hide Sidebar");
     i0.ɵɵelementEnd()();
 } }
-function ConversationListComponent_Conditional_1_Conditional_3_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 15)(1, "button", 16);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_3_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onRefreshConversationsClick($event)); });
-    i0.ɵɵelement(2, "i", 17);
+function ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 34)(1, "button", 35);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Conditional_3_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.OnRefreshConversationsClick($event)); });
+    i0.ɵɵelement(2, "i", 36);
     i0.ɵɵelementStart(3, "span");
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "button", 18);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_3_Template_button_click_5_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onSelectConversationsClick($event)); });
-    i0.ɵɵelement(6, "i", 19);
+    i0.ɵɵelementStart(5, "button", 37);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Conditional_3_Template_button_click_5_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.OnToggleGroupByClick($event)); });
+    i0.ɵɵelement(6, "i", 38);
     i0.ɵɵelementStart(7, "span");
-    i0.ɵɵtext(8, "Select Conversations");
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(9, "button", 18);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_3_Template_button_click_9_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onToggleGroupByClick($event)); });
-    i0.ɵɵelement(10, "i", 20);
-    i0.ɵɵelementStart(11, "span");
-    i0.ɵɵtext(12);
+    i0.ɵɵtext(8);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(13, ConversationListComponent_Conditional_1_Conditional_3_Conditional_3_Conditional_13_Template, 4, 0, "button", 21);
+    i0.ɵɵconditionalCreate(9, ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Conditional_3_Conditional_9_Template, 4, 0, "button", 39);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
+    const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("disabled", ctx_r1.isRefreshing);
+    i0.ɵɵproperty("disabled", ctx_r1.IsRefreshing);
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("fa-spin", ctx_r1.isRefreshing);
+    i0.ɵɵclassProp("fa-spin", ctx_r1.IsRefreshing);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r1.isRefreshing ? "Refreshing..." : "Refresh");
-    i0.ɵɵadvance(6);
-    i0.ɵɵclassProp("fa-folder-tree", ctx_r1.groupBy !== "project")("fa-list", ctx_r1.groupBy === "project");
+    i0.ɵɵtextInterpolate(ctx_r1.IsRefreshing ? "Refreshing..." : "Refresh");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r1.groupBy === "project" ? "Show as flat list" : "Group by folder");
+    i0.ɵɵclassProp("fa-folder-tree", ctx_r1.GroupBy !== "project")("fa-list", ctx_r1.GroupBy === "project");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.GroupBy === "project" ? "Show as flat list" : "Group by folder");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(!ctx_r1.isMobileView ? 13 : -1);
+    i0.ɵɵconditional(!ctx_r1.IsMobileView ? 9 : -1);
 } }
-function ConversationListComponent_Conditional_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 11)(1, "button", 13);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleHeaderMenu($event)); });
-    i0.ɵɵelement(2, "i", 14);
+function ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 28)(1, "button", 32);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.ToggleHeaderMenu($event)); });
+    i0.ɵɵelement(2, "i", 33);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(3, ConversationListComponent_Conditional_1_Conditional_3_Conditional_3_Template, 14, 10, "div", 15);
+    i0.ɵɵconditionalCreate(3, ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Conditional_3_Template, 10, 10, "div", 34);
     i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r1.IsHeaderMenuOpen ? 3 : -1);
+} }
+function ConversationListComponent_Conditional_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, ConversationListComponent_Conditional_1_Conditional_3_Conditional_0_Template, 4, 2, "div", 27);
+    i0.ɵɵconditionalCreate(1, ConversationListComponent_Conditional_1_Conditional_3_Conditional_1_Template, 4, 1, "div", 28);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵconditional(ctx_r1.showSearch ? 0 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.ShowHeaderMenu ? 1 : -1);
+} }
+function ConversationListComponent_Conditional_1_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 15)(1, "button", 41);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_4_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.SetSort("date")); });
+    i0.ɵɵelement(2, "i", 42);
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4, "Date");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "button", 41);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_1_Conditional_4_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.SetSort("name")); });
+    i0.ɵɵelement(6, "i", 42);
+    i0.ɵɵelementStart(7, "span");
+    i0.ɵɵtext(8, "Name");
+    i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("active", ctx_r1.SortBy === "date");
+    i0.ɵɵproperty("title", ctx_r1.SortBy === "date" ? ctx_r1.SortDirection === "asc" ? "Oldest first" : "Newest first" : "Sort by date");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngClass", ctx_r1.SortIcon("date"));
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.isHeaderMenuOpen ? 3 : -1);
+    i0.ɵɵclassProp("active", ctx_r1.SortBy === "name");
+    i0.ɵɵproperty("title", ctx_r1.SortBy === "name" ? ctx_r1.SortDirection === "asc" ? "A to Z" : "Z to A" : "Sort by name");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngClass", ctx_r1.SortIcon("name"));
 } }
 function ConversationListComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 3)(1, "div", 9);
-    i0.ɵɵconditionalCreate(2, ConversationListComponent_Conditional_1_Conditional_2_Template, 1, 1, "input", 10);
-    i0.ɵɵconditionalCreate(3, ConversationListComponent_Conditional_1_Conditional_3_Template, 4, 1, "div", 11);
-    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(0, "div", 5)(1, "div", 13);
+    i0.ɵɵconditionalCreate(2, ConversationListComponent_Conditional_1_Conditional_2_Template, 13, 10, "div", 14)(3, ConversationListComponent_Conditional_1_Conditional_3_Template, 2, 2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(4, ConversationListComponent_Conditional_1_Conditional_4_Template, 9, 8, "div", 15);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.showSearch ? 2 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.showHeaderMenu && !ctx_r1.isSelectionMode ? 3 : -1);
+    i0.ɵɵconditional(ctx_r1.IsSelectionMode ? 2 : 3);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.showSearch || ctx_r1.ShowHeaderMenu ? 4 : -1);
 } }
 function ConversationListComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 23);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.createNewConversation()); });
-    i0.ɵɵelement(1, "i", 24);
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 43);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.CreateNewConversation()); });
+    i0.ɵɵelement(1, "i", 44);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "New Conversation");
     i0.ɵɵelementEnd()();
 } }
 function ConversationListComponent_Conditional_4_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 28);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_4_Conditional_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.togglePinned()); });
-    i0.ɵɵelementStart(1, "div", 29);
-    i0.ɵɵelement(2, "i", 30)(3, "i", 31);
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 48);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_4_Conditional_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.TogglePinned()); });
+    i0.ɵɵelementStart(1, "div", 49);
+    i0.ɵɵelement(2, "i", 50)(3, "i", 51);
     i0.ɵɵelementStart(4, "span");
     i0.ɵɵtext(5, "Pinned");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("expanded", ctx_r1.pinnedExpanded);
+    i0.ɵɵclassProp("expanded", ctx_r1.PinnedExpanded);
 } }
 function ConversationListComponent_Conditional_4_For_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 27);
+    i0.ɵɵelementContainer(0, 47);
 } if (rf & 2) {
-    const conversation_r8 = ctx.$implicit;
+    const conversation_r11 = ctx.$implicit;
     i0.ɵɵnextContext(2);
-    const conversationItem_r9 = i0.ɵɵreference(11);
-    i0.ɵɵproperty("ngTemplateOutlet", conversationItem_r9)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c0, conversation_r8));
+    const conversationItem_r12 = i0.ɵɵreference(11);
+    i0.ɵɵproperty("ngTemplateOutlet", conversationItem_r12)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, conversation_r11));
 } }
 function ConversationListComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 6);
-    i0.ɵɵconditionalCreate(1, ConversationListComponent_Conditional_4_Conditional_1_Template, 6, 2, "div", 25);
-    i0.ɵɵelementStart(2, "div", 26);
-    i0.ɵɵrepeaterCreate(3, ConversationListComponent_Conditional_4_For_4_Template, 1, 4, "ng-container", 27, _forTrack0);
+    i0.ɵɵelementStart(0, "div", 8);
+    i0.ɵɵconditionalCreate(1, ConversationListComponent_Conditional_4_Conditional_1_Template, 6, 2, "div", 45);
+    i0.ɵɵelementStart(2, "div", 46);
+    i0.ɵɵrepeaterCreate(3, ConversationListComponent_Conditional_4_For_4_Template, 1, 4, "ng-container", 47, _forTrack0);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.showSectionHeaders ? 1 : -1);
+    i0.ɵɵconditional(ctx_r1.ShowSectionHeaders ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("expanded", !ctx_r1.showSectionHeaders || ctx_r1.pinnedExpanded);
+    i0.ɵɵclassProp("expanded", !ctx_r1.ShowSectionHeaders || ctx_r1.PinnedExpanded);
     i0.ɵɵadvance();
-    i0.ɵɵrepeater(ctx_r1.pinnedConversations);
+    i0.ɵɵrepeater(ctx_r1.PinnedConversations);
 } }
 function ConversationListComponent_Conditional_5_For_10_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 27);
+    i0.ɵɵelementContainer(0, 47);
 } if (rf & 2) {
-    const node_r11 = i0.ɵɵnextContext().$implicit;
+    const node_r14 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵnextContext(2);
-    const folderNode_r12 = i0.ɵɵreference(9);
-    i0.ɵɵproperty("ngTemplateOutlet", folderNode_r12)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c0, node_r11));
+    const folderNode_r15 = i0.ɵɵreference(9);
+    i0.ɵɵproperty("ngTemplateOutlet", folderNode_r15)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, node_r14));
 } }
 function ConversationListComponent_Conditional_5_For_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, ConversationListComponent_Conditional_5_For_10_Conditional_0_Template, 1, 4, "ng-container", 27);
+    i0.ɵɵconditionalCreate(0, ConversationListComponent_Conditional_5_For_10_Conditional_0_Template, 1, 4, "ng-container", 47);
 } if (rf & 2) {
-    const node_r11 = ctx.$implicit;
+    const node_r14 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵconditional(!ctx_r1.isSearching || node_r11.hasContent ? 0 : -1);
+    i0.ɵɵconditional(!ctx_r1.IsSearching || node_r14.hasContent ? 0 : -1);
 } }
 function ConversationListComponent_Conditional_5_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 36);
+    i0.ɵɵelementStart(0, "div", 56);
     i0.ɵɵtext(1, "No folders yet \u2014 create one to organize conversations.");
     i0.ɵɵelementEnd();
 } }
 function ConversationListComponent_Conditional_5_For_20_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 27);
+    i0.ɵɵelementContainer(0, 47);
 } if (rf & 2) {
-    const conversation_r13 = ctx.$implicit;
+    const conversation_r16 = ctx.$implicit;
     i0.ɵɵnextContext(2);
-    const conversationItem_r9 = i0.ɵɵreference(11);
-    i0.ɵɵproperty("ngTemplateOutlet", conversationItem_r9)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c0, conversation_r13));
+    const conversationItem_r12 = i0.ɵɵreference(11);
+    i0.ɵɵproperty("ngTemplateOutlet", conversationItem_r12)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, conversation_r16));
 } }
 function ConversationListComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 32)(1, "div", 33);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_5_Template_div_click_1_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleFolders()); })("dragover", function ConversationListComponent_Conditional_5_Template_div_dragover_1_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFoldersRootDragOver($event)); })("dragleave", function ConversationListComponent_Conditional_5_Template_div_dragleave_1_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDragLeave("folders-root")); })("drop", function ConversationListComponent_Conditional_5_Template_div_drop_1_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFoldersRootDrop($event)); });
-    i0.ɵɵelementStart(2, "div", 29);
-    i0.ɵɵelement(3, "i", 30);
+    const _r13 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 52)(1, "div", 53);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_5_Template_div_click_1_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.ToggleFolders()); })("dragover", function ConversationListComponent_Conditional_5_Template_div_dragover_1_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnFoldersRootDragOver($event)); })("dragleave", function ConversationListComponent_Conditional_5_Template_div_dragleave_1_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDragLeave("folders-root")); })("drop", function ConversationListComponent_Conditional_5_Template_div_drop_1_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnFoldersRootDrop($event)); });
+    i0.ɵɵelementStart(2, "div", 49);
+    i0.ɵɵelement(3, "i", 50);
     i0.ɵɵelementStart(4, "span");
     i0.ɵɵtext(5, "Folders");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "button", 34);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_5_Template_button_click_6_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.createFolder(null, $event)); });
-    i0.ɵɵelement(7, "i", 35);
+    i0.ɵɵelementStart(6, "button", 54);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_5_Template_button_click_6_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.CreateFolder(null, $event)); });
+    i0.ɵɵelement(7, "i", 55);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(8, "div", 26);
+    i0.ɵɵelementStart(8, "div", 46);
     i0.ɵɵrepeaterCreate(9, ConversationListComponent_Conditional_5_For_10_Template, 1, 1, null, null, _forTrack1);
-    i0.ɵɵconditionalCreate(11, ConversationListComponent_Conditional_5_Conditional_11_Template, 2, 0, "div", 36);
+    i0.ɵɵconditionalCreate(11, ConversationListComponent_Conditional_5_Conditional_11_Template, 2, 0, "div", 56);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(12, "div", 37);
-    i0.ɵɵlistener("dragover", function ConversationListComponent_Conditional_5_Template_div_dragover_12_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onUngroupedDragOver($event)); })("dragleave", function ConversationListComponent_Conditional_5_Template_div_dragleave_12_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDragLeave("ungrouped")); })("drop", function ConversationListComponent_Conditional_5_Template_div_drop_12_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onUngroupedDrop($event)); });
-    i0.ɵɵelementStart(13, "div", 28);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_5_Template_div_click_13_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleUngrouped()); });
-    i0.ɵɵelementStart(14, "div", 29);
-    i0.ɵɵelement(15, "i", 30);
+    i0.ɵɵelementStart(12, "div", 57);
+    i0.ɵɵlistener("dragover", function ConversationListComponent_Conditional_5_Template_div_dragover_12_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnUngroupedDragOver($event)); })("dragleave", function ConversationListComponent_Conditional_5_Template_div_dragleave_12_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDragLeave("ungrouped")); })("drop", function ConversationListComponent_Conditional_5_Template_div_drop_12_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnUngroupedDrop($event)); });
+    i0.ɵɵelementStart(13, "div", 48);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_5_Template_div_click_13_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.ToggleUngrouped()); });
+    i0.ɵɵelementStart(14, "div", 49);
+    i0.ɵɵelement(15, "i", 50);
     i0.ɵɵelementStart(16, "span");
     i0.ɵɵtext(17);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(18, "div", 26);
-    i0.ɵɵrepeaterCreate(19, ConversationListComponent_Conditional_5_For_20_Template, 1, 4, "ng-container", 27, _forTrack0);
+    i0.ɵɵelementStart(18, "div", 46);
+    i0.ɵɵrepeaterCreate(19, ConversationListComponent_Conditional_5_For_20_Template, 1, 4, "ng-container", 47, _forTrack0);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("expanded", ctx_r1.foldersExpanded)("drag-over", ctx_r1.dragOverTargetId === "folders-root");
+    i0.ɵɵclassProp("expanded", ctx_r1.FoldersExpanded)("drag-over", ctx_r1.DragOverTargetId === "folders-root");
     i0.ɵɵadvance(7);
-    i0.ɵɵclassProp("expanded", ctx_r1.foldersExpanded);
+    i0.ɵɵclassProp("expanded", ctx_r1.FoldersExpanded);
     i0.ɵɵadvance();
-    i0.ɵɵrepeater(ctx_r1.folderTree);
+    i0.ɵɵrepeater(ctx_r1.FolderTree);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.folderTree.length === 0 ? 11 : -1);
+    i0.ɵɵconditional(ctx_r1.FolderTree.length === 0 ? 11 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("drag-over", ctx_r1.dragOverTargetId === "ungrouped");
+    i0.ɵɵclassProp("drag-over", ctx_r1.DragOverTargetId === "ungrouped");
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("expanded", ctx_r1.ungroupedExpanded);
+    i0.ɵɵclassProp("expanded", ctx_r1.UngroupedExpanded);
     i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(ctx_r1.folderTree.length > 0 ? "Ungrouped" : "Messages");
+    i0.ɵɵtextInterpolate(ctx_r1.FolderTree.length > 0 ? "Ungrouped" : "Messages");
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("expanded", ctx_r1.ungroupedExpanded);
+    i0.ɵɵclassProp("expanded", ctx_r1.UngroupedExpanded);
     i0.ɵɵadvance();
-    i0.ɵɵrepeater(ctx_r1.ungroupedConversations);
+    i0.ɵɵrepeater(ctx_r1.UngroupedConversations);
 } }
 function ConversationListComponent_Conditional_6_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 28);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_6_Conditional_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleDirectMessages()); });
-    i0.ɵɵelementStart(1, "div", 29);
-    i0.ɵɵelement(2, "i", 30);
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 48);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_6_Conditional_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ToggleDirectMessages()); });
+    i0.ɵɵelementStart(1, "div", 49);
+    i0.ɵɵelement(2, "i", 50);
     i0.ɵɵelementStart(3, "span");
     i0.ɵɵtext(4, "Messages");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("expanded", ctx_r1.directMessagesExpanded);
+    i0.ɵɵclassProp("expanded", ctx_r1.DirectMessagesExpanded);
 } }
 function ConversationListComponent_Conditional_6_For_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 27);
+    i0.ɵɵelementContainer(0, 47);
 } if (rf & 2) {
-    const conversation_r15 = ctx.$implicit;
+    const conversation_r18 = ctx.$implicit;
     i0.ɵɵnextContext(2);
-    const conversationItem_r9 = i0.ɵɵreference(11);
-    i0.ɵɵproperty("ngTemplateOutlet", conversationItem_r9)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c0, conversation_r15));
+    const conversationItem_r12 = i0.ɵɵreference(11);
+    i0.ɵɵproperty("ngTemplateOutlet", conversationItem_r12)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, conversation_r18));
 } }
 function ConversationListComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 7);
-    i0.ɵɵconditionalCreate(1, ConversationListComponent_Conditional_6_Conditional_1_Template, 5, 2, "div", 25);
-    i0.ɵɵelementStart(2, "div", 26);
-    i0.ɵɵrepeaterCreate(3, ConversationListComponent_Conditional_6_For_4_Template, 1, 4, "ng-container", 27, _forTrack0);
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵconditionalCreate(1, ConversationListComponent_Conditional_6_Conditional_1_Template, 5, 2, "div", 45);
+    i0.ɵɵelementStart(2, "div", 46);
+    i0.ɵɵrepeaterCreate(3, ConversationListComponent_Conditional_6_For_4_Template, 1, 4, "ng-container", 47, _forTrack0);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.showSectionHeaders ? 1 : -1);
+    i0.ɵɵconditional(ctx_r1.ShowSectionHeaders ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("expanded", !ctx_r1.showSectionHeaders || ctx_r1.directMessagesExpanded);
+    i0.ɵɵclassProp("expanded", !ctx_r1.ShowSectionHeaders || ctx_r1.DirectMessagesExpanded);
     i0.ɵɵadvance();
-    i0.ɵɵrepeater(ctx_r1.unpinnedConversations);
-} }
-function ConversationListComponent_Conditional_7_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    const _r17 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 45);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_7_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.selectAll()); });
-    i0.ɵɵtext(1, "Select All");
-    i0.ɵɵelementEnd();
-} }
-function ConversationListComponent_Conditional_7_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    const _r18 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 45);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_7_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.deselectAll()); });
-    i0.ɵɵtext(1, "Deselect All");
-    i0.ɵɵelementEnd();
+    i0.ɵɵrepeater(ctx_r1.UnpinnedConversations);
 } }
 function ConversationListComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    const _r16 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 8)(1, "div", 38)(2, "span", 39);
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 58);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_7_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.EscalateSearch()); });
+    i0.ɵɵelement(1, "i", 59);
+    i0.ɵɵelementStart(2, "span", 60);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, ConversationListComponent_Conditional_7_Conditional_4_Template, 2, 0, "button", 40)(5, ConversationListComponent_Conditional_7_Conditional_5_Template, 2, 0, "button", 40);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 41)(7, "button", 42);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_7_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.bulkDeleteConversations()); });
-    i0.ɵɵelement(8, "i", 43);
-    i0.ɵɵtext(9);
+    i0.ɵɵelement(4, "i", 61);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "button", 44);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_7_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleSelectionMode()); });
-    i0.ɵɵtext(11, " Cancel ");
-    i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1("", ctx_r1.selectedConversationIds.size, " selected");
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.selectedConversationIds.size < ctx_r1.filteredConversations.length ? 4 : 5);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("disabled", ctx_r1.selectedConversationIds.size === 0);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" Delete (", ctx_r1.selectedConversationIds.size, ") ");
+    i0.ɵɵtextInterpolate1("Search all of Chat for \u201C", ctx_r1.SearchQuery, "\u201D");
 } }
-function ConversationListComponent_ng_template_8_Conditional_14_For_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 27);
+function ConversationListComponent_ng_template_8_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 65);
+    i0.ɵɵelement(1, "i", 69);
+    i0.ɵɵelementEnd();
+} }
+function ConversationListComponent_ng_template_8_Conditional_9_For_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0, 47);
 } if (rf & 2) {
-    const child_r21 = i0.ɵɵnextContext().$implicit;
+    const child_r22 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵnextContext(3);
-    const folderNode_r12 = i0.ɵɵreference(9);
-    i0.ɵɵproperty("ngTemplateOutlet", folderNode_r12)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c0, child_r21));
+    const folderNode_r15 = i0.ɵɵreference(9);
+    i0.ɵɵproperty("ngTemplateOutlet", folderNode_r15)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, child_r22));
 } }
-function ConversationListComponent_ng_template_8_Conditional_14_For_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, ConversationListComponent_ng_template_8_Conditional_14_For_2_Conditional_0_Template, 1, 4, "ng-container", 27);
+function ConversationListComponent_ng_template_8_Conditional_9_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, ConversationListComponent_ng_template_8_Conditional_9_For_2_Conditional_0_Template, 1, 4, "ng-container", 47);
 } if (rf & 2) {
-    const child_r21 = ctx.$implicit;
+    const child_r22 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵconditional(!ctx_r1.isSearching || child_r21.hasContent ? 0 : -1);
+    i0.ɵɵconditional(!ctx_r1.IsSearching || child_r22.hasContent ? 0 : -1);
 } }
-function ConversationListComponent_ng_template_8_Conditional_14_For_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 27);
+function ConversationListComponent_ng_template_8_Conditional_9_For_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0, 47);
 } if (rf & 2) {
-    const conversation_r22 = ctx.$implicit;
-    const node_r20 = i0.ɵɵnextContext(2).$implicit;
+    const conversation_r23 = ctx.$implicit;
+    const node_r21 = i0.ɵɵnextContext(2).$implicit;
     i0.ɵɵnextContext();
-    const conversationItem_r9 = i0.ɵɵreference(11);
-    i0.ɵɵproperty("ngTemplateOutlet", conversationItem_r9)("ngTemplateOutletContext", i0.ɵɵpureFunction2(2, _c1, conversation_r22, node_r20.depth + 1));
+    const conversationItem_r12 = i0.ɵɵreference(11);
+    i0.ɵɵproperty("ngTemplateOutlet", conversationItem_r12)("ngTemplateOutletContext", i0.ɵɵpureFunction2(2, _c3, conversation_r23, node_r21.depth + 1));
 } }
-function ConversationListComponent_ng_template_8_Conditional_14_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 36);
+function ConversationListComponent_ng_template_8_Conditional_9_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 56);
     i0.ɵɵtext(1, "Empty \u2014 drop a conversation here");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const node_r20 = i0.ɵɵnextContext(2).$implicit;
-    i0.ɵɵstyleProp("padding-left", 26 + node_r20.depth * 14, "px");
+    const node_r21 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵstyleProp("padding-left", 26 + node_r21.depth * 14, "px");
 } }
-function ConversationListComponent_ng_template_8_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 55);
-    i0.ɵɵrepeaterCreate(1, ConversationListComponent_ng_template_8_Conditional_14_For_2_Template, 1, 1, null, null, _forTrack1);
-    i0.ɵɵrepeaterCreate(3, ConversationListComponent_ng_template_8_Conditional_14_For_4_Template, 1, 5, "ng-container", 27, _forTrack0);
-    i0.ɵɵconditionalCreate(5, ConversationListComponent_ng_template_8_Conditional_14_Conditional_5_Template, 2, 2, "div", 56);
+function ConversationListComponent_ng_template_8_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 68);
+    i0.ɵɵrepeaterCreate(1, ConversationListComponent_ng_template_8_Conditional_9_For_2_Template, 1, 1, null, null, _forTrack1);
+    i0.ɵɵrepeaterCreate(3, ConversationListComponent_ng_template_8_Conditional_9_For_4_Template, 1, 5, "ng-container", 47, _forTrack0);
+    i0.ɵɵconditionalCreate(5, ConversationListComponent_ng_template_8_Conditional_9_Conditional_5_Template, 2, 2, "div", 70);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const node_r20 = i0.ɵɵnextContext().$implicit;
+    const node_r21 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵrepeater(node_r20.children);
+    i0.ɵɵrepeater(node_r21.children);
     i0.ɵɵadvance(2);
-    i0.ɵɵrepeater(node_r20.conversations);
+    i0.ɵɵrepeater(node_r21.conversations);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(node_r20.totalCount === 0 && !ctx_r1.isSearching ? 5 : -1);
+    i0.ɵɵconditional(node_r21.totalCount === 0 && !ctx_r1.IsSearching ? 5 : -1);
 } }
 function ConversationListComponent_ng_template_8_Template(rf, ctx) { if (rf & 1) {
-    const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 46);
-    i0.ɵɵlistener("dragstart", function ConversationListComponent_ng_template_8_Template_div_dragstart_0_listener($event) { const node_r20 = i0.ɵɵrestoreView(_r19).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFolderDragStart(node_r20, $event)); })("dragend", function ConversationListComponent_ng_template_8_Template_div_dragend_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFolderDragEnd()); })("click", function ConversationListComponent_ng_template_8_Template_div_click_0_listener() { const node_r20 = i0.ɵɵrestoreView(_r19).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleFolder(node_r20.project.ID)); })("dragover", function ConversationListComponent_ng_template_8_Template_div_dragover_0_listener($event) { const node_r20 = i0.ɵɵrestoreView(_r19).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFolderDragOver(node_r20.project.ID, $event)); })("dragleave", function ConversationListComponent_ng_template_8_Template_div_dragleave_0_listener() { const node_r20 = i0.ɵɵrestoreView(_r19).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDragLeave(node_r20.project.ID)); })("drop", function ConversationListComponent_ng_template_8_Template_div_drop_0_listener($event) { const node_r20 = i0.ɵɵrestoreView(_r19).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFolderDrop(node_r20.project, $event)); });
-    i0.ɵɵelement(1, "i", 47)(2, "i");
-    i0.ɵɵelementStart(3, "span", 48);
+    const _r20 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 62);
+    i0.ɵɵlistener("dragstart", function ConversationListComponent_ng_template_8_Template_div_dragstart_0_listener($event) { const node_r21 = i0.ɵɵrestoreView(_r20).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnFolderDragStart(node_r21, $event)); })("dragend", function ConversationListComponent_ng_template_8_Template_div_dragend_0_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnFolderDragEnd()); })("click", function ConversationListComponent_ng_template_8_Template_div_click_0_listener() { const node_r21 = i0.ɵɵrestoreView(_r20).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.ToggleFolder(node_r21.project.ID)); })("dragover", function ConversationListComponent_ng_template_8_Template_div_dragover_0_listener($event) { const node_r21 = i0.ɵɵrestoreView(_r20).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnFolderDragOver(node_r21.project.ID, $event)); })("dragleave", function ConversationListComponent_ng_template_8_Template_div_dragleave_0_listener() { const node_r21 = i0.ɵɵrestoreView(_r20).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDragLeave(node_r21.project.ID)); })("drop", function ConversationListComponent_ng_template_8_Template_div_drop_0_listener($event) { const node_r21 = i0.ɵɵrestoreView(_r20).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnFolderDrop(node_r21.project, $event)); })("contextmenu", function ConversationListComponent_ng_template_8_Template_div_contextmenu_0_listener($event) { const node_r21 = i0.ɵɵrestoreView(_r20).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnFolderContextMenu(node_r21.project, $event)); });
+    i0.ɵɵelement(1, "i", 63)(2, "i");
+    i0.ɵɵelementStart(3, "span", 64);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "span", 49);
-    i0.ɵɵtext(6);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "div", 50);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_8_Template_div_click_7_listener($event) { return $event.stopPropagation(); });
-    i0.ɵɵelementStart(8, "button", 51);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_8_Template_button_click_8_listener($event) { const node_r20 = i0.ɵɵrestoreView(_r19).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.createFolder(node_r20.project.ID, $event)); });
-    i0.ɵɵelement(9, "i", 35);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "button", 52);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_8_Template_button_click_10_listener($event) { const node_r20 = i0.ɵɵrestoreView(_r19).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.editFolder(node_r20.project, $event)); });
-    i0.ɵɵelement(11, "i", 53);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "button", 54);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_8_Template_button_click_12_listener($event) { const node_r20 = i0.ɵɵrestoreView(_r19).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.deleteFolder(node_r20.project, $event)); });
-    i0.ɵɵelement(13, "i", 43);
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵconditionalCreate(14, ConversationListComponent_ng_template_8_Conditional_14_Template, 6, 1, "div", 55);
+    i0.ɵɵconditionalCreate(5, ConversationListComponent_ng_template_8_Conditional_5_Template, 2, 0, "span", 65);
+    i0.ɵɵelement(6, "span", 66);
+    i0.ɵɵelementStart(7, "span", 67);
+    i0.ɵɵtext(8);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(9, ConversationListComponent_ng_template_8_Conditional_9_Template, 6, 1, "div", 68);
 } if (rf & 2) {
-    const node_r20 = ctx.$implicit;
+    const node_r21 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵstyleProp("padding-left", 12 + node_r20.depth * 14, "px");
-    i0.ɵɵclassProp("drag-over", ctx_r1.dragOverTargetId === node_r20.project.ID)("dragging", ctx_r1.draggedFolderId === node_r20.project.ID);
-    i0.ɵɵproperty("draggable", true)("title", node_r20.project.Name);
+    i0.ɵɵstyleProp("padding-left", 12 + node_r21.depth * 14, "px");
+    i0.ɵɵclassProp("drag-over", ctx_r1.DragOverTargetId === node_r21.project.ID)("dragging", ctx_r1.DraggedFolderId === node_r21.project.ID);
+    i0.ɵɵproperty("draggable", true)("title", node_r21.project.Name);
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("expanded", ctx_r1.isFolderExpanded(node_r20.project.ID));
+    i0.ɵɵclassProp("expanded", ctx_r1.IsFolderExpanded(node_r21.project.ID));
     i0.ɵɵadvance();
-    i0.ɵɵclassMap(i0.ɵɵinterpolate1("fas ", node_r20.project.Icon || "fa-folder", " folder-icon"));
-    i0.ɵɵstyleProp("color", node_r20.project.Color || null);
+    i0.ɵɵclassMap(i0.ɵɵinterpolate1("fas ", node_r21.project.Icon || "fa-folder", " folder-icon"));
+    i0.ɵɵstyleProp("color", node_r21.project.Color || null);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(node_r20.project.Name);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(node_r20.totalCount);
-    i0.ɵɵadvance(8);
-    i0.ɵɵconditional(ctx_r1.isFolderExpanded(node_r20.project.ID) ? 14 : -1);
+    i0.ɵɵtextInterpolate(node_r21.project.Name);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!node_r21.project.OwnerUserID ? 5 : -1);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(node_r21.totalCount);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.IsFolderExpanded(node_r21.project.ID) ? 9 : -1);
 } }
-function ConversationListComponent_ng_template_10_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r25 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 58)(1, "input", 68);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_1_Template_input_click_1_listener($event) { i0.ɵɵrestoreView(_r25); const conversation_r24 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); $event.stopPropagation(); return i0.ɵɵresetView(ctx_r1.toggleConversationSelection(conversation_r24.ID)); });
-    i0.ɵɵelementEnd()();
+function ConversationListComponent_ng_template_10_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 75);
+    i0.ɵɵelement(1, "i", 85);
+    i0.ɵɵelementEnd();
+} }
+function ConversationListComponent_ng_template_10_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 80);
 } if (rf & 2) {
-    const conversation_r24 = i0.ɵɵnextContext().$implicit;
+    const conversation_r25 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("checked", ctx_r1.selectedConversationIds.has(conversation_r24.ID));
+    i0.ɵɵproperty("title", ctx_r1.SharedWithMeTooltip(conversation_r25));
 } }
-function ConversationListComponent_ng_template_10_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 60);
-    i0.ɵɵelement(1, "i", 69);
+function ConversationListComponent_ng_template_10_Template(rf, ctx) { if (rf & 1) {
+    const _r24 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 71);
+    i0.ɵɵlistener("dragstart", function ConversationListComponent_ng_template_10_Template_div_dragstart_0_listener($event) { const conversation_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnConversationDragStart(conversation_r25, $event)); })("dragend", function ConversationListComponent_ng_template_10_Template_div_dragend_0_listener() { i0.ɵɵrestoreView(_r24); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnConversationDragEnd()); })("dragover", function ConversationListComponent_ng_template_10_Template_div_dragover_0_listener($event) { const conversation_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnConversationRowDragOver(conversation_r25, $event)); })("dragleave", function ConversationListComponent_ng_template_10_Template_div_dragleave_0_listener() { const conversation_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnDragLeave(ctx_r1.ConversationDropTargetId(conversation_r25))); })("drop", function ConversationListComponent_ng_template_10_Template_div_drop_0_listener($event) { const conversation_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnConversationRowDrop(conversation_r25, $event)); })("pointerdown", function ConversationListComponent_ng_template_10_Template_div_pointerdown_0_listener($event) { const conversation_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnRowPointerDown(conversation_r25, $event)); })("pointermove", function ConversationListComponent_ng_template_10_Template_div_pointermove_0_listener($event) { i0.ɵɵrestoreView(_r24); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnRowPointerMove($event)); })("pointerup", function ConversationListComponent_ng_template_10_Template_div_pointerup_0_listener() { i0.ɵɵrestoreView(_r24); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.CancelLongPress()); })("pointercancel", function ConversationListComponent_ng_template_10_Template_div_pointercancel_0_listener() { i0.ɵɵrestoreView(_r24); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.CancelLongPress()); })("click", function ConversationListComponent_ng_template_10_Template_div_click_0_listener($event) { const conversation_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.HandleConversationClick(conversation_r25, $event)); })("contextmenu", function ConversationListComponent_ng_template_10_Template_div_contextmenu_0_listener($event) { const conversation_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnConversationContextMenu(conversation_r25, $event)); });
+    i0.ɵɵelementStart(1, "button", 72);
+    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Template_button_click_1_listener($event) { const conversation_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnRowCheckboxClick(conversation_r25, $event)); });
+    i0.ɵɵelement(2, "i", 73);
     i0.ɵɵelementEnd();
-} }
-function ConversationListComponent_ng_template_10_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 65);
+    i0.ɵɵelementStart(3, "div", 74);
+    i0.ɵɵconditionalCreate(4, ConversationListComponent_ng_template_10_Conditional_4_Template, 2, 0, "div", 75);
+    i0.ɵɵelementStart(5, "div", 76);
+    i0.ɵɵelement(6, "mj-notification-badge", 77);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(7, "div", 78)(8, "div", 79);
+    i0.ɵɵtext(9);
+    i0.ɵɵconditionalCreate(10, ConversationListComponent_ng_template_10_Conditional_10_Template, 1, 1, "i", 80);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(11, "div", 81);
+    i0.ɵɵtext(12);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(13, "div", 82)(14, "button", 83);
+    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Template_button_click_14_listener($event) { const conversation_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OpenRowMenu(conversation_r25, $event)); });
+    i0.ɵɵelement(15, "i", 84);
+    i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const conversation_r24 = i0.ɵɵnextContext().$implicit;
+    const conversation_r25 = ctx.$implicit;
+    const depth_r26 = ctx.depth;
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("title", ctx_r1.sharedWithMeTooltip(conversation_r24));
+    i0.ɵɵstyleProp("padding-left", depth_r26 ? 16 + depth_r26 * 14 : 16, "px");
+    i0.ɵɵclassProp("active", ctx_r1.IsConversationActive(conversation_r25))("selected", ctx_r1.IsConversationSelected(conversation_r25))("renamed", ctx_r1.IsConversationRenamed(conversation_r25))("dragging", ctx_r1.IsConversationDragging(conversation_r25));
+    i0.ɵɵproperty("draggable", ctx_r1.CanChange(conversation_r25));
+    i0.ɵɵadvance();
+    i0.ɵɵstyleProp("left", (depth_r26 || 0) * 14 + 4, "px");
+    i0.ɵɵclassProp("checked", ctx_r1.IsConversationSelected(conversation_r25));
+    i0.ɵɵattribute("aria-checked", ctx_r1.IsConversationSelected(conversation_r25))("aria-label", "Select " + (conversation_r25.Name || "conversation"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r1.HasActiveTasks(conversation_r25.ID) ? 4 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("conversationId", conversation_r25.ID);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("title", conversation_r25.Name + (conversation_r25.Description ? "\n" + conversation_r25.Description : ""));
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", conversation_r25.Name, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.IsSharedWithMe(conversation_r25) ? 10 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(conversation_r25.Description);
 } }
-function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_1_For_11_Template(rf, ctx) { if (rf & 1) {
-    const _r28 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 78);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_1_For_11_Template_button_click_0_listener() { const f_r29 = i0.ɵɵrestoreView(_r28).$implicit; const conversation_r24 = i0.ɵɵnextContext(4).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.selectMoveTarget(conversation_r24, f_r29.project.ID)); });
+function ConversationListComponent_Conditional_13_Case_2_Conditional_0_For_11_Template(rf, ctx) { if (rf & 1) {
+    const _r29 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 91);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_0_For_11_Template_button_click_0_listener() { const f_r30 = i0.ɵɵrestoreView(_r29).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.ContextMoveToFolder(f_r30.project.ID)); });
     i0.ɵɵelement(1, "i");
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const f_r29 = ctx.$implicit;
-    const conversation_r24 = i0.ɵɵnextContext(4).$implicit;
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵstyleProp("padding-left", 14 + f_r29.depth * 12, "px");
-    i0.ɵɵclassProp("current", ctx_r1.IsInFolder(conversation_r24, f_r29.project.ID));
+    const f_r30 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵstyleProp("padding-left", 14 + f_r30.depth * 12, "px");
+    i0.ɵɵclassProp("current", ctx_r1.IsSingleTargetInFolder(f_r30.project.ID));
     i0.ɵɵadvance();
-    i0.ɵɵclassMap(i0.ɵɵinterpolate1("fas ", f_r29.project.Icon || "fa-folder"));
-    i0.ɵɵstyleProp("color", f_r29.project.Color || null);
+    i0.ɵɵclassMap(i0.ɵɵinterpolate1("fas ", f_r30.project.Icon || "fa-folder"));
+    i0.ɵɵstyleProp("color", f_r30.project.Color || null);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(f_r29.project.Name);
+    i0.ɵɵtextInterpolate(f_r30.project.Name);
 } }
-function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r27 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 74);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_1_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r27); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.closeMoveSubmenu($event)); });
-    i0.ɵɵelement(1, "i", 75);
+function ConversationListComponent_Conditional_13_Case_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r28 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 87);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_0_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r28); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.CloseMoveSubmenu($event)); });
+    i0.ɵɵelement(1, "i", 88);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "Move to folder");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(4, "div", 76);
-    i0.ɵɵelementStart(5, "div", 77)(6, "button", 78);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_1_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r27); const conversation_r24 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.selectMoveTarget(conversation_r24, null)); });
-    i0.ɵɵelement(7, "i", 79);
+    i0.ɵɵelement(4, "div", 89);
+    i0.ɵɵelementStart(5, "div", 90)(6, "button", 91);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_0_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r28); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.ContextMoveToFolder(null)); });
+    i0.ɵɵelement(7, "i", 92);
     i0.ɵɵelementStart(8, "span");
     i0.ɵɵtext(9, "No folder");
     i0.ɵɵelementEnd()();
-    i0.ɵɵrepeaterCreate(10, ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_1_For_11_Template, 4, 10, "button", 80, _forTrack1);
+    i0.ɵɵrepeaterCreate(10, ConversationListComponent_Conditional_13_Case_2_Conditional_0_For_11_Template, 4, 10, "button", 93, _forTrack1);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(12, "div", 76);
-    i0.ɵɵelementStart(13, "button", 78);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_1_Template_button_click_13_listener($event) { i0.ɵɵrestoreView(_r27); const conversation_r24 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.createFolderForConversation(conversation_r24, $event)); });
-    i0.ɵɵelement(14, "i", 35);
+    i0.ɵɵelement(12, "div", 89);
+    i0.ɵɵelementStart(13, "button", 91);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_0_Template_button_click_13_listener($event) { i0.ɵɵrestoreView(_r28); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.ContextMoveToNewFolder($event)); });
+    i0.ɵɵelement(14, "i", 55);
     i0.ɵɵelementStart(15, "span");
     i0.ɵɵtext(16, "New folder\u2026");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const conversation_r24 = i0.ɵɵnextContext(3).$implicit;
-    const ctx_r1 = i0.ɵɵnextContext();
+    const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance(6);
-    i0.ɵɵclassProp("current", !conversation_r24.ProjectID);
+    i0.ɵɵclassProp("current", ctx_r1.IsSingleTargetInFolder(null));
+    i0.ɵɵadvance(4);
+    i0.ɵɵrepeater(ctx_r1.FlatFolders);
+} }
+function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r32 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 99);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "button", 95);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_0_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.ContextSetPinned(true)); });
+    i0.ɵɵelement(3, "i", 20);
+    i0.ɵɵelementStart(4, "span");
+    i0.ɵɵtext(5, "Pin");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(6, "button", 95);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_0_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.ContextSetPinned(false)); });
+    i0.ɵɵelement(7, "i", 100);
+    i0.ɵɵelementStart(8, "span");
+    i0.ɵɵtext(9, "Unpin");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1("", ctx_r1.ContextMenu.targets.length, " selected");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("disabled", !ctx_r1.CanChangeAny(ctx_r1.ContextMenu.targets));
+    i0.ɵɵattribute("title", ctx_r1.CanChangeAny(ctx_r1.ContextMenu.targets) ? null : ctx_r1.ChangeRefusedReason);
     i0.ɵɵadvance(4);
-    i0.ɵɵrepeater(ctx_r1.flatFolders);
+    i0.ɵɵproperty("disabled", !ctx_r1.CanChangeAny(ctx_r1.ContextMenu.targets));
+    i0.ɵɵattribute("title", ctx_r1.CanChangeAny(ctx_r1.ContextMenu.targets) ? null : ctx_r1.ChangeRefusedReason);
 } }
-function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    const _r30 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 78);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_2_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r30); const conversation_r24 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.togglePin(conversation_r24, $event)); });
-    i0.ɵɵelement(1, "i", 81);
+function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r33 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 95);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.ContextTogglePin()); });
+    i0.ɵɵelement(1, "i", 20);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(4, "button", 78);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_2_Template_button_click_4_listener($event) { i0.ɵɵrestoreView(_r30); const conversation_r24 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openMoveSubmenu(conversation_r24.ID, $event)); });
-    i0.ɵɵelement(5, "i", 82);
-    i0.ɵɵelementStart(6, "span");
-    i0.ɵɵtext(7, "Move to folder");
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵproperty("disabled", !ctx_r1.CanChangeAny(ctx_r1.ContextMenu.targets));
+    i0.ɵɵattribute("title", ctx_r1.CanChangeAny(ctx_r1.ContextMenu.targets) ? null : ctx_r1.ChangeRefusedReason);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate((ctx_r1.ContextMenu.conversation == null ? null : ctx_r1.ContextMenu.conversation.IsPinned) ? "Unpin" : "Pin");
+} }
+function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    const _r34 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 91);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_11_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.ContextRename()); });
+    i0.ɵɵelement(1, "i", 101);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "Rename");
+    i0.ɵɵelementEnd()();
+} }
+function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r31 = i0.ɵɵgetCurrentView();
+    i0.ɵɵconditionalCreate(0, ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_0_Template, 10, 5)(1, ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_1_Template, 4, 3, "button", 94);
+    i0.ɵɵelementStart(2, "button", 95);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Template_button_click_2_listener($event) { i0.ɵɵrestoreView(_r31); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OpenMoveSubmenu($event)); });
+    i0.ɵɵelement(3, "i", 22);
+    i0.ɵɵelementStart(4, "span");
+    i0.ɵɵtext(5, "Move to folder");
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(8, "i", 83);
+    i0.ɵɵelement(6, "i", 96);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "button", 78);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_2_Template_button_click_9_listener() { i0.ɵɵrestoreView(_r30); const conversation_r24 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.renameConversation(conversation_r24); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
-    i0.ɵɵelement(10, "i", 84);
-    i0.ɵɵelementStart(11, "span");
-    i0.ɵɵtext(12, "Rename");
+    i0.ɵɵelementStart(7, "button", 95);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r31); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.ContextShare()); });
+    i0.ɵɵelement(8, "i", 24);
+    i0.ɵɵelementStart(9, "span");
+    i0.ɵɵtext(10);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(13, "div", 76);
-    i0.ɵɵelementStart(14, "button", 85);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_2_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r30); const conversation_r24 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.deleteConversation(conversation_r24); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
-    i0.ɵɵelement(15, "i", 43);
-    i0.ɵɵelementStart(16, "span");
-    i0.ɵɵtext(17, "Delete");
+    i0.ɵɵconditionalCreate(11, ConversationListComponent_Conditional_13_Case_2_Conditional_1_Conditional_11_Template, 4, 0, "button", 97);
+    i0.ɵɵelement(12, "div", 89);
+    i0.ɵɵelementStart(13, "button", 98);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_2_Conditional_1_Template_button_click_13_listener() { i0.ɵɵrestoreView(_r31); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.ContextDelete()); });
+    i0.ɵɵelement(14, "i", 26);
+    i0.ɵɵelementStart(15, "span");
+    i0.ɵɵtext(16);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const conversation_r24 = i0.ɵɵnextContext(3).$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵconditional(ctx_r1.ContextMenu.targets.length > 1 ? 0 : 1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("disabled", !ctx_r1.CanChangeAny(ctx_r1.ContextMenu.targets));
+    i0.ɵɵattribute("title", ctx_r1.CanChangeAny(ctx_r1.ContextMenu.targets) ? null : ctx_r1.ChangeRefusedReason);
+    i0.ɵɵadvance(5);
+    i0.ɵɵproperty("disabled", !ctx_r1.CanShareAny(ctx_r1.ContextMenu.targets));
+    i0.ɵɵattribute("title", ctx_r1.CanShareAny(ctx_r1.ContextMenu.targets) ? null : ctx_r1.ShareRefusedReason);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(conversation_r24.IsPinned ? "Unpin" : "Pin");
-} }
-function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 73);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Template_div_click_0_listener($event) { return $event.stopPropagation(); });
-    i0.ɵɵconditionalCreate(1, ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_1_Template, 17, 2)(2, ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Conditional_2_Template, 18, 1);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const conversation_r24 = i0.ɵɵnextContext(2).$implicit;
-    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵtextInterpolate(ctx_r1.ContextMenu.targets.length > 1 ? "Share " + ctx_r1.ContextMenu.targets.length + " conversations" : "Share");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.IsMoveSubmenuOpen(conversation_r24) ? 1 : 2);
+    i0.ɵɵconditional(ctx_r1.ContextMenu.targets.length === 1 ? 11 : -1);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(ctx_r1.ContextMenu.targets.length > 1 ? "Delete " + ctx_r1.ContextMenu.targets.length : "Delete");
 } }
-function ConversationListComponent_ng_template_10_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    const _r26 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 67)(1, "button", 70);
-    i0.ɵɵlistener("click", function ConversationListComponent_ng_template_10_Conditional_12_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r26); const conversation_r24 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleMenu(conversation_r24.ID, $event)); });
-    i0.ɵɵelement(2, "i", 71);
-    i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(3, ConversationListComponent_ng_template_10_Conditional_12_Conditional_3_Template, 3, 1, "div", 72);
-    i0.ɵɵelementEnd();
+function ConversationListComponent_Conditional_13_Case_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, ConversationListComponent_Conditional_13_Case_2_Conditional_0_Template, 17, 2)(1, ConversationListComponent_Conditional_13_Case_2_Conditional_1_Template, 17, 8);
 } if (rf & 2) {
-    const conversation_r24 = i0.ɵɵnextContext().$implicit;
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.IsMenuOpen(conversation_r24) ? 3 : -1);
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵconditional(ctx_r1.IsMoveSubmenuOpen ? 0 : 1);
 } }
-function ConversationListComponent_ng_template_10_Template(rf, ctx) { if (rf & 1) {
-    const _r23 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 57);
-    i0.ɵɵlistener("dragstart", function ConversationListComponent_ng_template_10_Template_div_dragstart_0_listener($event) { const conversation_r24 = i0.ɵɵrestoreView(_r23).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConversationDragStart(conversation_r24, $event)); })("dragend", function ConversationListComponent_ng_template_10_Template_div_dragend_0_listener() { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConversationDragEnd()); })("click", function ConversationListComponent_ng_template_10_Template_div_click_0_listener() { const conversation_r24 = i0.ɵɵrestoreView(_r23).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleConversationClick(conversation_r24)); });
-    i0.ɵɵconditionalCreate(1, ConversationListComponent_ng_template_10_Conditional_1_Template, 2, 1, "div", 58);
-    i0.ɵɵelementStart(2, "div", 59);
-    i0.ɵɵconditionalCreate(3, ConversationListComponent_ng_template_10_Conditional_3_Template, 2, 0, "div", 60);
-    i0.ɵɵelementStart(4, "div", 61);
-    i0.ɵɵelement(5, "mj-notification-badge", 62);
+function ConversationListComponent_Conditional_13_Case_3_Template(rf, ctx) { if (rf & 1) {
+    const _r35 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 91);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_3_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r35); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ContextCreateSubfolder($event)); });
+    i0.ɵɵelement(1, "i", 55);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "New Subfolder");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "div", 63)(7, "div", 64);
-    i0.ɵɵtext(8);
-    i0.ɵɵconditionalCreate(9, ConversationListComponent_ng_template_10_Conditional_9_Template, 1, 1, "i", 65);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "div", 66);
-    i0.ɵɵtext(11);
+    i0.ɵɵelementStart(4, "button", 91);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_3_Template_button_click_4_listener($event) { i0.ɵɵrestoreView(_r35); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ContextEditFolder($event)); });
+    i0.ɵɵelement(5, "i", 102);
+    i0.ɵɵelementStart(6, "span");
+    i0.ɵɵtext(7, "Rename");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelement(8, "div", 89);
+    i0.ɵɵelementStart(9, "button", 98);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_3_Template_button_click_9_listener($event) { i0.ɵɵrestoreView(_r35); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ContextDeleteFolder($event)); });
+    i0.ɵɵelement(10, "i", 26);
+    i0.ɵɵelementStart(11, "span");
+    i0.ɵɵtext(12, "Delete");
+    i0.ɵɵelementEnd()();
+} }
+function ConversationListComponent_Conditional_13_Case_4_Template(rf, ctx) { if (rf & 1) {
+    const _r36 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 91);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r36); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ContextNewConversation()); });
+    i0.ɵɵelement(1, "i", 44);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "New Conversation");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(4, "button", 91);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_4_Template_button_click_4_listener($event) { i0.ɵɵrestoreView(_r36); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ContextCreateRootFolder($event)); });
+    i0.ɵɵelement(5, "i", 55);
+    i0.ɵɵelementStart(6, "span");
+    i0.ɵɵtext(7, "New Folder");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelement(8, "div", 89);
+    i0.ɵɵelementStart(9, "button", 91);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Case_4_Template_button_click_9_listener() { i0.ɵɵrestoreView(_r36); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ContextSelectAll()); });
+    i0.ɵɵelement(10, "i", 103);
+    i0.ɵɵelementStart(11, "span");
+    i0.ɵɵtext(12, "Select All");
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(12, ConversationListComponent_ng_template_10_Conditional_12_Template, 4, 1, "div", 67);
+} }
+function ConversationListComponent_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    const _r27 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 86, 3);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_13_Template_div_click_0_listener($event) { return $event.stopPropagation(); })("contextmenu", function ConversationListComponent_Conditional_13_Template_div_contextmenu_0_listener($event) { i0.ɵɵrestoreView(_r27); $event.preventDefault(); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵconditionalCreate(2, ConversationListComponent_Conditional_13_Case_2_Template, 2, 1)(3, ConversationListComponent_Conditional_13_Case_3_Template, 13, 0)(4, ConversationListComponent_Conditional_13_Case_4_Template, 13, 0);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const conversation_r24 = ctx.$implicit;
-    const depth_r31 = ctx.depth;
+    let tmp_6_0;
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵstyleProp("padding-left", depth_r31 ? 16 + depth_r31 * 14 : 16, "px");
-    i0.ɵɵclassProp("active", ctx_r1.IsConversationActive(conversation_r24))("renamed", ctx_r1.IsConversationRenamed(conversation_r24))("dragging", ctx_r1.IsConversationDragging(conversation_r24));
-    i0.ɵɵproperty("draggable", !ctx_r1.isSelectionMode);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.isSelectionMode ? 1 : -1);
-    i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.hasActiveTasks(conversation_r24.ID) ? 3 : -1);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("conversationId", conversation_r24.ID);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("title", conversation_r24.Name + (conversation_r24.Description ? "\n" + conversation_r24.Description : ""));
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", conversation_r24.Name, " ");
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.isSharedWithMe(conversation_r24) ? 9 : -1);
+    i0.ɵɵstyleProp("left", ctx_r1.ContextMenu.x, "px")("top", ctx_r1.ContextMenu.y, "px");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(conversation_r24.Description);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(!ctx_r1.isSelectionMode ? 12 : -1);
+    i0.ɵɵconditional((tmp_6_0 = ctx_r1.ContextMenu.kind) === "conversation" ? 2 : tmp_6_0 === "folder" ? 3 : 4);
 } }
+/** Resource type the conversation share rows are written against. */
+const CONVERSATIONS_RESOURCE_TYPE_ID = '81D4BC3D-9FEB-EF11-B01A-286B35C04427';
 export class ConversationListComponent {
     dialogService;
     notificationService;
     activeTasksService;
     mjDialogService;
     cdr;
-    environmentId;
-    currentUser;
-    selectedConversationId = null;
-    renamedConversationId = null;
-    isSidebarPinned = true; // Whether sidebar is pinned (stays open after selection)
-    isMobileView = false; // Whether we're on mobile (no pin options)
+    EnvironmentId;
+    CurrentUser;
+    SelectedConversationId = null;
+    RenamedConversationId = null;
+    IsSidebarPinned = true; // Whether sidebar is pinned (stays open after selection)
+    IsMobileView = false; // Whether we're on mobile (no pin options)
     // ── White-label chrome toggles (all default true = stock rendering) ──
     /** Show the search box in the list header. Flipping to false clears any active
      *  search so a hidden filter can't keep silently narrowing the list. */
     set showSearch(value) {
         if (!value && this._searchQuery) {
-            this.searchQuery = ''; // setter rebuilds the groupings
+            this.SearchQuery = ''; // setter rebuilds the groupings
         }
         this._showSearch = value;
     }
@@ -591,50 +738,140 @@ export class ConversationListComponent {
     }
     _showSearch = true;
     /** Show the "New Conversation" button. */
-    showNewConversationButton = true;
+    ShowNewConversationButton = true;
     /** Show the ⋯ header options menu (refresh / select / group-by / hide sidebar). */
-    showHeaderMenu = true;
+    ShowHeaderMenu = true;
     /** Show the collapsible Pinned / Folders / Messages section headers. When false,
      *  the list renders FLAT and fully expanded: folder grouping is bypassed (the
      *  folder tree's root drop-zone and New Folder action live in the section
      *  header, so a headerless tree would allow one-way folder nesting) — the
      *  chrome-less rendering for embedded hosts. */
-    showSectionHeaders = true;
-    conversationSelected = new EventEmitter();
-    conversationDeleted = new EventEmitter(); // Emits the deleted conversation ID
-    newConversationRequested = new EventEmitter();
-    pinSidebarRequested = new EventEmitter(); // Request to pin sidebar
-    unpinSidebarRequested = new EventEmitter(); // Request to unpin (collapse) sidebar
-    refreshRequested = new EventEmitter(); // Emitted after list refresh so chat area can also reload
-    directMessagesExpanded = true;
-    pinnedExpanded = true;
-    foldersExpanded = true;
-    ungroupedExpanded = true;
-    openMenuConversationId = null;
-    conversationIdsWithTasks = new Set();
-    isSelectionMode = false;
-    selectedConversationIds = new Set();
-    isHeaderMenuOpen = false;
-    isRefreshing = false;
+    ShowSectionHeaders = true;
+    ConversationSelected = new EventEmitter();
+    /**
+     * @deprecated Use {@link ConversationSelected}.
+     *
+     * The same emitter under the old binding name, so a template still binding
+     * (conversationSelected) keeps working. Must stay AFTER ConversationSelected: class fields
+     * initialise in order, and the other way round this captures undefined.
+     */
+    conversationSelected = this.ConversationSelected;
+    ConversationDeleted = new EventEmitter(); // Emits the deleted conversation ID
+    /**
+     * @deprecated Use {@link ConversationDeleted}.
+     *
+     * The same emitter under the old binding name, so a template still binding
+     * (conversationDeleted) keeps working. Must stay AFTER ConversationDeleted: class fields
+     * initialise in order, and the other way round this captures undefined.
+     */
+    conversationDeleted = this.ConversationDeleted; // Emits the deleted conversation ID
+    NewConversationRequested = new EventEmitter();
+    /**
+     * @deprecated Use {@link NewConversationRequested}.
+     *
+     * The same emitter under the old binding name, so a template still binding
+     * (newConversationRequested) keeps working. Must stay AFTER NewConversationRequested: class fields
+     * initialise in order, and the other way round this captures undefined.
+     */
+    newConversationRequested = this.NewConversationRequested;
+    PinSidebarRequested = new EventEmitter(); // Request to pin sidebar
+    /**
+     * @deprecated Use {@link PinSidebarRequested}.
+     *
+     * The same emitter under the old binding name, so a template still binding
+     * (pinSidebarRequested) keeps working. Must stay AFTER PinSidebarRequested: class fields
+     * initialise in order, and the other way round this captures undefined.
+     */
+    pinSidebarRequested = this.PinSidebarRequested; // Request to pin sidebar
+    UnpinSidebarRequested = new EventEmitter(); // Request to unpin (collapse) sidebar
+    /**
+     * @deprecated Use {@link UnpinSidebarRequested}.
+     *
+     * The same emitter under the old binding name, so a template still binding
+     * (unpinSidebarRequested) keeps working. Must stay AFTER UnpinSidebarRequested: class fields
+     * initialise in order, and the other way round this captures undefined.
+     */
+    unpinSidebarRequested = this.UnpinSidebarRequested; // Request to unpin (collapse) sidebar
+    RefreshRequested = new EventEmitter(); // Emitted after list refresh so chat area can also reload
+    /**
+     * @deprecated Use {@link RefreshRequested}.
+     *
+     * The same emitter under the old binding name, so a template still binding
+     * (refreshRequested) keeps working. Must stay AFTER RefreshRequested: class fields
+     * initialise in order, and the other way round this captures undefined.
+     */
+    refreshRequested = this.RefreshRequested; // Emitted after list refresh so chat area can also reload
+    /**
+     * The user wants the current filter term searched across all of Chat, not just this list.
+     * Emits the term. This panel filters only loaded conversations by Name/Description, so it
+     * cannot answer "where did we discuss X" — the host owns that surface and the routing to it.
+     */
+    SearchEscalated = new EventEmitter();
+    DirectMessagesExpanded = true;
+    PinnedExpanded = true;
+    FoldersExpanded = true;
+    UngroupedExpanded = true;
+    /** The open right-click menu, or null. Positioned at the pointer. */
+    ContextMenu = null;
+    /** True while the open conversation menu is showing its folder picker. */
+    IsMoveSubmenuOpen = false;
+    /** Resources the share dialog is currently offering, one per conversation. */
+    ShareContexts = [];
+    ShareNotice = null;
+    IsShareDialogOpen = false;
+    ShareAdapter = new MJResourcePermissionShareAdapter(CONVERSATIONS_RESOURCE_TYPE_ID);
+    ConversationIdsWithTasks = new Set();
+    IsSelectionMode = false;
+    SelectedConversationIds = new Set();
+    /** Row a Shift-click ranges from — the last row picked without Shift. */
+    selectionAnchorId = null;
+    /** Why Share is unavailable, shown on its disabled button. */
+    ShareRefusedReason = 'Only the owner, or someone with Owner access, can share a conversation';
+    /** Why Move and Pin are unavailable, shown on their disabled buttons. */
+    ChangeRefusedReason = 'You need Edit access to move or pin a conversation shared with you';
+    /** How long a touch must rest on a row before it selects the row. */
+    static longPressDelayMs = 500;
+    /** How far a touch may drift, in pixels, before it counts as a scroll rather than a press. */
+    static longPressMoveTolerancePx = 10;
+    /** Space kept between the right-click menu and the edges of the window. */
+    static menuViewportMargin = 8;
+    /** The touch press waiting to become a long-press, or null. */
+    longPress = null;
+    /** Pointer type of the latest press on a row. On touch, a tap while selecting toggles the row. */
+    lastRowPointerType = 'mouse';
+    /** Set by a completed long-press, so the click that ends the same press does nothing. */
+    ignoreNextRowClick = false;
+    IsHeaderMenuOpen = false;
+    IsRefreshing = false;
+    searchInput;
+    contextMenuEl;
     /** UserInfoEngine key for persisting folder collapse state + group-by mode. */
-    static FolderPrefsKey = 'mj.conversations.folderPrefs.v1';
+    static folderPrefsKey = 'mj.conversations.folderPrefs.v1';
     /** How the conversation list is grouped. 'project' = folders, 'none' = flat list. */
-    groupBy = 'project';
+    GroupBy = 'project';
+    /** Field every section of the list is sorted on. */
+    SortBy = 'date';
+    /** Direction of the current sort. */
+    SortDirection = 'desc';
+    /** Direction each field falls back to when it becomes the active sort. */
+    static defaultSortDirections = {
+        date: 'desc',
+        name: 'asc'
+    };
     /** Precomputed groupings, rebuilt whenever conversations/projects/search change. */
-    pinnedConversations = [];
-    unpinnedConversations = [];
-    ungroupedConversations = [];
-    folderTree = [];
+    PinnedConversations = [];
+    UnpinnedConversations = [];
+    UngroupedConversations = [];
+    FolderTree = [];
     /** Flattened folder list (depth-ordered) for the "Move to folder" menu. */
-    flatFolders = [];
+    FlatFolders = [];
     /** Folder IDs (normalized) whose children are collapsed. Absent = expanded. */
     collapsedFolderIds = new Set();
     /** Drag-and-drop state. */
-    draggedConversationId = null;
-    draggedFolderId = null;
-    dragOverTargetId = null;
-    /** When set, the open conversation menu is showing its "Move to folder" picker. */
-    moveSubmenuConversationId = null;
+    /** Conversations currently being dragged — the whole selection when the grabbed row is part of it. */
+    DraggedConversationIds = [];
+    DraggedFolderId = null;
+    DragOverTargetId = null;
     _searchQuery = '';
     destroy$ = new Subject();
     engine = ConversationEngine.Instance;
@@ -647,23 +884,36 @@ export class ConversationListComponent {
         this.mjDialogService = mjDialogService;
         this.cdr = cdr;
     }
-    get searchQuery() {
+    get SearchQuery() {
         return this._searchQuery;
     }
-    set searchQuery(value) {
+    set SearchQuery(value) {
         this._searchQuery = value ?? '';
         this.rebuildGroups();
+        this.dropHiddenRowsFromSelection();
     }
     /** True when a search filter is active. */
-    get isSearching() {
+    get IsSearching() {
         return this._searchQuery.trim().length > 0;
     }
-    /** Conversations matching the current search (used by selection-mode helpers). */
-    get filteredConversations() {
-        return this.filterConversations(this.engine.Conversations);
+    /** Hand the current filter term to the host to search across every Chat entity. */
+    EscalateSearch() {
+        this.SearchEscalated.emit(this._searchQuery.trim());
+    }
+    /** Clears the search box and returns focus to it. */
+    ClearSearch() {
+        this.SearchQuery = '';
+        this.searchInput?.nativeElement.focus();
+    }
+    /** Escape in the search box clears it without closing any host overlay. */
+    OnSearchKeydown(event) {
+        if (event.key === 'Escape' && this.IsSearching) {
+            event.stopPropagation();
+            this.ClearSearch();
+        }
     }
     filterConversations(conversations) {
-        if (!this.isSearching) {
+        if (!this.IsSearching) {
             return conversations;
         }
         const lowerQuery = this._searchQuery.toLowerCase();
@@ -674,94 +924,106 @@ export class ConversationListComponent {
         // Restore persisted folder collapse state + group-by preference
         this.loadFolderPrefs();
         // Load conversations (and folders) on init
-        this.engine.LoadConversations(this.environmentId, this.currentUser, false);
+        this.engine.LoadConversations(this.EnvironmentId, this.CurrentUser, false);
         // Rebuild the precomputed groupings whenever conversations OR projects change
         // (pin, archive, rename, move-to-folder, folder create/rename/delete, etc.).
-        this.engine.Conversations$.pipe(takeUntil(this.destroy$)).subscribe(() => {
-            this.rebuildGroups();
-            this.cdr.detectChanges();
-        });
+        this.engine.Conversations$.pipe(takeUntil(this.destroy$)).subscribe(() => this.onConversationListChanged());
         this.engine.Projects$.pipe(takeUntil(this.destroy$)).subscribe(() => {
             this.rebuildGroups();
             this.cdr.detectChanges();
         });
         // Subscribe to conversation IDs with active tasks (hot set)
         this.activeTasksService.conversationIdsWithTasks$.pipe(takeUntil(this.destroy$)).subscribe(conversationIds => {
-            this.conversationIdsWithTasks = conversationIds;
+            this.ConversationIdsWithTasks = conversationIds;
             this.cdr.detectChanges(); // Force change detection to ensure spinner icons update reliably
         });
     }
     ngOnDestroy() {
+        this.CancelLongPress();
         this.destroy$.next();
         this.destroy$.complete();
     }
+    /** Rebuilds the groupings from the engine's list, first dropping selected conversations that left it. */
+    onConversationListChanged() {
+        this.dropRemovedConversationsFromSelection();
+        this.rebuildGroups();
+        this.cdr.detectChanges();
+    }
     onDocumentClick() {
         // Close menus when clicking outside
-        if (this.openMenuConversationId) {
-            this.closeMenu();
+        if (this.ContextMenu) {
+            this.CloseContextMenu();
         }
-        if (this.isHeaderMenuOpen) {
-            this.closeHeaderMenu();
+        if (this.IsHeaderMenuOpen) {
+            this.CloseHeaderMenu();
         }
     }
-    toggleHeaderMenu(event) {
-        event.stopPropagation();
-        this.isHeaderMenuOpen = !this.isHeaderMenuOpen;
-    }
-    closeHeaderMenu() {
-        this.isHeaderMenuOpen = false;
+    onDocumentEscape() {
+        if (this.ContextMenu) {
+            this.CloseContextMenu();
+            return;
+        }
+        if (this.IsSelectionMode) {
+            this.exitSelectionMode();
+        }
     }
-    onSelectConversationsClick(event) {
+    ToggleHeaderMenu(event) {
         event.stopPropagation();
-        this.toggleSelectionMode();
-        this.closeHeaderMenu();
+        this.IsHeaderMenuOpen = !this.IsHeaderMenuOpen;
     }
-    onToggleGroupByClick(event) {
+    CloseHeaderMenu() {
+        this.IsHeaderMenuOpen = false;
+    }
+    OnToggleGroupByClick(event) {
         event.stopPropagation();
-        this.toggleGroupBy();
-        this.closeHeaderMenu();
+        this.ToggleGroupBy();
+        this.CloseHeaderMenu();
     }
-    async onRefreshConversationsClick(event) {
+    async OnRefreshConversationsClick(event) {
         event.stopPropagation();
-        if (this.isRefreshing)
+        if (this.IsRefreshing)
             return;
-        this.isRefreshing = true;
+        this.IsRefreshing = true;
         try {
-            await this.engine.LoadConversations(this.environmentId, this.currentUser, true);
+            await this.engine.LoadConversations(this.EnvironmentId, this.CurrentUser, true);
             // Signal parent to also reload messages in the active conversation
-            this.refreshRequested.emit();
+            this.RefreshRequested.emit();
         }
         catch (error) {
             console.error('Error refreshing conversations:', error);
             await this.dialogService.alert('Error', 'Failed to refresh conversations. Please try again.');
         }
         finally {
-            this.isRefreshing = false;
+            this.IsRefreshing = false;
             this.cdr.detectChanges();
-            this.closeHeaderMenu();
+            this.CloseHeaderMenu();
         }
     }
-    onPinSidebarClick(event) {
+    OnPinSidebarClick(event) {
         event.stopPropagation();
-        this.closeHeaderMenu();
-        this.pinSidebarRequested.emit();
+        this.CloseHeaderMenu();
+        this.PinSidebarRequested.emit();
     }
-    onUnpinSidebarClick(event) {
+    OnUnpinSidebarClick(event) {
         event.stopPropagation();
-        this.closeHeaderMenu();
-        this.unpinSidebarRequested.emit();
+        this.CloseHeaderMenu();
+        this.UnpinSidebarRequested.emit();
     }
-    toggleDirectMessages() {
-        this.directMessagesExpanded = !this.directMessagesExpanded;
+    ToggleDirectMessages() {
+        this.DirectMessagesExpanded = !this.DirectMessagesExpanded;
+        this.dropHiddenRowsFromSelection();
     }
-    togglePinned() {
-        this.pinnedExpanded = !this.pinnedExpanded;
+    TogglePinned() {
+        this.PinnedExpanded = !this.PinnedExpanded;
+        this.dropHiddenRowsFromSelection();
     }
-    toggleFolders() {
-        this.foldersExpanded = !this.foldersExpanded;
+    ToggleFolders() {
+        this.FoldersExpanded = !this.FoldersExpanded;
+        this.dropHiddenRowsFromSelection();
     }
-    toggleUngrouped() {
-        this.ungroupedExpanded = !this.ungroupedExpanded;
+    ToggleUngrouped() {
+        this.UngroupedExpanded = !this.UngroupedExpanded;
+        this.dropHiddenRowsFromSelection();
     }
     // ========================================================================
     // FOLDER GROUPING
@@ -770,17 +1032,71 @@ export class ConversationListComponent {
      * Recomputes pinned/unpinned/ungrouped lists and the folder tree from the
      * engine's conversation + project caches and the current search filter.
      */
+    /**
+     * Makes `field` the active sort. Choosing the field that is already active
+     * flips the direction; switching fields starts from that field's natural
+     * direction (newest first for date, A-Z for name).
+     */
+    SetSort(field) {
+        if (this.SortBy === field) {
+            this.SortDirection = this.SortDirection === 'asc' ? 'desc' : 'asc';
+        }
+        else {
+            this.SortBy = field;
+            this.SortDirection = ConversationListComponent.defaultSortDirections[field];
+        }
+        this.saveFolderPrefs();
+        this.rebuildGroups();
+    }
+    /** Icon for a sort button: direction arrow when active, plain field icon otherwise. */
+    SortIcon(field) {
+        if (this.SortBy !== field) {
+            return field === 'date' ? 'fa-clock' : 'fa-font';
+        }
+        if (field === 'date') {
+            return this.SortDirection === 'asc' ? 'fa-arrow-up-1-9' : 'fa-arrow-down-9-1';
+        }
+        return this.SortDirection === 'asc' ? 'fa-arrow-up-a-z' : 'fa-arrow-down-z-a';
+    }
+    /**
+     * Orders conversations by the active sort. Returns a new array so the caller's
+     * source list is never mutated. Conversations with no name sort last.
+     */
+    sortConversations(conversations) {
+        const factor = this.SortDirection === 'asc' ? 1 : -1;
+        return [...conversations].sort((a, b) => {
+            if (this.SortBy === 'name') {
+                const aName = a.Name?.trim() ?? '';
+                const bName = b.Name?.trim() ?? '';
+                if (!aName || !bName) {
+                    return aName === bName ? 0 : (aName ? -1 : 1);
+                }
+                return aName.localeCompare(bName, undefined, { sensitivity: 'base' }) * factor;
+            }
+            return (this.updatedTime(a) - this.updatedTime(b)) * factor;
+        });
+    }
+    /** Position of a conversation in a rendered-order list, or -1. Case-insensitive on the ID. */
+    indexOfConversation(order, conversationId) {
+        if (!conversationId)
+            return -1;
+        return order.findIndex(id => UUIDsEqual(id, conversationId));
+    }
+    updatedTime(conversation) {
+        const updatedAt = conversation.__mj_UpdatedAt;
+        return updatedAt ? new Date(updatedAt).getTime() : 0;
+    }
     rebuildGroups() {
-        const matching = this.filterConversations(this.engine.Conversations);
-        this.pinnedConversations = matching.filter(c => c.IsPinned);
-        this.unpinnedConversations = matching.filter(c => !c.IsPinned);
+        const matching = this.sortConversations(this.filterConversations(this.engine.Conversations));
+        this.PinnedConversations = matching.filter(c => c.IsPinned);
+        this.UnpinnedConversations = matching.filter(c => !c.IsPinned);
         const projects = this.engine.Projects;
         const projectIds = new Set(projects.map(p => NormalizeUUID(p.ID)));
         // Bucket unpinned conversations by their folder (pinned ones live in the
         // Pinned section). Conversations with no/unknown folder are "ungrouped".
         const conversationsByProject = new Map();
         const ungrouped = [];
-        for (const c of this.unpinnedConversations) {
+        for (const c of this.UnpinnedConversations) {
             const pid = c.ProjectID ? NormalizeUUID(c.ProjectID) : null;
             if (pid && projectIds.has(pid)) {
                 const arr = conversationsByProject.get(pid) ?? [];
@@ -791,7 +1107,7 @@ export class ConversationListComponent {
                 ungrouped.push(c);
             }
         }
-        this.ungroupedConversations = ungrouped;
+        this.UngroupedConversations = ungrouped;
         // Index projects by parent. A project whose parent isn't loaded is treated
         // as a root so it never disappears from the tree.
         const childrenByParent = new Map();
@@ -812,8 +1128,8 @@ export class ConversationListComponent {
                 return { project: p, depth, conversations, children, totalCount, hasContent };
             });
         };
-        this.folderTree = build(null, 0);
-        this.flatFolders = this.flattenFolders(this.folderTree);
+        this.FolderTree = build(null, 0);
+        this.FlatFolders = this.flattenFolders(this.FolderTree);
     }
     flattenFolders(nodes) {
         const out = [];
@@ -833,10 +1149,10 @@ export class ConversationListComponent {
         }
         return null;
     }
-    isFolderExpanded(projectId) {
+    IsFolderExpanded(projectId) {
         return !this.collapsedFolderIds.has(NormalizeUUID(projectId));
     }
-    toggleFolder(projectId) {
+    ToggleFolder(projectId) {
         const key = NormalizeUUID(projectId);
         if (this.collapsedFolderIds.has(key)) {
             this.collapsedFolderIds.delete(key);
@@ -845,21 +1161,29 @@ export class ConversationListComponent {
             this.collapsedFolderIds.add(key);
         }
         this.saveFolderPrefs();
+        this.dropHiddenRowsFromSelection();
     }
-    toggleGroupBy() {
-        this.groupBy = this.groupBy === 'project' ? 'none' : 'project';
+    ToggleGroupBy() {
+        this.GroupBy = this.GroupBy === 'project' ? 'none' : 'project';
         this.saveFolderPrefs();
         this.rebuildGroups();
+        this.dropHiddenRowsFromSelection();
     }
     loadFolderPrefs() {
         try {
-            const raw = UserInfoEngine.Instance.GetSetting(ConversationListComponent.FolderPrefsKey);
+            const raw = UserInfoEngine.Instance.GetSetting(ConversationListComponent.folderPrefsKey);
             if (!raw)
                 return;
             const parsed = JSON.parse(raw);
             this.collapsedFolderIds = new Set((parsed.collapsed ?? []).map(id => NormalizeUUID(id)));
             if (parsed.groupBy === 'none' || parsed.groupBy === 'project') {
-                this.groupBy = parsed.groupBy;
+                this.GroupBy = parsed.groupBy;
+            }
+            if (parsed.sortBy === 'date' || parsed.sortBy === 'name') {
+                this.SortBy = parsed.sortBy;
+            }
+            if (parsed.sortDirection === 'asc' || parsed.sortDirection === 'desc') {
+                this.SortDirection = parsed.sortDirection;
             }
         }
         catch {
@@ -869,46 +1193,59 @@ export class ConversationListComponent {
     saveFolderPrefs() {
         const payload = JSON.stringify({
             collapsed: Array.from(this.collapsedFolderIds),
-            groupBy: this.groupBy
+            groupBy: this.GroupBy,
+            sortBy: this.SortBy,
+            sortDirection: this.SortDirection
         });
-        UserInfoEngine.Instance.SetSettingDebounced(ConversationListComponent.FolderPrefsKey, payload);
+        UserInfoEngine.Instance.SetSettingDebounced(ConversationListComponent.folderPrefsKey, payload);
     }
     // ========================================================================
     // DRAG & DROP (move conversation into/out of a folder)
     // ========================================================================
-    onConversationDragStart(conversation, event) {
-        if (this.isSelectionMode)
+    /**
+     * Starts a conversation drag. Grabbing a row that is part of the current
+     * selection drags the whole selection; grabbing any other row drags that row
+     * alone and leaves the selection untouched. A touch press that lifts the row
+     * selects it instead, since on touch a long-press means select.
+     */
+    OnConversationDragStart(conversation, event) {
+        if (this.lastRowPointerType === 'touch') {
+            event.preventDefault();
+            this.completeLongPress();
             return;
-        this.draggedFolderId = null;
-        this.draggedConversationId = conversation.ID;
+        }
+        this.DraggedFolderId = null;
+        this.DraggedConversationIds = this.SelectedConversationIds.has(conversation.ID)
+            ? Array.from(this.SelectedConversationIds)
+            : [conversation.ID];
         if (event.dataTransfer) {
             event.dataTransfer.effectAllowed = 'move';
-            event.dataTransfer.setData('text/plain', conversation.ID);
+            event.dataTransfer.setData('text/plain', this.DraggedConversationIds.join(','));
         }
     }
-    onConversationDragEnd() {
-        this.draggedConversationId = null;
-        this.dragOverTargetId = null;
+    OnConversationDragEnd() {
+        this.DraggedConversationIds = [];
+        this.DragOverTargetId = null;
     }
-    onFolderDragStart(node, event) {
+    OnFolderDragStart(node, event) {
         event.stopPropagation();
-        this.draggedConversationId = null;
-        this.draggedFolderId = node.project.ID;
+        this.DraggedConversationIds = [];
+        this.DraggedFolderId = node.project.ID;
         if (event.dataTransfer) {
             event.dataTransfer.effectAllowed = 'move';
             event.dataTransfer.setData('text/plain', node.project.ID);
         }
     }
-    onFolderDragEnd() {
-        this.draggedFolderId = null;
-        this.dragOverTargetId = null;
+    OnFolderDragEnd() {
+        this.DraggedFolderId = null;
+        this.DragOverTargetId = null;
     }
-    onFolderDragOver(projectId, event) {
+    OnFolderDragOver(projectId, event) {
         // A conversation can drop onto any folder; a folder can drop onto any folder
         // that isn't itself or one of its own descendants (which would create a cycle).
-        const accepts = this.draggedConversationId
+        const accepts = this.DraggedConversationIds.length > 0
             ? true
-            : this.draggedFolderId
+            : this.DraggedFolderId
                 ? this.isValidFolderDropTarget(projectId)
                 : false;
         if (!accepts)
@@ -916,58 +1253,95 @@ export class ConversationListComponent {
         event.preventDefault();
         if (event.dataTransfer)
             event.dataTransfer.dropEffect = 'move';
-        this.dragOverTargetId = projectId;
+        this.DragOverTargetId = projectId;
     }
-    onUngroupedDragOver(event) {
-        if (!this.draggedConversationId)
+    /**
+     * Drop target id for a conversation row: its folder, or the Ungrouped section
+     * when it has none. Resolved through the folder tree so the highlight matches
+     * the folder row's own ID regardless of how the conversation stores it.
+     */
+    ConversationDropTargetId(conversation) {
+        if (!conversation.ProjectID)
+            return 'ungrouped';
+        const node = this.FlatFolders.find(f => UUIDsEqual(f.project.ID, conversation.ProjectID));
+        return node ? node.project.ID : 'ungrouped';
+    }
+    /**
+     * A conversation row accepts a conversation drag and stands in for its folder,
+     * so dropping onto the rows inside a folder files the drag there too. A row
+     * that is part of the drag itself is not a target.
+     */
+    OnConversationRowDragOver(conversation, event) {
+        if (this.DraggedConversationIds.length === 0)
+            return;
+        if (this.DraggedConversationIds.some(id => UUIDsEqual(id, conversation.ID)))
             return;
         event.preventDefault();
+        event.stopPropagation();
         if (event.dataTransfer)
             event.dataTransfer.dropEffect = 'move';
-        this.dragOverTargetId = 'ungrouped';
+        this.DragOverTargetId = this.ConversationDropTargetId(conversation);
     }
-    /** The Folders section header accepts a dragged folder to move it back to the top level. */
-    onFoldersRootDragOver(event) {
-        if (!this.draggedFolderId)
-            return;
+    async OnConversationRowDrop(conversation, event) {
+        event.preventDefault();
+        event.stopPropagation();
+        const conversationIds = this.DraggedConversationIds.filter(id => !UUIDsEqual(id, conversation.ID));
+        this.DragOverTargetId = null;
+        this.DraggedConversationIds = [];
+        if (conversationIds.length > 0) {
+            await this.moveConversations(conversationIds, conversation.ProjectID ?? null);
+        }
+    }
+    OnUngroupedDragOver(event) {
+        if (this.DraggedConversationIds.length === 0)
+            return;
         event.preventDefault();
         if (event.dataTransfer)
             event.dataTransfer.dropEffect = 'move';
-        this.dragOverTargetId = 'folders-root';
+        this.DragOverTargetId = 'ungrouped';
     }
-    onDragLeave(targetId) {
-        if (this.dragOverTargetId === targetId) {
-            this.dragOverTargetId = null;
+    /** The Folders section header accepts a dragged folder to move it back to the top level. */
+    OnFoldersRootDragOver(event) {
+        if (!this.DraggedFolderId)
+            return;
+        event.preventDefault();
+        if (event.dataTransfer)
+            event.dataTransfer.dropEffect = 'move';
+        this.DragOverTargetId = 'folders-root';
+    }
+    OnDragLeave(targetId) {
+        if (this.DragOverTargetId === targetId) {
+            this.DragOverTargetId = null;
         }
     }
-    onFolderDrop(project, event) {
+    async OnFolderDrop(project, event) {
         event.preventDefault();
-        const conversationId = this.draggedConversationId;
-        const folderId = this.draggedFolderId;
-        this.dragOverTargetId = null;
-        this.draggedConversationId = null;
-        this.draggedFolderId = null;
-        if (conversationId) {
-            this.moveConversation(conversationId, project.ID);
+        const conversationIds = this.DraggedConversationIds;
+        const folderId = this.DraggedFolderId;
+        this.DragOverTargetId = null;
+        this.DraggedConversationIds = [];
+        this.DraggedFolderId = null;
+        if (conversationIds.length > 0) {
+            await this.moveConversations(conversationIds, project.ID);
         }
         else if (folderId && this.isValidFolderDropTarget(project.ID, folderId)) {
-            this.moveFolder(folderId, project.ID);
+            await this.moveFolder(folderId, project.ID);
         }
     }
-    onUngroupedDrop(event) {
+    async OnUngroupedDrop(event) {
         event.preventDefault();
-        const conversationId = this.draggedConversationId;
-        this.dragOverTargetId = null;
-        this.draggedConversationId = null;
-        if (conversationId) {
-            this.moveConversation(conversationId, null);
+        const conversationIds = this.DraggedConversationIds;
+        this.DragOverTargetId = null;
+        this.DraggedConversationIds = [];
+        if (conversationIds.length > 0) {
+            await this.moveConversations(conversationIds, null);
         }
     }
-    onFoldersRootDrop(event) {
+    OnFoldersRootDrop(event) {
         event.preventDefault();
-        const folderId = this.draggedFolderId;
-        this.dragOverTargetId = null;
-        this.draggedFolderId = null;
+        const folderId = this.DraggedFolderId;
+        this.DragOverTargetId = null;
+        this.DraggedFolderId = null;
         if (folderId) {
             this.moveFolder(folderId, null);
         }
@@ -976,7 +1350,7 @@ export class ConversationListComponent {
      * A folder can be dropped onto a target folder only if the target isn't the dragged
      * folder itself and isn't one of its descendants (otherwise we'd create a cycle).
      */
-    isValidFolderDropTarget(targetId, draggedId = this.draggedFolderId) {
+    isValidFolderDropTarget(targetId, draggedId = this.DraggedFolderId) {
         if (!draggedId)
             return false;
         if (UUIDsEqual(targetId, draggedId))
@@ -1001,20 +1375,41 @@ export class ConversationListComponent {
     }
     /** Assigns a conversation to a folder (or null to ungroup) and refreshes the view. */
     async moveConversation(conversationId, projectId) {
+        await this.moveConversations([conversationId], projectId);
+    }
+    /**
+     * Assigns several conversations to a folder (or null to ungroup) in one batch,
+     * reveals the destination folder, and refreshes the view.
+     */
+    async moveConversations(conversationIds, projectId) {
+        // Dropping onto a folder's own contents is easy to do by accident — skip the
+        // conversations that already live there rather than re-saving them.
+        const toMove = conversationIds.filter(id => !this.isInProject(id, projectId));
+        if (toMove.length === 0)
+            return;
         try {
-            await this.engine.MoveConversationToProject(conversationId, projectId, this.currentUser);
-            // Reveal the destination folder so the user sees where it landed
+            const result = await this.engine.MoveMultipleConversationsToProject(toMove, projectId, this.CurrentUser);
+            // Reveal the destination folder so the user sees where they landed
             if (projectId) {
                 this.collapsedFolderIds.delete(NormalizeUUID(projectId));
             }
+            await this.reportBulkOutcome(result, 'moved');
             this.rebuildGroups();
             this.cdr.detectChanges();
         }
         catch (error) {
-            console.error('Error moving conversation:', error);
-            await this.dialogService.alert('Error', 'Failed to move conversation. Please try again.');
+            console.error('Error moving conversations:', error);
+            await this.dialogService.alert('Error', `Failed to move the selected conversation${toMove.length === 1 ? '' : 's'}. Please try again.`);
         }
     }
+    /** True when a conversation already sits in the given folder (or in no folder). */
+    isInProject(conversationId, projectId) {
+        const conversation = this.engine.GetConversation(conversationId);
+        if (!conversation)
+            return false;
+        const current = conversation.ProjectID ?? null;
+        return projectId ? !!current && UUIDsEqual(current, projectId) : !current;
+    }
     /** Reparents a folder under another folder (or to the top level when projectId is null). */
     async moveFolder(folderId, parentId) {
         // No-op if it's already under that parent
@@ -1025,7 +1420,7 @@ export class ConversationListComponent {
         if (sameParent)
             return;
         try {
-            await this.engine.MoveProjectToParent(folderId, parentId, this.currentUser);
+            await this.engine.MoveProjectToParent(folderId, parentId, this.CurrentUser);
             // Reveal the new parent so the moved folder is visible
             if (parentId) {
                 this.collapsedFolderIds.delete(NormalizeUUID(parentId));
@@ -1039,42 +1434,246 @@ export class ConversationListComponent {
         }
     }
     // ========================================================================
-    // MOVE-TO-FOLDER MENU
+    // RIGHT-CLICK MENU — one menu for rows, folders and empty space
     // ========================================================================
-    openMoveSubmenu(conversationId, event) {
+    /**
+     * Opens the conversation menu. It acts on the whole selection when the clicked
+     * row is part of it, and on that row alone otherwise — so right-clicking
+     * something you had not selected never disturbs the selection.
+     */
+    OnConversationContextMenu(conversation, event) {
+        event.preventDefault();
+        event.stopPropagation();
+        if (this.lastRowPointerType === 'touch') {
+            // Some touch browsers report a long-press as a right-click; it selects instead.
+            this.completeLongPress();
+            return;
+        }
+        const targets = this.SelectedConversationIds.has(conversation.ID)
+            ? Array.from(this.SelectedConversationIds)
+            : [conversation.ID];
+        this.openContextMenu({ kind: 'conversation', conversation, folder: null, targets }, this.pointerAnchor(event));
+    }
+    /** The row's ⋯ button opens the same menu, anchored under the button. */
+    OpenRowMenu(conversation, event) {
         event.stopPropagation();
-        this.moveSubmenuConversationId = conversationId;
+        const targets = this.SelectedConversationIds.has(conversation.ID)
+            ? Array.from(this.SelectedConversationIds)
+            : [conversation.ID];
+        this.openContextMenu({ kind: 'conversation', conversation, folder: null, targets }, this.buttonAnchor(event));
     }
-    closeMoveSubmenu(event) {
+    OnFolderContextMenu(project, event) {
+        event.preventDefault();
+        event.stopPropagation();
+        this.openContextMenu({ kind: 'folder', conversation: null, folder: project, targets: [] }, this.pointerAnchor(event));
+    }
+    /** Empty space: a click that landed on a row or folder is theirs, not the list's. */
+    OnBackgroundContextMenu(event) {
+        const target = event.target;
+        if (target?.closest('.conversation-item, .folder-row'))
+            return;
+        event.preventDefault();
+        this.openContextMenu({ kind: 'background', conversation: null, folder: null, targets: [] }, this.pointerAnchor(event));
+    }
+    /** A menu opened at the pointer opens upward from the pointer when it must. */
+    pointerAnchor(event) {
+        return { x: event.clientX, y: event.clientY, flipBottom: event.clientY };
+    }
+    /** A menu opened from a button sits under it, or above it when there is no room below. */
+    buttonAnchor(event) {
+        const rect = event.currentTarget?.getBoundingClientRect();
+        if (!rect)
+            return this.pointerAnchor(event);
+        return { x: rect.left, y: rect.bottom + 2, flipBottom: rect.top - 2 };
+    }
+    openContextMenu(menu, anchor, showFolderPicker = false) {
+        this.IsMoveSubmenuOpen = showFolderPicker;
+        this.ContextMenu = { ...menu, anchor, x: anchor.x, y: anchor.y };
+        this.fitContextMenuInViewport();
+    }
+    /**
+     * Keeps the open menu inside the window: it opens upward from its anchor when
+     * there is no room below, and moves left when there is no room to the right.
+     * Runs again whenever the folder picker changes the menu's height.
+     */
+    fitContextMenuInViewport() {
+        if (!this.ContextMenu)
+            return;
+        this.cdr.detectChanges(); // render the menu so it can be measured
+        const menuElement = this.contextMenuEl?.nativeElement;
+        if (!menuElement)
+            return;
+        const { width, height } = menuElement.getBoundingClientRect();
+        const { anchor } = this.ContextMenu;
+        const margin = ConversationListComponent.menuViewportMargin;
+        let y = anchor.y;
+        if (y + height > window.innerHeight - margin) {
+            const above = anchor.flipBottom - height;
+            y = above >= margin ? above : Math.max(margin, window.innerHeight - margin - height);
+        }
+        const x = Math.max(margin, Math.min(anchor.x, window.innerWidth - margin - width));
+        this.ContextMenu = { ...this.ContextMenu, x, y };
+        this.cdr.detectChanges();
+    }
+    CloseContextMenu() {
+        this.ContextMenu = null;
+        this.IsMoveSubmenuOpen = false;
+    }
+    OpenMoveSubmenu(event) {
+        event.stopPropagation();
+        this.IsMoveSubmenuOpen = true;
+        this.fitContextMenuInViewport();
+    }
+    CloseMoveSubmenu(event) {
+        event.stopPropagation();
+        this.IsMoveSubmenuOpen = false;
+        this.fitContextMenuInViewport();
+    }
+    /** Marks the folder a single conversation already sits in. Never marks a multi-target menu. */
+    IsSingleTargetInFolder(projectId) {
+        const conversation = this.ContextMenu?.conversation;
+        if (!conversation || this.ContextMenu?.targets.length !== 1)
+            return false;
+        return projectId
+            ? !!conversation.ProjectID && UUIDsEqual(conversation.ProjectID, projectId)
+            : !conversation.ProjectID;
+    }
+    /** Conversations the menu's actions apply to — its targets, or the selection. */
+    actionTargetIds() {
+        const targets = this.ContextMenu?.targets ?? [];
+        return targets.length > 0 ? targets : Array.from(this.SelectedConversationIds);
+    }
+    ContextMoveToFolder(projectId) {
+        void this.BulkMoveToFolder(projectId);
+    }
+    ContextMoveToNewFolder(event) {
         event.stopPropagation();
-        this.moveSubmenuConversationId = null;
+        const ids = this.actionTargetIds();
+        this.CloseContextMenu();
+        this.openFolderModal(null, null, (created) => this.moveConversations(ids, created.ID));
+    }
+    ContextSetPinned(isPinned) {
+        void this.BulkSetPinned(isPinned);
+    }
+    ContextTogglePin() {
+        const conversation = this.ContextMenu?.conversation;
+        if (!conversation)
+            return;
+        void this.BulkSetPinned(!conversation.IsPinned);
     }
-    IsInFolder(conversation, projectId) {
-        return !!conversation.ProjectID && UUIDsEqual(conversation.ProjectID, projectId);
+    /** Shares the menu's targets — the whole selection, or just the clicked row. */
+    ContextShare() {
+        const ids = this.actionTargetIds();
+        this.CloseContextMenu();
+        this.shareConversations(ids);
     }
-    selectMoveTarget(conversation, projectId) {
-        this.moveConversation(conversation.ID, projectId);
-        this.closeMenu();
+    /**
+     * Opens the dialog the chat header uses for the conversations the user may
+     * share, and reports how many were left out. Says why when there are none.
+     */
+    shareConversations(ids) {
+        const conversations = ids
+            .map(id => this.engine.GetConversation(id))
+            .filter((c) => !!c);
+        const shareable = conversations.filter(c => this.canShare(c));
+        if (shareable.length === 0) {
+            void this.dialogService.alert('Cannot Share', `${this.ShareRefusedReason}.`);
+            return;
+        }
+        const skipped = conversations.length - shareable.length;
+        this.ShareContexts = shareable.map(c => ({
+            ResourceID: c.ID,
+            ResourceName: c.Name ?? 'Conversation',
+            OwnerUserID: c.UserID ?? null,
+            OwnerDisplayName: c.User ?? 'You',
+            CurrentUserID: this.CurrentUser?.ID ?? null
+        }));
+        this.ShareNotice = skipped > 0
+            ? `${skipped} of ${conversations.length} left out — ${this.ShareRefusedReason.toLowerCase()}.`
+            : null;
+        this.IsShareDialogOpen = true;
+    }
+    /** True when at least one of the conversations can be shared by the current user. */
+    CanShareAny(ids) {
+        return ids.some(id => this.canShare(this.engine.GetConversation(id)));
+    }
+    canShare(conversation) {
+        if (!conversation || !this.CurrentUser)
+            return false;
+        return this.engine.CanShareConversation(conversation, this.CurrentUser.ID);
+    }
+    /** True when at least one of the conversations can be moved or pinned by the current user. */
+    CanChangeAny(ids) {
+        return ids.some(id => {
+            const conversation = this.engine.GetConversation(id);
+            return !!conversation && this.CanChange(conversation);
+        });
+    }
+    /** True when the user may move or pin the conversation: they own it, or hold Edit or Owner access. */
+    CanChange(conversation) {
+        if (!this.CurrentUser)
+            return false;
+        return this.engine.CanEditConversation(conversation, this.CurrentUser.ID);
+    }
+    OnShareDialogResult(_result) {
+        this.IsShareDialogOpen = false;
+        this.ShareContexts = [];
+        this.ShareNotice = null;
+        this.cdr.detectChanges();
+    }
+    ContextRename() {
+        const conversation = this.ContextMenu?.conversation;
+        this.CloseContextMenu();
+        if (conversation)
+            this.RenameConversation(conversation);
+    }
+    ContextDelete() {
+        void this.BulkDeleteConversations();
+    }
+    ContextCreateSubfolder(event) {
+        const folder = this.ContextMenu?.folder;
+        this.CloseContextMenu();
+        if (folder)
+            this.CreateFolder(folder.ID, event);
+    }
+    ContextEditFolder(event) {
+        const folder = this.ContextMenu?.folder;
+        this.CloseContextMenu();
+        if (folder)
+            this.EditFolder(folder, event);
+    }
+    ContextDeleteFolder(event) {
+        const folder = this.ContextMenu?.folder;
+        this.CloseContextMenu();
+        if (folder)
+            void this.DeleteFolder(folder, event);
+    }
+    ContextNewConversation() {
+        this.CloseContextMenu();
+        this.CreateNewConversation();
+    }
+    ContextCreateRootFolder(event) {
+        this.CloseContextMenu();
+        this.CreateFolder(null, event);
+    }
+    ContextSelectAll() {
+        this.CloseContextMenu();
+        this.IsSelectionMode = true;
+        this.SelectAll();
     }
     // ========================================================================
     // FOLDER CRUD (reuses the existing project form modal)
     // ========================================================================
-    createFolder(parentId, event) {
+    CreateFolder(parentId, event) {
         if (event)
             event.stopPropagation();
         this.openFolderModal(null, parentId);
     }
-    editFolder(project, event) {
+    EditFolder(project, event) {
         if (event)
             event.stopPropagation();
         this.openFolderModal(project, null);
     }
-    createFolderForConversation(conversation, event) {
-        event.stopPropagation();
-        const conversationId = conversation.ID;
-        this.closeMenu();
-        this.openFolderModal(null, null, (created) => this.moveConversation(conversationId, created.ID));
-    }
     openFolderModal(project, parentId, onCreated) {
         const dialogRef = this.mjDialogService.open({
             content: ProjectFormModalComponent,
@@ -1083,8 +1682,8 @@ export class ConversationListComponent {
         });
         const instance = dialogRef.Content.instance;
         instance.dialogRef = dialogRef;
-        instance.environmentId = this.environmentId;
-        instance.currentUser = this.currentUser;
+        instance.environmentId = this.EnvironmentId;
+        instance.currentUser = this.CurrentUser;
         if (project)
             instance.project = project;
         if (parentId)
@@ -1101,10 +1700,10 @@ export class ConversationListComponent {
                 onCreated(saved);
         });
     }
-    async deleteFolder(project, event) {
+    async DeleteFolder(project, event) {
         if (event)
             event.stopPropagation();
-        const node = this.findFolderNode(this.folderTree, project.ID);
+        const node = this.findFolderNode(this.FolderTree, project.ID);
         const total = node?.totalCount ?? 0;
         const childCount = node?.children.length ?? 0;
         let message = `Are you sure you want to delete the folder "${project.Name}"?`;
@@ -1123,7 +1722,7 @@ export class ConversationListComponent {
         if (!confirmed)
             return;
         try {
-            await this.engine.DeleteProject(project.ID, this.currentUser);
+            await this.engine.DeleteProject(project.ID, this.CurrentUser);
             this.collapsedFolderIds.delete(NormalizeUUID(project.ID));
             this.rebuildGroups();
             this.cdr.detectChanges();
@@ -1134,31 +1733,29 @@ export class ConversationListComponent {
         }
     }
     IsConversationActive(conversation) {
-        return UUIDsEqual(conversation.ID, this.selectedConversationId);
+        return UUIDsEqual(conversation.ID, this.SelectedConversationId);
     }
-    IsConversationRenamed(conversation) {
-        return UUIDsEqual(conversation.ID, this.renamedConversationId);
+    /** True when this conversation is part of the current multi-selection. */
+    IsConversationSelected(conversation) {
+        return this.IsSelectionMode && this.SelectedConversationIds.has(conversation.ID);
     }
-    IsMenuOpen(conversation) {
-        return UUIDsEqual(this.openMenuConversationId, conversation.ID);
+    IsConversationRenamed(conversation) {
+        return UUIDsEqual(conversation.ID, this.RenamedConversationId);
     }
     IsConversationDragging(conversation) {
-        return UUIDsEqual(this.draggedConversationId, conversation.ID);
-    }
-    IsMoveSubmenuOpen(conversation) {
-        return UUIDsEqual(this.moveSubmenuConversationId, conversation.ID);
+        return this.DraggedConversationIds.some(id => UUIDsEqual(id, conversation.ID));
     }
-    selectConversation(conversation) {
-        this.conversationSelected.emit(conversation.ID);
+    SelectConversation(conversation) {
+        this.ConversationSelected.emit(conversation.ID);
         // Clear unread notifications when conversation is opened
         this.notificationService.markConversationAsRead(conversation.ID);
     }
-    async createNewConversation() {
+    async CreateNewConversation() {
         // Don't create DB record yet - just show the welcome screen
         // Conversation will be created when user sends first message
-        this.newConversationRequested.emit();
+        this.NewConversationRequested.emit();
     }
-    async renameConversation(conversation) {
+    async RenameConversation(conversation) {
         try {
             const result = await this.dialogService.input({
                 title: 'Edit Conversation',
@@ -1178,7 +1775,7 @@ export class ConversationListComponent {
                 const newName = typeof result === 'string' ? result : result.value;
                 const newDescription = typeof result === 'string' ? conversation.Description : result.secondValue;
                 if (newName !== conversation.Name || newDescription !== conversation.Description) {
-                    await this.engine.SaveConversation(conversation.ID, { Name: newName, Description: newDescription || '' }, this.currentUser);
+                    await this.engine.SaveConversation(conversation.ID, { Name: newName, Description: newDescription || '' }, this.CurrentUser);
                 }
             }
         }
@@ -1187,7 +1784,7 @@ export class ConversationListComponent {
             await this.dialogService.alert('Error', 'Failed to update conversation. Please try again.');
         }
     }
-    async deleteConversation(conversation) {
+    async DeleteConversation(conversation) {
         try {
             const confirmed = await this.dialogService.confirm({
                 title: 'Delete Conversation',
@@ -1197,9 +1794,9 @@ export class ConversationListComponent {
             });
             if (confirmed) {
                 const deletedId = conversation.ID;
-                await this.engine.DeleteConversation(deletedId, this.currentUser);
+                await this.engine.DeleteConversation(deletedId, this.CurrentUser);
                 this.cdr.detectChanges();
-                this.conversationDeleted.emit(deletedId);
+                this.ConversationDeleted.emit(deletedId);
             }
         }
         catch (error) {
@@ -1207,64 +1804,238 @@ export class ConversationListComponent {
             await this.dialogService.alert('Error', 'Failed to delete conversation. Please try again.');
         }
     }
-    toggleMenu(conversationId, event) {
-        event.stopPropagation();
-        this.openMenuConversationId = this.openMenuConversationId === conversationId ? null : conversationId;
-    }
-    closeMenu() {
-        this.openMenuConversationId = null;
-        this.moveSubmenuConversationId = null;
-    }
-    async togglePin(conversation, event) {
+    async TogglePin(conversation, event) {
         if (event)
             event.stopPropagation();
-        this.closeMenu(); // Close immediately on user action — don't wait for the async op
+        this.CloseContextMenu(); // Close immediately on user action — don't wait for the async op
         try {
-            await this.engine.PinConversation(conversation.ID, !conversation.IsPinned, this.currentUser);
+            await this.engine.PinConversation(conversation.ID, !conversation.IsPinned, this.CurrentUser);
         }
         catch (error) {
             console.error('Error toggling pin:', error);
             await this.dialogService.alert('Error', 'Failed to pin/unpin conversation. Please try again.');
         }
     }
-    hasActiveTasks(conversationId) {
-        return this.conversationIdsWithTasks.has(conversationId);
+    HasActiveTasks(conversationId) {
+        return this.ConversationIdsWithTasks.has(conversationId);
     }
     /** True when this conversation was shared with the current user by someone else. */
-    isSharedWithMe(conversation) {
+    IsSharedWithMe(conversation) {
         return this.engine.GetSharedByInfo(conversation.ID) !== null;
     }
     /** Tooltip for the sidebar share icon: "Shared by {email or name}". */
-    sharedWithMeTooltip(conversation) {
+    SharedWithMeTooltip(conversation) {
         const info = this.engine.GetSharedByInfo(conversation.ID);
         if (!info)
             return 'Shared with you';
         return `Shared by ${info.Email ?? info.Name ?? 'another user'}`;
     }
-    toggleSelectionMode() {
-        this.isSelectionMode = !this.isSelectionMode;
-        if (!this.isSelectionMode) {
-            this.selectedConversationIds.clear();
+    ToggleSelectionMode() {
+        if (this.IsSelectionMode) {
+            this.exitSelectionMode();
+        }
+        else {
+            this.IsSelectionMode = true;
         }
     }
-    toggleConversationSelection(conversationId) {
-        if (this.selectedConversationIds.has(conversationId)) {
-            this.selectedConversationIds.delete(conversationId);
+    /**
+     * Clicking the empty space of the list drops the selection, the way clicking
+     * blank space in a file browser does. A click that landed on a row, folder,
+     * section header or button is handled by that element instead.
+     */
+    OnListBackgroundClick(event) {
+        if (!this.IsSelectionMode)
+            return;
+        const target = event.target;
+        if (target?.closest('.conversation-item, .folder-row, .section-header, button'))
+            return;
+        this.exitSelectionMode();
+    }
+    exitSelectionMode() {
+        this.IsSelectionMode = false;
+        this.SelectedConversationIds.clear();
+        this.selectionAnchorId = null;
+    }
+    /** Ends selection mode from the selection bar's clear button. */
+    ClearSelection() {
+        this.exitSelectionMode();
+    }
+    /** Selection mode closes itself once the last row is deselected. */
+    exitSelectionModeIfEmpty() {
+        if (this.SelectedConversationIds.size === 0) {
+            this.exitSelectionMode();
+        }
+    }
+    /** Adds or removes one row and makes it the range anchor, ending the mode when nothing is left. */
+    toggleRowSelection(conversationId) {
+        this.ToggleConversationSelection(conversationId);
+        this.selectionAnchorId = conversationId;
+        this.exitSelectionModeIfEmpty();
+    }
+    /**
+     * Drops selected rows the view no longer shows — after a search edit, a
+     * collapse, or a grouping change — so no action can reach a row the user
+     * cannot see. A list rebuild alone does not call this: a move into a
+     * collapsed folder keeps its rows selected for a follow-up action.
+     */
+    dropHiddenRowsFromSelection() {
+        if (this.SelectedConversationIds.size === 0)
+            return;
+        const visible = new Set(this.visibleConversationIds().map(id => NormalizeUUID(id)));
+        this.removeFromSelection(id => !visible.has(NormalizeUUID(id)));
+    }
+    /** Drops selected conversations that are no longer in the engine's list at all. */
+    dropRemovedConversationsFromSelection() {
+        if (this.SelectedConversationIds.size === 0)
+            return;
+        const listed = new Set(this.engine.Conversations.map(c => NormalizeUUID(c.ID)));
+        this.removeFromSelection(id => !listed.has(NormalizeUUID(id)));
+    }
+    /** Removes the selected IDs that match, and ends selection mode if none remain. */
+    removeFromSelection(shouldRemove) {
+        for (const id of Array.from(this.SelectedConversationIds)) {
+            if (shouldRemove(id)) {
+                this.SelectedConversationIds.delete(id);
+            }
+        }
+        this.exitSelectionModeIfEmpty();
+    }
+    /**
+     * Adds the open conversation to a selection that is just starting, so it moves
+     * with the rows picked alongside it. Returns the id added, or null when nothing
+     * is open or it is hidden inside a collapsed folder or section.
+     */
+    seedSelectionWithOpenConversation() {
+        const openId = this.SelectedConversationId;
+        if (!openId)
+            return null;
+        const visibleId = this.visibleConversationIds().find(id => UUIDsEqual(id, openId));
+        if (!visibleId)
+            return null;
+        this.SelectedConversationIds.add(visibleId);
+        return visibleId;
+    }
+    /** Conversation IDs in the order the list renders them, skipping collapsed sections and folders. */
+    visibleConversationIds() {
+        const ids = [];
+        const sectionOpen = (expanded) => !this.ShowSectionHeaders || expanded;
+        if (sectionOpen(this.PinnedExpanded)) {
+            ids.push(...this.PinnedConversations.map(c => c.ID));
+        }
+        if (this.ShowSectionHeaders && this.GroupBy === 'project') {
+            if (this.FoldersExpanded) {
+                // Subfolders render above their parent folder's own conversations.
+                const walk = (nodes) => {
+                    for (const node of nodes) {
+                        if (!this.IsFolderExpanded(node.project.ID))
+                            continue;
+                        walk(node.children);
+                        ids.push(...node.conversations.map(c => c.ID));
+                    }
+                };
+                walk(this.FolderTree);
+            }
+            if (this.UngroupedExpanded) {
+                ids.push(...this.UngroupedConversations.map(c => c.ID));
+            }
+        }
+        else if (sectionOpen(this.DirectMessagesExpanded)) {
+            ids.push(...this.UnpinnedConversations.map(c => c.ID));
+        }
+        return ids;
+    }
+    /**
+     * Adds every row between the anchor and `conversationId` to the selection.
+     * Rows already picked stay picked — a range never takes a selection away.
+     *
+     * With nothing picked yet the open conversation stands in as the anchor, so a
+     * single Shift-click highlights the span from it rather than one lone row.
+     */
+    selectRangeTo(conversationId) {
+        const order = this.visibleConversationIds();
+        const end = this.indexOfConversation(order, conversationId);
+        if (end < 0)
+            return;
+        const anchorId = this.selectionAnchorId ?? this.SelectedConversationId;
+        const start = this.indexOfConversation(order, anchorId);
+        if (start < 0) {
+            // No anchor and no open conversation on screen — pick this row alone.
+            this.SelectedConversationIds.add(conversationId);
+            this.selectionAnchorId = conversationId;
+            return;
+        }
+        this.selectionAnchorId = order[start];
+        const [from, to] = start <= end ? [start, end] : [end, start];
+        for (let i = from; i <= to; i++) {
+            this.SelectedConversationIds.add(order[i]);
+        }
+    }
+    ToggleConversationSelection(conversationId) {
+        if (this.SelectedConversationIds.has(conversationId)) {
+            this.SelectedConversationIds.delete(conversationId);
         }
         else {
-            this.selectedConversationIds.add(conversationId);
+            this.SelectedConversationIds.add(conversationId);
         }
     }
-    selectAll() {
-        this.filteredConversations.forEach(c => {
-            this.selectedConversationIds.add(c.ID);
+    /** Selects every row on screen — never rows hidden by the search or a collapsed folder or section. */
+    SelectAll() {
+        this.visibleConversationIds().forEach(id => {
+            this.SelectedConversationIds.add(id);
         });
     }
-    deselectAll() {
-        this.selectedConversationIds.clear();
+    DeselectAll() {
+        this.SelectedConversationIds.clear();
+    }
+    /**
+     * Moves the conversations into one folder, or out of all folders when projectId
+     * is null. The selection survives so a second bulk action can follow.
+     */
+    async BulkMoveToFolder(projectId, ids = this.actionTargetIds()) {
+        this.CloseContextMenu();
+        if (ids.length === 0)
+            return;
+        try {
+            const result = await this.engine.MoveMultipleConversationsToProject(ids, projectId, this.CurrentUser);
+            await this.reportBulkOutcome(result, 'moved');
+        }
+        catch (error) {
+            console.error('Error moving conversations:', error);
+            await this.dialogService.alert('Error', 'Failed to move the selected conversations. Please try again.');
+        }
+        this.cdr.detectChanges();
+    }
+    /** Pins or unpins the conversations, keeping the selection. */
+    async BulkSetPinned(isPinned, ids = this.actionTargetIds()) {
+        this.CloseContextMenu();
+        if (ids.length === 0)
+            return;
+        try {
+            const result = await this.engine.PinMultipleConversations(ids, isPinned, this.CurrentUser);
+            await this.reportBulkOutcome(result, isPinned ? 'pinned' : 'unpinned');
+        }
+        catch (error) {
+            console.error('Error pinning conversations:', error);
+            await this.dialogService.alert('Error', `Failed to ${isPinned ? 'pin' : 'unpin'} the selected conversations. Please try again.`);
+        }
+        this.cdr.detectChanges();
     }
-    async bulkDeleteConversations() {
-        const count = this.selectedConversationIds.size;
+    /** Reports the conversations a bulk action could not change. Silent on full success. */
+    async reportBulkOutcome(result, verb) {
+        if (result.Failed.length === 0)
+            return;
+        const failedNames = result.Failed.map(f => `"${f.Name}" (${f.Error})`).join(', ');
+        await this.dialogService.alert('Partial Success', `${result.Successful.length} conversation${result.Successful.length === 1 ? '' : 's'} ${verb}.\n\n` +
+            `${result.Failed.length} could not be ${verb}: ${failedNames}`);
+    }
+    /**
+     * Deletes the conversations after confirmation. Only the deleted ones leave the
+     * selection: deleting a row outside it leaves it alone, and rows that failed
+     * stay selected so the user can try again.
+     */
+    async BulkDeleteConversations(ids = this.actionTargetIds()) {
+        const count = ids.length;
+        this.CloseContextMenu();
         if (count === 0)
             return;
         const confirmed = await this.dialogService.confirm({
@@ -1273,132 +2044,734 @@ export class ConversationListComponent {
             okText: 'Delete',
             cancelText: 'Cancel'
         });
-        if (confirmed) {
-            try {
-                const result = await this.engine.DeleteMultipleConversations(Array.from(this.selectedConversationIds), this.currentUser);
-                if (result.Failed.length > 0 && result.Successful.length > 0) {
-                    // Partial success
-                    const failedNames = result.Failed.map(f => `"${f.Name}"`).join(', ');
-                    await this.dialogService.alert('Partial Success', `Deleted ${result.Successful.length} of ${count} conversations.\n\n` +
-                        `${result.Failed.length} could not be deleted: ${failedNames}`);
-                }
-                else if (result.Failed.length > 0 && result.Successful.length === 0) {
-                    // All failed
-                    await this.dialogService.alert('Delete Failed', `None of the ${count} conversations could be deleted. They may have already been removed.`);
-                }
-                // Emit deleted events for successful deletions
-                for (const id of result.Successful) {
-                    this.conversationDeleted.emit(id);
-                }
-            }
-            catch (error) {
-                console.error('Error deleting conversations:', error);
-                await this.dialogService.alert('Error', 'Failed to delete conversations. Please try again.');
-            }
-            finally {
-                // Always exit selection mode after an attempt, whether success or failure
-                this.selectedConversationIds.clear();
-                this.isSelectionMode = false;
-                this.cdr.detectChanges();
+        if (!confirmed)
+            return;
+        try {
+            const result = await this.engine.DeleteMultipleConversations(ids, this.CurrentUser);
+            await this.reportDeleteOutcome(result, count);
+            for (const id of result.Successful) {
+                this.ConversationDeleted.emit(id);
             }
+            const deleted = new Set(result.Successful.map(id => NormalizeUUID(id)));
+            this.removeFromSelection(id => deleted.has(NormalizeUUID(id)));
+        }
+        catch (error) {
+            console.error('Error deleting conversations:', error);
+            await this.dialogService.alert('Error', 'Failed to delete conversations. Please try again.');
+        }
+        finally {
+            this.cdr.detectChanges();
         }
     }
-    handleConversationClick(conversation) {
-        if (this.isSelectionMode) {
-            this.toggleConversationSelection(conversation.ID);
+    /** Reports the conversations a bulk delete could not remove. Silent on full success. */
+    async reportDeleteOutcome(result, count) {
+        if (result.Failed.length === 0)
+            return;
+        if (result.Successful.length === 0) {
+            await this.dialogService.alert('Delete Failed', `None of the ${count} conversations could be deleted. They may have already been removed.`);
+            return;
         }
-        else {
-            this.selectConversation(conversation);
+        const failedNames = result.Failed.map(f => `"${f.Name}"`).join(', ');
+        await this.dialogService.alert('Partial Success', `Deleted ${result.Successful.length} of ${count} conversations.\n\n` +
+            `${result.Failed.length} could not be deleted: ${failedNames}`);
+    }
+    // ========================================================================
+    // SELECTION BAR — stands in for the search row while a selection exists
+    // ========================================================================
+    /** The selected conversation IDs, in the order they were picked. */
+    get SelectedIds() {
+        return Array.from(this.SelectedConversationIds);
+    }
+    /** True when any selected conversation is unpinned, so the bar's pin button pins rather than unpins. */
+    SelectionHasUnpinned() {
+        return this.SelectedIds.some(id => !this.engine.GetConversation(id)?.IsPinned);
+    }
+    /** The bar acts on the selection even while a menu for another row is open. */
+    BarSetPinned() {
+        void this.BulkSetPinned(this.SelectionHasUnpinned(), this.SelectedIds);
+    }
+    BarShare() {
+        this.CloseContextMenu();
+        this.shareConversations(this.SelectedIds);
+    }
+    BarDelete() {
+        void this.BulkDeleteConversations(this.SelectedIds);
+    }
+    /** Opens the folder picker for the selection, under the bar's Move button. */
+    BarOpenMoveMenu(event) {
+        event.stopPropagation(); // the document click would close the picker straight away
+        const ids = this.SelectedIds;
+        const conversation = ids.length === 1 ? this.engine.GetConversation(ids[0]) ?? null : null;
+        this.openContextMenu({ kind: 'conversation', conversation, folder: null, targets: ids }, this.buttonAnchor(event), true);
+    }
+    // ========================================================================
+    // ROW CLICKS, CHECKBOXES AND TOUCH PRESSES
+    // ========================================================================
+    /**
+     * The row checkbox adds or removes its row without opening it — the mouse
+     * route to a selection that needs no keyboard. Shift-click extends a range.
+     * Unlike a Ctrl-click it never takes the open conversation along, so the
+     * checkboxes show exactly what is picked.
+     */
+    OnRowCheckboxClick(conversation, event) {
+        event.stopPropagation();
+        this.IsSelectionMode = true;
+        if (event.shiftKey) {
+            this.selectRangeTo(conversation.ID);
+            return;
         }
+        this.toggleRowSelection(conversation.ID);
+    }
+    /**
+     * Starts timing a touch press on a row; held long enough, it selects the row.
+     * Presses on the row's own buttons (the checkbox and ⋯) are theirs to handle.
+     */
+    OnRowPointerDown(conversation, event) {
+        this.lastRowPointerType = event.pointerType;
+        this.ignoreNextRowClick = false;
+        this.CancelLongPress();
+        if (event.pointerType !== 'touch')
+            return;
+        if (event.target?.closest('button'))
+            return;
+        this.longPress = {
+            conversation,
+            x: event.clientX,
+            y: event.clientY,
+            timer: setTimeout(() => this.completeLongPress(), ConversationListComponent.longPressDelayMs)
+        };
+    }
+    /** A touch that drifts is a scroll, not a press. */
+    OnRowPointerMove(event) {
+        if (!this.longPress)
+            return;
+        const distance = Math.hypot(event.clientX - this.longPress.x, event.clientY - this.longPress.y);
+        if (distance > ConversationListComponent.longPressMoveTolerancePx) {
+            this.CancelLongPress();
+        }
+    }
+    CancelLongPress() {
+        if (this.longPress) {
+            clearTimeout(this.longPress.timer);
+            this.longPress = null;
+        }
+    }
+    /**
+     * Completes the press in progress, if any: selects its row and starts
+     * selection mode, as a long-press does in Gmail. The click that ends the same
+     * press is then ignored, so it does not undo the selection.
+     */
+    completeLongPress() {
+        const press = this.longPress;
+        if (!press)
+            return;
+        this.CancelLongPress();
+        this.ignoreNextRowClick = true;
+        this.IsSelectionMode = true;
+        this.SelectedConversationIds.add(press.conversation.ID);
+        this.selectionAnchorId = press.conversation.ID;
+        this.cdr.detectChanges();
+    }
+    /**
+     * Routes a row click. Ctrl/Cmd toggles one row and Shift extends from the
+     * anchor, either one starting selection mode. On touch, while selecting, a tap
+     * adds or removes the row. Any other click collapses the selection and opens
+     * the conversation.
+     */
+    HandleConversationClick(conversation, event) {
+        if (this.ignoreNextRowClick) {
+            this.ignoreNextRowClick = false;
+            return;
+        }
+        if (this.IsSelectionMode && this.lastRowPointerType === 'touch') {
+            this.toggleRowSelection(conversation.ID);
+            return;
+        }
+        const isRangeClick = !!event?.shiftKey;
+        const isToggleClick = !!event && (event.ctrlKey || event.metaKey);
+        if (isRangeClick || isToggleClick) {
+            event?.preventDefault(); // a Shift-click would otherwise paint a text selection
+            const entering = !this.IsSelectionMode;
+            if (entering) {
+                this.IsSelectionMode = true;
+            }
+            if (isRangeClick) {
+                this.selectRangeTo(conversation.ID);
+            }
+            else {
+                // The open conversation reads as picked, so a Ctrl-click that starts a
+                // selection takes it along; a Shift-click already ranges from it.
+                const seeded = entering ? this.seedSelectionWithOpenConversation() : null;
+                if (!seeded || !UUIDsEqual(seeded, conversation.ID)) {
+                    this.ToggleConversationSelection(conversation.ID);
+                }
+                this.selectionAnchorId = conversation.ID;
+                this.exitSelectionModeIfEmpty();
+            }
+            return;
+        }
+        // A plain click collapses the selection down to this one conversation, the
+        // way a file browser does.
+        if (this.IsSelectionMode) {
+            this.exitSelectionMode();
+        }
+        this.SelectConversation(conversation);
+    }
+    /** @deprecated Use {@link EnvironmentId}. */
+    set environmentId(value) {
+        this.EnvironmentId = value;
+    }
+    /** @deprecated Use {@link EnvironmentId}. */
+    get environmentId() {
+        return this.EnvironmentId;
+    }
+    /** @deprecated Use {@link CurrentUser}. */
+    set currentUser(value) {
+        this.CurrentUser = value;
+    }
+    /** @deprecated Use {@link CurrentUser}. */
+    get currentUser() {
+        return this.CurrentUser;
+    }
+    /** @deprecated Use {@link SelectedConversationId}. */
+    set selectedConversationId(value) {
+        this.SelectedConversationId = value;
+    }
+    /** @deprecated Use {@link SelectedConversationId}. */
+    get selectedConversationId() {
+        return this.SelectedConversationId;
+    }
+    /** @deprecated Use {@link RenamedConversationId}. */
+    set renamedConversationId(value) {
+        this.RenamedConversationId = value;
+    }
+    /** @deprecated Use {@link RenamedConversationId}. */
+    get renamedConversationId() {
+        return this.RenamedConversationId;
+    }
+    /** @deprecated Use {@link IsSidebarPinned}. */
+    set isSidebarPinned(value) {
+        this.IsSidebarPinned = value;
+    }
+    /** @deprecated Use {@link IsSidebarPinned}. */
+    get isSidebarPinned() {
+        return this.IsSidebarPinned;
+    } // Whether sidebar is pinned (stays open after selection)
+    /** @deprecated Use {@link IsMobileView}. */
+    set isMobileView(value) {
+        this.IsMobileView = value;
+    }
+    /** @deprecated Use {@link IsMobileView}. */
+    get isMobileView() {
+        return this.IsMobileView;
+    } // Whether we're on mobile (no pin options)
+    /** @deprecated Use {@link ShowNewConversationButton}. */
+    set showNewConversationButton(value) {
+        this.ShowNewConversationButton = value;
+    }
+    /** @deprecated Use {@link ShowNewConversationButton}. */
+    get showNewConversationButton() {
+        return this.ShowNewConversationButton;
+    }
+    /** @deprecated Use {@link ShowHeaderMenu}. */
+    set showHeaderMenu(value) {
+        this.ShowHeaderMenu = value;
+    }
+    /** @deprecated Use {@link ShowHeaderMenu}. */
+    get showHeaderMenu() {
+        return this.ShowHeaderMenu;
+    }
+    /** @deprecated Use {@link ShowSectionHeaders}. */
+    set showSectionHeaders(value) {
+        this.ShowSectionHeaders = value;
+    }
+    /** @deprecated Use {@link ShowSectionHeaders}. */
+    get showSectionHeaders() {
+        return this.ShowSectionHeaders;
+    }
+    /** @deprecated Use {@link DirectMessagesExpanded}. */
+    get directMessagesExpanded() {
+        return this.DirectMessagesExpanded;
+    }
+    /** @deprecated Use {@link DirectMessagesExpanded}. */
+    set directMessagesExpanded(value) {
+        this.DirectMessagesExpanded = value;
+    }
+    /** @deprecated Use {@link PinnedExpanded}. */
+    get pinnedExpanded() {
+        return this.PinnedExpanded;
+    }
+    /** @deprecated Use {@link PinnedExpanded}. */
+    set pinnedExpanded(value) {
+        this.PinnedExpanded = value;
+    }
+    /** @deprecated Use {@link FoldersExpanded}. */
+    get foldersExpanded() {
+        return this.FoldersExpanded;
+    }
+    /** @deprecated Use {@link FoldersExpanded}. */
+    set foldersExpanded(value) {
+        this.FoldersExpanded = value;
+    }
+    /** @deprecated Use {@link UngroupedExpanded}. */
+    get ungroupedExpanded() {
+        return this.UngroupedExpanded;
+    }
+    /** @deprecated Use {@link UngroupedExpanded}. */
+    set ungroupedExpanded(value) {
+        this.UngroupedExpanded = value;
+    }
+    /** @deprecated Use {@link ConversationIdsWithTasks}. */
+    get conversationIdsWithTasks() {
+        return this.ConversationIdsWithTasks;
+    }
+    /** @deprecated Use {@link ConversationIdsWithTasks}. */
+    set conversationIdsWithTasks(value) {
+        this.ConversationIdsWithTasks = value;
+    }
+    /** @deprecated Use {@link IsSelectionMode}. */
+    get isSelectionMode() {
+        return this.IsSelectionMode;
+    }
+    /** @deprecated Use {@link IsSelectionMode}. */
+    set isSelectionMode(value) {
+        this.IsSelectionMode = value;
+    }
+    /** @deprecated Use {@link SelectedConversationIds}. */
+    get selectedConversationIds() {
+        return this.SelectedConversationIds;
+    }
+    /** @deprecated Use {@link SelectedConversationIds}. */
+    set selectedConversationIds(value) {
+        this.SelectedConversationIds = value;
+    }
+    /** @deprecated Use {@link IsHeaderMenuOpen}. */
+    get isHeaderMenuOpen() {
+        return this.IsHeaderMenuOpen;
+    }
+    /** @deprecated Use {@link IsHeaderMenuOpen}. */
+    set isHeaderMenuOpen(value) {
+        this.IsHeaderMenuOpen = value;
+    }
+    /** @deprecated Use {@link IsRefreshing}. */
+    get isRefreshing() {
+        return this.IsRefreshing;
+    }
+    /** @deprecated Use {@link IsRefreshing}. */
+    set isRefreshing(value) {
+        this.IsRefreshing = value;
+    }
+    /** @deprecated Use {@link GroupBy}. */
+    get groupBy() {
+        return this.GroupBy;
+    }
+    /** @deprecated Use {@link GroupBy}. */
+    set groupBy(value) {
+        this.GroupBy = value;
+    }
+    /** @deprecated Use {@link PinnedConversations}. */
+    get pinnedConversations() {
+        return this.PinnedConversations;
+    }
+    /** @deprecated Use {@link PinnedConversations}. */
+    set pinnedConversations(value) {
+        this.PinnedConversations = value;
+    }
+    /** @deprecated Use {@link UnpinnedConversations}. */
+    get unpinnedConversations() {
+        return this.UnpinnedConversations;
+    }
+    /** @deprecated Use {@link UnpinnedConversations}. */
+    set unpinnedConversations(value) {
+        this.UnpinnedConversations = value;
+    }
+    /** @deprecated Use {@link UngroupedConversations}. */
+    get ungroupedConversations() {
+        return this.UngroupedConversations;
+    }
+    /** @deprecated Use {@link UngroupedConversations}. */
+    set ungroupedConversations(value) {
+        this.UngroupedConversations = value;
+    }
+    /** @deprecated Use {@link FolderTree}. */
+    get folderTree() {
+        return this.FolderTree;
+    }
+    /** @deprecated Use {@link FolderTree}. */
+    set folderTree(value) {
+        this.FolderTree = value;
+    }
+    /** @deprecated Use {@link FlatFolders}. */
+    get flatFolders() {
+        return this.FlatFolders;
+    }
+    /** @deprecated Use {@link FlatFolders}. */
+    set flatFolders(value) {
+        this.FlatFolders = value;
+    }
+    /** @deprecated Use {@link DraggedFolderId}. */
+    get draggedFolderId() {
+        return this.DraggedFolderId;
+    }
+    /** @deprecated Use {@link DraggedFolderId}. */
+    set draggedFolderId(value) {
+        this.DraggedFolderId = value;
+    }
+    /** @deprecated Use {@link DragOverTargetId}. */
+    get dragOverTargetId() {
+        return this.DragOverTargetId;
+    }
+    /** @deprecated Use {@link DragOverTargetId}. */
+    set dragOverTargetId(value) {
+        this.DragOverTargetId = value;
+    }
+    /** @deprecated Use {@link SearchQuery}. */
+    get searchQuery() {
+        return this.SearchQuery;
+    }
+    /** @deprecated Use {@link SearchQuery}. */
+    set searchQuery(value) {
+        this.SearchQuery = value;
+    }
+    /** @deprecated Use {@link IsSearching}. */
+    get isSearching() {
+        return this.IsSearching;
+    }
+    /** @deprecated Use {@link ToggleHeaderMenu}. */
+    toggleHeaderMenu(event) {
+        return this.ToggleHeaderMenu(event);
+    }
+    /** @deprecated Use {@link CloseHeaderMenu}. */
+    closeHeaderMenu() {
+        return this.CloseHeaderMenu();
+    }
+    /** @deprecated Use {@link OnToggleGroupByClick}. */
+    onToggleGroupByClick(event) {
+        return this.OnToggleGroupByClick(event);
+    }
+    /** @deprecated Use {@link OnRefreshConversationsClick}. */
+    onRefreshConversationsClick(event) {
+        return this.OnRefreshConversationsClick(event);
+    }
+    /** @deprecated Use {@link OnPinSidebarClick}. */
+    onPinSidebarClick(event) {
+        return this.OnPinSidebarClick(event);
+    }
+    /** @deprecated Use {@link OnUnpinSidebarClick}. */
+    onUnpinSidebarClick(event) {
+        return this.OnUnpinSidebarClick(event);
+    }
+    /** @deprecated Use {@link ToggleDirectMessages}. */
+    toggleDirectMessages() {
+        return this.ToggleDirectMessages();
+    }
+    /** @deprecated Use {@link TogglePinned}. */
+    togglePinned() {
+        return this.TogglePinned();
+    }
+    /** @deprecated Use {@link ToggleFolders}. */
+    toggleFolders() {
+        return this.ToggleFolders();
+    }
+    /** @deprecated Use {@link ToggleUngrouped}. */
+    toggleUngrouped() {
+        return this.ToggleUngrouped();
+    }
+    /** @deprecated Use {@link IsFolderExpanded}. */
+    isFolderExpanded(projectId) {
+        return this.IsFolderExpanded(projectId);
+    }
+    /** @deprecated Use {@link ToggleFolder}. */
+    toggleFolder(projectId) {
+        return this.ToggleFolder(projectId);
+    }
+    /** @deprecated Use {@link ToggleGroupBy}. */
+    toggleGroupBy() {
+        return this.ToggleGroupBy();
+    }
+    /** @deprecated Use {@link OnConversationDragStart}. */
+    onConversationDragStart(conversation, event) {
+        return this.OnConversationDragStart(conversation, event);
+    }
+    /** @deprecated Use {@link OnConversationDragEnd}. */
+    onConversationDragEnd() {
+        return this.OnConversationDragEnd();
+    }
+    /** @deprecated Use {@link OnFolderDragStart}. */
+    onFolderDragStart(node, event) {
+        return this.OnFolderDragStart(node, event);
+    }
+    /** @deprecated Use {@link OnFolderDragEnd}. */
+    onFolderDragEnd() {
+        return this.OnFolderDragEnd();
+    }
+    /** @deprecated Use {@link OnFolderDragOver}. */
+    onFolderDragOver(projectId, event) {
+        return this.OnFolderDragOver(projectId, event);
+    }
+    /** @deprecated Use {@link OnUngroupedDragOver}. */
+    onUngroupedDragOver(event) {
+        return this.OnUngroupedDragOver(event);
+    }
+    /** @deprecated Use {@link OnFoldersRootDragOver}. */
+    onFoldersRootDragOver(event) {
+        return this.OnFoldersRootDragOver(event);
+    }
+    /** @deprecated Use {@link OnDragLeave}. */
+    onDragLeave(targetId) {
+        return this.OnDragLeave(targetId);
+    }
+    /** @deprecated Use {@link OnFolderDrop}. */
+    onFolderDrop(project, event) {
+        return this.OnFolderDrop(project, event);
+    }
+    /** @deprecated Use {@link OnUngroupedDrop}. */
+    onUngroupedDrop(event) {
+        return this.OnUngroupedDrop(event);
+    }
+    /** @deprecated Use {@link OnFoldersRootDrop}. */
+    onFoldersRootDrop(event) {
+        return this.OnFoldersRootDrop(event);
+    }
+    /** @deprecated Use {@link OpenMoveSubmenu}. */
+    openMoveSubmenu(event) {
+        return this.OpenMoveSubmenu(event);
+    }
+    /** @deprecated Use {@link CloseMoveSubmenu}. */
+    closeMoveSubmenu(event) {
+        return this.CloseMoveSubmenu(event);
+    }
+    /** @deprecated Use {@link CreateFolder}. */
+    createFolder(parentId, event) {
+        return this.CreateFolder(parentId, event);
+    }
+    /** @deprecated Use {@link EditFolder}. */
+    editFolder(project, event) {
+        return this.EditFolder(project, event);
+    }
+    /** @deprecated Use {@link DeleteFolder}. */
+    deleteFolder(project, event) {
+        return this.DeleteFolder(project, event);
+    }
+    /** @deprecated Use {@link SelectConversation}. */
+    selectConversation(conversation) {
+        return this.SelectConversation(conversation);
+    }
+    /** @deprecated Use {@link CreateNewConversation}. */
+    createNewConversation() {
+        return this.CreateNewConversation();
+    }
+    /** @deprecated Use {@link RenameConversation}. */
+    renameConversation(conversation) {
+        return this.RenameConversation(conversation);
+    }
+    /** @deprecated Use {@link DeleteConversation}. */
+    deleteConversation(conversation) {
+        return this.DeleteConversation(conversation);
+    }
+    /** @deprecated Use {@link TogglePin}. */
+    togglePin(conversation, event) {
+        return this.TogglePin(conversation, event);
+    }
+    /** @deprecated Use {@link HasActiveTasks}. */
+    hasActiveTasks(conversationId) {
+        return this.HasActiveTasks(conversationId);
+    }
+    /** @deprecated Use {@link IsSharedWithMe}. */
+    isSharedWithMe(conversation) {
+        return this.IsSharedWithMe(conversation);
+    }
+    /** @deprecated Use {@link SharedWithMeTooltip}. */
+    sharedWithMeTooltip(conversation) {
+        return this.SharedWithMeTooltip(conversation);
+    }
+    /** @deprecated Use {@link ToggleSelectionMode}. */
+    toggleSelectionMode() {
+        return this.ToggleSelectionMode();
+    }
+    /** @deprecated Use {@link ToggleConversationSelection}. */
+    toggleConversationSelection(conversationId) {
+        return this.ToggleConversationSelection(conversationId);
+    }
+    /** @deprecated Use {@link SelectAll}. */
+    selectAll() {
+        return this.SelectAll();
+    }
+    /** @deprecated Use {@link DeselectAll}. */
+    deselectAll() {
+        return this.DeselectAll();
+    }
+    /** @deprecated Use {@link BulkDeleteConversations}. */
+    bulkDeleteConversations(ids) {
+        return this.BulkDeleteConversations(ids);
+    }
+    /** @deprecated Use {@link HandleConversationClick}. */
+    handleConversationClick(conversation, event) {
+        return this.HandleConversationClick(conversation, event);
     }
     static ɵfac = function ConversationListComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ConversationListComponent)(i0.ɵɵdirectiveInject(i1.DialogService), i0.ɵɵdirectiveInject(i2.NotificationService), i0.ɵɵdirectiveInject(i3.ActiveTasksService), i0.ɵɵdirectiveInject(i4.MJDialogService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ConversationListComponent, selectors: [["mj-conversation-list"]], hostBindings: function ConversationListComponent_HostBindings(rf, ctx) { if (rf & 1) {
-            i0.ɵɵlistener("click", function ConversationListComponent_click_HostBindingHandler() { return ctx.onDocumentClick(); }, i0.ɵɵresolveDocument);
-        } }, inputs: { environmentId: "environmentId", currentUser: "currentUser", selectedConversationId: "selectedConversationId", renamedConversationId: "renamedConversationId", isSidebarPinned: "isSidebarPinned", isMobileView: "isMobileView", showSearch: "showSearch", showNewConversationButton: "showNewConversationButton", showHeaderMenu: "showHeaderMenu", showSectionHeaders: "showSectionHeaders" }, outputs: { conversationSelected: "conversationSelected", conversationDeleted: "conversationDeleted", newConversationRequested: "newConversationRequested", pinSidebarRequested: "pinSidebarRequested", unpinSidebarRequested: "unpinSidebarRequested", refreshRequested: "refreshRequested" }, standalone: false, decls: 12, vars: 5, consts: [["folderNode", ""], ["conversationItem", ""], [1, "conversation-list"], [1, "list-header"], ["title", "New Conversation", 1, "btn-new-conversation"], [1, "list-content"], [1, "sidebar-section", "pinned-section"], [1, "sidebar-section"], [1, "selection-action-bar"], [1, "header-top"], ["type", "text", "placeholder", "Search conversations...", 1, "search-input", 3, "ngModel"], [1, "header-menu-container"], ["type", "text", "placeholder", "Search conversations...", 1, "search-input", 3, "ngModelChange", "ngModel"], ["title", "Options", 1, "btn-menu", 3, "click"], [1, "fas", "fa-ellipsis-v"], [1, "header-dropdown-menu"], [1, "dropdown-item", 3, "click", "disabled"], [1, "fas", "fa-sync-alt"], [1, "dropdown-item", 3, "click"], [1, "fas", "fa-check-square"], [1, "fas"], [1, "dropdown-item"], [1, "fas", "fa-table-columns"], ["title", "New Conversation", 1, "btn-new-conversation", 3, "click"], [1, "fas", "fa-plus"], [1, "section-header", 3, "expanded"], [1, "chat-list"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "section-header", 3, "click"], [1, "section-title"], [1, "fas", "fa-chevron-right"], [1, "fas", "fa-thumbtack", "section-icon"], [1, "sidebar-section", "folders-section"], [1, "section-header", 3, "click", "dragover", "dragleave", "drop"], ["title", "New Folder", 1, "section-action-btn", 3, "click"], [1, "fas", "fa-folder-plus"], [1, "folder-empty-hint"], [1, "sidebar-section", "ungrouped-section", 3, "dragover", "dragleave", "drop"], [1, "selection-info"], [1, "selection-count"], [1, "link-btn"], [1, "selection-actions"], [1, "btn-delete-bulk", 3, "click", "disabled"], [1, "fas", "fa-trash"], [1, "btn-cancel", 3, "click"], [1, "link-btn", 3, "click"], [1, "folder-row", 3, "dragstart", "dragend", "click", "dragover", "dragleave", "drop", "draggable", "title"], [1, "fas", "fa-chevron-right", "folder-chevron"], [1, "folder-name"], [1, "folder-count"], [1, "folder-actions", 3, "click"], ["title", "New Subfolder", 1, "folder-action-btn", 3, "click"], ["title", "Edit Folder", 1, "folder-action-btn", 3, "click"], [1, "fas", "fa-pen"], ["title", "Delete Folder", 1, "folder-action-btn", "danger", 3, "click"], [1, "folder-children"], [1, "folder-empty-hint", 3, "paddingLeft"], [1, "conversation-item", 3, "dragstart", "dragend", "click", "draggable"], [1, "conversation-checkbox"], [1, "conversation-icon-wrapper"], [1, "conversation-icon", "has-tasks"], [1, "badge-overlay"], [3, "conversationId"], [1, "conversation-info", 3, "title"], [1, "conversation-name"], [1, "fas", "fa-share-nodes", "shared-indicator", 3, "title"], [1, "conversation-preview"], [1, "conversation-actions"], ["type", "checkbox", 3, "click", "checked"], [1, "fas", "fa-spinner", "fa-pulse"], ["title", "More options", 1, "menu-btn", 3, "click"], [1, "fas", "fa-ellipsis"], [1, "context-menu"], [1, "context-menu", 3, "click"], [1, "menu-item", "back", 3, "click"], [1, "fas", "fa-chevron-left"], [1, "menu-divider"], [1, "move-folder-list"], [1, "menu-item", 3, "click"], [1, "fas", "fa-inbox"], [1, "menu-item", 3, "current", "paddingLeft"], [1, "fas", "fa-thumbtack"], [1, "fas", "fa-folder-tree"], [1, "fas", "fa-chevron-right", "submenu-arrow"], [1, "fas", "fa-edit"], [1, "menu-item", "danger", 3, "click"]], template: function ConversationListComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "div", 2);
-            i0.ɵɵconditionalCreate(1, ConversationListComponent_Conditional_1_Template, 4, 2, "div", 3);
-            i0.ɵɵconditionalCreate(2, ConversationListComponent_Conditional_2_Template, 4, 0, "button", 4);
-            i0.ɵɵelementStart(3, "div", 5);
-            i0.ɵɵconditionalCreate(4, ConversationListComponent_Conditional_4_Template, 5, 3, "div", 6);
-            i0.ɵɵconditionalCreate(5, ConversationListComponent_Conditional_5_Template, 21, 14)(6, ConversationListComponent_Conditional_6_Template, 5, 3, "div", 7);
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ConversationListComponent, selectors: [["mj-conversation-list"]], viewQuery: function ConversationListComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(_c0, 5)(_c1, 5);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.searchInput = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.contextMenuEl = _t.first);
+        } }, hostBindings: function ConversationListComponent_HostBindings(rf, ctx) { if (rf & 1) {
+            i0.ɵɵlistener("click", function ConversationListComponent_click_HostBindingHandler() { return ctx.onDocumentClick(); }, i0.ɵɵresolveDocument)("keydown.escape", function ConversationListComponent_keydown_escape_HostBindingHandler() { return ctx.onDocumentEscape(); }, i0.ɵɵresolveDocument);
+        } }, inputs: { EnvironmentId: "EnvironmentId", CurrentUser: "CurrentUser", SelectedConversationId: "SelectedConversationId", RenamedConversationId: "RenamedConversationId", IsSidebarPinned: "IsSidebarPinned", IsMobileView: "IsMobileView", showSearch: "showSearch", ShowNewConversationButton: "ShowNewConversationButton", ShowHeaderMenu: "ShowHeaderMenu", ShowSectionHeaders: "ShowSectionHeaders", environmentId: "environmentId", currentUser: "currentUser", selectedConversationId: "selectedConversationId", renamedConversationId: "renamedConversationId", isSidebarPinned: "isSidebarPinned", isMobileView: "isMobileView", showNewConversationButton: "showNewConversationButton", showHeaderMenu: "showHeaderMenu", showSectionHeaders: "showSectionHeaders" }, outputs: { ConversationSelected: "ConversationSelected", conversationSelected: "conversationSelected", ConversationDeleted: "ConversationDeleted", conversationDeleted: "conversationDeleted", NewConversationRequested: "NewConversationRequested", newConversationRequested: "newConversationRequested", PinSidebarRequested: "PinSidebarRequested", pinSidebarRequested: "pinSidebarRequested", UnpinSidebarRequested: "UnpinSidebarRequested", unpinSidebarRequested: "unpinSidebarRequested", RefreshRequested: "RefreshRequested", refreshRequested: "refreshRequested", SearchEscalated: "SearchEscalated" }, standalone: false, decls: 14, vars: 12, consts: [["folderNode", ""], ["conversationItem", ""], ["searchInput", ""], ["contextMenuEl", ""], [1, "conversation-list"], [1, "list-header"], ["title", "New Conversation", 1, "btn-new-conversation"], [1, "list-content", 3, "click", "contextmenu"], [1, "sidebar-section", "pinned-section"], [1, "sidebar-section"], [1, "search-escalate"], ["ResourceLabel", "conversation", 3, "Result", "Visible", "Contexts", "Adapter", "Notice"], [1, "list-context-menu", 3, "left", "top"], [1, "header-top"], ["role", "toolbar", "aria-label", "Selected conversations", 1, "selection-bar"], [1, "sort-row"], ["title", "Clear selection", "aria-label", "Clear selection", 1, "selection-bar-btn", 3, "click"], [1, "fas", "fa-xmark"], [1, "selection-count"], [1, "selection-bar-btn", 3, "click", "disabled", "title"], [1, "fas", "fa-thumbtack"], ["aria-label", "Move to folder", 1, "selection-bar-btn", 3, "click", "disabled", "title"], [1, "fas", "fa-folder-tree"], ["aria-label", "Share", 1, "selection-bar-btn", 3, "click", "disabled", "title"], [1, "fas", "fa-user-plus"], ["title", "Delete", "aria-label", "Delete", 1, "selection-bar-btn", "danger", 3, "click"], [1, "fas", "fa-trash"], [1, "search-box"], [1, "header-menu-container"], ["type", "text", "placeholder", "Search conversations...", 1, "search-input", 3, "ngModelChange", "keydown", "ngModel"], ["title", "Clear search", 1, "search-clear"], ["title", "Clear search", 1, "search-clear", 3, "click"], ["title", "Options", 1, "btn-menu", 3, "click"], [1, "fas", "fa-ellipsis-v"], [1, "header-dropdown-menu"], [1, "dropdown-item", 3, "click", "disabled"], [1, "fas", "fa-sync-alt"], [1, "dropdown-item", 3, "click"], [1, "fas"], [1, "dropdown-item"], [1, "fas", "fa-table-columns"], [1, "sort-btn", 3, "click", "title"], [1, "fas", 3, "ngClass"], ["title", "New Conversation", 1, "btn-new-conversation", 3, "click"], [1, "fas", "fa-plus"], [1, "section-header", 3, "expanded"], [1, "chat-list"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "section-header", 3, "click"], [1, "section-title"], [1, "fas", "fa-chevron-right"], [1, "fas", "fa-thumbtack", "section-icon"], [1, "sidebar-section", "folders-section"], [1, "section-header", 3, "click", "dragover", "dragleave", "drop"], ["title", "New Folder", 1, "section-action-btn", 3, "click"], [1, "fas", "fa-folder-plus"], [1, "folder-empty-hint"], [1, "sidebar-section", "ungrouped-section", 3, "dragover", "dragleave", "drop"], [1, "search-escalate", 3, "click"], [1, "fa-solid", "fa-magnifying-glass"], [1, "search-escalate-label"], [1, "fa-solid", "fa-arrow-right", "search-escalate-go"], [1, "folder-row", 3, "dragstart", "dragend", "click", "dragover", "dragleave", "drop", "contextmenu", "draggable", "title"], [1, "fas", "fa-chevron-right", "folder-chevron"], [1, "folder-name"], ["role", "img", "title", "Shared \u2014 everyone can see this folder and its name, but not the conversations in it", "aria-label", "Shared folder", 1, "folder-shared"], [1, "folder-spacer"], [1, "folder-count"], [1, "folder-children"], ["aria-hidden", "true", 1, "fas", "fa-users"], [1, "folder-empty-hint", 3, "paddingLeft"], [1, "conversation-item", 3, "dragstart", "dragend", "dragover", "dragleave", "drop", "pointerdown", "pointermove", "pointerup", "pointercancel", "click", "contextmenu", "draggable"], ["role", "checkbox", 1, "row-check", 3, "click"], [1, "fas", "fa-check"], [1, "conversation-icon-wrapper"], [1, "conversation-icon", "has-tasks"], [1, "badge-overlay"], [3, "conversationId"], [1, "conversation-info", 3, "title"], [1, "conversation-name"], [1, "fas", "fa-share-nodes", "shared-indicator", 3, "title"], [1, "conversation-preview"], [1, "conversation-actions"], ["title", "More options", 1, "menu-btn", 3, "click"], [1, "fas", "fa-ellipsis"], [1, "fas", "fa-spinner", "fa-pulse"], [1, "list-context-menu", 3, "click", "contextmenu"], [1, "menu-item", "back", 3, "click"], [1, "fas", "fa-chevron-left"], [1, "menu-divider"], [1, "move-folder-list"], [1, "menu-item", 3, "click"], [1, "fas", "fa-inbox"], [1, "menu-item", 3, "current", "paddingLeft"], [1, "menu-item", 3, "disabled"], [1, "menu-item", 3, "click", "disabled"], [1, "fas", "fa-chevron-right", "submenu-arrow"], [1, "menu-item"], [1, "menu-item", "danger", 3, "click"], [1, "context-menu-header"], [1, "fas", "fa-thumbtack", "fa-rotate-90"], [1, "fas", "fa-edit"], [1, "fas", "fa-pen"], [1, "fas", "fa-check-double"]], template: function ConversationListComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 4);
+            i0.ɵɵconditionalCreate(1, ConversationListComponent_Conditional_1_Template, 5, 2, "div", 5);
+            i0.ɵɵconditionalCreate(2, ConversationListComponent_Conditional_2_Template, 4, 0, "button", 6);
+            i0.ɵɵelementStart(3, "div", 7);
+            i0.ɵɵlistener("click", function ConversationListComponent_Template_div_click_3_listener($event) { return ctx.OnListBackgroundClick($event); })("contextmenu", function ConversationListComponent_Template_div_contextmenu_3_listener($event) { return ctx.OnBackgroundContextMenu($event); });
+            i0.ɵɵconditionalCreate(4, ConversationListComponent_Conditional_4_Template, 5, 3, "div", 8);
+            i0.ɵɵconditionalCreate(5, ConversationListComponent_Conditional_5_Template, 21, 14)(6, ConversationListComponent_Conditional_6_Template, 5, 3, "div", 9);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(7, ConversationListComponent_Conditional_7_Template, 5, 1, "button", 10);
             i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(7, ConversationListComponent_Conditional_7_Template, 12, 4, "div", 8);
+            i0.ɵɵtemplate(8, ConversationListComponent_ng_template_8_Template, 10, 19, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(10, ConversationListComponent_ng_template_10_Template, 16, 23, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+            i0.ɵɵelementStart(12, "mj-resource-share-dialog", 11);
+            i0.ɵɵlistener("Result", function ConversationListComponent_Template_mj_resource_share_dialog_Result_12_listener($event) { return ctx.OnShareDialogResult($event); });
             i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(8, ConversationListComponent_ng_template_8_Template, 15, 18, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(10, ConversationListComponent_ng_template_10_Template, 13, 17, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+            i0.ɵɵconditionalCreate(13, ConversationListComponent_Conditional_13_Template, 5, 5, "div", 12);
         } if (rf & 2) {
+            i0.ɵɵclassProp("is-selecting", ctx.IsSelectionMode);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.showSearch || ctx.showHeaderMenu && !ctx.isSelectionMode ? 1 : -1);
+            i0.ɵɵconditional(ctx.showSearch || ctx.ShowHeaderMenu || ctx.IsSelectionMode ? 1 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.showNewConversationButton ? 2 : -1);
+            i0.ɵɵconditional(ctx.ShowNewConversationButton ? 2 : -1);
             i0.ɵɵadvance(2);
-            i0.ɵɵconditional(ctx.pinnedConversations.length > 0 ? 4 : -1);
+            i0.ɵɵconditional(ctx.PinnedConversations.length > 0 ? 4 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.showSectionHeaders && ctx.groupBy === "project" ? 5 : 6);
+            i0.ɵɵconditional(ctx.ShowSectionHeaders && ctx.GroupBy === "project" ? 5 : 6);
             i0.ɵɵadvance(2);
-            i0.ɵɵconditional(ctx.isSelectionMode ? 7 : -1);
-        } }, dependencies: [i5.NgTemplateOutlet, i6.DefaultValueAccessor, i6.NgControlStatus, i6.NgModel, i7.NotificationBadgeComponent], styles: ["[_nghost-%COMP%] {\n      display: block;\n      height: 100%;\n      \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n      --conv-list-bg: var(--mj-chat-list-bg, var(--mj-brand-secondary));\n      --conv-list-ink: var(--mj-chat-list-ink, var(--mj-brand-on-secondary));\n      --conv-list-active-bg: var(--mj-chat-list-active-bg, var(--mj-brand-primary));\n      --conv-list-active-ink: var(--mj-chat-list-active-ink, var(--mj-brand-on-secondary));\n      --conv-list-active-hover-bg: var(--mj-chat-list-active-hover-bg, var(--mj-brand-primary-hover));\n      --conv-list-accent: var(--mj-chat-list-accent, var(--mj-brand-primary));\n      --conv-list-accent-ink: var(--mj-chat-list-accent-ink, var(--mj-text-inverse));\n      --conv-list-accent-hover: var(--mj-chat-list-accent-hover, var(--mj-brand-primary-hover));\n      --conv-list-hover-bg: var(--mj-chat-list-hover-bg, color-mix(in srgb, var(--conv-list-ink) 8%, transparent));\n    }\n    .conversation-list[_ngcontent-%COMP%] { display: flex; flex-direction: column; height: 100%; background: var(--conv-list-bg); }\n    .list-header[_ngcontent-%COMP%] { padding: 8px; border-bottom: 1px solid color-mix(in srgb, var(--conv-list-ink) 10%, transparent); }\n    .search-input[_ngcontent-%COMP%] {\n      width: 100%;\n      padding: 8px 12px;\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      transition: all 0.2s;\n    }\n    .search-input[_ngcontent-%COMP%]::placeholder { color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent); }\n    .search-input[_ngcontent-%COMP%]:focus { outline: none; background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent); border-color: var(--conv-list-accent); }\n    .btn-new-conversation[_ngcontent-%COMP%] {\n      width: calc(100% - 16px);\n      margin: 8px;\n      padding: 10px;\n      background: var(--conv-list-accent);\n      color: var(--conv-list-accent-ink);\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n      font-size: 14px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      transition: background 0.2s;\n      flex-shrink: 0;\n    }\n    .btn-new-conversation[_ngcontent-%COMP%]:hover { background: var(--conv-list-accent-hover); }\n    .btn-new-conversation[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 14px; }\n    .list-content[_ngcontent-%COMP%] { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 0; }\n\n    \n    .sidebar-section[_ngcontent-%COMP%] { margin-bottom: 20px; }\n    .pinned-section[_ngcontent-%COMP%]   .section-title[_ngcontent-%COMP%]   .section-icon[_ngcontent-%COMP%] {\n      color: var(--mj-status-warning);\n      font-size: 11px;\n      margin-left: 2px;\n    }\n    .section-header[_ngcontent-%COMP%] {\n      padding: 4px 16px;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      cursor: pointer;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      font-weight: 500;\n      transition: background 0.2s;\n      user-select: none;\n    }\n    .section-header[_ngcontent-%COMP%]:hover { background: color-mix(in srgb, var(--conv-list-ink) 8%, transparent); }\n    .section-title[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n    }\n    .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:not(.section-icon) {\n      transition: transform 0.2s;\n    }\n    .section-header.expanded[_ngcontent-%COMP%]   .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:not(.section-icon) { transform: rotate(90deg); }\n    .chat-list[_ngcontent-%COMP%] {\n      padding: 4px 0;\n      display: none;\n    }\n    .chat-list.expanded[_ngcontent-%COMP%] { display: block; }\n\n    .conversation-item[_ngcontent-%COMP%] {\n      padding: 6px 5px 6px 16px;\n      cursor: pointer;\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      transition: all 0.2s;\n      position: relative;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 14px;\n      min-height: 45px;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover { background: var(--conv-list-hover-bg); color: var(--conv-list-ink); }\n    .conversation-item[_ngcontent-%COMP%]:hover   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; }\n    .conversation-item.active[_ngcontent-%COMP%] { background: var(--conv-list-active-bg); color: var(--conv-list-active-ink); }\n    .conversation-icon-wrapper[_ngcontent-%COMP%] { position: relative; flex-shrink: 0; }\n    .conversation-icon[_ngcontent-%COMP%] { font-size: 12px; width: 16px; text-align: center; }\n    .conversation-icon.has-tasks[_ngcontent-%COMP%] { color: var(--mj-status-warning); }\n    .badge-overlay[_ngcontent-%COMP%] { position: absolute; top: -4px; right: -4px; }\n    .conversation-info[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n    .conversation-name[_ngcontent-%COMP%] { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 6px; }\n    .shared-indicator[_ngcontent-%COMP%] { font-size: 10px; color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent); flex-shrink: 0; }\n    .conversation-item.active[_ngcontent-%COMP%]   .shared-indicator[_ngcontent-%COMP%] { color: color-mix(in srgb, var(--conv-list-active-ink) 85%, transparent); }\n    .conversation-preview[_ngcontent-%COMP%] { font-size: 12px; color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-item.active[_ngcontent-%COMP%]   .conversation-preview[_ngcontent-%COMP%] { color: color-mix(in srgb, var(--conv-list-active-ink) 80%, transparent); }\n    .conversation-meta[_ngcontent-%COMP%] { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }\n\n    \n    .project-badge[_ngcontent-%COMP%] {\n      display: inline-block;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 10px;\n      font-weight: 600;\n      margin-left: auto;\n      background-color: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      white-space: nowrap;\n      max-width: 80px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover   .project-badge[_ngcontent-%COMP%] {\n      background-color: color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      color: color-mix(in srgb, var(--conv-list-ink) 80%, transparent);\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .project-badge[_ngcontent-%COMP%] {\n      background-color: color-mix(in srgb, var(--conv-list-active-ink) 20%, transparent);\n      color: var(--conv-list-active-ink);\n    }\n\n    .conversation-actions[_ngcontent-%COMP%] {\n      position: absolute;\n      right: 5px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      align-items: center;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 10;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    .conversation-item.active[_ngcontent-%COMP%]   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    .conversation-actions[_ngcontent-%COMP%]    > *[_ngcontent-%COMP%] { pointer-events: auto; }\n    .pinned-icon[_ngcontent-%COMP%] { color: var(--mj-brand-accent); font-size: 12px; }\n\n    \n    .task-indicator[_ngcontent-%COMP%] {\n      color: var(--mj-status-warning);\n      font-size: 12px;\n      margin-right: 8px;\n      flex-shrink: 0;\n      animation: _ngcontent-%COMP%_pulse-glow 2s ease-in-out infinite;\n    }\n    @keyframes _ngcontent-%COMP%_pulse-glow {\n      0%, 100% {\n        opacity: 1;\n        filter: drop-shadow(0 0 2px var(--mj-status-warning));\n      }\n      50% {\n        opacity: 0.6;\n        filter: drop-shadow(0 0 4px var(--mj-status-warning));\n      }\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .task-indicator[_ngcontent-%COMP%] {\n      color: var(--mj-status-warning);\n    }\n\n    .menu-btn[_ngcontent-%COMP%] {\n      width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      background: var(--conv-list-bg) !important;\n      border: none;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .menu-btn[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent) !important;\n      color: var(--conv-list-ink);\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .menu-btn[_ngcontent-%COMP%] {\n      background: var(--conv-list-active-hover-bg) !important;\n      color: var(--conv-list-active-ink);\n    }\n    .menu-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 14px; }\n\n    .context-menu[_ngcontent-%COMP%] {\n      position: absolute;\n      top: 100%;\n      right: 0;\n      margin-top: 4px;\n      min-width: 160px;\n      background: var(--conv-list-bg);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-lg);\n      z-index: 1001;\n      overflow: hidden;\n      pointer-events: auto;\n    }\n\n    .menu-item[_ngcontent-%COMP%] {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: color-mix(in srgb, var(--conv-list-ink) 85%, transparent);\n      font-size: 14px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .menu-item[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .menu-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      width: 16px;\n      font-size: 13px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n    }\n\n    .menu-item[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: var(--conv-list-ink);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, transparent);\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .menu-divider[_ngcontent-%COMP%] {\n      height: 1px;\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      margin: 4px 0;\n    }\n\n    \n    .conversation-item.renamed[_ngcontent-%COMP%] {\n      animation: _ngcontent-%COMP%_renameHighlight 1500ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    \n\n\n    @keyframes _ngcontent-%COMP%_renameHighlight {\n      0% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-brand-primary) 40%, transparent),\n          color-mix(in srgb, var(--mj-brand-accent) 40%, transparent));\n        transform: scale(1.03);\n        box-shadow: 0 0 20px color-mix(in srgb, var(--mj-brand-primary) 50%, transparent);\n      }\n      25% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-brand-primary) 35%, transparent),\n          color-mix(in srgb, var(--mj-brand-accent) 35%, transparent));\n        box-shadow: 0 0 15px color-mix(in srgb, var(--mj-brand-primary) 40%, transparent);\n      }\n      50% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-status-success) 30%, transparent),\n          color-mix(in srgb, var(--mj-brand-primary) 30%, transparent));\n        transform: scale(1.02);\n        box-shadow: 0 0 10px color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n      }\n      75% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-status-success) 20%, transparent),\n          color-mix(in srgb, var(--mj-brand-primary) 20%, transparent));\n        box-shadow: 0 0 5px color-mix(in srgb, var(--mj-status-success) 20%, transparent);\n      }\n      100% {\n        background: transparent;\n        transform: scale(1);\n        box-shadow: none;\n      }\n    }\n\n    \n    .header-top[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n    }\n\n    \n    .header-menu-container[_ngcontent-%COMP%] {\n      position: relative;\n      flex-shrink: 0;\n    }\n\n    .btn-menu[_ngcontent-%COMP%] {\n      width: 32px;\n      height: 32px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .btn-menu[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n      border-color: color-mix(in srgb, var(--conv-list-ink) 30%, transparent);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%] {\n      position: absolute;\n      top: calc(100% + 4px);\n      right: 0;\n      min-width: 200px;\n      background: var(--conv-list-bg);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-lg);\n      z-index: 1001;\n      overflow: hidden;\n      padding: 4px 0;\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%] {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: color-mix(in srgb, var(--conv-list-ink) 85%, transparent);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      width: 16px;\n      font-size: 13px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: var(--conv-list-ink);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]   .shortcut[_ngcontent-%COMP%] {\n      margin-left: auto;\n      font-size: 11px;\n      color: color-mix(in srgb, var(--conv-list-ink) 40%, transparent);\n      font-family: system-ui, -apple-system, sans-serif;\n    }\n\n    .btn-select[_ngcontent-%COMP%] {\n      padding: 8px 12px;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 13px;\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n      white-space: nowrap;\n      flex-shrink: 0;\n    }\n\n    .btn-select[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n      border-color: color-mix(in srgb, var(--conv-list-ink) 30%, transparent);\n    }\n\n    .conversation-checkbox[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      margin-right: 8px;\n      flex-shrink: 0;\n    }\n\n    .conversation-checkbox[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n      width: 18px;\n      height: 18px;\n      cursor: pointer;\n      accent-color: var(--conv-list-accent);\n    }\n\n    .selection-action-bar[_ngcontent-%COMP%] {\n      position: sticky;\n      bottom: 0;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 12px 16px;\n      background: var(--conv-list-bg);\n      border-top: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      gap: 12px;\n      flex-wrap: wrap;\n      flex-shrink: 0;\n    }\n\n    .selection-info[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      color: color-mix(in srgb, var(--conv-list-ink) 90%, transparent);\n      font-size: 14px;\n      font-weight: 500;\n      flex: 1 1 auto;\n      min-width: 150px;\n    }\n\n    .selection-count[_ngcontent-%COMP%] {\n      color: var(--conv-list-ink);\n    }\n\n    .link-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      color: var(--mj-brand-accent);\n      cursor: pointer;\n      font-size: 13px;\n      text-decoration: underline;\n      padding: 0;\n      transition: color 0.2s;\n    }\n\n    .link-btn[_ngcontent-%COMP%]:hover {\n      color: var(--conv-list-ink);\n    }\n\n    .selection-actions[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n      flex: 0 0 auto;\n    }\n\n    .btn-cancel[_ngcontent-%COMP%] {\n      padding: 8px 16px;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 500;\n      transition: all 0.2s;\n    }\n\n    .btn-cancel[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 8px 16px;\n      background: var(--mj-status-error);\n      border: none;\n      border-radius: 6px;\n      \n\n\n      color: var(--mj-brand-on-secondary);\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 600;\n      transition: all 0.2s;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: color-mix(in srgb, var(--mj-status-error) 80%, black);\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%]:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 12px;\n    }\n\n    \n    .section-action-btn[_ngcontent-%COMP%] {\n      width: 24px;\n      height: 24px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .section-action-btn[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      color: var(--conv-list-ink);\n    }\n    .section-action-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 12px; }\n\n    .folder-row[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 5px 8px 5px 12px;\n      cursor: pointer;\n      color: color-mix(in srgb, var(--conv-list-ink) 80%, transparent);\n      font-size: 13px;\n      transition: background 0.15s;\n      user-select: none;\n      position: relative;\n    }\n    .folder-row[_ngcontent-%COMP%]:hover { background: color-mix(in srgb, var(--conv-list-ink) 8%, transparent); }\n    .folder-row.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--conv-list-accent) 25%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n    }\n    .folder-row.dragging[_ngcontent-%COMP%] { opacity: 0.4; }\n    .section-header.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n      border-radius: 6px;\n    }\n    .folder-chevron[_ngcontent-%COMP%] {\n      font-size: 9px;\n      width: 10px;\n      flex-shrink: 0;\n      transition: transform 0.2s;\n      color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent);\n    }\n    .folder-chevron.expanded[_ngcontent-%COMP%] { transform: rotate(90deg); }\n    .folder-icon[_ngcontent-%COMP%] { font-size: 12px; width: 16px; text-align: center; flex-shrink: 0; }\n    .folder-name[_ngcontent-%COMP%] {\n      flex: 1;\n      min-width: 0;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      font-weight: 600;\n    }\n    .folder-count[_ngcontent-%COMP%] {\n      font-size: 11px;\n      font-weight: 600;\n      color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent);\n      flex-shrink: 0;\n      margin-left: auto;\n      padding-left: 6px;\n      text-align: right;\n    }\n    .folder-actions[_ngcontent-%COMP%] {\n      position: absolute;\n      right: 6px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      gap: 2px;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 5;\n    }\n    .folder-row[_ngcontent-%COMP%]:hover   .folder-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    .folder-row[_ngcontent-%COMP%]:hover   .folder-count[_ngcontent-%COMP%] { opacity: 0; }\n    .folder-action-btn[_ngcontent-%COMP%] {\n      width: 22px;\n      height: 22px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n    .folder-action-btn[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 18%, transparent);\n      color: var(--conv-list-ink);\n    }\n    .folder-action-btn.danger[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 18%, transparent);\n      color: var(--mj-status-error);\n    }\n    .folder-action-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 11px; }\n    .folder-children[_ngcontent-%COMP%] { display: block; }\n    .folder-empty-hint[_ngcontent-%COMP%] {\n      padding: 6px 16px;\n      font-size: 11px;\n      font-style: italic;\n      color: color-mix(in srgb, var(--conv-list-ink) 45%, transparent);\n    }\n    .ungrouped-section.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--conv-list-accent) 12%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n      border-radius: 6px;\n    }\n\n    \n    .conversation-item[_ngcontent-%COMP%] { user-select: none; }\n    .conversation-item.dragging[_ngcontent-%COMP%] { opacity: 0.4; }\n\n    \n    .menu-item.back[_ngcontent-%COMP%] { font-weight: 600; }\n    .menu-item[_ngcontent-%COMP%]   .submenu-arrow[_ngcontent-%COMP%] { margin-left: auto; font-size: 10px; }\n    .menu-item.current[_ngcontent-%COMP%] { background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent); }\n    .move-folder-list[_ngcontent-%COMP%] { max-height: 240px; overflow-y: auto; }"] });
+            i0.ɵɵconditional(ctx.IsSearching && !ctx.IsSelectionMode ? 7 : -1);
+            i0.ɵɵadvance(5);
+            i0.ɵɵproperty("Visible", ctx.IsShareDialogOpen)("Contexts", ctx.ShareContexts)("Adapter", ctx.ShareAdapter)("Notice", ctx.ShareNotice);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.ContextMenu ? 13 : -1);
+        } }, dependencies: [i5.NgClass, i5.NgTemplateOutlet, i6.DefaultValueAccessor, i6.NgControlStatus, i6.NgModel, i7.GenericShareDialogComponent, i8.NotificationBadgeComponent], styles: ["[_nghost-%COMP%] {\n      display: block;\n      height: 100%;\n      \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n      --conv-list-bg: var(--mj-chat-list-bg, var(--mj-brand-secondary));\n      --conv-list-ink: var(--mj-chat-list-ink, var(--mj-brand-on-secondary));\n      --conv-list-active-bg: var(--mj-chat-list-active-bg, var(--mj-brand-primary));\n      --conv-list-active-ink: var(--mj-chat-list-active-ink, var(--mj-brand-on-secondary));\n      --conv-list-active-hover-bg: var(--mj-chat-list-active-hover-bg, var(--mj-brand-primary-hover));\n      --conv-list-accent: var(--mj-chat-list-accent, var(--mj-brand-primary));\n      --conv-list-accent-ink: var(--mj-chat-list-accent-ink, var(--mj-text-inverse));\n      --conv-list-accent-hover: var(--mj-chat-list-accent-hover, var(--mj-brand-primary-hover));\n      --conv-list-hover-bg: var(--mj-chat-list-hover-bg, color-mix(in srgb, var(--conv-list-ink) 8%, transparent));\n    }\n    .conversation-list[_ngcontent-%COMP%] { display: flex; flex-direction: column; height: 100%; background: var(--conv-list-bg); }\n    .list-header[_ngcontent-%COMP%] { padding: 8px; border-bottom: 1px solid color-mix(in srgb, var(--conv-list-ink) 10%, transparent); }\n    .search-box[_ngcontent-%COMP%] { position: relative; flex: 1; min-width: 0; display: flex; }\n    .search-clear[_ngcontent-%COMP%] {\n      position: absolute;\n      right: 4px;\n      top: 50%;\n      transform: translateY(-50%);\n      width: 22px;\n      height: 22px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: 0;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent);\n      font-size: 12px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .sort-row[_ngcontent-%COMP%] { display: flex; gap: 6px; margin-top: 8px; }\n    .sort-btn[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 4px 10px;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 12px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .sort-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 11px; }\n    .sort-btn[_ngcontent-%COMP%]:hover { background: var(--conv-list-hover-bg); color: var(--conv-list-ink); }\n    .sort-btn.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent);\n      border-color: var(--conv-list-accent);\n      color: var(--conv-list-ink);\n      font-weight: 600;\n    }\n    .search-clear[_ngcontent-%COMP%]:hover { background: color-mix(in srgb, var(--conv-list-ink) 12%, transparent); color: var(--conv-list-ink); }\n    .search-input[_ngcontent-%COMP%] {\n      width: 100%;\n      padding: 8px 28px 8px 12px;\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      transition: all 0.2s;\n    }\n    .search-input[_ngcontent-%COMP%]::placeholder { color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent); }\n    .search-input[_ngcontent-%COMP%]:focus { outline: none; background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent); border-color: var(--conv-list-accent); }\n    .btn-new-conversation[_ngcontent-%COMP%] {\n      width: calc(100% - 16px);\n      margin: 8px;\n      padding: 10px;\n      background: var(--conv-list-accent);\n      color: var(--conv-list-accent-ink);\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n      font-size: 14px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      transition: background 0.2s;\n      flex-shrink: 0;\n    }\n    .btn-new-conversation[_ngcontent-%COMP%]:hover { background: var(--conv-list-accent-hover); }\n    .btn-new-conversation[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 14px; }\n    .list-content[_ngcontent-%COMP%] { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 0; }\n\n    \n    .sidebar-section[_ngcontent-%COMP%] { margin-bottom: 20px; }\n\n    \n\n    .search-escalate[_ngcontent-%COMP%] {\n      flex-shrink: 0;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      width: 100%;\n      padding: 10px 12px;\n      border: none;\n      border-top: 1px solid color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      background: transparent;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .search-escalate[_ngcontent-%COMP%]:hover {\n      background: var(--conv-list-hover-bg);\n      color: var(--conv-list-ink);\n    }\n\n    \n    .search-escalate-label[_ngcontent-%COMP%] {\n      flex: 1;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    .search-escalate-go[_ngcontent-%COMP%] { opacity: 0.6; }\n    .pinned-section[_ngcontent-%COMP%]   .section-title[_ngcontent-%COMP%]   .section-icon[_ngcontent-%COMP%] {\n      color: var(--mj-status-warning);\n      font-size: 11px;\n      margin-left: 2px;\n    }\n    .section-header[_ngcontent-%COMP%] {\n      padding: 4px 16px;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      cursor: pointer;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      font-weight: 500;\n      transition: background 0.2s;\n      user-select: none;\n    }\n    .section-header[_ngcontent-%COMP%]:hover { background: color-mix(in srgb, var(--conv-list-ink) 8%, transparent); }\n    .section-title[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n    }\n    .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:not(.section-icon) {\n      transition: transform 0.2s;\n    }\n    .section-header.expanded[_ngcontent-%COMP%]   .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:not(.section-icon) { transform: rotate(90deg); }\n    .chat-list[_ngcontent-%COMP%] {\n      padding: 4px 0;\n      display: none;\n    }\n    .chat-list.expanded[_ngcontent-%COMP%] { display: block; }\n\n    .conversation-item[_ngcontent-%COMP%] {\n      padding: 6px 5px 6px 16px;\n      cursor: pointer;\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      transition: all 0.2s;\n      position: relative;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 14px;\n      min-height: 45px;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover { background: var(--conv-list-hover-bg); color: var(--conv-list-ink); }\n    .conversation-item[_ngcontent-%COMP%]:hover   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; }\n    .conversation-item.active[_ngcontent-%COMP%] { background: var(--conv-list-active-bg); color: var(--conv-list-active-ink); }\n    \n\n\n    .conversation-item.selected[_ngcontent-%COMP%] { background: color-mix(in srgb, var(--conv-list-accent) 16%, transparent); }\n    .conversation-item.selected[_ngcontent-%COMP%]:hover { background: color-mix(in srgb, var(--conv-list-accent) 24%, transparent); }\n    .conversation-item.active.selected[_ngcontent-%COMP%] { background: var(--conv-list-active-bg); }\n    \n\n\n    .row-check[_ngcontent-%COMP%] {\n      position: absolute;\n      top: 50%;\n      transform: translateY(-50%);\n      width: 14px;\n      height: 14px;\n      padding: 0;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: 1.5px solid color-mix(in srgb, var(--conv-list-ink) 45%, transparent);\n      border-radius: 3px;\n      color: transparent;\n      cursor: pointer;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.15s;\n      z-index: 2;\n    }\n    .row-check[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 8px; }\n    .conversation-list.is-selecting[_ngcontent-%COMP%]   .row-check[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    @media (hover: hover) {\n      .conversation-item[_ngcontent-%COMP%]:hover   .row-check[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    }\n    .row-check.checked[_ngcontent-%COMP%] {\n      background: var(--conv-list-accent);\n      border-color: var(--conv-list-accent);\n      color: var(--conv-list-accent-ink);\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .row-check[_ngcontent-%COMP%]:not(.checked) {\n      border-color: color-mix(in srgb, var(--conv-list-active-ink) 70%, transparent);\n    }\n    .conversation-icon-wrapper[_ngcontent-%COMP%] { position: relative; flex-shrink: 0; }\n    .conversation-icon[_ngcontent-%COMP%] { font-size: 12px; width: 16px; text-align: center; }\n    .conversation-icon.has-tasks[_ngcontent-%COMP%] { color: var(--mj-status-warning); }\n    .badge-overlay[_ngcontent-%COMP%] { position: absolute; top: -4px; right: -4px; }\n    .conversation-info[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n    .conversation-name[_ngcontent-%COMP%] { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 6px; }\n    .shared-indicator[_ngcontent-%COMP%] { font-size: 10px; color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent); flex-shrink: 0; }\n    .conversation-item.active[_ngcontent-%COMP%]   .shared-indicator[_ngcontent-%COMP%] { color: color-mix(in srgb, var(--conv-list-active-ink) 85%, transparent); }\n    .conversation-preview[_ngcontent-%COMP%] { font-size: 12px; color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-item.active[_ngcontent-%COMP%]   .conversation-preview[_ngcontent-%COMP%] { color: color-mix(in srgb, var(--conv-list-active-ink) 80%, transparent); }\n    .conversation-meta[_ngcontent-%COMP%] { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }\n\n    \n    .project-badge[_ngcontent-%COMP%] {\n      display: inline-block;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 10px;\n      font-weight: 600;\n      margin-left: auto;\n      background-color: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      white-space: nowrap;\n      max-width: 80px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover   .project-badge[_ngcontent-%COMP%] {\n      background-color: color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      color: color-mix(in srgb, var(--conv-list-ink) 80%, transparent);\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .project-badge[_ngcontent-%COMP%] {\n      background-color: color-mix(in srgb, var(--conv-list-active-ink) 20%, transparent);\n      color: var(--conv-list-active-ink);\n    }\n\n    .conversation-actions[_ngcontent-%COMP%] {\n      position: absolute;\n      right: 5px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      align-items: center;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 10;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    .conversation-item.active[_ngcontent-%COMP%]   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    .conversation-actions[_ngcontent-%COMP%]    > *[_ngcontent-%COMP%] { pointer-events: auto; }\n    \n    @media (hover: none) {\n      .conversation-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    }\n    .pinned-icon[_ngcontent-%COMP%] { color: var(--mj-brand-accent); font-size: 12px; }\n\n    \n    .task-indicator[_ngcontent-%COMP%] {\n      color: var(--mj-status-warning);\n      font-size: 12px;\n      margin-right: 8px;\n      flex-shrink: 0;\n      animation: _ngcontent-%COMP%_pulse-glow 2s ease-in-out infinite;\n    }\n    @keyframes _ngcontent-%COMP%_pulse-glow {\n      0%, 100% {\n        opacity: 1;\n        filter: drop-shadow(0 0 2px var(--mj-status-warning));\n      }\n      50% {\n        opacity: 0.6;\n        filter: drop-shadow(0 0 4px var(--mj-status-warning));\n      }\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .task-indicator[_ngcontent-%COMP%] {\n      color: var(--mj-status-warning);\n    }\n\n    .menu-btn[_ngcontent-%COMP%] {\n      width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      background: var(--conv-list-bg) !important;\n      border: none;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .menu-btn[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent) !important;\n      color: var(--conv-list-ink);\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .menu-btn[_ngcontent-%COMP%] {\n      background: var(--conv-list-active-hover-bg) !important;\n      color: var(--conv-list-active-ink);\n    }\n    .menu-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 14px; }\n\n    \n\n    .list-context-menu[_ngcontent-%COMP%] {\n      position: fixed;\n      min-width: 190px;\n      max-height: 70vh;\n      overflow-y: auto;\n      background: var(--conv-list-bg);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-lg);\n      z-index: 1001;\n      padding: 4px 0;\n    }\n\n    .context-menu-header[_ngcontent-%COMP%] {\n      padding: 6px 14px 8px;\n      font-size: 12px;\n      font-weight: 600;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      border-bottom: 1px solid color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      margin-bottom: 4px;\n    }\n\n    .menu-item[_ngcontent-%COMP%] {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: color-mix(in srgb, var(--conv-list-ink) 85%, transparent);\n      font-size: 14px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .menu-item[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .menu-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      width: 16px;\n      font-size: 13px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n    }\n\n    .menu-item[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: var(--conv-list-ink);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, transparent);\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .menu-divider[_ngcontent-%COMP%] {\n      height: 1px;\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      margin: 4px 0;\n    }\n\n    \n    .conversation-item.renamed[_ngcontent-%COMP%] {\n      animation: _ngcontent-%COMP%_renameHighlight 1500ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    \n\n\n    @keyframes _ngcontent-%COMP%_renameHighlight {\n      0% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-brand-primary) 40%, transparent),\n          color-mix(in srgb, var(--mj-brand-accent) 40%, transparent));\n        transform: scale(1.03);\n        box-shadow: 0 0 20px color-mix(in srgb, var(--mj-brand-primary) 50%, transparent);\n      }\n      25% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-brand-primary) 35%, transparent),\n          color-mix(in srgb, var(--mj-brand-accent) 35%, transparent));\n        box-shadow: 0 0 15px color-mix(in srgb, var(--mj-brand-primary) 40%, transparent);\n      }\n      50% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-status-success) 30%, transparent),\n          color-mix(in srgb, var(--mj-brand-primary) 30%, transparent));\n        transform: scale(1.02);\n        box-shadow: 0 0 10px color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n      }\n      75% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-status-success) 20%, transparent),\n          color-mix(in srgb, var(--mj-brand-primary) 20%, transparent));\n        box-shadow: 0 0 5px color-mix(in srgb, var(--mj-status-success) 20%, transparent);\n      }\n      100% {\n        background: transparent;\n        transform: scale(1);\n        box-shadow: none;\n      }\n    }\n\n    \n\n\n    .header-top[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      min-height: 36px;\n    }\n\n    .selection-bar[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 2px;\n      flex: 1;\n      min-width: 0;\n    }\n\n    .selection-count[_ngcontent-%COMP%] {\n      flex: 1;\n      min-width: 0;\n      padding: 0 6px;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      font-weight: 600;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .selection-bar-btn[_ngcontent-%COMP%] {\n      width: 32px;\n      height: 32px;\n      flex-shrink: 0;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: 0;\n      background: transparent;\n      border: none;\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 75%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .selection-bar-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 13px; }\n    .selection-bar-btn[_ngcontent-%COMP%]:hover:not(:disabled) { background: var(--conv-list-hover-bg); color: var(--conv-list-ink); }\n    .selection-bar-btn[_ngcontent-%COMP%]:disabled { opacity: 0.4; cursor: not-allowed; }\n    .selection-bar-btn.danger[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, transparent);\n      color: var(--mj-status-error);\n    }\n\n    \n    .header-menu-container[_ngcontent-%COMP%] {\n      position: relative;\n      flex-shrink: 0;\n    }\n\n    .btn-menu[_ngcontent-%COMP%] {\n      width: 32px;\n      height: 32px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .btn-menu[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n      border-color: color-mix(in srgb, var(--conv-list-ink) 30%, transparent);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%] {\n      position: absolute;\n      top: calc(100% + 4px);\n      right: 0;\n      min-width: 200px;\n      background: var(--conv-list-bg);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-lg);\n      z-index: 1001;\n      overflow: hidden;\n      padding: 4px 0;\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%] {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: color-mix(in srgb, var(--conv-list-ink) 85%, transparent);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      width: 16px;\n      font-size: 13px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: var(--conv-list-ink);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]   .shortcut[_ngcontent-%COMP%] {\n      margin-left: auto;\n      font-size: 11px;\n      color: color-mix(in srgb, var(--conv-list-ink) 40%, transparent);\n      font-family: system-ui, -apple-system, sans-serif;\n    }\n\n    .btn-select[_ngcontent-%COMP%] {\n      padding: 8px 12px;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 13px;\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n      white-space: nowrap;\n      flex-shrink: 0;\n    }\n\n    .btn-select[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n      border-color: color-mix(in srgb, var(--conv-list-ink) 30%, transparent);\n    }\n\n\n    \n    .section-action-btn[_ngcontent-%COMP%] {\n      width: 24px;\n      height: 24px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .section-action-btn[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      color: var(--conv-list-ink);\n    }\n    .section-action-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 12px; }\n\n    .folder-row[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 5px 8px 5px 12px;\n      cursor: pointer;\n      color: color-mix(in srgb, var(--conv-list-ink) 80%, transparent);\n      font-size: 13px;\n      transition: background 0.15s;\n      user-select: none;\n      position: relative;\n    }\n    .folder-row[_ngcontent-%COMP%]:hover { background: color-mix(in srgb, var(--conv-list-ink) 8%, transparent); }\n    .folder-row.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--conv-list-accent) 25%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n    }\n    .folder-row.dragging[_ngcontent-%COMP%] { opacity: 0.4; }\n    .section-header.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n      border-radius: 6px;\n    }\n    .folder-chevron[_ngcontent-%COMP%] {\n      font-size: 9px;\n      width: 10px;\n      flex-shrink: 0;\n      transition: transform 0.2s;\n      color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent);\n    }\n    .folder-chevron.expanded[_ngcontent-%COMP%] { transform: rotate(90deg); }\n    .folder-icon[_ngcontent-%COMP%] { font-size: 12px; width: 16px; text-align: center; flex-shrink: 0; }\n    .folder-name[_ngcontent-%COMP%] {\n      \n\n\n\n      flex: 0 1 auto;\n      min-width: 0;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      font-weight: 600;\n    }\n    .folder-count[_ngcontent-%COMP%] {\n      font-size: 11px;\n      font-weight: 600;\n      color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent);\n      flex-shrink: 0;\n      margin-left: auto;\n      padding-left: 6px;\n      text-align: right;\n    }\n    .folder-spacer[_ngcontent-%COMP%] {\n      flex: 1 1 auto;\n      min-width: 0;\n    }\n    .folder-shared[_ngcontent-%COMP%] {\n      flex-shrink: 0;\n      margin-left: 6px;\n      font-size: 10px;\n      line-height: 1;\n      \n\n      color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent);\n    }\n    .folder-children[_ngcontent-%COMP%] { display: block; }\n    .folder-empty-hint[_ngcontent-%COMP%] {\n      padding: 6px 16px;\n      font-size: 11px;\n      font-style: italic;\n      color: color-mix(in srgb, var(--conv-list-ink) 45%, transparent);\n    }\n    .ungrouped-section.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--conv-list-accent) 12%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n      border-radius: 6px;\n    }\n\n    \n\n    .conversation-item[_ngcontent-%COMP%] { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }\n    .conversation-item.dragging[_ngcontent-%COMP%] { opacity: 0.4; }\n\n    \n    .menu-item.back[_ngcontent-%COMP%] { font-weight: 600; }\n    .menu-item[_ngcontent-%COMP%]   .submenu-arrow[_ngcontent-%COMP%] { margin-left: auto; font-size: 10px; }\n    .menu-item.current[_ngcontent-%COMP%] { background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent); }\n    .move-folder-list[_ngcontent-%COMP%] { max-height: 240px; overflow-y: auto; }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ConversationListComponent, [{
         type: Component,
         args: [{ standalone: false, selector: 'mj-conversation-list', template: `
-    <div class="conversation-list">
-      <!-- Header strip gated as a whole so an empty bordered band never renders:
-           the ⋯ menu also hides during selection mode, so it only counts toward
-           the strip when actually visible. -->
-      @if (showSearch || (showHeaderMenu && !isSelectionMode)) {
+    <div class="conversation-list" [class.is-selecting]="IsSelectionMode">
+      <!-- Header strip gated as a whole so an empty bordered band never renders.
+           While a selection exists its top row becomes the selection bar, which
+           shows even for a host that hides the rest of the chrome. -->
+      @if (showSearch || ShowHeaderMenu || IsSelectionMode) {
       <div class="list-header">
         <div class="header-top">
-          @if (showSearch) {
-            <input
-              type="text"
-              class="search-input"
-              placeholder="Search conversations..."
-              [(ngModel)]="searchQuery">
-          }
-          @if (showHeaderMenu && !isSelectionMode) {
-            <div class="header-menu-container">
-              <button class="btn-menu" (click)="toggleHeaderMenu($event)" title="Options">
-                <i class="fas fa-ellipsis-v"></i>
+          @if (IsSelectionMode) {
+            <div class="selection-bar" role="toolbar" aria-label="Selected conversations">
+              <button class="selection-bar-btn" (click)="ClearSelection()" title="Clear selection" aria-label="Clear selection">
+                <i class="fas fa-xmark"></i>
               </button>
-              @if (isHeaderMenuOpen) {
-                <div class="header-dropdown-menu">
-                  <button class="dropdown-item" (click)="onRefreshConversationsClick($event)" [disabled]="isRefreshing">
-                    <i class="fas fa-sync-alt" [class.fa-spin]="isRefreshing"></i>
-                    <span>{{ isRefreshing ? 'Refreshing...' : 'Refresh' }}</span>
-                  </button>
-                  <button class="dropdown-item" (click)="onSelectConversationsClick($event)">
-                    <i class="fas fa-check-square"></i>
-                    <span>Select Conversations</span>
-                  </button>
-                  <button class="dropdown-item" (click)="onToggleGroupByClick($event)">
-                    <i class="fas" [class.fa-folder-tree]="groupBy !== 'project'" [class.fa-list]="groupBy === 'project'"></i>
-                    <span>{{ groupBy === 'project' ? 'Show as flat list' : 'Group by folder' }}</span>
+              <span class="selection-count">{{ SelectedConversationIds.size }} selected</span>
+              <button class="selection-bar-btn"
+                      (click)="BarSetPinned()"
+                      [disabled]="!CanChangeAny(SelectedIds)"
+                      [title]="CanChangeAny(SelectedIds) ? (SelectionHasUnpinned() ? 'Pin' : 'Unpin') : ChangeRefusedReason"
+                      [attr.aria-label]="SelectionHasUnpinned() ? 'Pin' : 'Unpin'">
+                <i class="fas fa-thumbtack" [class.fa-rotate-90]="!SelectionHasUnpinned()"></i>
+              </button>
+              <button class="selection-bar-btn"
+                      (click)="BarOpenMoveMenu($event)"
+                      [disabled]="!CanChangeAny(SelectedIds)"
+                      [title]="CanChangeAny(SelectedIds) ? 'Move to folder' : ChangeRefusedReason"
+                      aria-label="Move to folder">
+                <i class="fas fa-folder-tree"></i>
+              </button>
+              <button class="selection-bar-btn"
+                      (click)="BarShare()"
+                      [disabled]="!CanShareAny(SelectedIds)"
+                      [title]="CanShareAny(SelectedIds) ? 'Share' : ShareRefusedReason"
+                      aria-label="Share">
+                <i class="fas fa-user-plus"></i>
+              </button>
+              <button class="selection-bar-btn danger" (click)="BarDelete()" title="Delete" aria-label="Delete">
+                <i class="fas fa-trash"></i>
+              </button>
+            </div>
+          } @else {
+            @if (showSearch) {
+              <div class="search-box">
+                <input
+                  #searchInput
+                  type="text"
+                  class="search-input"
+                  placeholder="Search conversations..."
+                  [(ngModel)]="SearchQuery"
+                  (keydown)="OnSearchKeydown($event)">
+                @if (IsSearching) {
+                  <button class="search-clear" (click)="ClearSearch()" title="Clear search">
+                    <i class="fas fa-xmark"></i>
                   </button>
-                  @if (!isMobileView) {
-                    <button class="dropdown-item" (click)="onUnpinSidebarClick($event)">
-                      <i class="fas fa-table-columns"></i>
-                      <span>Hide Sidebar</span>
+                }
+              </div>
+            }
+            @if (ShowHeaderMenu) {
+              <div class="header-menu-container">
+                <button class="btn-menu" (click)="ToggleHeaderMenu($event)" title="Options">
+                  <i class="fas fa-ellipsis-v"></i>
+                </button>
+                @if (IsHeaderMenuOpen) {
+                  <div class="header-dropdown-menu">
+                    <button class="dropdown-item" (click)="OnRefreshConversationsClick($event)" [disabled]="IsRefreshing">
+                      <i class="fas fa-sync-alt" [class.fa-spin]="IsRefreshing"></i>
+                      <span>{{ IsRefreshing ? 'Refreshing...' : 'Refresh' }}</span>
                     </button>
-                  }
-                </div>
-              }
-            </div>
+                    <button class="dropdown-item" (click)="OnToggleGroupByClick($event)">
+                      <i class="fas" [class.fa-folder-tree]="GroupBy !== 'project'" [class.fa-list]="GroupBy === 'project'"></i>
+                      <span>{{ GroupBy === 'project' ? 'Show as flat list' : 'Group by folder' }}</span>
+                    </button>
+                    @if (!IsMobileView) {
+                      <button class="dropdown-item" (click)="OnUnpinSidebarClick($event)">
+                        <i class="fas fa-table-columns"></i>
+                        <span>Hide Sidebar</span>
+                      </button>
+                    }
+                  </div>
+                }
+              </div>
+            }
           }
         </div>
+        <!-- Sort controls. Live in the header strip, so a host that hides all
+             chrome (showSearch + ShowHeaderMenu both false) gets no sort row.
+             They stay put while selecting, so the list does not jump. -->
+        @if (showSearch || ShowHeaderMenu) {
+          <div class="sort-row">
+            <button class="sort-btn" [class.active]="SortBy === 'date'"
+                    (click)="SetSort('date')"
+                    [title]="SortBy === 'date' ? (SortDirection === 'asc' ? 'Oldest first' : 'Newest first') : 'Sort by date'">
+              <i class="fas" [ngClass]="SortIcon('date')"></i>
+              <span>Date</span>
+            </button>
+            <button class="sort-btn" [class.active]="SortBy === 'name'"
+                    (click)="SetSort('name')"
+                    [title]="SortBy === 'name' ? (SortDirection === 'asc' ? 'A to Z' : 'Z to A') : 'Sort by name'">
+              <i class="fas" [ngClass]="SortIcon('name')"></i>
+              <span>Name</span>
+            </button>
+          </div>
+        }
       </div>
       }
-      @if (showNewConversationButton) {
-        <button class="btn-new-conversation" (click)="createNewConversation()" title="New Conversation">
+      @if (ShowNewConversationButton) {
+        <button class="btn-new-conversation" (click)="CreateNewConversation()" title="New Conversation">
           <i class="fas fa-plus"></i>
           <span>New Conversation</span>
         </button>
       }
-      <div class="list-content">
+      <div class="list-content"
+           (click)="OnListBackgroundClick($event)"
+           (contextmenu)="OnBackgroundContextMenu($event)">
         <!-- Pinned Section (only show if there are pinned conversations) -->
-        @if (pinnedConversations.length > 0) {
+        @if (PinnedConversations.length > 0) {
           <div class="sidebar-section pinned-section">
-            @if (showSectionHeaders) {
-              <div class="section-header" [class.expanded]="pinnedExpanded" (click)="togglePinned()">
+            @if (ShowSectionHeaders) {
+              <div class="section-header" [class.expanded]="PinnedExpanded" (click)="TogglePinned()">
                 <div class="section-title">
                   <i class="fas fa-chevron-right"></i>
                   <i class="fas fa-thumbtack section-icon"></i>
@@ -1406,46 +2779,46 @@ export class ConversationListComponent {
                 </div>
               </div>
             }
-            <div class="chat-list" [class.expanded]="!showSectionHeaders || pinnedExpanded">
-              @for (conversation of pinnedConversations; track conversation.ID) {
+            <div class="chat-list" [class.expanded]="!ShowSectionHeaders || PinnedExpanded">
+              @for (conversation of PinnedConversations; track conversation.ID) {
                 <ng-container [ngTemplateOutlet]="conversationItem" [ngTemplateOutletContext]="{ $implicit: conversation }"></ng-container>
               }
             </div>
           </div>
         }
 
-        <!-- showSectionHeaders=false forces the FLAT branch even in project
+        <!-- ShowSectionHeaders=false forces the FLAT branch even in project
              grouping: the folder tree's root drop-zone and New Folder action
              live in the section header, so rendering the tree without headers
              would let a user drag a folder INTO another folder with no way to
              ever drag it back out (a one-way door). Flat + headerless is the
              coherent chrome-less rendering. -->
-        @if (showSectionHeaders && groupBy === 'project') {
+        @if (ShowSectionHeaders && GroupBy === 'project') {
           <!-- Folders Section. NOTE: this whole branch is already gated on
-               showSectionHeaders above, so the header + collapse state here are
+               ShowSectionHeaders above, so the header + collapse state here are
                unconditional — a headerless folder tree never renders. -->
           <div class="sidebar-section folders-section">
-            <div class="section-header" [class.expanded]="foldersExpanded"
-                 [class.drag-over]="dragOverTargetId === 'folders-root'"
-                 (click)="toggleFolders()"
-                 (dragover)="onFoldersRootDragOver($event)"
-                 (dragleave)="onDragLeave('folders-root')"
-                 (drop)="onFoldersRootDrop($event)">
+            <div class="section-header" [class.expanded]="FoldersExpanded"
+                 [class.drag-over]="DragOverTargetId === 'folders-root'"
+                 (click)="ToggleFolders()"
+                 (dragover)="OnFoldersRootDragOver($event)"
+                 (dragleave)="OnDragLeave('folders-root')"
+                 (drop)="OnFoldersRootDrop($event)">
               <div class="section-title">
                 <i class="fas fa-chevron-right"></i>
                 <span>Folders</span>
               </div>
-              <button class="section-action-btn" (click)="createFolder(null, $event)" title="New Folder">
+              <button class="section-action-btn" (click)="CreateFolder(null, $event)" title="New Folder">
                 <i class="fas fa-folder-plus"></i>
               </button>
             </div>
-            <div class="chat-list" [class.expanded]="foldersExpanded">
-              @for (node of folderTree; track node.project.ID) {
-                @if (!isSearching || node.hasContent) {
+            <div class="chat-list" [class.expanded]="FoldersExpanded">
+              @for (node of FolderTree; track node.project.ID) {
+                @if (!IsSearching || node.hasContent) {
                   <ng-container [ngTemplateOutlet]="folderNode" [ngTemplateOutletContext]="{ $implicit: node }"></ng-container>
                 }
               }
-              @if (folderTree.length === 0) {
+              @if (FolderTree.length === 0) {
                 <div class="folder-empty-hint">No folders yet — create one to organize conversations.</div>
               }
             </div>
@@ -1453,19 +2826,19 @@ export class ConversationListComponent {
 
           <!-- Ungrouped Section (drop target to remove from folder) -->
           <div class="sidebar-section ungrouped-section"
-               [class.drag-over]="dragOverTargetId === 'ungrouped'"
-               (dragover)="onUngroupedDragOver($event)"
-               (dragleave)="onDragLeave('ungrouped')"
-               (drop)="onUngroupedDrop($event)">
-            <!-- Same as Folders above: reached only when showSectionHeaders is true. -->
-            <div class="section-header" [class.expanded]="ungroupedExpanded" (click)="toggleUngrouped()">
+               [class.drag-over]="DragOverTargetId === 'ungrouped'"
+               (dragover)="OnUngroupedDragOver($event)"
+               (dragleave)="OnDragLeave('ungrouped')"
+               (drop)="OnUngroupedDrop($event)">
+            <!-- Same as Folders above: reached only when ShowSectionHeaders is true. -->
+            <div class="section-header" [class.expanded]="UngroupedExpanded" (click)="ToggleUngrouped()">
               <div class="section-title">
                 <i class="fas fa-chevron-right"></i>
-                <span>{{ folderTree.length > 0 ? 'Ungrouped' : 'Messages' }}</span>
+                <span>{{ FolderTree.length > 0 ? 'Ungrouped' : 'Messages' }}</span>
               </div>
             </div>
-            <div class="chat-list" [class.expanded]="ungroupedExpanded">
-              @for (conversation of ungroupedConversations; track conversation.ID) {
+            <div class="chat-list" [class.expanded]="UngroupedExpanded">
+              @for (conversation of UngroupedConversations; track conversation.ID) {
                 <ng-container [ngTemplateOutlet]="conversationItem" [ngTemplateOutletContext]="{ $implicit: conversation }"></ng-container>
               }
             </div>
@@ -1473,16 +2846,16 @@ export class ConversationListComponent {
         } @else {
           <!-- Flat Messages Section -->
           <div class="sidebar-section">
-            @if (showSectionHeaders) {
-              <div class="section-header" [class.expanded]="directMessagesExpanded" (click)="toggleDirectMessages()">
+            @if (ShowSectionHeaders) {
+              <div class="section-header" [class.expanded]="DirectMessagesExpanded" (click)="ToggleDirectMessages()">
                 <div class="section-title">
                   <i class="fas fa-chevron-right"></i>
                   <span>Messages</span>
                 </div>
               </div>
             }
-            <div class="chat-list" [class.expanded]="!showSectionHeaders || directMessagesExpanded">
-              @for (conversation of unpinnedConversations; track conversation.ID) {
+            <div class="chat-list" [class.expanded]="!ShowSectionHeaders || DirectMessagesExpanded">
+              @for (conversation of UnpinnedConversations; track conversation.ID) {
                 <ng-container [ngTemplateOutlet]="conversationItem" [ngTemplateOutletContext]="{ $implicit: conversation }"></ng-container>
               }
             </div>
@@ -1490,73 +2863,68 @@ export class ConversationListComponent {
         }
       </div>
 
-      <!-- Selection Action Bar -->
-      @if (isSelectionMode) {
-        <div class="selection-action-bar">
-          <div class="selection-info">
-            <span class="selection-count">{{ selectedConversationIds.size }} selected</span>
-            @if (selectedConversationIds.size < filteredConversations.length) {
-              <button class="link-btn" (click)="selectAll()">Select All</button>
-            } @else {
-              <button class="link-btn" (click)="deselectAll()">Deselect All</button>
-            }
-          </div>
-          <div class="selection-actions">
-            <button class="btn-delete-bulk"
-                    (click)="bulkDeleteConversations()"
-                    [disabled]="selectedConversationIds.size === 0">
-              <i class="fas fa-trash"></i>
-              Delete ({{ selectedConversationIds.size }})
-            </button>
-            <button class="btn-cancel" (click)="toggleSelectionMode()">
-              Cancel
-            </button>
-          </div>
-        </div>
+      <!-- Escalate the in-place filter to a full cross-entity search. Pinned below the
+           scroll region rather than appended to the results so it stays reachable without
+           scrolling past every match. Only meaningful while filtering. -->
+      @if (IsSearching && !IsSelectionMode) {
+        <button class="search-escalate" (click)="EscalateSearch()">
+          <i class="fa-solid fa-magnifying-glass"></i>
+          <span class="search-escalate-label">Search all of Chat for &ldquo;{{ SearchQuery }}&rdquo;</span>
+          <i class="fa-solid fa-arrow-right search-escalate-go"></i>
+        </button>
       }
     </div>
 
     <!-- Recursive folder node: header + nested children + direct conversations -->
     <ng-template #folderNode let-node>
       <div class="folder-row"
-           [class.drag-over]="dragOverTargetId === node.project.ID"
-           [class.dragging]="draggedFolderId === node.project.ID"
+           [class.drag-over]="DragOverTargetId === node.project.ID"
+           [class.dragging]="DraggedFolderId === node.project.ID"
            [style.paddingLeft.px]="12 + node.depth * 14"
            [draggable]="true"
-           (dragstart)="onFolderDragStart(node, $event)"
-           (dragend)="onFolderDragEnd()"
-           (click)="toggleFolder(node.project.ID)"
-           (dragover)="onFolderDragOver(node.project.ID, $event)"
-           (dragleave)="onDragLeave(node.project.ID)"
-           (drop)="onFolderDrop(node.project, $event)"
+           (dragstart)="OnFolderDragStart(node, $event)"
+           (dragend)="OnFolderDragEnd()"
+           (click)="ToggleFolder(node.project.ID)"
+           (dragover)="OnFolderDragOver(node.project.ID, $event)"
+           (dragleave)="OnDragLeave(node.project.ID)"
+           (drop)="OnFolderDrop(node.project, $event)"
+           (contextmenu)="OnFolderContextMenu(node.project, $event)"
            [title]="node.project.Name">
-        <i class="fas fa-chevron-right folder-chevron" [class.expanded]="isFolderExpanded(node.project.ID)"></i>
+        <i class="fas fa-chevron-right folder-chevron" [class.expanded]="IsFolderExpanded(node.project.ID)"></i>
         <i class="fas {{ node.project.Icon || 'fa-folder' }} folder-icon" [style.color]="node.project.Color || null"></i>
         <span class="folder-name">{{ node.project.Name }}</span>
+        <!-- SHARED is the marked state, not personal. Two reasons: it is the state with
+             consequences for other people ("anyone here can read this folder's name"),
+             and personal is the create-time default, so marking personal would badge
+             nearly every row in steady state while marking shared thins out over time.
+             On an environment upgrading to this column every existing folder is shared
+             and so every row is badged — which is exactly the disclosure people need at
+             that moment. Sits beside the name it describes rather than at the right
+             edge, which belongs to the count. -->
+        @if (!node.project.OwnerUserID) {
+          <!-- role="img" so the aria-label is actually announced: on a bare span with no
+               role, an aria-label is not reliably exposed, and the <i> carrying the glyph
+               is aria-hidden. -->
+          <span class="folder-shared" role="img"
+                title="Shared — everyone can see this folder and its name, but not the conversations in it"
+                aria-label="Shared folder">
+            <i class="fas fa-users" aria-hidden="true"></i>
+          </span>
+        }
+        <span class="folder-spacer"></span>
         <span class="folder-count">{{ node.totalCount }}</span>
-        <div class="folder-actions" (click)="$event.stopPropagation()">
-          <button class="folder-action-btn" (click)="createFolder(node.project.ID, $event)" title="New Subfolder">
-            <i class="fas fa-folder-plus"></i>
-          </button>
-          <button class="folder-action-btn" (click)="editFolder(node.project, $event)" title="Edit Folder">
-            <i class="fas fa-pen"></i>
-          </button>
-          <button class="folder-action-btn danger" (click)="deleteFolder(node.project, $event)" title="Delete Folder">
-            <i class="fas fa-trash"></i>
-          </button>
-        </div>
       </div>
-      @if (isFolderExpanded(node.project.ID)) {
+      @if (IsFolderExpanded(node.project.ID)) {
         <div class="folder-children">
           @for (child of node.children; track child.project.ID) {
-            @if (!isSearching || child.hasContent) {
+            @if (!IsSearching || child.hasContent) {
               <ng-container [ngTemplateOutlet]="folderNode" [ngTemplateOutletContext]="{ $implicit: child }"></ng-container>
             }
           }
           @for (conversation of node.conversations; track conversation.ID) {
             <ng-container [ngTemplateOutlet]="conversationItem" [ngTemplateOutletContext]="{ $implicit: conversation, depth: node.depth + 1 }"></ng-container>
           }
-          @if (node.totalCount === 0 && !isSearching) {
+          @if (node.totalCount === 0 && !IsSearching) {
             <div class="folder-empty-hint" [style.paddingLeft.px]="26 + node.depth * 14">Empty — drop a conversation here</div>
           }
         </div>
@@ -1567,22 +2935,33 @@ export class ConversationListComponent {
     <ng-template #conversationItem let-conversation let-depth="depth">
       <div class="conversation-item"
            [class.active]="IsConversationActive(conversation)"
+           [class.selected]="IsConversationSelected(conversation)"
            [class.renamed]="IsConversationRenamed(conversation)"
            [class.dragging]="IsConversationDragging(conversation)"
            [style.paddingLeft.px]="depth ? 16 + depth * 14 : 16"
-           [draggable]="!isSelectionMode"
-           (dragstart)="onConversationDragStart(conversation, $event)"
-           (dragend)="onConversationDragEnd()"
-           (click)="handleConversationClick(conversation)">
-        @if (isSelectionMode) {
-          <div class="conversation-checkbox">
-            <input type="checkbox"
-                   [checked]="selectedConversationIds.has(conversation.ID)"
-                   (click)="$event.stopPropagation(); toggleConversationSelection(conversation.ID)">
-          </div>
-        }
+           [draggable]="CanChange(conversation)"
+           (dragstart)="OnConversationDragStart(conversation, $event)"
+           (dragend)="OnConversationDragEnd()"
+           (dragover)="OnConversationRowDragOver(conversation, $event)"
+           (dragleave)="OnDragLeave(ConversationDropTargetId(conversation))"
+           (drop)="OnConversationRowDrop(conversation, $event)"
+           (pointerdown)="OnRowPointerDown(conversation, $event)"
+           (pointermove)="OnRowPointerMove($event)"
+           (pointerup)="CancelLongPress()"
+           (pointercancel)="CancelLongPress()"
+           (click)="HandleConversationClick(conversation, $event)"
+           (contextmenu)="OnConversationContextMenu(conversation, $event)">
+        <button class="row-check"
+                role="checkbox"
+                [class.checked]="IsConversationSelected(conversation)"
+                [attr.aria-checked]="IsConversationSelected(conversation)"
+                [attr.aria-label]="'Select ' + (conversation.Name || 'conversation')"
+                [style.left.px]="(depth || 0) * 14 + 4"
+                (click)="OnRowCheckboxClick(conversation, $event)">
+          <i class="fas fa-check"></i>
+        </button>
         <div class="conversation-icon-wrapper">
-          @if (hasActiveTasks(conversation.ID)) {
+          @if (HasActiveTasks(conversation.ID)) {
             <div class="conversation-icon has-tasks">
               <i class="fas fa-spinner fa-pulse"></i>
             </div>
@@ -1594,107 +2973,227 @@ export class ConversationListComponent {
         <div class="conversation-info" [title]="conversation.Name + (conversation.Description ? '\n' + conversation.Description : '')">
           <div class="conversation-name">
             {{ conversation.Name }}
-            @if (isSharedWithMe(conversation)) {
+            @if (IsSharedWithMe(conversation)) {
               <i class="fas fa-share-nodes shared-indicator"
-                 [title]="sharedWithMeTooltip(conversation)"></i>
+                 [title]="SharedWithMeTooltip(conversation)"></i>
             }
           </div>
           <div class="conversation-preview">{{ conversation.Description }}</div>
         </div>
-        @if (!isSelectionMode) {
-          <div class="conversation-actions">
-            <button class="menu-btn" (click)="toggleMenu(conversation.ID, $event)" title="More options">
-              <i class="fas fa-ellipsis"></i>
-            </button>
-            @if (IsMenuOpen(conversation)) {
-              <div class="context-menu" (click)="$event.stopPropagation()">
-                @if (IsMoveSubmenuOpen(conversation)) {
-                  <button class="menu-item back" (click)="closeMoveSubmenu($event)">
-                    <i class="fas fa-chevron-left"></i>
-                    <span>Move to folder</span>
-                  </button>
-                  <div class="menu-divider"></div>
-                  <div class="move-folder-list">
-                    <button class="menu-item" [class.current]="!conversation.ProjectID" (click)="selectMoveTarget(conversation, null)">
-                      <i class="fas fa-inbox"></i>
-                      <span>No folder</span>
-                    </button>
-                    @for (f of flatFolders; track f.project.ID) {
-                      <button class="menu-item" [class.current]="IsInFolder(conversation, f.project.ID)"
-                              [style.paddingLeft.px]="14 + f.depth * 12"
-                              (click)="selectMoveTarget(conversation, f.project.ID)">
-                        <i class="fas {{ f.project.Icon || 'fa-folder' }}" [style.color]="f.project.Color || null"></i>
-                        <span>{{ f.project.Name }}</span>
-                      </button>
-                    }
-                  </div>
-                  <div class="menu-divider"></div>
-                  <button class="menu-item" (click)="createFolderForConversation(conversation, $event)">
-                    <i class="fas fa-folder-plus"></i>
-                    <span>New folder…</span>
-                  </button>
-                } @else {
-                  <button class="menu-item" (click)="togglePin(conversation, $event)">
-                    <i class="fas fa-thumbtack"></i>
-                    <span>{{ conversation.IsPinned ? 'Unpin' : 'Pin' }}</span>
-                  </button>
-                  <button class="menu-item" (click)="openMoveSubmenu(conversation.ID, $event)">
-                    <i class="fas fa-folder-tree"></i>
-                    <span>Move to folder</span>
-                    <i class="fas fa-chevron-right submenu-arrow"></i>
-                  </button>
-                  <button class="menu-item" (click)="renameConversation(conversation); closeMenu()">
-                    <i class="fas fa-edit"></i>
-                    <span>Rename</span>
-                  </button>
-                  <div class="menu-divider"></div>
-                  <button class="menu-item danger" (click)="deleteConversation(conversation); closeMenu()">
-                    <i class="fas fa-trash"></i>
-                    <span>Delete</span>
+        <div class="conversation-actions">
+          <button class="menu-btn" (click)="OpenRowMenu(conversation, $event)" title="More options">
+            <i class="fas fa-ellipsis"></i>
+          </button>
+        </div>
+      </div>
+    </ng-template>
+
+    <mj-resource-share-dialog
+      [Visible]="IsShareDialogOpen"
+      [Contexts]="ShareContexts"
+      [Adapter]="ShareAdapter"
+      [Notice]="ShareNotice"
+      ResourceLabel="conversation"
+      (Result)="OnShareDialogResult($event)">
+    </mj-resource-share-dialog>
+
+    <!-- One menu for every right-click target: a conversation row (the clicked
+         row, or the whole selection when it is part of it), a folder row, or the
+         empty space of the list. Fixed-positioned at the pointer, and moved as
+         needed to stay inside the window. -->
+    @if (ContextMenu) {
+      <div class="list-context-menu" #contextMenuEl
+           [style.left.px]="ContextMenu.x"
+           [style.top.px]="ContextMenu.y"
+           (click)="$event.stopPropagation()"
+           (contextmenu)="$event.preventDefault(); $event.stopPropagation()">
+        @switch (ContextMenu.kind) {
+          @case ('conversation') {
+            @if (IsMoveSubmenuOpen) {
+              <button class="menu-item back" (click)="CloseMoveSubmenu($event)">
+                <i class="fas fa-chevron-left"></i>
+                <span>Move to folder</span>
+              </button>
+              <div class="menu-divider"></div>
+              <div class="move-folder-list">
+                <button class="menu-item" [class.current]="IsSingleTargetInFolder(null)" (click)="ContextMoveToFolder(null)">
+                  <i class="fas fa-inbox"></i>
+                  <span>No folder</span>
+                </button>
+                @for (f of FlatFolders; track f.project.ID) {
+                  <button class="menu-item" [class.current]="IsSingleTargetInFolder(f.project.ID)"
+                          [style.paddingLeft.px]="14 + f.depth * 12"
+                          (click)="ContextMoveToFolder(f.project.ID)">
+                    <i class="fas {{ f.project.Icon || 'fa-folder' }}" [style.color]="f.project.Color || null"></i>
+                    <span>{{ f.project.Name }}</span>
                   </button>
                 }
               </div>
+              <div class="menu-divider"></div>
+              <button class="menu-item" (click)="ContextMoveToNewFolder($event)">
+                <i class="fas fa-folder-plus"></i>
+                <span>New folder&hellip;</span>
+              </button>
+            } @else {
+              @if (ContextMenu.targets.length > 1) {
+                <div class="context-menu-header">{{ ContextMenu.targets.length }} selected</div>
+                <button class="menu-item" (click)="ContextSetPinned(true)"
+                        [disabled]="!CanChangeAny(ContextMenu.targets)"
+                        [attr.title]="CanChangeAny(ContextMenu.targets) ? null : ChangeRefusedReason">
+                  <i class="fas fa-thumbtack"></i>
+                  <span>Pin</span>
+                </button>
+                <button class="menu-item" (click)="ContextSetPinned(false)"
+                        [disabled]="!CanChangeAny(ContextMenu.targets)"
+                        [attr.title]="CanChangeAny(ContextMenu.targets) ? null : ChangeRefusedReason">
+                  <i class="fas fa-thumbtack fa-rotate-90"></i>
+                  <span>Unpin</span>
+                </button>
+              } @else {
+                <button class="menu-item" (click)="ContextTogglePin()"
+                        [disabled]="!CanChangeAny(ContextMenu.targets)"
+                        [attr.title]="CanChangeAny(ContextMenu.targets) ? null : ChangeRefusedReason">
+                  <i class="fas fa-thumbtack"></i>
+                  <span>{{ ContextMenu.conversation?.IsPinned ? 'Unpin' : 'Pin' }}</span>
+                </button>
+              }
+              <button class="menu-item" (click)="OpenMoveSubmenu($event)"
+                      [disabled]="!CanChangeAny(ContextMenu.targets)"
+                      [attr.title]="CanChangeAny(ContextMenu.targets) ? null : ChangeRefusedReason">
+                <i class="fas fa-folder-tree"></i>
+                <span>Move to folder</span>
+                <i class="fas fa-chevron-right submenu-arrow"></i>
+              </button>
+              <button class="menu-item"
+                      (click)="ContextShare()"
+                      [disabled]="!CanShareAny(ContextMenu.targets)"
+                      [attr.title]="CanShareAny(ContextMenu.targets) ? null : ShareRefusedReason">
+                <i class="fas fa-user-plus"></i>
+                <span>{{ ContextMenu.targets.length > 1 ? 'Share ' + ContextMenu.targets.length + ' conversations' : 'Share' }}</span>
+              </button>
+              @if (ContextMenu.targets.length === 1) {
+                <button class="menu-item" (click)="ContextRename()">
+                  <i class="fas fa-edit"></i>
+                  <span>Rename</span>
+                </button>
+              }
+              <div class="menu-divider"></div>
+              <button class="menu-item danger" (click)="ContextDelete()">
+                <i class="fas fa-trash"></i>
+                <span>{{ ContextMenu.targets.length > 1 ? 'Delete ' + ContextMenu.targets.length : 'Delete' }}</span>
+              </button>
             }
-          </div>
+          }
+          @case ('folder') {
+            <button class="menu-item" (click)="ContextCreateSubfolder($event)">
+              <i class="fas fa-folder-plus"></i>
+              <span>New Subfolder</span>
+            </button>
+            <button class="menu-item" (click)="ContextEditFolder($event)">
+              <i class="fas fa-pen"></i>
+              <span>Rename</span>
+            </button>
+            <div class="menu-divider"></div>
+            <button class="menu-item danger" (click)="ContextDeleteFolder($event)">
+              <i class="fas fa-trash"></i>
+              <span>Delete</span>
+            </button>
+          }
+          @default {
+            <button class="menu-item" (click)="ContextNewConversation()">
+              <i class="fas fa-plus"></i>
+              <span>New Conversation</span>
+            </button>
+            <button class="menu-item" (click)="ContextCreateRootFolder($event)">
+              <i class="fas fa-folder-plus"></i>
+              <span>New Folder</span>
+            </button>
+            <div class="menu-divider"></div>
+            <button class="menu-item" (click)="ContextSelectAll()">
+              <i class="fas fa-check-double"></i>
+              <span>Select All</span>
+            </button>
+          }
         }
       </div>
-    </ng-template>
-  `, styles: ["\n    :host {\n      display: block;\n      height: 100%;\n      /* White-label theming tokens for the list panel. The public\n         --mj-chat-list-* custom properties are host-overridable (set\n         them at :root or on any ancestor); the private --conv-list-* names\n         resolve the fallback ONCE here so the 70+ usages below stay simple.\n         (A self-referential var() fallback would be a custom-property cycle,\n         so the two-name indirection is required, not stylistic.) Defaults\n         preserve the stock look exactly: a brand-secondary panel with\n         on-secondary ink. Hover/border/divider states derive from the ink via\n         color-mix, so they follow automatically when the ink is remapped.\n         The accent trio drives the panel's ACTION surfaces (New Conversation\n         button, search-focus ring, checkbox tick, drag-over highlights) \u2014\n         independent of the active-row pair so a host can tint actions on their\n         own; defaults to the brand-primary action color, unchanged.\n         --conv-list-hover-bg is the row-hover wash: it defaults to the same\n         ink-derived tint as before (so a bg/ink remap still gives a neutral\n         hover), but a host can point it at a brand tint to make hover an accent\n         cue while keeping the panel itself on a neutral surface. */\n      --conv-list-bg: var(--mj-chat-list-bg, var(--mj-brand-secondary));\n      --conv-list-ink: var(--mj-chat-list-ink, var(--mj-brand-on-secondary));\n      --conv-list-active-bg: var(--mj-chat-list-active-bg, var(--mj-brand-primary));\n      --conv-list-active-ink: var(--mj-chat-list-active-ink, var(--mj-brand-on-secondary));\n      --conv-list-active-hover-bg: var(--mj-chat-list-active-hover-bg, var(--mj-brand-primary-hover));\n      --conv-list-accent: var(--mj-chat-list-accent, var(--mj-brand-primary));\n      --conv-list-accent-ink: var(--mj-chat-list-accent-ink, var(--mj-text-inverse));\n      --conv-list-accent-hover: var(--mj-chat-list-accent-hover, var(--mj-brand-primary-hover));\n      --conv-list-hover-bg: var(--mj-chat-list-hover-bg, color-mix(in srgb, var(--conv-list-ink) 8%, transparent));\n    }\n    .conversation-list { display: flex; flex-direction: column; height: 100%; background: var(--conv-list-bg); }\n    .list-header { padding: 8px; border-bottom: 1px solid color-mix(in srgb, var(--conv-list-ink) 10%, transparent); }\n    .search-input {\n      width: 100%;\n      padding: 8px 12px;\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      transition: all 0.2s;\n    }\n    .search-input::placeholder { color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent); }\n    .search-input:focus { outline: none; background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent); border-color: var(--conv-list-accent); }\n    .btn-new-conversation {\n      width: calc(100% - 16px);\n      margin: 8px;\n      padding: 10px;\n      background: var(--conv-list-accent);\n      color: var(--conv-list-accent-ink);\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n      font-size: 14px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      transition: background 0.2s;\n      flex-shrink: 0;\n    }\n    .btn-new-conversation:hover { background: var(--conv-list-accent-hover); }\n    .btn-new-conversation i { font-size: 14px; }\n    .list-content { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 0; }\n\n    /* Collapsible Sections */\n    .sidebar-section { margin-bottom: 20px; }\n    .pinned-section .section-title .section-icon {\n      color: var(--mj-status-warning);\n      font-size: 11px;\n      margin-left: 2px;\n    }\n    .section-header {\n      padding: 4px 16px;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      cursor: pointer;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      font-weight: 500;\n      transition: background 0.2s;\n      user-select: none;\n    }\n    .section-header:hover { background: color-mix(in srgb, var(--conv-list-ink) 8%, transparent); }\n    .section-title {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .section-title i {\n      font-size: 10px;\n    }\n    .section-title i:not(.section-icon) {\n      transition: transform 0.2s;\n    }\n    .section-header.expanded .section-title i:not(.section-icon) { transform: rotate(90deg); }\n    .chat-list {\n      padding: 4px 0;\n      display: none;\n    }\n    .chat-list.expanded { display: block; }\n\n    .conversation-item {\n      padding: 6px 5px 6px 16px;\n      cursor: pointer;\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      transition: all 0.2s;\n      position: relative;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 14px;\n      min-height: 45px;\n    }\n    .conversation-item:hover { background: var(--conv-list-hover-bg); color: var(--conv-list-ink); }\n    .conversation-item:hover .conversation-actions { opacity: 1; }\n    .conversation-item.active { background: var(--conv-list-active-bg); color: var(--conv-list-active-ink); }\n    .conversation-icon-wrapper { position: relative; flex-shrink: 0; }\n    .conversation-icon { font-size: 12px; width: 16px; text-align: center; }\n    .conversation-icon.has-tasks { color: var(--mj-status-warning); }\n    .badge-overlay { position: absolute; top: -4px; right: -4px; }\n    .conversation-info { flex: 1; min-width: 0; }\n    .conversation-name { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 6px; }\n    .shared-indicator { font-size: 10px; color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent); flex-shrink: 0; }\n    .conversation-item.active .shared-indicator { color: color-mix(in srgb, var(--conv-list-active-ink) 85%, transparent); }\n    .conversation-preview { font-size: 12px; color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-item.active .conversation-preview { color: color-mix(in srgb, var(--conv-list-active-ink) 80%, transparent); }\n    .conversation-meta { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }\n\n    /* Project Badge */\n    .project-badge {\n      display: inline-block;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 10px;\n      font-weight: 600;\n      margin-left: auto;\n      background-color: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      white-space: nowrap;\n      max-width: 80px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n    .conversation-item:hover .project-badge {\n      background-color: color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      color: color-mix(in srgb, var(--conv-list-ink) 80%, transparent);\n    }\n    .conversation-item.active .project-badge {\n      background-color: color-mix(in srgb, var(--conv-list-active-ink) 20%, transparent);\n      color: var(--conv-list-active-ink);\n    }\n\n    .conversation-actions {\n      position: absolute;\n      right: 5px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      align-items: center;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 10;\n    }\n    .conversation-item:hover .conversation-actions { opacity: 1; pointer-events: auto; }\n    .conversation-item.active .conversation-actions { opacity: 1; pointer-events: auto; }\n    .conversation-actions > * { pointer-events: auto; }\n    .pinned-icon { color: var(--mj-brand-accent); font-size: 12px; }\n\n    /* Task Indicator */\n    .task-indicator {\n      color: var(--mj-status-warning);\n      font-size: 12px;\n      margin-right: 8px;\n      flex-shrink: 0;\n      animation: pulse-glow 2s ease-in-out infinite;\n    }\n    @keyframes pulse-glow {\n      0%, 100% {\n        opacity: 1;\n        filter: drop-shadow(0 0 2px var(--mj-status-warning));\n      }\n      50% {\n        opacity: 0.6;\n        filter: drop-shadow(0 0 4px var(--mj-status-warning));\n      }\n    }\n    .conversation-item.active .task-indicator {\n      color: var(--mj-status-warning);\n    }\n\n    .menu-btn {\n      width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      background: var(--conv-list-bg) !important;\n      border: none;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .menu-btn:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent) !important;\n      color: var(--conv-list-ink);\n    }\n    .conversation-item.active .menu-btn {\n      background: var(--conv-list-active-hover-bg) !important;\n      color: var(--conv-list-active-ink);\n    }\n    .menu-btn i { font-size: 14px; }\n\n    .context-menu {\n      position: absolute;\n      top: 100%;\n      right: 0;\n      margin-top: 4px;\n      min-width: 160px;\n      background: var(--conv-list-bg);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-lg);\n      z-index: 1001;\n      overflow: hidden;\n      pointer-events: auto;\n    }\n\n    .menu-item {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: color-mix(in srgb, var(--conv-list-ink) 85%, transparent);\n      font-size: 14px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .menu-item:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .menu-item i {\n      width: 16px;\n      font-size: 13px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n    }\n\n    .menu-item:hover i {\n      color: var(--conv-list-ink);\n    }\n\n    .menu-item.danger {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, transparent);\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger i {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger:hover i {\n      color: var(--mj-status-error);\n    }\n\n    .menu-divider {\n      height: 1px;\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      margin: 4px 0;\n    }\n\n    /* Rename Animation */\n    .conversation-item.renamed {\n      animation: renameHighlight 1500ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    /* Brand-token ramp (was hardcoded tailwind blue/purple/emerald rgba values,\n       which ignored theming): primary/accent open the flash, success/primary\n       carry the fade, at the original alpha ramp (40/35/30/20; glows 50-20). */\n    @keyframes renameHighlight {\n      0% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-brand-primary) 40%, transparent),\n          color-mix(in srgb, var(--mj-brand-accent) 40%, transparent));\n        transform: scale(1.03);\n        box-shadow: 0 0 20px color-mix(in srgb, var(--mj-brand-primary) 50%, transparent);\n      }\n      25% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-brand-primary) 35%, transparent),\n          color-mix(in srgb, var(--mj-brand-accent) 35%, transparent));\n        box-shadow: 0 0 15px color-mix(in srgb, var(--mj-brand-primary) 40%, transparent);\n      }\n      50% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-status-success) 30%, transparent),\n          color-mix(in srgb, var(--mj-brand-primary) 30%, transparent));\n        transform: scale(1.02);\n        box-shadow: 0 0 10px color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n      }\n      75% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-status-success) 20%, transparent),\n          color-mix(in srgb, var(--mj-brand-primary) 20%, transparent));\n        box-shadow: 0 0 5px color-mix(in srgb, var(--mj-status-success) 20%, transparent);\n      }\n      100% {\n        background: transparent;\n        transform: scale(1);\n        box-shadow: none;\n      }\n    }\n\n    /* Selection Mode Styles */\n    .header-top {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n    }\n\n    /* Header menu button and dropdown */\n    .header-menu-container {\n      position: relative;\n      flex-shrink: 0;\n    }\n\n    .btn-menu {\n      width: 32px;\n      height: 32px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .btn-menu:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n      border-color: color-mix(in srgb, var(--conv-list-ink) 30%, transparent);\n    }\n\n    .header-dropdown-menu {\n      position: absolute;\n      top: calc(100% + 4px);\n      right: 0;\n      min-width: 200px;\n      background: var(--conv-list-bg);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-lg);\n      z-index: 1001;\n      overflow: hidden;\n      padding: 4px 0;\n    }\n\n    .header-dropdown-menu .dropdown-item {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: color-mix(in srgb, var(--conv-list-ink) 85%, transparent);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .header-dropdown-menu .dropdown-item:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .header-dropdown-menu .dropdown-item i {\n      width: 16px;\n      font-size: 13px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n    }\n\n    .header-dropdown-menu .dropdown-item:hover i {\n      color: var(--conv-list-ink);\n    }\n\n    .header-dropdown-menu .dropdown-item .shortcut {\n      margin-left: auto;\n      font-size: 11px;\n      color: color-mix(in srgb, var(--conv-list-ink) 40%, transparent);\n      font-family: system-ui, -apple-system, sans-serif;\n    }\n\n    .btn-select {\n      padding: 8px 12px;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 13px;\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n      white-space: nowrap;\n      flex-shrink: 0;\n    }\n\n    .btn-select:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n      border-color: color-mix(in srgb, var(--conv-list-ink) 30%, transparent);\n    }\n\n    .conversation-checkbox {\n      display: flex;\n      align-items: center;\n      margin-right: 8px;\n      flex-shrink: 0;\n    }\n\n    .conversation-checkbox input[type=\"checkbox\"] {\n      width: 18px;\n      height: 18px;\n      cursor: pointer;\n      accent-color: var(--conv-list-accent);\n    }\n\n    .selection-action-bar {\n      position: sticky;\n      bottom: 0;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 12px 16px;\n      background: var(--conv-list-bg);\n      border-top: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      gap: 12px;\n      flex-wrap: wrap;\n      flex-shrink: 0;\n    }\n\n    .selection-info {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      color: color-mix(in srgb, var(--conv-list-ink) 90%, transparent);\n      font-size: 14px;\n      font-weight: 500;\n      flex: 1 1 auto;\n      min-width: 150px;\n    }\n\n    .selection-count {\n      color: var(--conv-list-ink);\n    }\n\n    .link-btn {\n      background: none;\n      border: none;\n      color: var(--mj-brand-accent);\n      cursor: pointer;\n      font-size: 13px;\n      text-decoration: underline;\n      padding: 0;\n      transition: color 0.2s;\n    }\n\n    .link-btn:hover {\n      color: var(--conv-list-ink);\n    }\n\n    .selection-actions {\n      display: flex;\n      gap: 8px;\n      flex: 0 0 auto;\n    }\n\n    .btn-cancel {\n      padding: 8px 16px;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 500;\n      transition: all 0.2s;\n    }\n\n    .btn-cancel:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .btn-delete-bulk {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 8px 16px;\n      background: var(--mj-status-error);\n      border: none;\n      border-radius: 6px;\n      /* Deliberately NOT --conv-list-ink: this ink sits on the error-red button,\n         not the panel, so it must not follow a panel remap. (brand-on-secondary\n         stays light in both modes; text-inverse flips dark in dark mode.) */\n      color: var(--mj-brand-on-secondary);\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 600;\n      transition: all 0.2s;\n    }\n\n    .btn-delete-bulk:hover:not(:disabled) {\n      background: color-mix(in srgb, var(--mj-status-error) 80%, black);\n    }\n\n    .btn-delete-bulk:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .btn-delete-bulk i {\n      font-size: 12px;\n    }\n\n    /* Folders */\n    .section-action-btn {\n      width: 24px;\n      height: 24px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .section-action-btn:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      color: var(--conv-list-ink);\n    }\n    .section-action-btn i { font-size: 12px; }\n\n    .folder-row {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 5px 8px 5px 12px;\n      cursor: pointer;\n      color: color-mix(in srgb, var(--conv-list-ink) 80%, transparent);\n      font-size: 13px;\n      transition: background 0.15s;\n      user-select: none;\n      position: relative;\n    }\n    .folder-row:hover { background: color-mix(in srgb, var(--conv-list-ink) 8%, transparent); }\n    .folder-row.drag-over {\n      background: color-mix(in srgb, var(--conv-list-accent) 25%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n    }\n    .folder-row.dragging { opacity: 0.4; }\n    .section-header.drag-over {\n      background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n      border-radius: 6px;\n    }\n    .folder-chevron {\n      font-size: 9px;\n      width: 10px;\n      flex-shrink: 0;\n      transition: transform 0.2s;\n      color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent);\n    }\n    .folder-chevron.expanded { transform: rotate(90deg); }\n    .folder-icon { font-size: 12px; width: 16px; text-align: center; flex-shrink: 0; }\n    .folder-name {\n      flex: 1;\n      min-width: 0;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      font-weight: 600;\n    }\n    .folder-count {\n      font-size: 11px;\n      font-weight: 600;\n      color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent);\n      flex-shrink: 0;\n      margin-left: auto;\n      padding-left: 6px;\n      text-align: right;\n    }\n    .folder-actions {\n      position: absolute;\n      right: 6px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      gap: 2px;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 5;\n    }\n    .folder-row:hover .folder-actions { opacity: 1; pointer-events: auto; }\n    .folder-row:hover .folder-count { opacity: 0; }\n    .folder-action-btn {\n      width: 22px;\n      height: 22px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n    .folder-action-btn:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 18%, transparent);\n      color: var(--conv-list-ink);\n    }\n    .folder-action-btn.danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 18%, transparent);\n      color: var(--mj-status-error);\n    }\n    .folder-action-btn i { font-size: 11px; }\n    .folder-children { display: block; }\n    .folder-empty-hint {\n      padding: 6px 16px;\n      font-size: 11px;\n      font-style: italic;\n      color: color-mix(in srgb, var(--conv-list-ink) 45%, transparent);\n    }\n    .ungrouped-section.drag-over {\n      background: color-mix(in srgb, var(--conv-list-accent) 12%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n      border-radius: 6px;\n    }\n\n    /* Dragging state */\n    .conversation-item { user-select: none; }\n    .conversation-item.dragging { opacity: 0.4; }\n\n    /* Move-to-folder submenu */\n    .menu-item.back { font-weight: 600; }\n    .menu-item .submenu-arrow { margin-left: auto; font-size: 10px; }\n    .menu-item.current { background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent); }\n    .move-folder-list { max-height: 240px; overflow-y: auto; }\n  "] }]
-    }], () => [{ type: i1.DialogService }, { type: i2.NotificationService }, { type: i3.ActiveTasksService }, { type: i4.MJDialogService }, { type: i0.ChangeDetectorRef }], { environmentId: [{
+    }
+  `, styles: ["\n    :host {\n      display: block;\n      height: 100%;\n      /* White-label theming tokens for the list panel. The public\n         --mj-chat-list-* custom properties are host-overridable (set\n         them at :root or on any ancestor); the private --conv-list-* names\n         resolve the fallback ONCE here so the 70+ usages below stay simple.\n         (A self-referential var() fallback would be a custom-property cycle,\n         so the two-name indirection is required, not stylistic.) Defaults\n         preserve the stock look exactly: a brand-secondary panel with\n         on-secondary ink. Hover/border/divider states derive from the ink via\n         color-mix, so they follow automatically when the ink is remapped.\n         The accent trio drives the panel's ACTION surfaces (New Conversation\n         button, search-focus ring, checkbox tick, drag-over highlights) \u2014\n         independent of the active-row pair so a host can tint actions on their\n         own; defaults to the brand-primary action color, unchanged.\n         --conv-list-hover-bg is the row-hover wash: it defaults to the same\n         ink-derived tint as before (so a bg/ink remap still gives a neutral\n         hover), but a host can point it at a brand tint to make hover an accent\n         cue while keeping the panel itself on a neutral surface. */\n      --conv-list-bg: var(--mj-chat-list-bg, var(--mj-brand-secondary));\n      --conv-list-ink: var(--mj-chat-list-ink, var(--mj-brand-on-secondary));\n      --conv-list-active-bg: var(--mj-chat-list-active-bg, var(--mj-brand-primary));\n      --conv-list-active-ink: var(--mj-chat-list-active-ink, var(--mj-brand-on-secondary));\n      --conv-list-active-hover-bg: var(--mj-chat-list-active-hover-bg, var(--mj-brand-primary-hover));\n      --conv-list-accent: var(--mj-chat-list-accent, var(--mj-brand-primary));\n      --conv-list-accent-ink: var(--mj-chat-list-accent-ink, var(--mj-text-inverse));\n      --conv-list-accent-hover: var(--mj-chat-list-accent-hover, var(--mj-brand-primary-hover));\n      --conv-list-hover-bg: var(--mj-chat-list-hover-bg, color-mix(in srgb, var(--conv-list-ink) 8%, transparent));\n    }\n    .conversation-list { display: flex; flex-direction: column; height: 100%; background: var(--conv-list-bg); }\n    .list-header { padding: 8px; border-bottom: 1px solid color-mix(in srgb, var(--conv-list-ink) 10%, transparent); }\n    .search-box { position: relative; flex: 1; min-width: 0; display: flex; }\n    .search-clear {\n      position: absolute;\n      right: 4px;\n      top: 50%;\n      transform: translateY(-50%);\n      width: 22px;\n      height: 22px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: 0;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent);\n      font-size: 12px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .sort-row { display: flex; gap: 6px; margin-top: 8px; }\n    .sort-btn {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 4px 10px;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 12px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .sort-btn i { font-size: 11px; }\n    .sort-btn:hover { background: var(--conv-list-hover-bg); color: var(--conv-list-ink); }\n    .sort-btn.active {\n      background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent);\n      border-color: var(--conv-list-accent);\n      color: var(--conv-list-ink);\n      font-weight: 600;\n    }\n    .search-clear:hover { background: color-mix(in srgb, var(--conv-list-ink) 12%, transparent); color: var(--conv-list-ink); }\n    .search-input {\n      width: 100%;\n      padding: 8px 28px 8px 12px;\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      transition: all 0.2s;\n    }\n    .search-input::placeholder { color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent); }\n    .search-input:focus { outline: none; background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent); border-color: var(--conv-list-accent); }\n    .btn-new-conversation {\n      width: calc(100% - 16px);\n      margin: 8px;\n      padding: 10px;\n      background: var(--conv-list-accent);\n      color: var(--conv-list-accent-ink);\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n      font-size: 14px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      transition: background 0.2s;\n      flex-shrink: 0;\n    }\n    .btn-new-conversation:hover { background: var(--conv-list-accent-hover); }\n    .btn-new-conversation i { font-size: 14px; }\n    .list-content { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 0; }\n\n    /* Collapsible Sections */\n    .sidebar-section { margin-bottom: 20px; }\n\n    /* Reads as a continuation of the list rather than a second control: full-width row,\n       ink-derived like every other affordance in this panel, no input styling. */\n    .search-escalate {\n      flex-shrink: 0;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      width: 100%;\n      padding: 10px 12px;\n      border: none;\n      border-top: 1px solid color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      background: transparent;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .search-escalate:hover {\n      background: var(--conv-list-hover-bg);\n      color: var(--conv-list-ink);\n    }\n\n    /* Truncate rather than wrap \u2014 the query is user text of unbounded length. */\n    .search-escalate-label {\n      flex: 1;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    .search-escalate-go { opacity: 0.6; }\n    .pinned-section .section-title .section-icon {\n      color: var(--mj-status-warning);\n      font-size: 11px;\n      margin-left: 2px;\n    }\n    .section-header {\n      padding: 4px 16px;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      cursor: pointer;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      font-weight: 500;\n      transition: background 0.2s;\n      user-select: none;\n    }\n    .section-header:hover { background: color-mix(in srgb, var(--conv-list-ink) 8%, transparent); }\n    .section-title {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .section-title i {\n      font-size: 10px;\n    }\n    .section-title i:not(.section-icon) {\n      transition: transform 0.2s;\n    }\n    .section-header.expanded .section-title i:not(.section-icon) { transform: rotate(90deg); }\n    .chat-list {\n      padding: 4px 0;\n      display: none;\n    }\n    .chat-list.expanded { display: block; }\n\n    .conversation-item {\n      padding: 6px 5px 6px 16px;\n      cursor: pointer;\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      transition: all 0.2s;\n      position: relative;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 14px;\n      min-height: 45px;\n    }\n    .conversation-item:hover { background: var(--conv-list-hover-bg); color: var(--conv-list-ink); }\n    .conversation-item:hover .conversation-actions { opacity: 1; }\n    .conversation-item.active { background: var(--conv-list-active-bg); color: var(--conv-list-active-ink); }\n    /* A selected row is marked by its ticked checkbox and an accent tint. The\n       open conversation keeps its solid .active fill, so a row that is both\n       still reads as the open one. */\n    .conversation-item.selected { background: color-mix(in srgb, var(--conv-list-accent) 16%, transparent); }\n    .conversation-item.selected:hover { background: color-mix(in srgb, var(--conv-list-accent) 24%, transparent); }\n    .conversation-item.active.selected { background: var(--conv-list-active-bg); }\n    /* Row checkbox: the mouse route to a selection. It sits in the row's left\n       padding, hidden until the row is hovered, and shows on every row while a\n       selection exists (on touch too, where there is no hover). */\n    .row-check {\n      position: absolute;\n      top: 50%;\n      transform: translateY(-50%);\n      width: 14px;\n      height: 14px;\n      padding: 0;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: 1.5px solid color-mix(in srgb, var(--conv-list-ink) 45%, transparent);\n      border-radius: 3px;\n      color: transparent;\n      cursor: pointer;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.15s;\n      z-index: 2;\n    }\n    .row-check i { font-size: 8px; }\n    .conversation-list.is-selecting .row-check { opacity: 1; pointer-events: auto; }\n    @media (hover: hover) {\n      .conversation-item:hover .row-check { opacity: 1; pointer-events: auto; }\n    }\n    .row-check.checked {\n      background: var(--conv-list-accent);\n      border-color: var(--conv-list-accent);\n      color: var(--conv-list-accent-ink);\n    }\n    .conversation-item.active .row-check:not(.checked) {\n      border-color: color-mix(in srgb, var(--conv-list-active-ink) 70%, transparent);\n    }\n    .conversation-icon-wrapper { position: relative; flex-shrink: 0; }\n    .conversation-icon { font-size: 12px; width: 16px; text-align: center; }\n    .conversation-icon.has-tasks { color: var(--mj-status-warning); }\n    .badge-overlay { position: absolute; top: -4px; right: -4px; }\n    .conversation-info { flex: 1; min-width: 0; }\n    .conversation-name { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 6px; }\n    .shared-indicator { font-size: 10px; color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent); flex-shrink: 0; }\n    .conversation-item.active .shared-indicator { color: color-mix(in srgb, var(--conv-list-active-ink) 85%, transparent); }\n    .conversation-preview { font-size: 12px; color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-item.active .conversation-preview { color: color-mix(in srgb, var(--conv-list-active-ink) 80%, transparent); }\n    .conversation-meta { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }\n\n    /* Project Badge */\n    .project-badge {\n      display: inline-block;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 10px;\n      font-weight: 600;\n      margin-left: auto;\n      background-color: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      white-space: nowrap;\n      max-width: 80px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n    .conversation-item:hover .project-badge {\n      background-color: color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      color: color-mix(in srgb, var(--conv-list-ink) 80%, transparent);\n    }\n    .conversation-item.active .project-badge {\n      background-color: color-mix(in srgb, var(--conv-list-active-ink) 20%, transparent);\n      color: var(--conv-list-active-ink);\n    }\n\n    .conversation-actions {\n      position: absolute;\n      right: 5px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      align-items: center;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 10;\n    }\n    .conversation-item:hover .conversation-actions { opacity: 1; pointer-events: auto; }\n    .conversation-item.active .conversation-actions { opacity: 1; pointer-events: auto; }\n    .conversation-actions > * { pointer-events: auto; }\n    /* No hover on touch, so the \u22EF button is always shown there. */\n    @media (hover: none) {\n      .conversation-actions { opacity: 1; pointer-events: auto; }\n    }\n    .pinned-icon { color: var(--mj-brand-accent); font-size: 12px; }\n\n    /* Task Indicator */\n    .task-indicator {\n      color: var(--mj-status-warning);\n      font-size: 12px;\n      margin-right: 8px;\n      flex-shrink: 0;\n      animation: pulse-glow 2s ease-in-out infinite;\n    }\n    @keyframes pulse-glow {\n      0%, 100% {\n        opacity: 1;\n        filter: drop-shadow(0 0 2px var(--mj-status-warning));\n      }\n      50% {\n        opacity: 0.6;\n        filter: drop-shadow(0 0 4px var(--mj-status-warning));\n      }\n    }\n    .conversation-item.active .task-indicator {\n      color: var(--mj-status-warning);\n    }\n\n    .menu-btn {\n      width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      background: var(--conv-list-bg) !important;\n      border: none;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .menu-btn:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent) !important;\n      color: var(--conv-list-ink);\n    }\n    .conversation-item.active .menu-btn {\n      background: var(--conv-list-active-hover-bg) !important;\n      color: var(--conv-list-active-ink);\n    }\n    .menu-btn i { font-size: 14px; }\n\n    /* The one right-click menu. Fixed to the viewport so it escapes the list's\n       scroll container and is never clipped by a row. */\n    .list-context-menu {\n      position: fixed;\n      min-width: 190px;\n      max-height: 70vh;\n      overflow-y: auto;\n      background: var(--conv-list-bg);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-lg);\n      z-index: 1001;\n      padding: 4px 0;\n    }\n\n    .context-menu-header {\n      padding: 6px 14px 8px;\n      font-size: 12px;\n      font-weight: 600;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      border-bottom: 1px solid color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      margin-bottom: 4px;\n    }\n\n    .menu-item {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: color-mix(in srgb, var(--conv-list-ink) 85%, transparent);\n      font-size: 14px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .menu-item:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .menu-item i {\n      width: 16px;\n      font-size: 13px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n    }\n\n    .menu-item:hover i {\n      color: var(--conv-list-ink);\n    }\n\n    .menu-item.danger {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, transparent);\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger i {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger:hover i {\n      color: var(--mj-status-error);\n    }\n\n    .menu-divider {\n      height: 1px;\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      margin: 4px 0;\n    }\n\n    /* Rename Animation */\n    .conversation-item.renamed {\n      animation: renameHighlight 1500ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    /* Brand-token ramp (was hardcoded tailwind blue/purple/emerald rgba values,\n       which ignored theming): primary/accent open the flash, success/primary\n       carry the fade, at the original alpha ramp (40/35/30/20; glows 50-20). */\n    @keyframes renameHighlight {\n      0% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-brand-primary) 40%, transparent),\n          color-mix(in srgb, var(--mj-brand-accent) 40%, transparent));\n        transform: scale(1.03);\n        box-shadow: 0 0 20px color-mix(in srgb, var(--mj-brand-primary) 50%, transparent);\n      }\n      25% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-brand-primary) 35%, transparent),\n          color-mix(in srgb, var(--mj-brand-accent) 35%, transparent));\n        box-shadow: 0 0 15px color-mix(in srgb, var(--mj-brand-primary) 40%, transparent);\n      }\n      50% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-status-success) 30%, transparent),\n          color-mix(in srgb, var(--mj-brand-primary) 30%, transparent));\n        transform: scale(1.02);\n        box-shadow: 0 0 10px color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n      }\n      75% {\n        background: linear-gradient(90deg,\n          color-mix(in srgb, var(--mj-status-success) 20%, transparent),\n          color-mix(in srgb, var(--mj-brand-primary) 20%, transparent));\n        box-shadow: 0 0 5px color-mix(in srgb, var(--mj-status-success) 20%, transparent);\n      }\n      100% {\n        background: transparent;\n        transform: scale(1);\n        box-shadow: none;\n      }\n    }\n\n    /* Header top row: the search box and \u22EF menu, or the selection bar while a\n       selection exists. A fixed minimum height keeps the list from jumping\n       when one replaces the other. */\n    .header-top {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      min-height: 36px;\n    }\n\n    .selection-bar {\n      display: flex;\n      align-items: center;\n      gap: 2px;\n      flex: 1;\n      min-width: 0;\n    }\n\n    .selection-count {\n      flex: 1;\n      min-width: 0;\n      padding: 0 6px;\n      color: var(--conv-list-ink);\n      font-size: 13px;\n      font-weight: 600;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .selection-bar-btn {\n      width: 32px;\n      height: 32px;\n      flex-shrink: 0;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: 0;\n      background: transparent;\n      border: none;\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 75%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .selection-bar-btn i { font-size: 13px; }\n    .selection-bar-btn:hover:not(:disabled) { background: var(--conv-list-hover-bg); color: var(--conv-list-ink); }\n    .selection-bar-btn:disabled { opacity: 0.4; cursor: not-allowed; }\n    .selection-bar-btn.danger:hover:not(:disabled) {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, transparent);\n      color: var(--mj-status-error);\n    }\n\n    /* Header menu button and dropdown */\n    .header-menu-container {\n      position: relative;\n      flex-shrink: 0;\n    }\n\n    .btn-menu {\n      width: 32px;\n      height: 32px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .btn-menu:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n      border-color: color-mix(in srgb, var(--conv-list-ink) 30%, transparent);\n    }\n\n    .header-dropdown-menu {\n      position: absolute;\n      top: calc(100% + 4px);\n      right: 0;\n      min-width: 200px;\n      background: var(--conv-list-bg);\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-lg);\n      z-index: 1001;\n      overflow: hidden;\n      padding: 4px 0;\n    }\n\n    .header-dropdown-menu .dropdown-item {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: color-mix(in srgb, var(--conv-list-ink) 85%, transparent);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .header-dropdown-menu .dropdown-item:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n    }\n\n    .header-dropdown-menu .dropdown-item i {\n      width: 16px;\n      font-size: 13px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n    }\n\n    .header-dropdown-menu .dropdown-item:hover i {\n      color: var(--conv-list-ink);\n    }\n\n    .header-dropdown-menu .dropdown-item .shortcut {\n      margin-left: auto;\n      font-size: 11px;\n      color: color-mix(in srgb, var(--conv-list-ink) 40%, transparent);\n      font-family: system-ui, -apple-system, sans-serif;\n    }\n\n    .btn-select {\n      padding: 8px 12px;\n      background: transparent;\n      border: 1px solid color-mix(in srgb, var(--conv-list-ink) 20%, transparent);\n      border-radius: 6px;\n      color: color-mix(in srgb, var(--conv-list-ink) 70%, transparent);\n      font-size: 13px;\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n      white-space: nowrap;\n      flex-shrink: 0;\n    }\n\n    .btn-select:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 10%, transparent);\n      color: var(--conv-list-ink);\n      border-color: color-mix(in srgb, var(--conv-list-ink) 30%, transparent);\n    }\n\n\n    /* Folders */\n    .section-action-btn {\n      width: 24px;\n      height: 24px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: color-mix(in srgb, var(--conv-list-ink) 60%, transparent);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .section-action-btn:hover {\n      background: color-mix(in srgb, var(--conv-list-ink) 15%, transparent);\n      color: var(--conv-list-ink);\n    }\n    .section-action-btn i { font-size: 12px; }\n\n    .folder-row {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 5px 8px 5px 12px;\n      cursor: pointer;\n      color: color-mix(in srgb, var(--conv-list-ink) 80%, transparent);\n      font-size: 13px;\n      transition: background 0.15s;\n      user-select: none;\n      position: relative;\n    }\n    .folder-row:hover { background: color-mix(in srgb, var(--conv-list-ink) 8%, transparent); }\n    .folder-row.drag-over {\n      background: color-mix(in srgb, var(--conv-list-accent) 25%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n    }\n    .folder-row.dragging { opacity: 0.4; }\n    .section-header.drag-over {\n      background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n      border-radius: 6px;\n    }\n    .folder-chevron {\n      font-size: 9px;\n      width: 10px;\n      flex-shrink: 0;\n      transition: transform 0.2s;\n      color: color-mix(in srgb, var(--conv-list-ink) 55%, transparent);\n    }\n    .folder-chevron.expanded { transform: rotate(90deg); }\n    .folder-icon { font-size: 12px; width: 16px; text-align: center; flex-shrink: 0; }\n    .folder-name {\n      /* NOT flex: 1. Growing to fill the row would push the shared badge to the right\n         edge, beside the count, instead of beside the name it describes. The\n         .folder-spacer after the badge takes the slack instead. Shrink + min-width:0\n         keeps the ellipsis behaviour on a long name. */\n      flex: 0 1 auto;\n      min-width: 0;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      font-weight: 600;\n    }\n    .folder-count {\n      font-size: 11px;\n      font-weight: 600;\n      color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent);\n      flex-shrink: 0;\n      margin-left: auto;\n      padding-left: 6px;\n      text-align: right;\n    }\n    .folder-spacer {\n      flex: 1 1 auto;\n      min-width: 0;\n    }\n    .folder-shared {\n      flex-shrink: 0;\n      margin-left: 6px;\n      font-size: 10px;\n      line-height: 1;\n      /* Same muted treatment as .folder-count, so it reads as metadata and does not\n         compete with the folder's own colour. */\n      color: color-mix(in srgb, var(--conv-list-ink) 50%, transparent);\n    }\n    .folder-children { display: block; }\n    .folder-empty-hint {\n      padding: 6px 16px;\n      font-size: 11px;\n      font-style: italic;\n      color: color-mix(in srgb, var(--conv-list-ink) 45%, transparent);\n    }\n    .ungrouped-section.drag-over {\n      background: color-mix(in srgb, var(--conv-list-accent) 12%, transparent);\n      box-shadow: inset 0 0 0 1px var(--conv-list-accent);\n      border-radius: 6px;\n    }\n\n    /* Dragging state. Rows never select text or raise the touch callout, so a\n       long-press can select the row instead. */\n    .conversation-item { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }\n    .conversation-item.dragging { opacity: 0.4; }\n\n    /* Move-to-folder submenu */\n    .menu-item.back { font-weight: 600; }\n    .menu-item .submenu-arrow { margin-left: auto; font-size: 10px; }\n    .menu-item.current { background: color-mix(in srgb, var(--conv-list-accent) 18%, transparent); }\n    .move-folder-list { max-height: 240px; overflow-y: auto; }\n  "] }]
+    }], () => [{ type: i1.DialogService }, { type: i2.NotificationService }, { type: i3.ActiveTasksService }, { type: i4.MJDialogService }, { type: i0.ChangeDetectorRef }], { EnvironmentId: [{
             type: Input
-        }], currentUser: [{
+        }], CurrentUser: [{
             type: Input
-        }], selectedConversationId: [{
+        }], SelectedConversationId: [{
             type: Input
-        }], renamedConversationId: [{
+        }], RenamedConversationId: [{
             type: Input
-        }], isSidebarPinned: [{
+        }], IsSidebarPinned: [{
             type: Input
-        }], isMobileView: [{
+        }], IsMobileView: [{
             type: Input
         }], showSearch: [{
             type: Input
-        }], showNewConversationButton: [{
+        }], ShowNewConversationButton: [{
             type: Input
-        }], showHeaderMenu: [{
+        }], ShowHeaderMenu: [{
             type: Input
-        }], showSectionHeaders: [{
+        }], ShowSectionHeaders: [{
             type: Input
+        }], ConversationSelected: [{
+            type: Output
         }], conversationSelected: [{
             type: Output
+        }], ConversationDeleted: [{
+            type: Output
         }], conversationDeleted: [{
             type: Output
+        }], NewConversationRequested: [{
+            type: Output
         }], newConversationRequested: [{
             type: Output
+        }], PinSidebarRequested: [{
+            type: Output
         }], pinSidebarRequested: [{
             type: Output
+        }], UnpinSidebarRequested: [{
+            type: Output
         }], unpinSidebarRequested: [{
             type: Output
+        }], RefreshRequested: [{
+            type: Output
         }], refreshRequested: [{
             type: Output
+        }], SearchEscalated: [{
+            type: Output
+        }], searchInput: [{
+            type: ViewChild,
+            args: ['searchInput']
+        }], contextMenuEl: [{
+            type: ViewChild,
+            args: ['contextMenuEl']
         }], onDocumentClick: [{
             type: HostListener,
             args: ['document:click']
+        }], onDocumentEscape: [{
+            type: HostListener,
+            args: ['document:keydown.escape']
+        }], environmentId: [{
+            type: Input
+        }], currentUser: [{
+            type: Input
+        }], selectedConversationId: [{
+            type: Input
+        }], renamedConversationId: [{
+            type: Input
+        }], isSidebarPinned: [{
+            type: Input
+        }], isMobileView: [{
+            type: Input
+        }], showNewConversationButton: [{
+            type: Input
+        }], showHeaderMenu: [{
+            type: Input
+        }], showSectionHeaders: [{
+            type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ConversationListComponent, { className: "ConversationListComponent", filePath: "src/lib/components/conversation/conversation-list.component.ts", lineNumber: 1029 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ConversationListComponent, { className: "ConversationListComponent", filePath: "src/lib/components/conversation/conversation-list.component.ts", lineNumber: 1260 }); })();
 //# sourceMappingURL=conversation-list.component.js.map