@burdenoff/fe-libs 2026.1021.14 → 2026.1021.15

package/dist/admin-overview/AdminOverviewActionsContext.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+interface AdminOverviewActions {
+    onLoadProjects: (workspaceId: string) => void;
+    onManageWorkspace: (workspaceId: string) => void;
+}
+export declare function AdminOverviewActionsProvider({ actions, children, }: {
+    actions: AdminOverviewActions;
+    children: ReactNode;
+}): import('react/jsx-runtime').JSX.Element;
+export declare function useAdminOverviewActions(): AdminOverviewActions;
+export {};

package/dist/admin-overview/AdminOverviewActionsContext.js

@@ -0,0 +1,17 @@
+import { createContext as e, use as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/admin-overview/AdminOverviewActionsContext.tsx
+var r = e(null);
+function i({ actions: e, children: t }) {
+	return /* @__PURE__ */ n(r.Provider, {
+		value: e,
+		children: t
+	});
+}
+function a() {
+	let e = t(r);
+	if (!e) throw Error("useAdminOverviewActions must be used inside AdminOverviewActionsProvider");
+	return e;
+}
+//#endregion
+export { i as AdminOverviewActionsProvider, a as useAdminOverviewActions };

package/dist/admin-overview/AdminOverviewPage.d.ts

@@ -0,0 +1,4 @@
+export interface AdminOverviewPageProps {
+    authToken: string;
+}
+export declare function AdminOverviewPage(props: AdminOverviewPageProps): import('react/jsx-runtime').JSX.Element;

package/dist/admin-overview/AdminOverviewPage.js

@@ -0,0 +1,524 @@
+import { graphqlFetch as e } from "../shared/graphql/fetch.js";
+import { useI18n as t } from "../shared/providers/shell/I18nProvider.js";
+import { useShellNavigate as n } from "../shared/utils/appHelpers.js";
+import "../shared-utils.js";
+import { GET_ADMIN_OVERVIEW_CONTEXT as r, GET_MY_PROJECTS_DOC as i } from "./operations.js";
+import { buildHierarchyGraph as a } from "./buildHierarchyGraph.js";
+import { AdminOverviewActionsProvider as o } from "./AdminOverviewActionsContext.js";
+import { OrganizationNode as s } from "./nodes/OrganizationNode.js";
+import { WorkspaceNode as c } from "./nodes/WorkspaceNode.js";
+import { TenantNode as l } from "./nodes/TenantNode.js";
+import { ProjectNode as u } from "./nodes/ProjectNode.js";
+import { impactFeedback as d, notificationFeedback as ee, selectionFeedback as te } from "../shell-native/feedback.js";
+import { showNativeToast as ne } from "../shell-native/toast.js";
+import "../shell-native.js";
+import { useCallback as f, useEffect as p, useMemo as m, useReducer as re, useRef as ie, useState as h } from "react";
+import { AlertCircle as g, Building as _, Building2 as v, Download as y, Layers as b, LayoutGrid as x, Network as S, Package as C, RefreshCcw as w } from "lucide-react";
+import { Fragment as ae, jsx as T, jsxs as E } from "react/jsx-runtime";
+import { useQuery as D } from "@apollo/client/react";
+import { Background as O, BackgroundVariant as k, Controls as A, MiniMap as j, Panel as M, ReactFlow as N, ReactFlowProvider as P, applyEdgeChanges as F, applyNodeChanges as I, useReactFlow as L } from "@xyflow/react";
+import "@xyflow/react/dist/style.css";
+//#region src/admin-overview/AdminOverviewPage.tsx
+var R = {
+	organization: s,
+	workspace: c,
+	tenant: l,
+	project: u
+}, z = {
+	byWorkspace: {},
+	loadingFor: /* @__PURE__ */ new Set(),
+	error: null
+};
+function B(e, t) {
+	switch (t.type) {
+		case "loadStart": {
+			let n = new Set(e.loadingFor);
+			return n.add(t.workspaceId), {
+				...e,
+				loadingFor: n,
+				error: null
+			};
+		}
+		case "loadSuccess": {
+			let n = new Set(e.loadingFor);
+			return n.delete(t.workspaceId), {
+				...e,
+				loadingFor: n,
+				byWorkspace: {
+					...e.byWorkspace,
+					[t.workspaceId]: t.projects
+				}
+			};
+		}
+		case "loadFailure": {
+			let n = new Set(e.loadingFor);
+			return n.delete(t.workspaceId), {
+				...e,
+				loadingFor: n,
+				error: t.error
+			};
+		}
+		case "reset": return {
+			byWorkspace: {},
+			loadingFor: /* @__PURE__ */ new Set(),
+			error: null
+		};
+		default: return e;
+	}
+}
+function V(e) {
+	return /* @__PURE__ */ T(P, { children: /* @__PURE__ */ T(H, { ...e }) });
+}
+function H({ authToken: o }) {
+	let s = n(), { fitView: c } = L(), { t: l } = t(), u = f((e, t) => {
+		let n = l(e);
+		return n === e ? t : n;
+	}, [l]), g = D(r, {
+		variables: {
+			limit: 100,
+			offset: 0
+		},
+		fetchPolicy: "cache-and-network"
+	}), _ = m(() => !!(g.data?.myOrganizations?.hasMore || g.data?.myWorkspaces?.hasMore || g.data?.myTenants?.hasMore), [g.data]), [v, y] = re(B, z), { byWorkspace: b, loadingFor: x, error: S } = v, [C, w] = h(null), O = m(() => g.data?.myOrganizations?.items ?? [], [g.data]), k = m(() => g.data?.myWorkspaces?.items ?? [], [g.data]), A = m(() => g.data?.myTenants?.items ?? [], [g.data]), j = ie({}), M = f(async (t) => {
+		y({
+			type: "loadStart",
+			workspaceId: t
+		});
+		try {
+			let n = k.find((e) => e.id === t);
+			if (!n) throw Error("Workspace not found in current context");
+			let r = n.organizationId ?? n.tenantId;
+			if (!r) throw Error("Workspace is missing organization/tenant context and cannot be scoped");
+			let a = j.current[t];
+			if (!a) {
+				let n = await e({
+					gateway: "workspace",
+					query: "mutation AdminOverviewIssueWorkspaceToken($input: IssueWorkspaceTokenInput!) {\n              issueWorkspaceToken(input: $input) { success token }\n            }",
+					variables: { input: {
+						organizationId: r,
+						workspaceId: t
+					} },
+					authToken: o
+				});
+				if (n.errors && n.errors.length > 0) throw Error(`Token issue failed: ${n.errors.map((e) => e.message).join("; ")}`);
+				let i = n.data?.issueWorkspaceToken;
+				if (!i?.success || !i.token) throw Error("Could not issue workspace token");
+				a = i.token, j.current[t] = a;
+			}
+			let s = await e({
+				gateway: "workspace",
+				query: i,
+				variables: { pagination: { limit: 100 } },
+				authToken: o,
+				workspaceToken: a,
+				workspaceId: t,
+				organizationId: r
+			});
+			if (s.errors && s.errors.length > 0) throw s.errors.some((e) => e.extensions?.code === "TOKEN_EXPIRED") && delete j.current[t], Error(s.errors.map((e) => e.message).join("; "));
+			y({
+				type: "loadSuccess",
+				workspaceId: t,
+				projects: s.data?.myProjects?.items ?? []
+			});
+		} catch (e) {
+			y({
+				type: "loadFailure",
+				workspaceId: t,
+				error: `Failed to load projects: ${e instanceof Error ? e.message : String(e)}`
+			}), ee("error"), ne(u("adminOverviewPage.errorLoadProjects", "Failed to load projects"), "long");
+		}
+	}, [
+		o,
+		k,
+		u
+	]), N = f((e) => {
+		d("light"), s(`/workspaces/${e}`);
+	}, [s]), P = f(() => {
+		d("light"), g.refetch(), y({ type: "reset" }), w(null), j.current = {};
+	}, [g]), R = f(() => {
+		d("medium"), k.forEach((e) => {
+			!b[e.id] && !x.has(e.id) && M(e.id);
+		});
+	}, [
+		k,
+		b,
+		x,
+		M
+	]), V = f((e, t) => {
+		te(), w(t.id);
+	}, []), { nodes: H, edges: W } = m(() => a({
+		organizations: O,
+		workspaces: k,
+		tenants: A,
+		projectsByWorkspace: b,
+		loadingProjectsFor: x,
+		selectedId: C
+	}), [
+		O,
+		k,
+		A,
+		b,
+		x,
+		C
+	]), G = m(() => ({
+		onLoadProjects: M,
+		onManageWorkspace: N
+	}), [M, N]), [K, q] = h(H), [Y, X] = h(W);
+	p(() => {
+		queueMicrotask(() => q(H));
+	}, [H]), p(() => {
+		queueMicrotask(() => X(W));
+	}, [W]);
+	let ce = f((e) => q((t) => I(e, t)), []), le = f((e) => X((t) => F(e, t)), []), ue = Object.keys(b).length, Z = H.length;
+	p(() => {
+		if (Z === 0) return;
+		let e = 0, t = window.requestAnimationFrame(() => {
+			e = window.requestAnimationFrame(() => {
+				c({
+					padding: .2,
+					duration: 500,
+					includeHiddenNodes: !1
+				});
+			});
+		}), n = window.setTimeout(() => {
+			c({
+				padding: .2,
+				duration: 500,
+				includeHiddenNodes: !1
+			});
+		}, 250);
+		return () => {
+			window.cancelAnimationFrame(t), e && window.cancelAnimationFrame(e), window.clearTimeout(n);
+		};
+	}, [
+		c,
+		Z,
+		ue
+	]);
+	let Q = g.loading && !g.data, $ = g.error?.message || S, de = m(() => Object.values(b).reduce((e, t) => e + (t?.length ?? 0), 0), [b]), fe = !Q && O.length === 0 && k.length === 0 && A.length === 0, pe = f(() => w(null), []);
+	return /* @__PURE__ */ T("div", {
+		className: "flex flex-col",
+		style: {
+			height: "clamp(640px, calc(100dvh - 11rem), 980px)",
+			background: "var(--color-bg-page, var(--color-bg-surface))"
+		},
+		"data-testid": "admin-overview-page",
+		children: Q ? /* @__PURE__ */ T("div", {
+			className: "flex flex-1 items-center justify-center",
+			children: /* @__PURE__ */ T(J, {})
+		}) : /* @__PURE__ */ E(ae, { children: [
+			/* @__PURE__ */ T(oe, {
+				organizationsCount: O.length,
+				workspacesCount: k.length,
+				tenantsCount: A.length,
+				totalProjects: de,
+				onLoadAllProjects: R,
+				onRefresh: P
+			}),
+			$ ? /* @__PURE__ */ T(U, { message: $ }) : null,
+			_ ? /* @__PURE__ */ T(U, { message: u("adminOverviewPage.truncatedWarning", "Some lists are truncated (more than 100 items). Not all organizations, workspaces or tenants are shown.") }) : null,
+			/* @__PURE__ */ T(se, {
+				nodes: K,
+				edges: Y,
+				onNodesChange: ce,
+				onEdgesChange: le,
+				onNodeClick: V,
+				onPaneClick: pe,
+				selectedId: C,
+				actions: G,
+				isInitialLoading: Q,
+				isEmpty: fe
+			})
+		] })
+	});
+}
+function oe({ organizationsCount: e, workspacesCount: n, tenantsCount: r, totalProjects: i, onLoadAllProjects: a, onRefresh: o }) {
+	let { t: s } = t(), c = (e, t) => {
+		let n = s(e);
+		return n === e ? t : n;
+	};
+	return /* @__PURE__ */ E("header", {
+		className: "flex items-center justify-between px-6 py-4 border-b shrink-0",
+		style: {
+			borderColor: "var(--color-border-default)",
+			background: "var(--color-bg-surface)"
+		},
+		children: [/* @__PURE__ */ E("div", {
+			className: "flex items-center gap-3",
+			children: [/* @__PURE__ */ T("div", {
+				className: "p-2 rounded-lg",
+				style: {
+					background: "var(--color-bg-subtle, var(--color-bg-surface))",
+					color: "var(--color-action-primary-bg)"
+				},
+				children: /* @__PURE__ */ T(S, { size: 20 })
+			}), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("h1", {
+				className: "text-lg font-semibold",
+				style: { color: "var(--color-text-primary)" },
+				children: c("adminOverviewPage.title", "Administration Overview")
+			}), /* @__PURE__ */ T("p", {
+				className: "text-xs",
+				style: { color: "var(--color-text-secondary)" },
+				children: c("adminOverviewPage.subtitle", "Organization → Workspace → Project hierarchy, with tenant placement")
+			})] })]
+		}), /* @__PURE__ */ E("div", {
+			className: "flex items-center gap-4",
+			children: [
+				/* @__PURE__ */ T(W, {
+					organizations: e,
+					workspaces: n,
+					tenants: r,
+					projects: i
+				}),
+				/* @__PURE__ */ E("button", {
+					type: "button",
+					onClick: a,
+					disabled: n === 0,
+					className: "inline-flex items-center gap-1.5 px-3 py-1.5 rounded-md border text-sm cursor-pointer transition-all duration-150 hover:bg-[color:var(--color-action-primary-bg)]/10 disabled:opacity-50 disabled:cursor-not-allowed whitespace-nowrap",
+					style: {
+						borderColor: "var(--color-action-primary-bg)",
+						color: "var(--color-action-primary-bg)",
+						background: "transparent"
+					},
+					"data-testid": "admin-overview-load-all-projects",
+					title: c("adminOverviewPage.loadAllProjectsTooltip", "Load projects for every workspace"),
+					children: [/* @__PURE__ */ T(y, { size: 14 }), c("adminOverviewPage.loadAllProjects", "Load all projects")]
+				}),
+				/* @__PURE__ */ E("button", {
+					type: "button",
+					onClick: o,
+					className: "inline-flex items-center gap-1.5 px-3 py-1.5 rounded-md border text-sm cursor-pointer transition-all duration-150 hover:bg-action-ghost-bgHover whitespace-nowrap",
+					style: {
+						borderColor: "var(--color-border-default)",
+						color: "var(--color-text-primary)",
+						background: "var(--color-bg-surface)"
+					},
+					"data-testid": "admin-overview-refresh",
+					children: [/* @__PURE__ */ T(w, { size: 14 }), c("adminOverviewPage.refresh", "Refresh")]
+				})
+			]
+		})]
+	});
+}
+function U({ message: e }) {
+	return /* @__PURE__ */ E("div", {
+		className: "flex items-center gap-2 px-6 py-2 border-b text-sm",
+		style: {
+			borderColor: "var(--color-border-default)",
+			background: "var(--color-bg-surface)",
+			color: "var(--color-status-error-text)"
+		},
+		"data-testid": "admin-overview-error",
+		children: [/* @__PURE__ */ T(g, { size: 14 }), /* @__PURE__ */ T("span", { children: e })]
+	});
+}
+function se({ nodes: e, edges: t, onNodesChange: n, onEdgesChange: r, onNodeClick: i, onPaneClick: a, selectedId: s, actions: c, isInitialLoading: l, isEmpty: u }) {
+	return /* @__PURE__ */ E("div", {
+		className: "flex-1 min-h-0 relative",
+		children: [l ? /* @__PURE__ */ T(J, {}) : u ? /* @__PURE__ */ T(Y, {}) : null, /* @__PURE__ */ T(o, {
+			actions: c,
+			children: /* @__PURE__ */ E(N, {
+				nodes: e,
+				edges: t,
+				onNodesChange: n,
+				onEdgesChange: r,
+				nodeTypes: R,
+				fitView: !0,
+				fitViewOptions: { padding: .25 },
+				minZoom: .15,
+				maxZoom: 1.5,
+				onNodeClick: i,
+				onPaneClick: a,
+				proOptions: { hideAttribution: !0 },
+				defaultEdgeOptions: { type: "smoothstep" },
+				children: [
+					/* @__PURE__ */ T(O, {
+						variant: k.Dots,
+						gap: 20,
+						size: 1,
+						color: "var(--color-border-default)"
+					}),
+					/* @__PURE__ */ T(A, { style: {
+						background: "var(--color-bg-surface)",
+						border: "1px solid var(--color-border-default)",
+						borderRadius: 8,
+						overflow: "hidden"
+					} }),
+					/* @__PURE__ */ T(j, {
+						pannable: !0,
+						zoomable: !0,
+						style: {
+							background: "var(--color-bg-surface)",
+							border: "1px solid var(--color-border-default)",
+							borderRadius: 8
+						},
+						nodeColor: (e) => {
+							switch (e.data?.kind) {
+								case "organization": return "var(--color-action-primary-bg)";
+								case "workspace": return "var(--color-status-success-bg)";
+								case "tenant": return "var(--color-status-warning-bg)";
+								case "project": return "var(--color-text-secondary)";
+								default: return "var(--color-border-default)";
+							}
+						}
+					}),
+					/* @__PURE__ */ T(M, {
+						position: "top-left",
+						children: /* @__PURE__ */ T(K, {})
+					}),
+					s ? /* @__PURE__ */ T(M, {
+						position: "bottom-center",
+						children: /* @__PURE__ */ T("div", {
+							className: "px-3 py-1.5 rounded-full border text-xs shadow-sm",
+							style: {
+								background: "var(--color-bg-surface)",
+								borderColor: "var(--color-border-default)",
+								color: "var(--color-text-secondary)"
+							},
+							children: "Click the background to clear selection"
+						})
+					}) : null
+				]
+			})
+		})]
+	});
+}
+function W({ organizations: e, workspaces: n, tenants: r, projects: i }) {
+	let { t: a } = t(), o = (e, t) => {
+		let n = a(e);
+		return n === e ? t : n;
+	};
+	return /* @__PURE__ */ E("div", {
+		className: "flex items-center gap-2 text-xs",
+		children: [
+			/* @__PURE__ */ T(G, {
+				icon: /* @__PURE__ */ T(_, { size: 12 }),
+				label: `${e} ${o("adminOverviewPage.statsOrgs", "orgs")}`
+			}),
+			/* @__PURE__ */ T(G, {
+				icon: /* @__PURE__ */ T(x, { size: 12 }),
+				label: `${n} ${o("adminOverviewPage.statsWorkspaces", "workspaces")}`
+			}),
+			/* @__PURE__ */ T(G, {
+				icon: /* @__PURE__ */ T(v, { size: 12 }),
+				label: `${r} ${o("adminOverviewPage.statsTenants", "tenants")}`
+			}),
+			i > 0 ? /* @__PURE__ */ T(G, {
+				icon: /* @__PURE__ */ T(C, { size: 12 }),
+				label: `${i} ${o("adminOverviewPage.statsProjects", "projects")}`
+			}) : null
+		]
+	});
+}
+function G({ icon: e, label: t }) {
+	return /* @__PURE__ */ E("span", {
+		className: "inline-flex items-center gap-1 px-2 py-1 rounded-md border whitespace-nowrap",
+		style: {
+			borderColor: "var(--color-border-default)",
+			background: "var(--color-bg-surface)",
+			color: "var(--color-text-secondary)"
+		},
+		children: [e, t]
+	});
+}
+function K() {
+	let { t: e } = t(), n = (t, n) => {
+		let r = e(t);
+		return r === t ? n : r;
+	};
+	return /* @__PURE__ */ E("div", {
+		className: "p-3 rounded-lg border shadow-sm text-xs",
+		style: {
+			background: "var(--color-bg-surface)",
+			borderColor: "var(--color-border-default)",
+			color: "var(--color-text-secondary)"
+		},
+		"data-testid": "admin-overview-legend",
+		children: [
+			/* @__PURE__ */ E("div", {
+				className: "flex items-center gap-1.5 mb-2",
+				style: { color: "var(--color-text-primary)" },
+				children: [/* @__PURE__ */ T(b, { size: 12 }), /* @__PURE__ */ T("span", {
+					className: "font-semibold",
+					children: n("adminOverviewPage.legend", "Legend")
+				})]
+			}),
+			/* @__PURE__ */ T(q, {
+				icon: /* @__PURE__ */ T(_, { size: 11 }),
+				label: n("adminOverviewPage.legendOrganization", "Organization")
+			}),
+			/* @__PURE__ */ T(q, {
+				icon: /* @__PURE__ */ T(x, { size: 11 }),
+				label: n("adminOverviewPage.legendWorkspace", "Workspace")
+			}),
+			/* @__PURE__ */ T(q, {
+				icon: /* @__PURE__ */ T(C, { size: 11 }),
+				label: n("adminOverviewPage.legendProject", "Project")
+			}),
+			/* @__PURE__ */ T(q, {
+				icon: /* @__PURE__ */ T(v, { size: 11 }),
+				label: n("adminOverviewPage.legendTenant", "Tenant (dashed link)")
+			}),
+			/* @__PURE__ */ T("div", {
+				className: "mt-2 pt-2 border-t text-[10px] leading-tight",
+				style: { borderColor: "var(--color-border-default)" },
+				children: n("adminOverviewPage.legendHint", "Click any node to highlight its connections.")
+			})
+		]
+	});
+}
+function q({ icon: e, label: t }) {
+	return /* @__PURE__ */ E("div", {
+		className: "flex items-center gap-1.5 py-0.5",
+		children: [/* @__PURE__ */ T("span", {
+			style: { color: "var(--color-action-primary-bg)" },
+			children: e
+		}), /* @__PURE__ */ T("span", { children: t })]
+	});
+}
+function J() {
+	let { t: e } = t();
+	return /* @__PURE__ */ T("div", {
+		className: "absolute inset-0 flex items-center justify-center text-sm pointer-events-none z-10",
+		style: { color: "var(--color-text-secondary)" },
+		children: /* @__PURE__ */ E("div", {
+			className: "flex items-center gap-2",
+			children: [/* @__PURE__ */ T("div", {
+				className: "animate-spin rounded-full size-4 border-2 border-t-transparent",
+				style: {
+					borderColor: "var(--color-action-primary-bg)",
+					borderTopColor: "transparent"
+				}
+			}), ((t, n) => {
+				let r = e(t);
+				return r === t ? n : r;
+			})("adminOverviewPage.loadingHierarchy", "Loading hierarchy…")]
+		})
+	});
+}
+function Y() {
+	let { t: e } = t(), n = (t, n) => {
+		let r = e(t);
+		return r === t ? n : r;
+	};
+	return /* @__PURE__ */ T("div", {
+		className: "absolute inset-0 flex items-center justify-center pointer-events-none z-10",
+		style: { color: "var(--color-text-secondary)" },
+		children: /* @__PURE__ */ E("div", {
+			className: "flex flex-col items-center gap-2 text-center max-w-sm",
+			children: [
+				/* @__PURE__ */ T(S, { size: 32 }),
+				/* @__PURE__ */ T("div", {
+					className: "text-base font-medium",
+					children: n("adminOverviewPage.emptyTitle", "No resources found")
+				}),
+				/* @__PURE__ */ T("div", {
+					className: "text-xs",
+					children: n("adminOverviewPage.emptyDescription", "You don't have access to any organizations, workspaces, or tenants yet.")
+				})
+			]
+		})
+	});
+}
+//#endregion
+export { V as AdminOverviewPage };

