@burdenoff/microfe-bigconsole 2026.711.2 → 2026.712.1

package/dist/bigconsole/components/dashboard/ShareDialog/ShareDialog.js

@@ -1,10 +1,11 @@
-import e from "../../../hooks/useDashboardSharing.js";
+import e from "../../../hooks/useBigConsoleAnalytics.js";
+import t from "../../../hooks/useDashboardSharing.js";
 import "../../../hooks/index.js";
-import { useCallback as t, useEffect as n, useMemo as r, useState as i } from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { createPortal as s } from "react-dom";
+import { useCallback as n, useEffect as r, useMemo as i, useState as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { createPortal as c } from "react-dom";
 //#region src/bigconsole/components/dashboard/ShareDialog/ShareDialog.tsx
-var c = (e) => ({
+var l = (e) => ({
 	bgPrimary: e ? "#1a1a2e" : "#ffffff",
 	bgSecondary: e ? "#252542" : "#f4f4f5",
 	bgTertiary: e ? "#2d2d4a" : "#e4e4e7",
@@ -16,7 +17,7 @@ var c = (e) => ({
 	actionPrimaryBgHover: "#4f46e5",
 	statusSuccessBg: "#22c55e",
 	statusErrorText: "#ef4444"
-}), l = [{
+}), u = [{
 	value: "VIEW",
 	label: "View",
 	description: "Can view the dashboard"
@@ -25,37 +26,49 @@ var c = (e) => ({
 	label: "Edit",
 	description: "Can edit widgets, layout, and share"
 }];
-function u({ dashboardId: u, dashboardName: f, isOpen: p, onClose: m }) {
-	let { shares: h, loading: g, fetchShares: _, shareWithUser: v, shareWithGroup: y, updateShare: b, revokeShare: x, revokeAllShares: S } = e(), [C, w] = i(""), [T, E] = i(null), [D, O] = i("VIEW"), [k, A] = i(""), [j, M] = i(!1);
-	n(() => {
-		p && u && (_(u), A(`${window.location.origin}/dashboard/${u}?shared=true`));
+function d({ dashboardId: d, dashboardName: p, isOpen: m, onClose: h }) {
+	let { shares: g, loading: _, fetchShares: v, shareWithUser: y, shareWithGroup: b, updateShare: x, revokeShare: S, revokeAllShares: C } = t(), w = e(), [T, E] = a(""), [D, O] = a(null), [k, A] = a("VIEW"), [j, M] = a(""), [N, P] = a(!1);
+	r(() => {
+		m && d && (v(d), M(`${window.location.origin}/dashboard/${d}?shared=true`));
 	}, [
-		p,
-		u,
-		_
+		m,
+		d,
+		v
 	]);
-	let N = t(async () => {
-		T && (T.type === "USER" ? await v(u, T.id, D) : T.type === "GROUP" && await y(u, T.id, D), E(null), w(""));
+	let F = n(async () => {
+		if (!D) return;
+		w("bigconsole.dashboard.share_clicked", {
+			dashboardId: d,
+			permission: k,
+			recipientType: D.type
+		});
+		let e = null;
+		D.type === "USER" ? e = await y(d, D.id, k) : D.type === "GROUP" && (e = await b(d, D.id, k)), e && w("bigconsole.dashboard.shared", {
+			dashboardId: d,
+			permission: k,
+			recipientType: D.type
+		}), O(null), E("");
 	}, [
-		u,
-		T,
+		d,
+		w,
 		D,
-		v,
+		k,
+		b,
 		y
-	]), P = t(async (e, t) => {
-		await b({
+	]), I = n(async (e, t) => {
+		await x({
 			id: e,
 			permission: t
 		});
-	}, [b]), F = t(async (e) => {
-		window.confirm("Are you sure you want to revoke this access?") && await x(e);
-	}, [x]), I = t(async () => {
-		window.confirm("Are you sure you want to revoke all shared access?") && await S(u);
-	}, [u, S]), L = t(async () => {
+	}, [x]), L = n(async (e) => {
+		window.confirm("Are you sure you want to revoke this access?") && await S(e);
+	}, [S]), R = n(async () => {
+		window.confirm("Are you sure you want to revoke all shared access?") && await C(d);
+	}, [d, C]), z = n(async () => {
 		try {
-			await navigator.clipboard.writeText(k), M(!0), setTimeout(() => M(!1), 2e3);
+			await navigator.clipboard.writeText(j), P(!0), setTimeout(() => P(!1), 2e3);
 		} catch {}
-	}, [k]), R = C ? [
+	}, [j]), B = T ? [
 		{
 			id: "user-1",
 			name: "John Doe",
@@ -78,8 +91,8 @@ function u({ dashboardId: u, dashboardName: f, isOpen: p, onClose: m }) {
 			name: "Editors",
 			type: "GROUP"
 		}
-	].filter((e) => e.name.toLowerCase().includes(C.toLowerCase()) || e.email?.toLowerCase().includes(C.toLowerCase())) : [], z = typeof document < "u" && document.documentElement.classList.contains("dark"), B = r(() => c(z), [z]);
-	return p ? s(/* @__PURE__ */ a("div", {
+	].filter((e) => e.name.toLowerCase().includes(T.toLowerCase()) || e.email?.toLowerCase().includes(T.toLowerCase())) : [], V = typeof document < "u" && document.documentElement.classList.contains("dark"), H = i(() => l(V), [V]);
+	return m ? c(/* @__PURE__ */ o("div", {
 		style: {
 			position: "fixed",
 			top: 0,
@@ -93,99 +106,99 @@ function u({ dashboardId: u, dashboardName: f, isOpen: p, onClose: m }) {
 			zIndex: 99999,
 			isolation: "isolate"
 		},
-		onClick: m,
-		children: /* @__PURE__ */ o("div", {
+		onClick: h,
+		children: /* @__PURE__ */ s("div", {
 			style: {
 				width: "520px",
 				maxHeight: "80vh",
-				backgroundColor: B.bgPrimary,
+				backgroundColor: H.bgPrimary,
 				borderRadius: "12px",
 				boxShadow: "0 8px 32px rgba(0, 0, 0, 0.3)",
 				overflow: "hidden",
 				position: "relative",
 				zIndex: 1e5,
-				color: B.textPrimary
+				color: H.textPrimary
 			},
 			onClick: (e) => e.stopPropagation(),
-			children: [/* @__PURE__ */ o("div", {
+			children: [/* @__PURE__ */ s("div", {
 				style: {
 					padding: "20px 24px",
-					borderBottom: `1px solid ${B.borderDefault}`,
+					borderBottom: `1px solid ${H.borderDefault}`,
 					display: "flex",
 					alignItems: "center",
 					justifyContent: "space-between",
-					backgroundColor: B.bgPrimary
+					backgroundColor: H.bgPrimary
 				},
-				children: [/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("h3", {
+				children: [/* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("h3", {
 					style: {
 						margin: 0,
 						fontSize: "18px",
 						fontWeight: 600,
-						color: B.textPrimary
+						color: H.textPrimary
 					},
 					children: "Share Dashboard"
-				}), /* @__PURE__ */ a("p", {
+				}), /* @__PURE__ */ o("p", {
 					style: {
 						margin: "4px 0 0",
 						fontSize: "13px",
-						color: B.textSecondary
+						color: H.textSecondary
 					},
-					children: f
-				})] }), /* @__PURE__ */ a("button", {
-					onClick: m,
+					children: p
+				})] }), /* @__PURE__ */ o("button", {
+					onClick: h,
 					style: {
 						background: "none",
 						border: "none",
 						fontSize: "24px",
 						cursor: "pointer",
-						color: B.textSecondary,
+						color: H.textSecondary,
 						padding: "4px",
 						lineHeight: 1
 					},
 					children: "×"
 				})]
-			}), /* @__PURE__ */ o("div", {
+			}), /* @__PURE__ */ s("div", {
 				style: {
 					padding: "24px",
 					overflowY: "auto",
 					maxHeight: "calc(80vh - 200px)",
-					backgroundColor: B.bgPrimary
+					backgroundColor: H.bgPrimary
 				},
 				children: [
-					/* @__PURE__ */ o("div", {
+					/* @__PURE__ */ s("div", {
 						style: { marginBottom: "24px" },
-						children: [/* @__PURE__ */ a("label", {
+						children: [/* @__PURE__ */ o("label", {
 							style: {
 								display: "block",
 								marginBottom: "8px",
 								fontSize: "13px",
 								fontWeight: 600,
-								color: B.textPrimary
+								color: H.textPrimary
 							},
 							children: "Share Link"
-						}), /* @__PURE__ */ o("div", {
+						}), /* @__PURE__ */ s("div", {
 							style: {
 								display: "flex",
 								gap: "8px"
 							},
-							children: [/* @__PURE__ */ a("input", {
+							children: [/* @__PURE__ */ o("input", {
 								type: "text",
-								value: k,
+								value: j,
 								readOnly: !0,
 								style: {
 									flex: 1,
 									padding: "10px 12px",
-									border: `1px solid ${B.borderDefault}`,
+									border: `1px solid ${H.borderDefault}`,
 									borderRadius: "6px",
 									fontSize: "13px",
-									backgroundColor: B.bgSecondary,
-									color: B.textPrimary
+									backgroundColor: H.bgSecondary,
+									color: H.textPrimary
 								}
-							}), /* @__PURE__ */ a("button", {
-								onClick: L,
+							}), /* @__PURE__ */ o("button", {
+								onClick: z,
 								style: {
 									padding: "10px 16px",
-									backgroundColor: j ? B.statusSuccessBg : B.actionPrimaryBg,
+									backgroundColor: N ? H.statusSuccessBg : H.actionPrimaryBg,
 									color: "white",
 									border: "none",
 									borderRadius: "6px",
@@ -194,66 +207,66 @@ function u({ dashboardId: u, dashboardName: f, isOpen: p, onClose: m }) {
 									fontWeight: 500,
 									minWidth: "80px"
 								},
-								children: j ? "Copied!" : "Copy"
+								children: N ? "Copied!" : "Copy"
 							})]
 						})]
 					}),
-					/* @__PURE__ */ o("div", {
+					/* @__PURE__ */ s("div", {
 						style: { marginBottom: "24px" },
-						children: [/* @__PURE__ */ a("label", {
+						children: [/* @__PURE__ */ o("label", {
 							style: {
 								display: "block",
 								marginBottom: "8px",
 								fontSize: "13px",
 								fontWeight: 600,
-								color: B.textPrimary
+								color: H.textPrimary
 							},
 							children: "Add People"
-						}), /* @__PURE__ */ o("div", {
+						}), /* @__PURE__ */ s("div", {
 							style: {
 								display: "flex",
 								gap: "8px",
 								marginBottom: "8px"
 							},
 							children: [
-								/* @__PURE__ */ o("div", {
+								/* @__PURE__ */ s("div", {
 									style: {
 										flex: 1,
 										position: "relative"
 									},
-									children: [/* @__PURE__ */ a("input", {
+									children: [/* @__PURE__ */ o("input", {
 										type: "text",
-										value: T ? T.name : C,
+										value: D ? D.name : T,
 										onChange: (e) => {
-											w(e.target.value), E(null);
+											E(e.target.value), O(null);
 										},
 										placeholder: "Search by name or email...",
 										style: {
 											width: "100%",
 											padding: "10px 12px",
-											border: `1px solid ${B.borderDefault}`,
+											border: `1px solid ${H.borderDefault}`,
 											borderRadius: "6px",
 											fontSize: "13px",
-											backgroundColor: B.bgPrimary,
-											color: B.textPrimary
+											backgroundColor: H.bgPrimary,
+											color: H.textPrimary
 										}
-									}), C && !T && R.length > 0 && /* @__PURE__ */ a("div", {
+									}), T && !D && B.length > 0 && /* @__PURE__ */ o("div", {
 										style: {
 											position: "absolute",
 											top: "100%",
 											left: 0,
 											right: 0,
 											marginTop: "4px",
-											backgroundColor: B.bgPrimary,
-											border: `1px solid ${B.borderDefault}`,
+											backgroundColor: H.bgPrimary,
+											border: `1px solid ${H.borderDefault}`,
 											borderRadius: "6px",
 											boxShadow: "0 8px 24px rgba(0,0,0,0.25)",
 											zIndex: 100001,
 											maxHeight: "200px",
 											overflowY: "auto"
 										},
-										children: R.map((e) => /* @__PURE__ */ o("button", {
-											onClick: () => E(e),
+										children: B.map((e) => /* @__PURE__ */ s("button", {
+											onClick: () => O(e),
 											style: {
 												display: "block",
 												width: "100%",
@@ -262,28 +275,28 @@ function u({ dashboardId: u, dashboardName: f, isOpen: p, onClose: m }) {
 												backgroundColor: "transparent",
 												border: "none",
 												cursor: "pointer",
-												borderBottom: `1px solid ${B.borderDefault}`
+												borderBottom: `1px solid ${H.borderDefault}`
 											},
 											children: [
-												/* @__PURE__ */ a("div", {
+												/* @__PURE__ */ o("div", {
 													style: {
 														fontSize: "13px",
 														fontWeight: 500,
-														color: B.textPrimary
+														color: H.textPrimary
 													},
 													children: e.name
 												}),
-												e.email && /* @__PURE__ */ a("div", {
+												e.email && /* @__PURE__ */ o("div", {
 													style: {
 														fontSize: "11px",
-														color: B.textSecondary
+														color: H.textSecondary
 													},
 													children: e.email
 												}),
-												/* @__PURE__ */ a("span", {
+												/* @__PURE__ */ o("span", {
 													style: {
 														fontSize: "10px",
-														color: B.textTertiary,
+														color: H.textTertiary,
 														textTransform: "uppercase"
 													},
 													children: e.type
@@ -292,32 +305,32 @@ function u({ dashboardId: u, dashboardName: f, isOpen: p, onClose: m }) {
 										}, e.id))
 									})]
 								}),
-								/* @__PURE__ */ a("select", {
-									value: D,
-									onChange: (e) => O(e.target.value),
+								/* @__PURE__ */ o("select", {
+									value: k,
+									onChange: (e) => A(e.target.value),
 									style: {
 										padding: "10px 12px",
-										border: `1px solid ${B.borderDefault}`,
+										border: `1px solid ${H.borderDefault}`,
 										borderRadius: "6px",
 										fontSize: "13px",
-										backgroundColor: B.bgPrimary,
-										color: B.textPrimary
+										backgroundColor: H.bgPrimary,
+										color: H.textPrimary
 									},
-									children: l.map((e) => /* @__PURE__ */ a("option", {
+									children: u.map((e) => /* @__PURE__ */ o("option", {
 										value: e.value,
 										children: e.label
 									}, e.value))
 								}),
-								/* @__PURE__ */ a("button", {
-									onClick: N,
-									disabled: !T || g,
+								/* @__PURE__ */ o("button", {
+									onClick: F,
+									disabled: !D || _,
 									style: {
 										padding: "10px 16px",
-										backgroundColor: T ? B.actionPrimaryBg : B.bgTertiary,
-										color: T ? "white" : B.textSecondary,
+										backgroundColor: D ? H.actionPrimaryBg : H.bgTertiary,
+										color: D ? "white" : H.textSecondary,
 										border: "none",
 										borderRadius: "6px",
-										cursor: T ? "pointer" : "not-allowed",
+										cursor: D ? "pointer" : "not-allowed",
 										fontSize: "13px",
 										fontWeight: 500
 									},
@@ -326,59 +339,59 @@ function u({ dashboardId: u, dashboardName: f, isOpen: p, onClose: m }) {
 							]
 						})]
 					}),
-					/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ o("div", {
+					/* @__PURE__ */ s("div", { children: [/* @__PURE__ */ s("div", {
 						style: {
 							display: "flex",
 							alignItems: "center",
 							justifyContent: "space-between",
 							marginBottom: "12px"
 						},
-						children: [/* @__PURE__ */ o("label", {
+						children: [/* @__PURE__ */ s("label", {
 							style: {
 								fontSize: "13px",
 								fontWeight: 600,
-								color: B.textPrimary
+								color: H.textPrimary
 							},
 							children: [
 								"People with Access (",
-								h.length,
+								g.length,
 								")"
 							]
-						}), h.length > 0 && /* @__PURE__ */ a("button", {
-							onClick: I,
+						}), g.length > 0 && /* @__PURE__ */ o("button", {
+							onClick: R,
 							style: {
 								padding: "4px 8px",
 								backgroundColor: "transparent",
-								color: B.statusErrorText,
+								color: H.statusErrorText,
 								border: "none",
 								cursor: "pointer",
 								fontSize: "12px"
 							},
 							children: "Revoke All"
 						})]
-					}), g && h.length === 0 ? /* @__PURE__ */ a("p", {
+					}), _ && g.length === 0 ? /* @__PURE__ */ o("p", {
 						style: {
-							color: B.textSecondary,
+							color: H.textSecondary,
 							fontSize: "13px"
 						},
 						children: "Loading..."
-					}) : h.length === 0 ? /* @__PURE__ */ a("p", {
+					}) : g.length === 0 ? /* @__PURE__ */ o("p", {
 						style: {
-							color: B.textSecondary,
+							color: H.textSecondary,
 							fontSize: "13px"
 						},
 						children: "No one has access to this dashboard yet."
-					}) : /* @__PURE__ */ a("div", {
+					}) : /* @__PURE__ */ o("div", {
 						style: {
 							display: "flex",
 							flexDirection: "column",
 							gap: "8px"
 						},
-						children: h.map((e) => /* @__PURE__ */ a(d, {
+						children: g.map((e) => /* @__PURE__ */ o(f, {
 							share: e,
-							onUpdatePermission: P,
-							onRevoke: F,
-							colors: B
+							onUpdatePermission: I,
+							onRevoke: L,
+							colors: H
 						}, e.id))
 					})] })
 				]
@@ -386,8 +399,8 @@ function u({ dashboardId: u, dashboardName: f, isOpen: p, onClose: m }) {
 		})
 	}), document.body) : null;
 }
-function d({ share: e, onUpdatePermission: t, onRevoke: n, colors: r }) {
-	return /* @__PURE__ */ o("div", {
+function f({ share: e, onUpdatePermission: t, onRevoke: n, colors: r }) {
+	return /* @__PURE__ */ s("div", {
 		style: {
 			display: "flex",
 			alignItems: "center",
@@ -396,13 +409,13 @@ function d({ share: e, onUpdatePermission: t, onRevoke: n, colors: r }) {
 			backgroundColor: r.bgSecondary,
 			borderRadius: "6px"
 		},
-		children: [/* @__PURE__ */ o("div", {
+		children: [/* @__PURE__ */ s("div", {
 			style: {
 				display: "flex",
 				alignItems: "center",
 				gap: "10px"
 			},
-			children: [/* @__PURE__ */ a("div", {
+			children: [/* @__PURE__ */ o("div", {
 				style: {
 					width: "36px",
 					height: "36px",
@@ -416,14 +429,14 @@ function d({ share: e, onUpdatePermission: t, onRevoke: n, colors: r }) {
 					fontSize: "14px"
 				},
 				children: e.recipientType === "USER" ? "U" : "R"
-			}), /* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("div", {
+			}), /* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("div", {
 				style: {
 					fontSize: "13px",
 					fontWeight: 500,
 					color: r.textPrimary
 				},
 				children: e.recipientId
-			}), /* @__PURE__ */ o("div", {
+			}), /* @__PURE__ */ s("div", {
 				style: {
 					fontSize: "11px",
 					color: r.textSecondary
@@ -434,13 +447,13 @@ function d({ share: e, onUpdatePermission: t, onRevoke: n, colors: r }) {
 					new Date(e.createdAt).toLocaleDateString()
 				]
 			})] })]
-		}), /* @__PURE__ */ o("div", {
+		}), /* @__PURE__ */ s("div", {
 			style: {
 				display: "flex",
 				alignItems: "center",
 				gap: "8px"
 			},
-			children: [/* @__PURE__ */ a("select", {
+			children: [/* @__PURE__ */ o("select", {
 				value: e.permission,
 				onChange: (n) => t(e.id, n.target.value),
 				style: {
@@ -451,11 +464,11 @@ function d({ share: e, onUpdatePermission: t, onRevoke: n, colors: r }) {
 					backgroundColor: r.bgPrimary,
 					color: r.textPrimary
 				},
-				children: l.map((e) => /* @__PURE__ */ a("option", {
+				children: u.map((e) => /* @__PURE__ */ o("option", {
 					value: e.value,
 					children: e.label
 				}, e.value))
-			}), /* @__PURE__ */ a("button", {
+			}), /* @__PURE__ */ o("button", {
 				onClick: () => n(e.id),
 				style: {
 					padding: "6px 10px",
@@ -472,6 +485,6 @@ function d({ share: e, onUpdatePermission: t, onRevoke: n, colors: r }) {
 	});
 }
 //#endregion
-export { u as default };
+export { d as default };
 
 //# sourceMappingURL=ShareDialog.js.map