@burdenoff/microfe-conversations 2026.510.117

package/dist/conversations/pages/ConversationDetailPage.js

@@ -0,0 +1,439 @@
+import { useConversations as e } from "../providers/ConversationsProvider.js";
+import { cn as t } from "../utils/cn.js";
+import { useConversationActions as n, useGetConversation as r } from "../hooks/useConversationQueries.js";
+import { useMessageStreamForConversation as i } from "../hooks/useMessageSubscriptions.js";
+import { useConversationsStore as ee } from "../store/conversationsStore.js";
+import { PermissionGuard as a } from "../components/PermissionGuard.js";
+import { CONVERSATIONS_PERMISSIONS as o } from "../constants/permissions.js";
+import { nativeImpact as te, nativeNotify as s } from "../../utils/nativeBridge.js";
+import { MessageBubble as ne } from "../components/MessageBubble.js";
+import { useEditMessage as re, useGetMessages as ie, useMessageActions as ae, useSendMessage as oe } from "../hooks/useMessageQueries.js";
+import { useCallback as c, useEffect as l, useMemo as se, useRef as u, useState as d } from "react";
+import { Archive as ce, ArrowLeft as le, Bell as ue, BellOff as de, ExternalLink as fe, Hash as pe, Loader2 as me, MessageCircle as he, MoreVertical as ge, Pin as _e, PinOff as ve, SendHorizontal as ye, Users as be, X as xe } from "lucide-react";
+import { useNavigate as Se, useParams as Ce } from "react-router-dom";
+import { useEventBus as we } from "@burdenoff/fe-libs/shared/events";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { useI18n as Te } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+//#region src/conversations/pages/ConversationDetailPage.tsx
+function m() {
+	let { conversationId: a } = Ce(), o = Se(), { basePath: m, currentUser: Ee } = e(), _ = we(), { t: De } = Te(), v = (e, t) => {
+		let n = De(e);
+		return n === e ? t : n;
+	}, { clearMessageDraft: y, isParticipantsPanelOpen: b, messageDrafts: Oe, setMessageDraft: x, toggleParticipantsPanel: S } = ee(), [C, w] = d(Oe[a ?? ""] ?? ""), T = u(null), { conversation: E, loading: ke, error: D } = r(a ?? ""), { messages: O, loading: k, error: A } = ie(a ?? "", { first: 100 });
+	i(a);
+	let { sendMessage: j, loading: M } = oe(), { editMessage: N, loading: P } = re(), { deleteMessage: F, addReaction: I, removeReaction: L, pinMessage: R, unpinMessage: z } = ae(), { archiveConversation: B, pinConversation: V, unpinConversation: Ae, muteConversation: je, unmuteConversation: Me } = n(), [H, U] = d(!1), [W, G] = d(null), [K, q] = d(""), [J, Y] = d(null), X = u(null), Ne = Ee?.id ?? "", Z = E?.sourceContext;
+	l(() => {
+		T.current?.scrollIntoView({ behavior: "smooth" });
+	}, [O.length]), l(() => {
+		if (a) {
+			if (C.trim()) {
+				x(a, C);
+				return;
+			}
+			y(a);
+		}
+	}, [
+		C,
+		a,
+		x,
+		y
+	]);
+	let Pe = se(() => {
+		let e = /* @__PURE__ */ new Map();
+		for (let t of O) !t.authorId || e.has(t.authorId) || e.set(t.authorId, {
+			id: t.authorId,
+			name: t.sender.name || t.authorId
+		});
+		return Array.from(e.values());
+	}, [O]), Q = c(async () => {
+		if (!a || !C.trim() || M) return;
+		let e = await j({
+			conversationId: a,
+			content: C.trim(),
+			type: "TEXT",
+			parentMessageId: J?.id
+		});
+		e && (_.emit("conversations.message.sent", {
+			messageId: e.id,
+			conversationId: a
+		}), w(""), Y(null), y(a));
+	}, [
+		_,
+		a,
+		C,
+		M,
+		j,
+		y,
+		J
+	]), Fe = c((e) => {
+		e.key !== "Enter" || e.shiftKey || (e.preventDefault(), Q());
+	}, [Q]);
+	l(() => {
+		a && _.emit("conversations.conversation.opened", { conversationId: a });
+	}, [_, a]), l(() => {
+		if (!H) return;
+		let e = (e) => {
+			X.current && !X.current.contains(e.target) && U(!1);
+		};
+		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+	}, [H]);
+	let Ie = c((e) => {
+		Y({
+			id: e.id,
+			content: e.content,
+			sender: e.sender.name
+		});
+	}, []), Le = c(async (e, t) => {
+		try {
+			await I(e, t);
+		} catch {
+			await L(e, t).catch(() => {});
+		}
+	}, [I, L]), Re = c((e) => {
+		G(e.id), q(e.content);
+	}, []), ze = c(async () => {
+		!W || !K.trim() || P || (await N(W, K.trim()), G(null), q(""));
+	}, [
+		W,
+		K,
+		P,
+		N
+	]), $ = c(() => {
+		G(null), q("");
+	}, []), Be = c(async (e) => {
+		te("medium");
+		try {
+			await F(e), s("success");
+		} catch (e) {
+			throw s("error"), e;
+		}
+	}, [F]), Ve = c(async (e, t) => {
+		if (t) {
+			await z(e);
+			return;
+		}
+		await R(e);
+	}, [R, z]), He = c(async () => {
+		a && (E?.isPinned ? await Ae(a) : await V(a), U(!1));
+	}, [
+		a,
+		E?.isPinned,
+		V,
+		Ae
+	]), Ue = c(async () => {
+		a && (E?.isMuted ? await Me(a) : await je(a), U(!1));
+	}, [
+		a,
+		E?.isMuted,
+		je,
+		Me
+	]), We = c(async () => {
+		a && (await B(a), _.emit("conversations.conversation.archived", { conversationId: a }), U(!1), o(m || "/conversations"));
+	}, [
+		B,
+		m,
+		_,
+		a,
+		o
+	]), Ge = c(() => {
+		if (Z?.contextHref) {
+			try {
+				let e = new URL(Z.contextHref);
+				if (e.origin === window.location.origin) {
+					o(`${e.pathname}${e.search}${e.hash}`);
+					return;
+				}
+			} catch {}
+			window.location.assign(Z.contextHref);
+		}
+	}, [o, Z?.contextHref]);
+	return !E && ke ? /* @__PURE__ */ f("div", {
+		className: "flex items-center justify-center h-[calc(100vh-64px)] text-sm text-muted-foreground",
+		children: v("conversations.loading", "Loading conversation...")
+	}) : !E || D ? /* @__PURE__ */ p("div", {
+		className: "flex flex-col items-center justify-center h-[calc(100vh-64px)] text-center gap-3 px-4",
+		children: [
+			/* @__PURE__ */ f(he, { className: "h-8 w-8 text-muted-foreground" }),
+			/* @__PURE__ */ f("p", {
+				className: "text-sm text-muted-foreground",
+				children: D ? v("conversations.unavailable", "We couldn't load this conversation. Please try again.") : v("conversations.notFound", "Conversation not found")
+			}),
+			/* @__PURE__ */ f("button", {
+				type: "button",
+				onClick: () => o(m || "/conversations"),
+				className: "px-3 py-2 text-sm font-medium rounded-lg border border-border hover:bg-muted/50",
+				children: v("conversations.back", "Back to conversations")
+			})
+		]
+	}) : /* @__PURE__ */ p("div", {
+		className: "flex h-[calc(100vh-64px)] bg-background",
+		children: [/* @__PURE__ */ p("div", {
+			className: "flex-1 flex flex-col min-w-0",
+			children: [
+				/* @__PURE__ */ p("header", {
+					className: "flex items-center justify-between px-4 py-3 border-b border-border bg-background/95 backdrop-blur-sm",
+					children: [/* @__PURE__ */ p("div", {
+						className: "flex items-center gap-3 min-w-0",
+						children: [/* @__PURE__ */ f("button", {
+							type: "button",
+							onClick: () => o(m || "/conversations"),
+							className: "p-1.5 rounded-lg text-muted-foreground hover:text-foreground hover:bg-muted/50 transition-colors",
+							children: /* @__PURE__ */ f(le, { size: 18 })
+						}), /* @__PURE__ */ p("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ p("div", {
+								className: "flex items-center gap-1.5",
+								children: [E.type === "CHANNEL" && /* @__PURE__ */ f(pe, {
+									size: 14,
+									className: "text-muted-foreground flex-shrink-0"
+								}), /* @__PURE__ */ f("h2", {
+									className: "text-sm font-semibold text-foreground truncate",
+									children: E.title
+								})]
+							}), /* @__PURE__ */ f("p", {
+								className: "text-xs text-muted-foreground",
+								children: E.type === "DIRECT" ? v("conversations.directConversation", "Direct conversation") : E.type === "CHANNEL" ? `${v("conversations.channel", "Channel")} · ${E.memberCount} ${v("conversations.membersCountLabel", "members")}` : E.type === "ANNOUNCEMENT" ? `${v("conversations.announcement", "Announcement")} · ${E.memberCount} ${v("conversations.membersCountLabel", "members")}` : `${E.memberCount} ${v("conversations.membersCountLabel", "members")}`
+							})]
+						})]
+					}), /* @__PURE__ */ p("div", {
+						className: "flex items-center gap-1",
+						children: [
+							Z?.contextHref && /* @__PURE__ */ f(g, {
+								icon: /* @__PURE__ */ f(fe, { size: 16 }),
+								label: v("conversations.openContext", "Open context"),
+								onClick: Ge
+							}),
+							E.isGroup && /* @__PURE__ */ f(g, {
+								icon: /* @__PURE__ */ f(be, { size: 16 }),
+								label: v("conversations.participants", "Participants"),
+								active: b,
+								onClick: S
+							}),
+							/* @__PURE__ */ p("div", {
+								className: "relative",
+								ref: X,
+								children: [/* @__PURE__ */ f(g, {
+									icon: /* @__PURE__ */ f(ge, { size: 16 }),
+									label: v("conversations.moreOptions", "More options"),
+									active: H,
+									onClick: () => U((e) => !e)
+								}), H && /* @__PURE__ */ p("div", {
+									className: "absolute right-0 top-full mt-1 w-48 bg-popover border border-border rounded-lg shadow-lg z-50 py-1 animate-in fade-in-0 zoom-in-95 duration-100",
+									children: [
+										/* @__PURE__ */ f(h, {
+											icon: E.isPinned ? /* @__PURE__ */ f(ve, { size: 14 }) : /* @__PURE__ */ f(_e, { size: 14 }),
+											label: E.isPinned ? v("conversations.unpinConversation", "Unpin conversation") : v("conversations.pinConversation", "Pin conversation"),
+											onClick: () => void He()
+										}),
+										/* @__PURE__ */ f(h, {
+											icon: E.isMuted ? /* @__PURE__ */ f(ue, { size: 14 }) : /* @__PURE__ */ f(de, { size: 14 }),
+											label: E.isMuted ? v("conversations.unmuteConversation", "Unmute conversation") : v("conversations.muteConversation", "Mute conversation"),
+											onClick: () => void Ue()
+										}),
+										/* @__PURE__ */ f("div", { className: "h-px bg-border my-1" }),
+										/* @__PURE__ */ f(h, {
+											icon: /* @__PURE__ */ f(ce, { size: 14 }),
+											label: v("conversations.archiveConversation", "Archive conversation"),
+											onClick: () => void We(),
+											destructive: !0
+										})
+									]
+								})]
+							})
+						]
+					})]
+				}),
+				/* @__PURE__ */ p("div", {
+					className: "flex-1 overflow-y-auto py-4 space-y-0.5",
+					children: [
+						Z?.pagePath && /* @__PURE__ */ p("div", {
+							className: "mx-4 mb-4 rounded-lg border border-border bg-muted/20 px-3 py-2 text-xs text-muted-foreground",
+							children: [/* @__PURE__ */ f("span", {
+								className: "font-medium text-foreground",
+								children: Z.contextTitle || Z.pagePath
+							}), Z.entityType && Z.entityId ? ` · ${Z.entityType} ${Z.entityId}` : ""]
+						}),
+						A && /* @__PURE__ */ f("div", {
+							className: "mx-4 mb-4 rounded-lg border border-status-warning-border bg-status-warning-bg px-3 py-2 text-sm text-status-warning-text",
+							children: v("conversations.messagesUnavailable", "Messages couldn't be loaded right now. The conversation header and actions are still available.")
+						}),
+						k && /* @__PURE__ */ p("div", {
+							className: "mx-4 mb-4 flex items-center gap-2 rounded-lg border border-border bg-muted/20 px-3 py-2 text-sm text-muted-foreground",
+							children: [/* @__PURE__ */ f(me, {
+								size: 14,
+								className: "animate-spin"
+							}), v("conversations.loadingMessages", "Loading messages...")]
+						}),
+						!k && !A && O.length === 0 && /* @__PURE__ */ f("div", {
+							className: "mx-4 mb-4 rounded-lg border border-dashed border-border bg-muted/20 px-3 py-6 text-center text-sm text-muted-foreground",
+							children: v("conversations.noMessagesYet", "No messages yet. Start the conversation below.")
+						}),
+						O.map((e, t) => {
+							let n = O[t - 1], r = !n || n.authorId !== e.authorId || n.type === "SYSTEM";
+							return /* @__PURE__ */ f("div", { children: W === e.id ? /* @__PURE__ */ p("div", {
+								className: "px-4 py-2",
+								children: [/* @__PURE__ */ p("div", {
+									className: "flex items-center gap-2 text-xs text-muted-foreground mb-1",
+									children: [/* @__PURE__ */ f("span", { children: v("conversations.editingMessage", "Editing message") }), /* @__PURE__ */ f("button", {
+										type: "button",
+										onClick: $,
+										className: "hover:text-foreground",
+										children: /* @__PURE__ */ f(xe, { size: 12 })
+									})]
+								}), /* @__PURE__ */ p("div", {
+									className: "flex items-end gap-2",
+									children: [/* @__PURE__ */ f("textarea", {
+										value: K,
+										onChange: (e) => q(e.target.value),
+										onKeyDown: (e) => {
+											e.key === "Enter" && !e.shiftKey && (e.preventDefault(), ze()), e.key === "Escape" && $();
+										},
+										className: "flex-1 px-3 py-2 text-sm rounded-lg border border-border bg-muted/30 resize-none focus:outline-none focus:ring-2 focus:ring-ring",
+										rows: 2
+									}), /* @__PURE__ */ f("button", {
+										type: "button",
+										onClick: () => void ze(),
+										disabled: !K.trim() || P,
+										className: "px-3 py-2 text-xs font-medium rounded-lg bg-primary text-primary-foreground hover:bg-primary/90 disabled:opacity-50",
+										children: v("conversations.save", "Save")
+									})]
+								})]
+							}) : /* @__PURE__ */ f(ne, {
+								message: e,
+								isOwnMessage: e.authorId === Ne,
+								showAvatar: r,
+								showSender: r,
+								onReply: Ie,
+								onReact: (e, t) => void Le(e, t),
+								onEdit: Re,
+								onDelete: (e) => void Be(e),
+								onTogglePin: (e, t) => void Ve(e, t)
+							}) }, e.id);
+						}),
+						/* @__PURE__ */ f("div", { ref: T })
+					]
+				}),
+				/* @__PURE__ */ p("div", {
+					className: "border-t border-border px-4 py-3 bg-background",
+					children: [J && /* @__PURE__ */ p("div", {
+						className: "flex items-center gap-2 mb-2 px-3 py-1.5 rounded-lg bg-muted/50 text-xs text-muted-foreground",
+						children: [/* @__PURE__ */ p("span", { children: [
+							v("conversations.replyingTo", "Replying to"),
+							" ",
+							/* @__PURE__ */ f("strong", {
+								className: "text-foreground",
+								children: J.sender
+							}),
+							": ",
+							J.content.slice(0, 80),
+							J.content.length > 80 ? "…" : ""
+						] }), /* @__PURE__ */ f("button", {
+							type: "button",
+							onClick: () => Y(null),
+							className: "ml-auto hover:text-foreground",
+							children: /* @__PURE__ */ f(xe, { size: 12 })
+						})]
+					}), /* @__PURE__ */ p("div", {
+						className: "flex items-end gap-2",
+						children: [/* @__PURE__ */ f("div", {
+							className: "flex-1 relative",
+							children: /* @__PURE__ */ f("textarea", {
+								"aria-label": v("conversations.messageComposer", "Message composer"),
+								value: C,
+								onChange: (e) => w(e.target.value),
+								onKeyDown: Fe,
+								placeholder: `${v("conversations.messageConversationPrefix", "Message")} ${E.title}...`,
+								rows: 1,
+								className: t("w-full px-4 py-2.5 text-sm rounded-xl border border-border bg-muted/30", "resize-none overflow-hidden placeholder:text-muted-foreground", "focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent max-h-32"),
+								style: {
+									height: "auto",
+									minHeight: "40px"
+								},
+								onInput: (e) => {
+									let t = e.target;
+									t.style.height = "auto", t.style.height = `${Math.min(t.scrollHeight, 128)}px`;
+								}
+							})
+						}), /* @__PURE__ */ f("button", {
+							type: "button",
+							"aria-label": v("conversations.sendMessage", "Send message"),
+							onClick: () => void Q(),
+							disabled: !C.trim() || M,
+							className: t("p-2.5 rounded-xl transition-all duration-150", C.trim() && !M ? "bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm" : "bg-muted text-muted-foreground cursor-not-allowed"),
+							children: M ? /* @__PURE__ */ f(me, {
+								size: 18,
+								className: "animate-spin"
+							}) : /* @__PURE__ */ f(ye, { size: 18 })
+						})]
+					})]
+				})
+			]
+		}), b && E.isGroup && /* @__PURE__ */ f("aside", {
+			className: "w-64 border-l border-border bg-background overflow-y-auto animate-in slide-in-from-right-4 duration-200",
+			children: /* @__PURE__ */ p("div", {
+				className: "p-4",
+				children: [/* @__PURE__ */ p("div", {
+					className: "flex items-center justify-between mb-4",
+					children: [/* @__PURE__ */ p("h3", {
+						className: "text-sm font-semibold text-foreground",
+						children: [
+							v("conversations.members", "Members"),
+							" (",
+							Pe.length || E.memberCount,
+							")"
+						]
+					}), /* @__PURE__ */ f("button", {
+						type: "button",
+						onClick: S,
+						className: "p-1 rounded text-muted-foreground hover:text-foreground",
+						children: /* @__PURE__ */ f(_e, { size: 14 })
+					})]
+				}), /* @__PURE__ */ f("div", {
+					className: "space-y-1",
+					children: Pe.map((e) => /* @__PURE__ */ p("div", {
+						className: "flex items-center gap-2.5 px-2 py-1.5 rounded-lg hover:bg-muted/50",
+						children: [/* @__PURE__ */ f("div", {
+							className: "w-7 h-7 rounded-full bg-muted flex items-center justify-center text-xs font-medium text-muted-foreground",
+							children: e.name.split(" ").map((e) => e[0]).join("").slice(0, 2)
+						}), /* @__PURE__ */ p("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ f("p", {
+								className: "text-xs font-medium text-foreground truncate",
+								children: e.name
+							}), /* @__PURE__ */ f("p", {
+								className: "text-[10px] text-muted-foreground",
+								children: v("conversations.member", "Member")
+							})]
+						})]
+					}, e.id))
+				})]
+			})
+		})]
+	});
+}
+function h({ icon: e, label: n, onClick: r, destructive: i }) {
+	return /* @__PURE__ */ p("button", {
+		type: "button",
+		onClick: r,
+		className: t("flex items-center gap-2.5 w-full px-3 py-2 text-sm transition-colors text-left", i ? "text-destructive hover:bg-destructive/10" : "text-foreground hover:bg-muted/50"),
+		children: [e, /* @__PURE__ */ f("span", { children: n })]
+	});
+}
+function g({ icon: e, label: n, active: r, onClick: i }) {
+	return /* @__PURE__ */ f(a, {
+		permission: o.CONVERSATION_READ,
+		allowUnavailablePermissions: !0,
+		children: /* @__PURE__ */ f("button", {
+			type: "button",
+			onClick: i,
+			"aria-label": n,
+			title: n,
+			className: t("p-2 rounded-lg transition-colors", r ? "bg-primary/10 text-primary" : "text-muted-foreground hover:text-foreground hover:bg-muted/50"),
+			children: e
+		})
+	});
+}
+//#endregion
+export { m as ConversationDetailPage };
+
+//# sourceMappingURL=ConversationDetailPage.js.map