package/dist/admin-overview/buildHierarchyGraph.d.ts

@@ -0,0 +1,36 @@
+import { Edge, Node } from '@xyflow/react';
+import { OrganizationSummary, ProjectSummary, TenantSummary, WorkspaceSummary } from './operations';
+export type HierarchyNodeData = {
+    kind: 'organization';
+    entity: OrganizationSummary;
+    workspaceCount: number;
+    isHighlighted: boolean;
+} | {
+    kind: 'workspace';
+    entity: WorkspaceSummary;
+    projectCount: number | null;
+    projectsLoading: boolean;
+    isHighlighted: boolean;
+} | {
+    kind: 'tenant';
+    entity: TenantSummary;
+    workspaceCount: number;
+    isHighlighted: boolean;
+} | {
+    kind: 'project';
+    entity: ProjectSummary;
+    isHighlighted: boolean;
+};
+export interface BuildGraphInput {
+    organizations: OrganizationSummary[];
+    workspaces: WorkspaceSummary[];
+    tenants: TenantSummary[];
+    projectsByWorkspace: Record<string, ProjectSummary[] | undefined>;
+    loadingProjectsFor: Set<string>;
+    selectedId: string | null;
+}
+export interface BuildGraphResult {
+    nodes: Node<HierarchyNodeData>[];
+    edges: Edge[];
+}
+export declare function buildHierarchyGraph(input: BuildGraphInput): BuildGraphResult;