@burdenoff/fe-libs 2026.510.126

package/dist/shared/components/ContextConversationWidget.js

@@ -0,0 +1,821 @@
+import { Button as e } from "../../ui/button.js";
+import { useGatewayClient as t } from "../graphql/GatewayContext.js";
+import "../../shared-graphql.js";
+import { useAuth as n } from "../providers/shell/AuthProvider.js";
+import { useActiveContext as r } from "../providers/shell/ActiveContextProvider.js";
+import { Badge as i } from "../../ui/badge.js";
+import { Card as a, CardContent as o, CardHeader as s, CardTitle as ee } from "../../ui/card.js";
+import { Textarea as te } from "../../ui/textarea.js";
+import "../../ui.js";
+import { useI18n as ne } from "../providers/shell/I18nProvider.js";
+import { usePageConversationContext as re } from "../providers/shell/PageConversationContextProvider.js";
+import "../../shared-providers-shell.js";
+import { useEffect as c, useMemo as l, useRef as ie, useState as u } from "react";
+import { ChevronDown as ae, ChevronUp as oe, ExternalLink as se, Loader2 as ce, MessageCircle as le, Paperclip as ue, Pencil as de, Pin as fe, PinOff as pe, Reply as me, SendHorizontal as he, SmilePlus as ge, Trash2 as _e, X as ve } from "lucide-react";
+import { Fragment as ye, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { gql as p } from "@apollo/client";
+import { useMutation as m, useQuery as h, useSubscription as g } from "@apollo/client/react";
+import { useNavigate as be } from "react-router-dom";
+//#region src/shared/components/ContextConversationWidget.tsx
+var xe = p`
+  mutation ContextConversationWidget_SendContextMessage(
+    $input: SendContextConversationMessageInput!
+  ) {
+    sendContextMessage(input: $input) {
+      success
+      message {
+        id
+        conversationId
+      }
+    }
+  }
+`, Se = p`
+  query ContextConversationWidget_GetConversation($id: ID!) {
+    conversation(id: $id) {
+      id
+      title
+      description
+      settings
+      updatedAt
+      features {
+        threads
+        reactions
+        mentions
+      }
+      currentUserMembership {
+        unreadCount
+      }
+    }
+  }
+`, Ce = p`
+  query ContextConversationWidget_GetContextConversations($first: Int) {
+    conversations(first: $first) {
+      edges {
+        node {
+          id
+          settings
+        }
+      }
+    }
+  }
+`, _ = p`
+  query ContextConversationWidget_GetMessages(
+    $conversationId: ID!
+    $first: Int
+  ) {
+    messages(conversationId: $conversationId, first: $first) {
+      edges {
+        node {
+          id
+          conversationId
+          type
+          status
+          content
+          authorId
+          authorType
+          parentMessageId
+          threadRootId
+          threadLevel
+          isEdited
+          editedAt
+          isPinned
+          createdAt
+          updatedAt
+          replyCount
+          permissions {
+            canEdit
+            canDelete
+            canReact
+            canReply
+            canPin
+          }
+          reactions {
+            id
+            emoji
+            userId
+            createdAt
+          }
+          attachments {
+            id
+            fileId
+            fileName
+            fileSize
+            mimeType
+            downloadUrl
+            thumbnail
+            width
+            height
+            duration
+          }
+        }
+      }
+    }
+  }
+`, we = p`
+  subscription ContextConversationWidget_MessageAdded($conversationId: ID!) {
+    messageAdded(conversationId: $conversationId) {
+      id
+      conversationId
+      type
+      status
+      content
+      authorId
+      authorType
+      parentMessageId
+      threadRootId
+      threadLevel
+      isEdited
+      editedAt
+      isPinned
+      createdAt
+      updatedAt
+      replyCount
+    }
+  }
+`, Te = p`
+  subscription ContextConversationWidget_MessageUpdated($conversationId: ID!) {
+    messageUpdated(conversationId: $conversationId) {
+      id
+      conversationId
+      content
+      isEdited
+      editedAt
+      updatedAt
+    }
+  }
+`, Ee = p`
+  subscription ContextConversationWidget_MessageDeleted($conversationId: ID!) {
+    messageDeleted(conversationId: $conversationId) {
+      messageId
+      conversationId
+    }
+  }
+`, De = p`
+  mutation ContextConversationWidget_EditMessage($input: EditMessageInput!) {
+    editMessage(input: $input) {
+      id
+    }
+  }
+`, Oe = p`
+  mutation ContextConversationWidget_DeleteMessage($id: ID!, $hard: Boolean) {
+    deleteMessage(id: $id, hard: $hard) {
+      success
+    }
+  }
+`, ke = p`
+  mutation ContextConversationWidget_AddReaction(
+    $messageId: ID!
+    $emoji: String!
+  ) {
+    addReaction(messageId: $messageId, emoji: $emoji) {
+      id
+    }
+  }
+`, Ae = p`
+  mutation ContextConversationWidget_RemoveReaction(
+    $messageId: ID!
+    $emoji: String!
+  ) {
+    removeReaction(messageId: $messageId, emoji: $emoji) {
+      success
+    }
+  }
+`, je = p`
+  mutation ContextConversationWidget_PinMessage($messageId: ID!) {
+    pinMessage(messageId: $messageId) {
+      id
+    }
+  }
+`, Me = p`
+  mutation ContextConversationWidget_UnpinMessage($messageId: ID!) {
+    unpinMessage(messageId: $messageId) {
+      id
+    }
+  }
+`, Ne = p`
+  mutation ContextConversationWidget_InitiateUpload(
+    $input: InitiateUploadInput!
+  ) {
+    initiateUpload(input: $input) {
+      uploadUrl
+      session {
+        id
+      }
+    }
+  }
+`, Pe = p`
+  mutation ContextConversationWidget_CompleteUpload(
+    $input: CompleteUploadInput!
+  ) {
+    completeUpload(input: $input) {
+      fileId
+      file {
+        id
+        name
+        mimeType
+        size
+        downloadUrl
+      }
+    }
+  }
+`, Fe = [
+	"👍",
+	"❤️",
+	"🎉",
+	"👀",
+	"✅"
+], Ie = 5 * 1024 * 1024;
+function v(e) {
+	return e.trim().toLowerCase().replace(/[^a-z0-9:_/-]+/g, "-").replace(/-+/g, "-").replace(/^-|-$/g, "");
+}
+function y(e) {
+	if (typeof e != "string" || !e.trim()) return null;
+	try {
+		let t = typeof window < "u" ? window.location.origin : "http://local";
+		return v(new URL(e, t).pathname);
+	} catch {
+		return v(e.split(/[?#]/)[0] ?? e);
+	}
+}
+function b(e) {
+	return typeof e == "string" && e.trim() ? e : null;
+}
+function Le(e) {
+	if (!e || typeof e != "object" || Array.isArray(e)) return null;
+	let t = e.metadata;
+	if (!t || typeof t != "object" || Array.isArray(t)) return null;
+	let n = t.sourceContext;
+	return n && typeof n == "object" && !Array.isArray(n) ? n : null;
+}
+function Re(e, t) {
+	if (!e) return !1;
+	let n = b(e.product);
+	if (n && n !== t.product) return !1;
+	let r = b(e.widgetKey);
+	if (r && r !== t.widgetKey) return !1;
+	if (b(e.threadKey) === t.threadKey) return !0;
+	let i = b(e.entityType), a = b(e.entityId);
+	if (i && a && i === t.entityType && a === t.entityId) return !0;
+	let o = [y(e.pagePath), y(e.contextHref)].filter((e) => !!e), s = [y(t.pagePath), y(t.contextHref)].filter((e) => !!e);
+	return o.some((e) => s.includes(e));
+}
+function ze(e) {
+	if (typeof e == "string") return e;
+	if (e && typeof e == "object") {
+		let t = e;
+		if (typeof t.text == "string") return t.text;
+		if (typeof t.markdown == "string") return t.markdown;
+		if (typeof t.html == "string") return t.html;
+	}
+	return "";
+}
+function Be(e) {
+	return e < 1024 ? `${e} B` : e < 1024 * 1024 ? `${(e / 1024).toFixed(1)} KB` : `${(e / (1024 * 1024)).toFixed(1)} MB`;
+}
+function Ve(e) {
+	return new Date(e).toLocaleTimeString([], {
+		hour: "2-digit",
+		minute: "2-digit"
+	});
+}
+function x({ className: p, widgetKey: y }) {
+	let { t: x } = ne(), { workspaceId: S } = r(), C = n(), w = re(), T = t("workspace"), E = be(), [D, O] = u(null), [He, k] = u(null), [A, j] = u(""), [M, Ue] = u(() => typeof window < "u" ? window.innerWidth < 768 : !1), [N, P] = u(null), [F, I] = u(null), [L, R] = u(""), [z, We] = u(!1), [B, V] = u([]), [Ge, H] = u(null), [Ke, qe] = u([]), [Je, Ye] = u(!1), U = ie(null), Xe = ie(null), W = l(() => (e, t) => {
+		let n = x(e);
+		return n === e ? t : n;
+	}, [x]), G = C.user?.id ?? null, K = y ?? w.widgetKey ?? "default", q = T, J = l(() => {
+		let e = v(w.entityType && w.entityId ? `${w.entityType}:${w.entityId}` : w.pagePath || w.contextHref), t = v(K);
+		return {
+			...w,
+			widgetKey: K,
+			threadKey: `${w.product}:${S}:${e}:widget:${t}`
+		};
+	}, [
+		K,
+		w,
+		S
+	]);
+	c(() => {
+		O(null), k(null), P(null), I(null), R(""), H(null);
+	}, [J.threadKey]);
+	let [Ze] = m(De, { client: q }), [Qe] = m(Oe, { client: q }), [$e] = m(ke, { client: q }), [et] = m(Ae, { client: q }), [tt] = m(je, { client: q }), [nt] = m(Me, { client: q }), [rt] = m(Ne, { client: T }), [it] = m(Pe, { client: T }), Y = h(Se, {
+		client: q,
+		variables: { id: D },
+		skip: !D,
+		pollInterval: 3e5,
+		fetchPolicy: "cache-and-network"
+	}), at = h(Ce, {
+		client: q,
+		variables: { first: 100 },
+		skip: !S || !G || !!D,
+		fetchPolicy: "cache-and-network"
+	}), X = h(_, {
+		client: q,
+		variables: {
+			conversationId: D,
+			first: 100
+		},
+		skip: !D,
+		fetchPolicy: "cache-and-network"
+	});
+	g(we, {
+		client: q,
+		variables: { conversationId: D || "" },
+		skip: !D,
+		onData: ({ data: e, client: t }) => {
+			e.data?.messageAdded && t.refetchQueries({ include: [_] });
+		}
+	}), g(Te, {
+		client: q,
+		variables: { conversationId: D || "" },
+		skip: !D
+	}), g(Ee, {
+		client: q,
+		variables: { conversationId: D || "" },
+		skip: !D,
+		onData: ({ client: e }) => {
+			e.refetchQueries({ include: [_] });
+		}
+	});
+	let ot = (Y.data?.conversation?.settings ?? {}).metadata?.sourceContext, st = typeof ot?.contextHref == "string" ? ot.contextHref : J.contextHref, Z = l(() => (X.data?.messages?.edges ?? []).map((e) => {
+		let t = e.node;
+		return {
+			id: String(t.id ?? ""),
+			conversationId: String(t.conversationId ?? ""),
+			content: ze(t.content),
+			authorId: String(t.authorId ?? ""),
+			parentMessageId: t.parentMessageId ? String(t.parentMessageId) : void 0,
+			threadLevel: Number(t.threadLevel ?? 0),
+			replyCount: Number(t.replyCount ?? 0),
+			createdAt: String(t.createdAt ?? (/* @__PURE__ */ new Date()).toISOString()),
+			updatedAt: String(t.updatedAt ?? (/* @__PURE__ */ new Date()).toISOString()),
+			isEdited: !!t.isEdited,
+			isPinned: !!t.isPinned,
+			permissions: {
+				canEdit: !!t.permissions?.canEdit,
+				canDelete: !!t.permissions?.canDelete,
+				canReact: !!(t.permissions?.canReact ?? !0),
+				canReply: !!(t.permissions?.canReply ?? !0),
+				canPin: !!t.permissions?.canPin
+			},
+			reactions: (t.reactions ?? []).map((e) => ({
+				id: String(e.id ?? ""),
+				emoji: String(e.emoji ?? ""),
+				userId: String(e.userId ?? "")
+			})),
+			attachments: (t.attachments ?? []).map((e) => ({
+				id: String(e.id ?? ""),
+				fileId: String(e.fileId ?? ""),
+				fileName: String(e.fileName ?? e.fileId ?? "Attachment"),
+				fileSize: Number(e.fileSize ?? 0),
+				mimeType: String(e.mimeType ?? "application/octet-stream"),
+				downloadUrl: e.downloadUrl ? String(e.downloadUrl) : null,
+				thumbnail: e.thumbnail ? String(e.thumbnail) : null
+			}))
+		};
+	}), [X.data]);
+	c(() => {
+		if (D) return;
+		let e = (at.data?.conversations?.edges ?? []).find((e) => Re(Le(e.node?.settings), J)), t = e?.node?.id;
+		t && (O(t), k(b(Le(e.node?.settings)?.threadKey) ?? J.threadKey));
+	}, [
+		at.data,
+		D,
+		J
+	]);
+	let ct = l(() => {
+		let e = /* @__PURE__ */ new Map();
+		G && e.set(G, {
+			id: G,
+			label: C.user?.name || C.user?.email || G
+		});
+		for (let t of Z) e.has(t.authorId) || e.set(t.authorId, {
+			id: t.authorId,
+			label: t.authorId
+		});
+		return Array.from(e.values());
+	}, [
+		C.user?.email,
+		C.user?.name,
+		G,
+		Z
+	]), Q = l(() => A.match(/(^|\s)@([^\s@]*)$/)?.[2]?.toLowerCase() ?? null, [A]), lt = l(() => Q ? ct.filter((e) => `${e.label} ${e.id}`.toLowerCase().includes(Q)) : [], [Q, ct]), $ = l(() => {
+		let e = Y.data?.conversation?.features;
+		return {
+			threads: !!(e?.threads ?? !0),
+			reactions: !!(e?.reactions ?? !0),
+			mentions: !!(e?.mentions ?? !0)
+		};
+	}, [Y.data]);
+	if (c(() => {
+		Xe.current?.scrollIntoView({ behavior: "smooth" });
+	}, [Z.length, M]), !G) return null;
+	if (!S) return /* @__PURE__ */ f(a, {
+		className: p,
+		children: [/* @__PURE__ */ d(s, { children: /* @__PURE__ */ f(ee, {
+			className: "flex items-center gap-2 text-base",
+			children: [/* @__PURE__ */ d(le, { className: "h-4 w-4" }), W("conversationWidget.title", "Page conversation")]
+		}) }), /* @__PURE__ */ d(o, { children: /* @__PURE__ */ d("p", {
+			className: "text-sm text-muted-foreground",
+			children: W("conversationWidget.noWorkspace", "Select a workspace to enable contextual conversations on this page.")
+		}) })]
+	});
+	let ut = async (e) => {
+		if (!(!e || e.length === 0)) {
+			We(!0), H(null);
+			try {
+				let t = [];
+				for (let n of Array.from(e)) {
+					if (n.size > Ie) throw Error(`${n.name} exceeds the 5 MB widget upload limit.`);
+					let e = n.name.includes(".") ? n.name.split(".").pop() ?? "bin" : "bin", r = await rt({ variables: { input: {
+						fileName: n.name,
+						fileSize: n.size,
+						mimeType: n.type || "application/octet-stream",
+						extension: e,
+						visibility: "PRIVATE"
+					} } }), i = r.data?.initiateUpload?.uploadUrl, a = r.data?.initiateUpload?.session?.id;
+					if (!i || !a) throw Error(`Unable to create an upload session for ${n.name}`);
+					if (!(await fetch(i, {
+						method: "PUT",
+						body: n,
+						headers: { "Content-Type": n.type || "application/octet-stream" }
+					})).ok) throw Error(`Upload failed for ${n.name}`);
+					let o = (await it({ variables: { input: { sessionId: a } } })).data?.completeUpload;
+					if (!o?.fileId) throw Error(`Failed to finalize ${n.name}`);
+					t.push({
+						fileId: o.fileId,
+						fileName: o.file?.name ?? n.name,
+						fileSize: Number(o.file?.size ?? n.size),
+						mimeType: o.file?.mimeType ?? n.type,
+						downloadUrl: o.file?.downloadUrl ?? null
+					});
+				}
+				V((e) => [...e, ...t]);
+			} catch (e) {
+				H(e instanceof Error ? e.message : "File upload failed");
+			} finally {
+				We(!1), U.current && (U.current.value = "");
+			}
+		}
+	}, dt = async () => {
+		if (!(!S || !A.trim())) {
+			H(null), Ye(!0);
+			try {
+				let e = await q.mutate({
+					mutation: xe,
+					errorPolicy: "none",
+					variables: { input: {
+						workspaceId: S,
+						sourceContext: {
+							...J,
+							threadKey: He ?? J.threadKey
+						},
+						content: { text: A.trim() },
+						type: "TEXT",
+						parentMessageId: N?.id,
+						mentionUserIds: Array.from(new Set(Ke)),
+						attachments: B.map((e) => ({
+							fileId: e.fileId,
+							fileName: e.fileName,
+							fileSize: e.fileSize,
+							mimeType: e.mimeType,
+							downloadUrl: e.downloadUrl
+						}))
+					} }
+				});
+				if (!e.data?.sendContextMessage?.success) throw Error("Failed to send message");
+				let t = e.data.sendContextMessage.message?.conversationId;
+				t && (O(String(t)), k(He ?? J.threadKey)), j(""), P(null), V([]), qe([]), D && (await X.refetch(), await Y.refetch());
+			} catch (e) {
+				H(e instanceof Error ? e.message : "Failed to send message");
+			} finally {
+				Ye(!1);
+			}
+		}
+	}, ft = (e) => {
+		j((t) => t.replace(/(^|\s)@([^\s@]*)$/, `$1@${e.label} `)), qe((t) => Array.from(new Set([...t, e.id])));
+	}, pt = async () => {
+		!F || !L.trim() || (await Ze({ variables: { input: {
+			id: F,
+			content: { text: L.trim() }
+		} } }), I(null), R(""), await X.refetch());
+	}, mt = async (e, t) => {
+		e.reactions.some((e) => e.emoji === t && e.userId === G) ? await et({ variables: {
+			messageId: e.id,
+			emoji: t
+		} }) : await $e({ variables: {
+			messageId: e.id,
+			emoji: t
+		} }), await X.refetch();
+	}, ht = async (e) => {
+		e.isPinned ? await nt({ variables: { messageId: e.id } }) : await tt({ variables: { messageId: e.id } }), await X.refetch();
+	};
+	return /* @__PURE__ */ f(a, {
+		className: p,
+		children: [/* @__PURE__ */ f(s, {
+			className: "space-y-3",
+			children: [/* @__PURE__ */ f("div", {
+				className: "flex flex-col gap-3 md:flex-row md:items-start md:justify-between",
+				children: [/* @__PURE__ */ f("div", {
+					className: "space-y-1",
+					children: [/* @__PURE__ */ f(ee, {
+						className: "flex items-center gap-2 text-base",
+						children: [/* @__PURE__ */ d(le, { className: "h-4 w-4" }), Y.data?.conversation?.title || w.contextTitle || W("conversationWidget.title", "Page conversation")]
+					}), /* @__PURE__ */ d("p", {
+						className: "text-sm text-muted-foreground truncate whitespace-nowrap overflow-hidden max-w-full",
+						title: w.entityType && w.entityId ? `${w.entityType} · ${w.entityId}` : w.pagePath,
+						children: w.entityType && w.entityId ? `${w.entityType} · ${w.entityId}` : w.pagePath
+					})]
+				}), /* @__PURE__ */ f("div", {
+					className: "flex flex-wrap items-center gap-2",
+					children: [
+						/* @__PURE__ */ f(e, {
+							type: "button",
+							variant: "outline",
+							size: "sm",
+							onClick: () => {
+								try {
+									let e = new URL(st);
+									E(`${e.pathname}${e.search}${e.hash}`);
+								} catch {
+									E(w.pagePath);
+								}
+							},
+							children: [/* @__PURE__ */ d(se, { className: "mr-2 h-4 w-4" }), W("conversationWidget.openContext", "Open context")]
+						}),
+						/* @__PURE__ */ d(e, {
+							type: "button",
+							variant: "outline",
+							size: "sm",
+							onClick: () => {
+								D && E(`/conversations/${D}`);
+							},
+							disabled: !D,
+							children: W("conversationWidget.openInbox", "Open in conversations")
+						}),
+						/* @__PURE__ */ d(e, {
+							type: "button",
+							variant: "ghost",
+							size: "icon",
+							onClick: () => Ue((e) => !e),
+							"aria-label": M ? W("conversationWidget.expand", "Expand page conversation") : W("conversationWidget.collapse", "Collapse page conversation"),
+							children: d(M ? ae : oe, { className: "h-4 w-4" })
+						})
+					]
+				})]
+			}), /* @__PURE__ */ f("div", {
+				className: "flex flex-wrap items-center gap-2",
+				children: [
+					/* @__PURE__ */ d(i, {
+						variant: "secondary",
+						children: J.widgetKey
+					}),
+					J.activeTab ? /* @__PURE__ */ d(i, {
+						variant: "outline",
+						children: J.activeTab
+					}) : null,
+					Y.data?.conversation?.currentUserMembership?.unreadCount ? /* @__PURE__ */ f(i, { children: [
+						Y.data.conversation.currentUserMembership.unreadCount,
+						" ",
+						"unread"
+					] }) : null
+				]
+			})]
+		}), !M && /* @__PURE__ */ f(o, {
+			className: "space-y-4",
+			children: [
+				Ge && /* @__PURE__ */ d("div", {
+					className: "rounded-md border border-destructive/20 bg-destructive/10 px-3 py-2 text-sm text-destructive",
+					children: Ge
+				}),
+				/* @__PURE__ */ d("div", {
+					className: "max-h-[24rem] overflow-y-auto rounded-lg border border-border bg-muted/20",
+					children: /* @__PURE__ */ f("div", {
+						className: "space-y-3 p-4",
+						children: [Z.length === 0 ? /* @__PURE__ */ d("div", {
+							className: "rounded-lg border border-dashed border-border bg-background/70 px-4 py-5 text-sm text-muted-foreground",
+							children: W("conversationWidget.empty", "No messages yet. Start the conversation in context.")
+						}) : Z.map((t) => {
+							let n = t.authorId === G;
+							return /* @__PURE__ */ d("div", {
+								className: `flex ${n ? "justify-end" : "justify-start"}`,
+								children: /* @__PURE__ */ f("div", {
+									className: `w-full max-w-[92%] rounded-xl border px-3 py-2 text-sm shadow-sm ${n ? "border-primary/20 bg-primary/5" : "border-border bg-background"}`,
+									children: [
+										/* @__PURE__ */ f("div", {
+											className: "mb-1 flex items-center justify-between gap-2",
+											children: [/* @__PURE__ */ f("div", {
+												className: "flex items-center gap-2 text-xs text-muted-foreground",
+												children: [
+													/* @__PURE__ */ d("span", {
+														className: "font-medium text-foreground",
+														children: n ? W("conversationWidget.you", "You") : t.authorId
+													}),
+													/* @__PURE__ */ d("span", { children: Ve(t.createdAt) }),
+													t.isEdited ? /* @__PURE__ */ d("span", { children: W("conversationWidget.edited", "edited") }) : null,
+													t.isPinned ? /* @__PURE__ */ d(fe, { className: "h-3 w-3" }) : null
+												]
+											}), /* @__PURE__ */ d("div", {
+												className: "flex items-center gap-1",
+												children: $.reactions && t.permissions.canReact ? Fe.map((e) => {
+													let n = t.reactions.filter((t) => t.emoji === e).length;
+													return /* @__PURE__ */ f("button", {
+														type: "button",
+														className: `rounded-full px-2 py-1 text-xs transition-colors ${t.reactions.some((t) => t.emoji === e && t.userId === G) ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground hover:bg-muted/80"}`,
+														onClick: () => void mt(t, e),
+														children: [e, n > 0 ? ` ${n}` : ""]
+													}, `${t.id}-${e}`);
+												}) : null
+											})]
+										}),
+										F === t.id ? /* @__PURE__ */ f("div", {
+											className: "space-y-2",
+											children: [/* @__PURE__ */ d(te, {
+												value: L,
+												onChange: (e) => R(e.target.value),
+												rows: 3
+											}), /* @__PURE__ */ f("div", {
+												className: "flex items-center justify-end gap-2",
+												children: [/* @__PURE__ */ d(e, {
+													type: "button",
+													variant: "outline",
+													size: "sm",
+													onClick: () => I(null),
+													children: W("conversationWidget.cancel", "Cancel")
+												}), /* @__PURE__ */ d(e, {
+													type: "button",
+													size: "sm",
+													onClick: () => void pt(),
+													children: W("conversationWidget.save", "Save")
+												})]
+											})]
+										}) : /* @__PURE__ */ f(ye, { children: [t.parentMessageId ? /* @__PURE__ */ d("p", {
+											className: "mb-1 text-xs text-muted-foreground",
+											children: W("conversationWidget.replyingInThread", "Reply in thread")
+										}) : null, /* @__PURE__ */ d("p", {
+											className: "whitespace-pre-wrap break-words text-sm text-foreground",
+											children: t.content
+										})] }),
+										t.attachments.length > 0 ? /* @__PURE__ */ d("div", {
+											className: "mt-3 flex flex-col gap-2",
+											children: t.attachments.map((e) => /* @__PURE__ */ f("a", {
+												href: e.downloadUrl ?? "#",
+												target: e.downloadUrl ? "_blank" : void 0,
+												rel: e.downloadUrl ? "noreferrer" : void 0,
+												className: "flex items-center justify-between gap-2 rounded-md border border-border bg-muted/40 px-3 py-2 text-xs",
+												children: [/* @__PURE__ */ d("span", {
+													className: "truncate",
+													children: e.fileName
+												}), /* @__PURE__ */ d("span", {
+													className: "text-muted-foreground",
+													children: Be(e.fileSize)
+												})]
+											}, e.id))
+										}) : null,
+										/* @__PURE__ */ f("div", {
+											className: "mt-3 flex flex-wrap items-center gap-2 text-xs",
+											children: [
+												$.threads && t.permissions.canReply ? /* @__PURE__ */ f(e, {
+													type: "button",
+													variant: "ghost",
+													size: "sm",
+													onClick: () => P(t),
+													children: [/* @__PURE__ */ d(me, { className: "mr-2 h-3 w-3" }), W("conversationWidget.reply", "Reply")]
+												}) : null,
+												t.permissions.canEdit && F !== t.id ? /* @__PURE__ */ f(e, {
+													type: "button",
+													variant: "ghost",
+													size: "sm",
+													onClick: () => {
+														I(t.id), R(t.content);
+													},
+													children: [/* @__PURE__ */ d(de, { className: "mr-2 h-3 w-3" }), W("conversationWidget.edit", "Edit")]
+												}) : null,
+												t.permissions.canDelete ? /* @__PURE__ */ f(e, {
+													type: "button",
+													variant: "ghost",
+													size: "sm",
+													onClick: async () => {
+														await Qe({ variables: {
+															id: t.id,
+															hard: !1
+														} }), await X.refetch();
+													},
+													children: [/* @__PURE__ */ d(_e, { className: "mr-2 h-3 w-3" }), W("conversationWidget.delete", "Delete")]
+												}) : null,
+												t.permissions.canPin ? /* @__PURE__ */ f(e, {
+													type: "button",
+													variant: "ghost",
+													size: "sm",
+													onClick: () => void ht(t),
+													children: [t.isPinned ? /* @__PURE__ */ d(pe, { className: "mr-2 h-3 w-3" }) : /* @__PURE__ */ d(fe, { className: "mr-2 h-3 w-3" }), t.isPinned ? W("conversationWidget.unpin", "Unpin") : W("conversationWidget.pin", "Pin")]
+												}) : null
+											]
+										})
+									]
+								})
+							}, t.id);
+						}), /* @__PURE__ */ d("div", { ref: Xe })]
+					})
+				}),
+				N ? /* @__PURE__ */ f("div", {
+					className: "flex items-center justify-between gap-2 rounded-md border border-border bg-muted/40 px-3 py-2 text-sm",
+					children: [/* @__PURE__ */ f("div", {
+						className: "min-w-0",
+						children: [/* @__PURE__ */ f("p", {
+							className: "text-xs text-muted-foreground",
+							children: [
+								W("conversationWidget.replyingTo", "Replying to"),
+								" ",
+								N.authorId
+							]
+						}), /* @__PURE__ */ d("p", {
+							className: "truncate",
+							children: N.content
+						})]
+					}), /* @__PURE__ */ d(e, {
+						type: "button",
+						variant: "ghost",
+						size: "icon",
+						onClick: () => P(null),
+						children: /* @__PURE__ */ d(ve, { className: "h-4 w-4" })
+					})]
+				}) : null,
+				B.length > 0 ? /* @__PURE__ */ d("div", {
+					className: "flex flex-wrap gap-2",
+					children: B.map((e) => /* @__PURE__ */ f(i, {
+						variant: "secondary",
+						className: "gap-2 py-1.5",
+						children: [
+							/* @__PURE__ */ d(ue, { className: "h-3 w-3" }),
+							/* @__PURE__ */ d("span", {
+								className: "max-w-[14rem] truncate",
+								children: e.fileName
+							}),
+							/* @__PURE__ */ d("button", {
+								type: "button",
+								onClick: () => V((t) => t.filter((t) => t.fileId !== e.fileId)),
+								children: /* @__PURE__ */ d(ve, { className: "h-3 w-3" })
+							})
+						]
+					}, e.fileId))
+				}) : null,
+				/* @__PURE__ */ f("div", {
+					className: "space-y-3 rounded-lg border border-border bg-background/80 p-3",
+					children: [
+						/* @__PURE__ */ d(te, {
+							value: A,
+							onChange: (e) => j(e.target.value),
+							rows: 3,
+							placeholder: W("conversationWidget.placeholder", "Discuss this page in context…"),
+							className: "border-0 bg-transparent px-0 shadow-none focus-visible:ring-0"
+						}),
+						$.mentions && lt.length > 0 ? /* @__PURE__ */ f("div", {
+							className: "flex flex-wrap gap-2 rounded-md border border-border bg-muted/20 p-2",
+							children: [/* @__PURE__ */ d(ge, { className: "mt-0.5 h-4 w-4 text-muted-foreground" }), lt.map((t) => /* @__PURE__ */ f(e, {
+								type: "button",
+								variant: "outline",
+								size: "sm",
+								onClick: () => ft(t),
+								children: ["@", t.label]
+							}, t.id))]
+						}) : null,
+						/* @__PURE__ */ f("div", {
+							className: "flex flex-col gap-3 md:flex-row md:items-center md:justify-between",
+							children: [/* @__PURE__ */ f("div", {
+								className: "flex flex-wrap items-center gap-2",
+								children: [
+									/* @__PURE__ */ d("input", {
+										ref: U,
+										type: "file",
+										multiple: !0,
+										className: "hidden",
+										onChange: (e) => void ut(e.target.files)
+									}),
+									/* @__PURE__ */ f(e, {
+										type: "button",
+										variant: "outline",
+										size: "sm",
+										onClick: () => U.current?.click(),
+										disabled: z,
+										children: [z ? /* @__PURE__ */ d(ce, { className: "mr-2 h-4 w-4 animate-spin" }) : /* @__PURE__ */ d(ue, { className: "mr-2 h-4 w-4" }), W("conversationWidget.attach", "Attach files")]
+									}),
+									$.mentions ? /* @__PURE__ */ d(i, {
+										variant: "outline",
+										children: W("conversationWidget.mentionsHint", "Type @ to mention participants")
+									}) : null
+								]
+							}), /* @__PURE__ */ f(e, {
+								type: "button",
+								onClick: () => void dt(),
+								disabled: Je || z || !A.trim(),
+								children: [Je ? /* @__PURE__ */ d(ce, { className: "mr-2 h-4 w-4 animate-spin" }) : /* @__PURE__ */ d(he, { className: "mr-2 h-4 w-4" }), W("conversationWidget.send", "Send")]
+							})]
+						})
+					]
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { x as ContextConversationWidget };