package/dist/conversations/pages/ConversationDetailPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConversationDetailPage.js","names":[],"sources":["../../../src/conversations/pages/ConversationDetailPage.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { useEventBus } from \"@burdenoff/fe-libs/shared/events\";\nimport { useNavigate, useParams } from \"react-router-dom\";\nimport {\n  Archive,\n  ArrowLeft,\n  BellOff,\n  Bell,\n  ExternalLink,\n  Hash,\n  Loader2,\n  MessageCircle,\n  MoreVertical,\n  Pin,\n  PinOff,\n  SendHorizontal,\n  Users,\n  X,\n} from \"lucide-react\";\nimport { MessageBubble } from \"../components/MessageBubble\";\nimport {\n  useGetConversation,\n  useConversationActions,\n} from \"../hooks/useConversationQueries\";\nimport {\n  useGetMessages,\n  useSendMessage,\n  useEditMessage,\n  useMessageActions,\n} from \"../hooks/useMessageQueries\";\nimport { useMessageStreamForConversation } from \"../hooks/useMessageSubscriptions\";\nimport { useConversations } from \"../providers/ConversationsProvider\";\nimport { useConversationsStore } from \"../store/conversationsStore\";\nimport { cn } from \"../utils/cn\";\nimport { PermissionGuard } from \"../components/PermissionGuard\";\nimport { CONVERSATIONS_PERMISSIONS } from \"../constants/permissions\";\nimport { nativeImpact, nativeNotify } from \"../../utils/nativeBridge\";\n\nexport function ConversationDetailPage() {\n  const { conversationId } = useParams<{ conversationId: string }>();\n  const navigate = useNavigate();\n  const { basePath, currentUser } = useConversations();\n  const bus = useEventBus();\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n  const {\n    clearMessageDraft,\n    isParticipantsPanelOpen,\n    messageDrafts,\n    setMessageDraft,\n    toggleParticipantsPanel,\n  } = useConversationsStore();\n\n  const [messageInput, setMessageInput] = useState(\n    messageDrafts[conversationId ?? \"\"] ?? \"\",\n  );\n  const messagesEndRef = useRef<HTMLDivElement>(null);\n\n  const {\n    conversation,\n    loading: conversationLoading,\n    error: conversationError,\n  } = useGetConversation(conversationId ?? \"\");\n  const {\n    messages,\n    loading: messagesLoading,\n    error: messagesError,\n  } = useGetMessages(conversationId ?? \"\", {\n    first: 100,\n  });\n  // Subscribe to live message events so the list updates without polling.\n  // Apollo cache merges by id; the hook handles append / evict explicitly.\n  useMessageStreamForConversation(conversationId);\n  const { sendMessage, loading: sendingMessage } = useSendMessage();\n  const { editMessage, loading: editingMessage } = useEditMessage();\n  const {\n    deleteMessage,\n    addReaction,\n    removeReaction,\n    pinMessage,\n    unpinMessage,\n  } = useMessageActions();\n  const {\n    archiveConversation,\n    pinConversation,\n    unpinConversation,\n    muteConversation,\n    unmuteConversation,\n  } = useConversationActions();\n\n  const [moreMenuOpen, setMoreMenuOpen] = useState(false);\n  const [editingMessageId, setEditingMessageId] = useState<string | null>(null);\n  const [editingContent, setEditingContent] = useState(\"\");\n  const [replyingTo, setReplyingTo] = useState<{\n    id: string;\n    content: string;\n    sender: string;\n  } | null>(null);\n  const moreMenuRef = useRef<HTMLDivElement>(null);\n\n  const currentUserId = currentUser?.id ?? \"\";\n  const sourceContext = conversation?.sourceContext;\n\n  useEffect(() => {\n    messagesEndRef.current?.scrollIntoView({ behavior: \"smooth\" });\n  }, [messages.length]);\n\n  useEffect(() => {\n    if (!conversationId) return;\n    if (messageInput.trim()) {\n      setMessageDraft(conversationId, messageInput);\n      return;\n    }\n    clearMessageDraft(conversationId);\n  }, [messageInput, conversationId, setMessageDraft, clearMessageDraft]);\n\n  const participants = useMemo(() => {\n    const byAuthor = new Map<string, { id: string; name: string }>();\n    for (const message of messages) {\n      if (!message.authorId || byAuthor.has(message.authorId)) continue;\n      byAuthor.set(message.authorId, {\n        id: message.authorId,\n        name: message.sender.name || message.authorId,\n      });\n    }\n    return Array.from(byAuthor.values());\n  }, [messages]);\n\n  const handleSendMessage = useCallback(async () => {\n    if (!conversationId || !messageInput.trim() || sendingMessage) return;\n    const message = await sendMessage({\n      conversationId,\n      content: messageInput.trim(),\n      type: \"TEXT\",\n      parentMessageId: replyingTo?.id,\n    });\n    if (!message) return;\n    bus.emit(\"conversations.message.sent\", {\n      messageId: message.id,\n      conversationId,\n    });\n    setMessageInput(\"\");\n    setReplyingTo(null);\n    clearMessageDraft(conversationId);\n  }, [\n    bus,\n    conversationId,\n    messageInput,\n    sendingMessage,\n    sendMessage,\n    clearMessageDraft,\n    replyingTo,\n  ]);\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n      if (event.key !== \"Enter\" || event.shiftKey) return;\n      event.preventDefault();\n      void handleSendMessage();\n    },\n    [handleSendMessage],\n  );\n\n  // Emit opened event so sinks (analytics/audit) can record the view\n  useEffect(() => {\n    if (!conversationId) return;\n    bus.emit(\"conversations.conversation.opened\", { conversationId });\n  }, [bus, conversationId]);\n\n  // Close more-menu on outside click\n  useEffect(() => {\n    if (!moreMenuOpen) return;\n    const handler = (e: MouseEvent) => {\n      if (\n        moreMenuRef.current &&\n        !moreMenuRef.current.contains(e.target as Node)\n      ) {\n        setMoreMenuOpen(false);\n      }\n    };\n    document.addEventListener(\"mousedown\", handler);\n    return () => document.removeEventListener(\"mousedown\", handler);\n  }, [moreMenuOpen]);\n\n  const handleReply = useCallback(\n    (message: { id: string; content: string; sender: { name: string } }) => {\n      setReplyingTo({\n        id: message.id,\n        content: message.content,\n        sender: message.sender.name,\n      });\n    },\n    [],\n  );\n\n  const handleReact = useCallback(\n    async (messageId: string, emoji: string) => {\n      try {\n        await addReaction(messageId, emoji);\n      } catch {\n        // If already reacted, toggle off\n        await removeReaction(messageId, emoji).catch(() => {});\n      }\n    },\n    [addReaction, removeReaction],\n  );\n\n  const handleEdit = useCallback((message: { id: string; content: string }) => {\n    setEditingMessageId(message.id);\n    setEditingContent(message.content);\n  }, []);\n\n  const handleEditSubmit = useCallback(async () => {\n    if (!editingMessageId || !editingContent.trim() || editingMessage) return;\n    await editMessage(editingMessageId, editingContent.trim());\n    setEditingMessageId(null);\n    setEditingContent(\"\");\n  }, [editingMessageId, editingContent, editingMessage, editMessage]);\n\n  const handleEditCancel = useCallback(() => {\n    setEditingMessageId(null);\n    setEditingContent(\"\");\n  }, []);\n\n  const handleDelete = useCallback(\n    async (messageId: string) => {\n      nativeImpact(\"medium\");\n      try {\n        await deleteMessage(messageId);\n        nativeNotify(\"success\");\n      } catch (error) {\n        nativeNotify(\"error\");\n        throw error;\n      }\n    },\n    [deleteMessage],\n  );\n\n  const handleTogglePinMessage = useCallback(\n    async (messageId: string, isPinned: boolean) => {\n      if (isPinned) {\n        await unpinMessage(messageId);\n        return;\n      }\n      await pinMessage(messageId);\n    },\n    [pinMessage, unpinMessage],\n  );\n\n  const handlePin = useCallback(async () => {\n    if (!conversationId) return;\n    if (conversation?.isPinned) {\n      await unpinConversation(conversationId);\n    } else {\n      await pinConversation(conversationId);\n    }\n    setMoreMenuOpen(false);\n  }, [\n    conversationId,\n    conversation?.isPinned,\n    pinConversation,\n    unpinConversation,\n  ]);\n\n  const handleMute = useCallback(async () => {\n    if (!conversationId) return;\n    if (conversation?.isMuted) {\n      await unmuteConversation(conversationId);\n    } else {\n      await muteConversation(conversationId);\n    }\n    setMoreMenuOpen(false);\n  }, [\n    conversationId,\n    conversation?.isMuted,\n    muteConversation,\n    unmuteConversation,\n  ]);\n\n  const handleArchive = useCallback(async () => {\n    if (!conversationId) return;\n    await archiveConversation(conversationId);\n    bus.emit(\"conversations.conversation.archived\", { conversationId });\n    setMoreMenuOpen(false);\n    navigate(basePath || \"/conversations\");\n  }, [archiveConversation, basePath, bus, conversationId, navigate]);\n\n  const handleOpenContext = useCallback(() => {\n    if (!sourceContext?.contextHref) return;\n    try {\n      const url = new URL(sourceContext.contextHref);\n      if (url.origin === window.location.origin) {\n        navigate(`${url.pathname}${url.search}${url.hash}`);\n        return;\n      }\n    } catch {\n      // Fall through to full navigation for relative or invalid URLs.\n    }\n\n    window.location.assign(sourceContext.contextHref);\n  }, [navigate, sourceContext?.contextHref]);\n\n  if (!conversation && conversationLoading) {\n    return (\n      <div className=\"flex items-center justify-center h-[calc(100vh-64px)] text-sm text-muted-foreground\">\n        {tr(\"conversations.loading\", \"Loading conversation...\")}\n      </div>\n    );\n  }\n\n  if (!conversation || conversationError) {\n    return (\n      <div className=\"flex flex-col items-center justify-center h-[calc(100vh-64px)] text-center gap-3 px-4\">\n        <MessageCircle className=\"h-8 w-8 text-muted-foreground\" />\n        <p className=\"text-sm text-muted-foreground\">\n          {conversationError\n            ? tr(\n                \"conversations.unavailable\",\n                \"We couldn't load this conversation. Please try again.\",\n              )\n            : tr(\"conversations.notFound\", \"Conversation not found\")}\n        </p>\n        <button\n          type=\"button\"\n          onClick={() => navigate(basePath || \"/conversations\")}\n          className=\"px-3 py-2 text-sm font-medium rounded-lg border border-border hover:bg-muted/50\"\n        >\n          {tr(\"conversations.back\", \"Back to conversations\")}\n        </button>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"flex h-[calc(100vh-64px)] bg-background\">\n      <div className=\"flex-1 flex flex-col min-w-0\">\n        <header className=\"flex items-center justify-between px-4 py-3 border-b border-border bg-background/95 backdrop-blur-sm\">\n          <div className=\"flex items-center gap-3 min-w-0\">\n            <button\n              type=\"button\"\n              onClick={() => navigate(basePath || \"/conversations\")}\n              className=\"p-1.5 rounded-lg text-muted-foreground hover:text-foreground hover:bg-muted/50 transition-colors\"\n            >\n              <ArrowLeft size={18} />\n            </button>\n            <div className=\"min-w-0\">\n              <div className=\"flex items-center gap-1.5\">\n                {conversation.type === \"CHANNEL\" && (\n                  <Hash\n                    size={14}\n                    className=\"text-muted-foreground flex-shrink-0\"\n                  />\n                )}\n                <h2 className=\"text-sm font-semibold text-foreground truncate\">\n                  {conversation.title}\n                </h2>\n              </div>\n              <p className=\"text-xs text-muted-foreground\">\n                {conversation.type === \"DIRECT\"\n                  ? tr(\n                      \"conversations.directConversation\",\n                      \"Direct conversation\",\n                    )\n                  : conversation.type === \"CHANNEL\"\n                    ? `${tr(\"conversations.channel\", \"Channel\")} · ${conversation.memberCount} ${tr(\"conversations.membersCountLabel\", \"members\")}`\n                    : conversation.type === \"ANNOUNCEMENT\"\n                      ? `${tr(\"conversations.announcement\", \"Announcement\")} · ${conversation.memberCount} ${tr(\"conversations.membersCountLabel\", \"members\")}`\n                      : `${conversation.memberCount} ${tr(\"conversations.membersCountLabel\", \"members\")}`}\n              </p>\n            </div>\n          </div>\n\n          <div className=\"flex items-center gap-1\">\n            {sourceContext?.contextHref && (\n              <HeaderButton\n                icon={<ExternalLink size={16} />}\n                label={tr(\"conversations.openContext\", \"Open context\")}\n                onClick={handleOpenContext}\n              />\n            )}\n            {conversation.isGroup && (\n              <HeaderButton\n                icon={<Users size={16} />}\n                label={tr(\"conversations.participants\", \"Participants\")}\n                active={isParticipantsPanelOpen}\n                onClick={toggleParticipantsPanel}\n              />\n            )}\n            <div className=\"relative\" ref={moreMenuRef}>\n              <HeaderButton\n                icon={<MoreVertical size={16} />}\n                label={tr(\"conversations.moreOptions\", \"More options\")}\n                active={moreMenuOpen}\n                onClick={() => setMoreMenuOpen((prev) => !prev)}\n              />\n              {moreMenuOpen && (\n                <div className=\"absolute right-0 top-full mt-1 w-48 bg-popover border border-border rounded-lg shadow-lg z-50 py-1 animate-in fade-in-0 zoom-in-95 duration-100\">\n                  <DropdownItem\n                    icon={\n                      conversation.isPinned ? (\n                        <PinOff size={14} />\n                      ) : (\n                        <Pin size={14} />\n                      )\n                    }\n                    label={\n                      conversation.isPinned\n                        ? tr(\n                            \"conversations.unpinConversation\",\n                            \"Unpin conversation\",\n                          )\n                        : tr(\n                            \"conversations.pinConversation\",\n                            \"Pin conversation\",\n                          )\n                    }\n                    onClick={() => void handlePin()}\n                  />\n                  <DropdownItem\n                    icon={\n                      conversation.isMuted ? (\n                        <Bell size={14} />\n                      ) : (\n                        <BellOff size={14} />\n                      )\n                    }\n                    label={\n                      conversation.isMuted\n                        ? tr(\n                            \"conversations.unmuteConversation\",\n                            \"Unmute conversation\",\n                          )\n                        : tr(\n                            \"conversations.muteConversation\",\n                            \"Mute conversation\",\n                          )\n                    }\n                    onClick={() => void handleMute()}\n                  />\n                  <div className=\"h-px bg-border my-1\" />\n                  <DropdownItem\n                    icon={<Archive size={14} />}\n                    label={tr(\n                      \"conversations.archiveConversation\",\n                      \"Archive conversation\",\n                    )}\n                    onClick={() => void handleArchive()}\n                    destructive\n                  />\n                </div>\n              )}\n            </div>\n          </div>\n        </header>\n\n        <div className=\"flex-1 overflow-y-auto py-4 space-y-0.5\">\n          {sourceContext?.pagePath && (\n            <div className=\"mx-4 mb-4 rounded-lg border border-border bg-muted/20 px-3 py-2 text-xs text-muted-foreground\">\n              <span className=\"font-medium text-foreground\">\n                {sourceContext.contextTitle || sourceContext.pagePath}\n              </span>\n              {sourceContext.entityType && sourceContext.entityId\n                ? ` · ${sourceContext.entityType} ${sourceContext.entityId}`\n                : \"\"}\n            </div>\n          )}\n          {messagesError && (\n            <div className=\"mx-4 mb-4 rounded-lg border border-status-warning-border bg-status-warning-bg px-3 py-2 text-sm text-status-warning-text\">\n              {tr(\n                \"conversations.messagesUnavailable\",\n                \"Messages couldn't be loaded right now. The conversation header and actions are still available.\",\n              )}\n            </div>\n          )}\n          {messagesLoading && (\n            <div className=\"mx-4 mb-4 flex items-center gap-2 rounded-lg border border-border bg-muted/20 px-3 py-2 text-sm text-muted-foreground\">\n              <Loader2 size={14} className=\"animate-spin\" />\n              {tr(\"conversations.loadingMessages\", \"Loading messages...\")}\n            </div>\n          )}\n          {!messagesLoading && !messagesError && messages.length === 0 && (\n            <div className=\"mx-4 mb-4 rounded-lg border border-dashed border-border bg-muted/20 px-3 py-6 text-center text-sm text-muted-foreground\">\n              {tr(\n                \"conversations.noMessagesYet\",\n                \"No messages yet. Start the conversation below.\",\n              )}\n            </div>\n          )}\n          {messages.map((message, index) => {\n            const prevMessage = messages[index - 1];\n            const showAvatar =\n              !prevMessage ||\n              prevMessage.authorId !== message.authorId ||\n              prevMessage.type === \"SYSTEM\";\n\n            return (\n              <div key={message.id}>\n                {editingMessageId === message.id ? (\n                  <div className=\"px-4 py-2\">\n                    <div className=\"flex items-center gap-2 text-xs text-muted-foreground mb-1\">\n                      <span>\n                        {tr(\"conversations.editingMessage\", \"Editing message\")}\n                      </span>\n                      <button\n                        type=\"button\"\n                        onClick={handleEditCancel}\n                        className=\"hover:text-foreground\"\n                      >\n                        <X size={12} />\n                      </button>\n                    </div>\n                    <div className=\"flex items-end gap-2\">\n                      <textarea\n                        value={editingContent}\n                        onChange={(e) => setEditingContent(e.target.value)}\n                        onKeyDown={(e) => {\n                          if (e.key === \"Enter\" && !e.shiftKey) {\n                            e.preventDefault();\n                            void handleEditSubmit();\n                          }\n                          if (e.key === \"Escape\") handleEditCancel();\n                        }}\n                        className=\"flex-1 px-3 py-2 text-sm rounded-lg border border-border bg-muted/30 resize-none focus:outline-none focus:ring-2 focus:ring-ring\"\n                        rows={2}\n                      />\n                      <button\n                        type=\"button\"\n                        onClick={() => void handleEditSubmit()}\n                        disabled={!editingContent.trim() || editingMessage}\n                        className=\"px-3 py-2 text-xs font-medium rounded-lg bg-primary text-primary-foreground hover:bg-primary/90 disabled:opacity-50\"\n                      >\n                        {tr(\"conversations.save\", \"Save\")}\n                      </button>\n                    </div>\n                  </div>\n                ) : (\n                  <MessageBubble\n                    message={message}\n                    isOwnMessage={message.authorId === currentUserId}\n                    showAvatar={showAvatar}\n                    showSender={showAvatar}\n                    onReply={handleReply}\n                    onReact={(id, emoji) => void handleReact(id, emoji)}\n                    onEdit={handleEdit}\n                    onDelete={(id) => void handleDelete(id)}\n                    onTogglePin={(id, isPinned) =>\n                      void handleTogglePinMessage(id, isPinned)\n                    }\n                  />\n                )}\n              </div>\n            );\n          })}\n          <div ref={messagesEndRef} />\n        </div>\n\n        <div className=\"border-t border-border px-4 py-3 bg-background\">\n          {/* Reply-to indicator */}\n          {replyingTo && (\n            <div className=\"flex items-center gap-2 mb-2 px-3 py-1.5 rounded-lg bg-muted/50 text-xs text-muted-foreground\">\n              <span>\n                {tr(\"conversations.replyingTo\", \"Replying to\")}{\" \"}\n                <strong className=\"text-foreground\">{replyingTo.sender}</strong>\n                : {replyingTo.content.slice(0, 80)}\n                {replyingTo.content.length > 80 ? \"…\" : \"\"}\n              </span>\n              <button\n                type=\"button\"\n                onClick={() => setReplyingTo(null)}\n                className=\"ml-auto hover:text-foreground\"\n              >\n                <X size={12} />\n              </button>\n            </div>\n          )}\n          <div className=\"flex items-end gap-2\">\n            <div className=\"flex-1 relative\">\n              <textarea\n                aria-label={tr(\n                  \"conversations.messageComposer\",\n                  \"Message composer\",\n                )}\n                value={messageInput}\n                onChange={(event) => setMessageInput(event.target.value)}\n                onKeyDown={handleKeyDown}\n                placeholder={`${tr(\"conversations.messageConversationPrefix\", \"Message\")} ${conversation.title}...`}\n                rows={1}\n                className={cn(\n                  \"w-full px-4 py-2.5 text-sm rounded-xl border border-border bg-muted/30\",\n                  \"resize-none overflow-hidden placeholder:text-muted-foreground\",\n                  \"focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent max-h-32\",\n                )}\n                style={{\n                  height: \"auto\",\n                  minHeight: \"40px\",\n                }}\n                onInput={(event) => {\n                  const target = event.target as HTMLTextAreaElement;\n                  target.style.height = \"auto\";\n                  target.style.height = `${Math.min(target.scrollHeight, 128)}px`;\n                }}\n              />\n            </div>\n\n            <button\n              type=\"button\"\n              aria-label={tr(\"conversations.sendMessage\", \"Send message\")}\n              onClick={() => void handleSendMessage()}\n              disabled={!messageInput.trim() || sendingMessage}\n              className={cn(\n                \"p-2.5 rounded-xl transition-all duration-150\",\n                messageInput.trim() && !sendingMessage\n                  ? \"bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm\"\n                  : \"bg-muted text-muted-foreground cursor-not-allowed\",\n              )}\n            >\n              {sendingMessage ? (\n                <Loader2 size={18} className=\"animate-spin\" />\n              ) : (\n                <SendHorizontal size={18} />\n              )}\n            </button>\n          </div>\n        </div>\n      </div>\n\n      {isParticipantsPanelOpen && conversation.isGroup && (\n        <aside className=\"w-64 border-l border-border bg-background overflow-y-auto animate-in slide-in-from-right-4 duration-200\">\n          <div className=\"p-4\">\n            <div className=\"flex items-center justify-between mb-4\">\n              <h3 className=\"text-sm font-semibold text-foreground\">\n                {tr(\"conversations.members\", \"Members\")} (\n                {participants.length || conversation.memberCount})\n              </h3>\n              <button\n                type=\"button\"\n                onClick={toggleParticipantsPanel}\n                className=\"p-1 rounded text-muted-foreground hover:text-foreground\"\n              >\n                <Pin size={14} />\n              </button>\n            </div>\n\n            <div className=\"space-y-1\">\n              {participants.map((participant) => (\n                <div\n                  key={participant.id}\n                  className=\"flex items-center gap-2.5 px-2 py-1.5 rounded-lg hover:bg-muted/50\"\n                >\n                  <div className=\"w-7 h-7 rounded-full bg-muted flex items-center justify-center text-xs font-medium text-muted-foreground\">\n                    {participant.name\n                      .split(\" \")\n                      .map((word) => word[0])\n                      .join(\"\")\n                      .slice(0, 2)}\n                  </div>\n                  <div className=\"min-w-0\">\n                    <p className=\"text-xs font-medium text-foreground truncate\">\n                      {participant.name}\n                    </p>\n                    <p className=\"text-[10px] text-muted-foreground\">\n                      {tr(\"conversations.member\", \"Member\")}\n                    </p>\n                  </div>\n                </div>\n              ))}\n            </div>\n          </div>\n        </aside>\n      )}\n    </div>\n  );\n}\n\nfunction DropdownItem({\n  icon,\n  label,\n  onClick,\n  destructive,\n}: {\n  icon: React.ReactNode;\n  label: string;\n  onClick: () => void;\n  destructive?: boolean;\n}) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      className={cn(\n        \"flex items-center gap-2.5 w-full px-3 py-2 text-sm transition-colors text-left\",\n        destructive\n          ? \"text-destructive hover:bg-destructive/10\"\n          : \"text-foreground hover:bg-muted/50\",\n      )}\n    >\n      {icon}\n      <span>{label}</span>\n    </button>\n  );\n}\n\nfunction HeaderButton({\n  icon,\n  label,\n  active,\n  onClick,\n}: {\n  icon: React.ReactNode;\n  label: string;\n  active?: boolean;\n  onClick?: () => void;\n}) {\n  return (\n    <PermissionGuard\n      permission={CONVERSATIONS_PERMISSIONS.CONVERSATION_READ}\n      allowUnavailablePermissions\n    >\n      <button\n        type=\"button\"\n        onClick={onClick}\n        aria-label={label}\n        title={label}\n        className={cn(\n          \"p-2 rounded-lg transition-colors\",\n          active\n            ? \"bg-primary/10 text-primary\"\n            : \"text-muted-foreground hover:text-foreground hover:bg-muted/50\",\n        )}\n      >\n        {icon}\n      </button>\n    </PermissionGuard>\n  );\n}\n"],"mappings":"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"}

package/dist/conversations/pages/ConversationListPage.d.ts

@@ -0,0 +1,6 @@
+interface ConversationListPageProps {
+    forcedFilterParam?: "channel" | "direct" | "group" | "archived";
+}
+export declare function ConversationListPage({ forcedFilterParam, }?: ConversationListPageProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ConversationListPage.d.ts.map

package/dist/conversations/pages/ConversationListPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConversationListPage.d.ts","sourceRoot":"","sources":["../../../src/conversations/pages/ConversationListPage.tsx"],"names":[],"mappings":"AAuDA,UAAU,yBAAyB;IACjC,iBAAiB,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;CACjE;AAED,wBAAgB,oBAAoB,CAAC,EACnC,iBAAiB,GAClB,GAAE,yBAA8B,2CAgYhC"}