@burdenoff/microfe-organization 2026.624.1 → 2026.625.1

package/dist/organization-management/modules/workspaces/pages/WorkspaceDetailPage.js

@@ -3,22 +3,23 @@ import { toast as t } from "../../../../node_modules/sonner/dist/index.js";
 import { useTr as n } from "../../../shared/hooks/useTr.js";
 import { LoadingState as r } from "../../../shared/components/feedback/LoadingState.js";
 import { ErrorState as i } from "../../../shared/components/feedback/ErrorState.js";
-import { EmptyState as a } from "../../../shared/components/feedback/EmptyState.js";
-import { useConfirmDialog as o } from "../../../shared/components/dialog/ConfirmDialog.js";
-import { PERMISSIONS as s } from "../../../constants/permissions.js";
-import { MemberRoleBadge as c } from "../../members/components/MemberRoleBadge.js";
-import { useWorkspace as l } from "../hooks/useWorkspaces.js";
-import { WorkspaceStatusBadge as u } from "../components/WorkspaceStatusBadge.js";
-import { useRemoveWorkspaceMember as ee, useWorkspaceMembers as te } from "../hooks/useWorkspaceMembers.js";
-import { AddWorkspaceMemberDialog as d } from "../components/AddWorkspaceMemberDialog.js";
-import { useMemo as f, useState as p } from "react";
-import { ArrowLeft as m, Briefcase as h, Edit as ne, Trash2 as g, UserPlus as _, Users as v } from "lucide-react";
-import { usePermissions as y } from "@burdenoff/fe-libs/shared/providers/shell";
-import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
-import { useParams as C } from "react-router-dom";
-import { ActorIdentity as w, buildActorFallback as T, useActorProfiles as E } from "@burdenoff/fe-libs/shared";
+import { EmptyState as ee } from "../../../shared/components/feedback/EmptyState.js";
+import { useConfirmDialog as a } from "../../../shared/components/dialog/ConfirmDialog.js";
+import { PERMISSIONS as o } from "../../../constants/permissions.js";
+import { MemberRoleBadge as s } from "../../members/components/MemberRoleBadge.js";
+import { useWorkspace as c } from "../hooks/useWorkspaces.js";
+import { WorkspaceStatusBadge as l } from "../components/WorkspaceStatusBadge.js";
+import { useRemoveWorkspaceMember as u, useWorkspaceMembers as d } from "../hooks/useWorkspaceMembers.js";
+import { AddWorkspaceMemberDialog as f } from "../components/AddWorkspaceMemberDialog.js";
+import { useMemo as p, useState as m } from "react";
+import { ArrowLeft as h, Briefcase as g, Edit as _, Trash2 as v, UserPlus as te, Users as y } from "lucide-react";
+import { CTAOverflowMenu as b, EmphasisPanel as x, GlassCard as S, ResponsiveTable as C } from "@burdenoff/fe-libs/ui";
+import { usePermissions as ne } from "@burdenoff/fe-libs/shared/providers/shell";
+import { jsx as w, jsxs as T } from "react/jsx-runtime";
+import { useParams as E } from "react-router-dom";
+import { ActorIdentity as D, buildActorFallback as O, useActorProfiles as k } from "@burdenoff/fe-libs/shared";
 //#region src/organization-management/modules/workspaces/pages/WorkspaceDetailPage.tsx
-function D(e) {
+function A(e) {
 	return new Date(e).toLocaleDateString("en-US", {
 		year: "numeric",
 		month: "long",
@@ -27,397 +28,327 @@ function D(e) {
 		minute: "2-digit"
 	});
 }
-function O() {
-	let O = n(), { id: k } = C(), { navigate: A, basePath: j = "/organizations", apiGatewayUrl: M, authToken: N } = e(), { hasPermission: P, isLoading: F } = y(), { workspace: I, loading: L, error: R } = l(k ?? ""), [z, B] = p("overview"), [V, H] = p(!1), { openConfirmDialog: U, ConfirmDialog: W } = o(), { members: G, loading: K, error: q, refetch: J } = te(z === "members" && k ? k ?? "" : "", 50, 0), { removeWorkspaceMember: Y, loading: X } = ee(), Z = G.length > 0 || z === "members" ? G.length : I?.memberCount ?? 0, Q = E(f(() => G.map((e) => ({
+function j() {
+	let j = n(), { id: M } = E(), { navigate: N, basePath: P = "/organizations", apiGatewayUrl: F, authToken: I } = e(), { hasPermission: L, isLoading: R } = ne(), { workspace: z, loading: B, error: V } = c(M ?? ""), [H, U] = m("overview"), [W, G] = m(!1), { openConfirmDialog: K, ConfirmDialog: q } = a(), { members: J, loading: Y, error: X, refetch: Z } = d(H === "members" && M ? M ?? "" : "", 50, 0), { removeWorkspaceMember: Q, loading: re } = u(), $ = J.length > 0 || H === "members" ? J.length : z?.memberCount ?? 0, ie = k(p(() => J.map((e) => ({
 		actorId: e.userId,
 		actorType: "user"
-	})), [G]), {
-		apiGatewayUrl: M,
-		authToken: N,
-		orgId: I?.organizationId,
-		workspaceId: k
-	}), re = f(() => [{
+	})), [J]), {
+		apiGatewayUrl: F,
+		authToken: I,
+		orgId: z?.organizationId,
+		workspaceId: M
+	}), ae = p(() => [{
 		id: "overview",
-		label: O("workspaces.detail.tab.overview", "Overview")
+		label: j("workspaces.detail.tab.overview", "Overview")
 	}, {
 		id: "members",
-		label: `${O("workspaces.detail.tab.members", "Members")} (${Z})`
-	}], [Z, O]), $ = (e) => {
-		k && U({
-			title: O("workspaces.removeMember.title", "Remove workspace member"),
-			description: `${O("workspaces.removeMember.prefix", "Remove")} ${e} ${O("workspaces.removeMember.suffix", "from this workspace? They will keep their organization membership.")}`,
-			confirmText: O("common.remove", "Remove"),
+		label: `${j("workspaces.detail.tab.members", "Members")} (${$})`
+	}], [$, j]), oe = (e) => {
+		M && K({
+			title: j("workspaces.removeMember.title", "Remove workspace member"),
+			description: `${j("workspaces.removeMember.prefix", "Remove")} ${e} ${j("workspaces.removeMember.suffix", "from this workspace? They will keep their organization membership.")}`,
+			confirmText: j("common.remove", "Remove"),
 			variant: "danger",
 			onConfirm: () => {
 				(async () => {
 					try {
-						let n = await Y(k, e);
-						if (n.errors?.length) throw Error(n.errors[0]?.message ?? O("workspaces.removeMember.failed", "Failed to remove workspace member"));
-						await J(), t.success(O("workspaces.removeMember.success", "Workspace member removed successfully"));
+						let n = await Q(M, e);
+						if (n.errors?.length) throw Error(n.errors[0]?.message ?? j("workspaces.removeMember.failed", "Failed to remove workspace member"));
+						await Z(), t.success(j("workspaces.removeMember.success", "Workspace member removed successfully"));
 					} catch (e) {
-						t.error(e instanceof Error ? e.message : O("workspaces.removeMember.failed", "Failed to remove workspace member"));
+						t.error(e instanceof Error ? e.message : j("workspaces.removeMember.failed", "Failed to remove workspace member"));
 					}
 				})();
 			}
 		});
-	};
-	return F ? /* @__PURE__ */ x("div", {
+	}, se = [
+		{
+			key: "user",
+			header: j("members.detail.userId", "User ID"),
+			priority: "primary",
+			cell: (e) => /* @__PURE__ */ w(D, {
+				profile: ie[e.userId] ?? O({
+					actorId: e.userId,
+					actorType: "user"
+				}),
+				variant: "cell"
+			})
+		},
+		{
+			key: "role",
+			header: j("members.list.column.role", "Role"),
+			priority: "secondary",
+			cell: (e) => /* @__PURE__ */ w(s, { role: e.role })
+		},
+		{
+			key: "joined",
+			header: j("members.list.joined", "Joined"),
+			priority: "secondary",
+			cell: (e) => /* @__PURE__ */ w("span", {
+				className: "text-sm text-[var(--color-text-secondary)]",
+				children: A(e.joinedAt)
+			})
+		},
+		{
+			key: "invitedBy",
+			header: j("members.list.invitedBy", "Invited by"),
+			priority: "secondary",
+			cell: (e) => /* @__PURE__ */ w("span", {
+				className: "break-all font-mono text-sm text-[var(--color-text-secondary)]",
+				children: e.invitedBy || "—"
+			})
+		}
+	];
+	return R ? /* @__PURE__ */ w("div", {
 		className: "min-h-full bg-[var(--color-bg-canvas)] p-6",
-		children: /* @__PURE__ */ x(r, { message: O("common.loadingPermissions", "Loading permissions...") })
-	}) : P(s.WORKSPACE_READ) ? L ? /* @__PURE__ */ x("div", {
+		children: /* @__PURE__ */ w(r, { message: j("common.loadingPermissions", "Loading permissions...") })
+	}) : L(o.WORKSPACE_READ) ? B ? /* @__PURE__ */ w("div", {
 		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6",
-		children: /* @__PURE__ */ x(r, { message: O("workspaces.detail.loading", "Loading workspace details...") })
-	}) : R || !I ? /* @__PURE__ */ x("div", {
+		children: /* @__PURE__ */ w(r, { message: j("workspaces.detail.loading", "Loading workspace details...") })
+	}) : V || !z ? /* @__PURE__ */ w("div", {
 		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6",
-		children: /* @__PURE__ */ x(i, {
-			message: R?.message || O("workspaces.detail.notFound", "Workspace not found"),
+		children: /* @__PURE__ */ w(i, {
+			message: V?.message || j("workspaces.detail.notFound", "Workspace not found"),
 			action: {
-				label: O("workspaces.create.backToWorkspaces", "Back to Workspaces"),
-				onClick: () => A(`${j}/workspaces`)
+				label: j("workspaces.create.backToWorkspaces", "Back to Workspaces"),
+				onClick: () => N(`${P}/workspaces`)
 			}
 		})
-	}) : /* @__PURE__ */ S("div", {
-		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6 animate-in fade-in duration-300",
+	}) : /* @__PURE__ */ T("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6 animate-in fade-in duration-200",
 		children: [
-			/* @__PURE__ */ S("div", {
+			/* @__PURE__ */ T("div", {
 				className: "mx-auto flex w-full max-w-7xl flex-col gap-6",
-				children: [/* @__PURE__ */ S("div", {
+				children: [/* @__PURE__ */ T("div", {
 					className: "space-y-4",
-					children: [/* @__PURE__ */ S("button", {
+					children: [/* @__PURE__ */ T("button", {
 						type: "button",
-						onClick: () => A(`${j}/workspaces`),
+						onClick: () => N(`${P}/workspaces`),
 						className: "inline-flex min-h-10 items-center gap-2 text-[var(--color-text-secondary)] transition-all duration-200 hover:text-[var(--color-text-primary)]",
-						children: [/* @__PURE__ */ x(m, {
+						children: [/* @__PURE__ */ w(h, {
 							size: 20,
 							"aria-hidden": "true"
-						}), /* @__PURE__ */ x("span", {
+						}), /* @__PURE__ */ w("span", {
 							className: "text-sm font-medium",
-							children: O("workspaces.create.backToWorkspaces", "Back to Workspaces")
+							children: j("workspaces.create.backToWorkspaces", "Back to Workspaces")
 						})]
-					}), /* @__PURE__ */ S("div", {
-						className: "flex flex-col gap-4 rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] p-5 shadow-[var(--shadow-elevation-1)] lg:flex-row lg:items-start lg:justify-between",
-						children: [/* @__PURE__ */ S("div", {
+					}), /* @__PURE__ */ T(x, {
+						className: "flex flex-col gap-4 p-5 lg:flex-row lg:items-start lg:justify-between",
+						children: [/* @__PURE__ */ T("div", {
 							className: "flex min-w-0 items-start gap-4",
-							children: [/* @__PURE__ */ x("div", {
+							children: [/* @__PURE__ */ w("div", {
 								className: "flex size-16 items-center justify-center rounded-xl bg-[var(--color-status-info-bgSubtle)] text-[var(--color-status-info-text)]",
-								children: /* @__PURE__ */ x(h, {
+								children: /* @__PURE__ */ w(g, {
 									size: 28,
 									"aria-hidden": "true"
 								})
-							}), /* @__PURE__ */ S("div", {
+							}), /* @__PURE__ */ T("div", {
 								className: "min-w-0 space-y-2",
-								children: [/* @__PURE__ */ S("div", {
+								children: [/* @__PURE__ */ T("div", {
 									className: "flex flex-wrap items-start gap-2",
-									children: [/* @__PURE__ */ x("h1", {
+									children: [/* @__PURE__ */ w("h1", {
 										className: "text-3xl font-bold text-[var(--color-text-primary)]",
-										children: I.name
-									}), /* @__PURE__ */ x(u, { status: I.status })]
-								}), /* @__PURE__ */ S("p", {
+										children: z.name
+									}), /* @__PURE__ */ w(l, { status: z.status })]
+								}), /* @__PURE__ */ T("p", {
 									className: "break-all font-mono text-sm text-[var(--color-text-secondary)]",
-									children: ["/", I.slug]
+									children: ["/", z.slug]
 								})]
 							})]
-						}), /* @__PURE__ */ S("div", {
-							className: "flex flex-col gap-3 sm:flex-row",
-							children: [/* @__PURE__ */ S("button", {
-								type: "button",
-								onClick: () => A(`${j}/${I.organizationId}`),
-								className: "inline-flex min-h-11 items-center justify-center gap-2 rounded-lg border border-[var(--color-border-default)] px-4 py-2.5 text-[var(--color-text-primary)] transition-all duration-200 hover:bg-[var(--color-bg-subtle)]",
-								children: [/* @__PURE__ */ x(v, {
+						}), /* @__PURE__ */ w(b, {
+							primary: L(o.WORKSPACE_UPDATE) ? {
+								label: j("workspaces.edit.title", "Edit Workspace"),
+								icon: /* @__PURE__ */ w(_, {
 									size: 16,
 									"aria-hidden": "true"
-								}), /* @__PURE__ */ x("span", { children: O("workspaces.detail.viewOrganization", "View Organization") })]
-							}), P(s.WORKSPACE_UPDATE) && /* @__PURE__ */ S("button", {
-								type: "button",
-								onClick: () => A(`${j}/workspaces/${k}/edit`),
-								className: "inline-flex min-h-11 items-center justify-center gap-2 rounded-lg bg-[var(--color-action-primary-bg)] px-4 py-2.5 text-[var(--color-action-primary-text)] transition-all duration-200 hover:opacity-90",
-								children: [/* @__PURE__ */ x(ne, {
+								}),
+								onSelect: () => N(`${P}/workspaces/${M}/edit`)
+							} : void 0,
+							actions: [{
+								label: j("workspaces.detail.viewOrganization", "View Organization"),
+								icon: /* @__PURE__ */ w(y, {
 									size: 16,
 									"aria-hidden": "true"
-								}), /* @__PURE__ */ x("span", { children: O("workspaces.edit.title", "Edit Workspace") })]
-							})]
+								}),
+								onSelect: () => N(`${P}/${z.organizationId}`)
+							}]
 						})]
 					})]
-				}), /* @__PURE__ */ S("div", {
-					className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] shadow-[var(--shadow-elevation-1)]",
-					children: [/* @__PURE__ */ x("div", {
-						className: "overflow-x-auto border-b border-[var(--color-border-default)]",
-						children: /* @__PURE__ */ x("div", {
+				}), /* @__PURE__ */ T(S, {
+					treatment: "plain",
+					className: "border-border-seam p-0",
+					children: [/* @__PURE__ */ w("div", {
+						className: "overflow-x-auto border-b border-[var(--color-border-seam)]",
+						children: /* @__PURE__ */ w("div", {
 							className: "flex min-w-max gap-2 px-4 pt-4 sm:px-6",
-							children: re.map((e) => {
-								let t = z === e.id;
-								return /* @__PURE__ */ x("button", {
+							children: ae.map((e) => {
+								let t = H === e.id;
+								return /* @__PURE__ */ w("button", {
 									type: "button",
-									onClick: () => B(e.id),
+									onClick: () => U(e.id),
 									className: `inline-flex min-h-11 items-center rounded-t-lg border-b-2 px-4 py-3 text-sm font-medium transition-colors ${t ? "border-[var(--color-action-primary-bg)] text-[var(--color-action-primary-bg)]" : "border-transparent text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)]"}`,
 									"aria-pressed": t,
 									children: e.label
 								}, e.id);
 							})
 						})
-					}), /* @__PURE__ */ x("div", {
+					}), /* @__PURE__ */ w("div", {
 						className: "p-4 sm:p-6",
-						children: z === "overview" ? /* @__PURE__ */ S("div", {
+						children: H === "overview" ? /* @__PURE__ */ T("div", {
 							className: "grid grid-cols-1 gap-6 xl:grid-cols-[minmax(0,1fr)_320px]",
-							children: [/* @__PURE__ */ S("section", {
-								className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-5",
-								children: [/* @__PURE__ */ x("h2", {
+							children: [/* @__PURE__ */ T(S, {
+								treatment: "plain",
+								className: "border-border-seam bg-[var(--color-bg-canvas)] p-5",
+								children: [/* @__PURE__ */ w("h2", {
 									className: "text-lg font-semibold text-[var(--color-text-primary)]",
-									children: O("workspaces.detail.detailsSection", "Workspace details")
-								}), /* @__PURE__ */ S("dl", {
+									children: j("workspaces.detail.detailsSection", "Workspace details")
+								}), /* @__PURE__ */ T("dl", {
 									className: "mt-5 grid grid-cols-1 gap-4 sm:grid-cols-2",
 									children: [
-										/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("dt", {
+										/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("dt", {
 											className: "text-sm font-medium text-[var(--color-text-secondary)]",
-											children: O("common.name", "Name")
-										}), /* @__PURE__ */ x("dd", {
+											children: j("common.name", "Name")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 text-sm text-[var(--color-text-primary)]",
-											children: I.name
+											children: z.name
 										})] }),
-										/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("dt", {
+										/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("dt", {
 											className: "text-sm font-medium text-[var(--color-text-secondary)]",
-											children: O("common.slug", "Slug")
-										}), /* @__PURE__ */ x("dd", {
+											children: j("common.slug", "Slug")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 break-all font-mono text-sm text-[var(--color-text-primary)]",
-											children: I.slug
+											children: z.slug
 										})] }),
-										/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("dt", {
+										/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("dt", {
 											className: "text-sm font-medium text-[var(--color-text-secondary)]",
-											children: O("common.status", "Status")
-										}), /* @__PURE__ */ x("dd", {
+											children: j("common.status", "Status")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1",
-											children: /* @__PURE__ */ x(u, { status: I.status })
+											children: /* @__PURE__ */ w(l, { status: z.status })
 										})] }),
-										/* @__PURE__ */ S("div", {
+										/* @__PURE__ */ T("div", {
 											className: "sm:col-span-2",
-											children: [/* @__PURE__ */ x("dt", {
+											children: [/* @__PURE__ */ w("dt", {
 												className: "text-sm font-medium text-[var(--color-text-secondary)]",
-												children: O("members.detail.orgId", "Organization ID")
-											}), /* @__PURE__ */ x("dd", {
+												children: j("members.detail.orgId", "Organization ID")
+											}), /* @__PURE__ */ w("dd", {
 												className: "mt-1 break-all font-mono text-sm text-[var(--color-text-primary)]",
-												children: I.organizationId
+												children: z.organizationId
 											})]
 										}),
-										I.endpoint ? /* @__PURE__ */ S("div", {
+										z.endpoint ? /* @__PURE__ */ T("div", {
 											className: "sm:col-span-2",
-											children: [/* @__PURE__ */ x("dt", {
+											children: [/* @__PURE__ */ w("dt", {
 												className: "text-sm font-medium text-[var(--color-text-secondary)]",
-												children: O("workspaces.detail.endpoint", "Endpoint")
-											}), /* @__PURE__ */ x("dd", {
+												children: j("workspaces.detail.endpoint", "Endpoint")
+											}), /* @__PURE__ */ w("dd", {
 												className: "mt-1 break-all font-mono text-sm text-[var(--color-text-primary)]",
-												children: I.endpoint
+												children: z.endpoint
 											})]
 										}) : null
 									]
 								})]
-							}), /* @__PURE__ */ S("aside", {
-								className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-5",
-								children: [/* @__PURE__ */ x("h2", {
+							}), /* @__PURE__ */ T(S, {
+								treatment: "plain",
+								className: "border-border-seam bg-[var(--color-bg-canvas)] p-5 xl:sticky xl:top-6 xl:self-start",
+								children: [/* @__PURE__ */ w("h2", {
 									className: "text-lg font-semibold text-[var(--color-text-primary)]",
-									children: O("common.metadata", "Metadata")
-								}), /* @__PURE__ */ S("dl", {
+									children: j("common.metadata", "Metadata")
+								}), /* @__PURE__ */ T("dl", {
 									className: "mt-5 space-y-4",
 									children: [
-										/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("dt", {
+										/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("dt", {
 											className: "text-sm font-medium text-[var(--color-text-secondary)]",
-											children: O("workspaces.list.members", "Members")
-										}), /* @__PURE__ */ x("dd", {
+											children: j("workspaces.list.members", "Members")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 text-sm text-[var(--color-text-primary)]",
-											children: Z
+											children: $
 										})] }),
-										/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("dt", {
+										/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("dt", {
 											className: "text-sm font-medium text-[var(--color-text-secondary)]",
-											children: O("common.created", "Created")
-										}), /* @__PURE__ */ x("dd", {
+											children: j("common.created", "Created")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 text-sm text-[var(--color-text-primary)]",
-											children: D(I.createdAt)
+											children: A(z.createdAt)
 										})] }),
-										/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("dt", {
+										/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("dt", {
 											className: "text-sm font-medium text-[var(--color-text-secondary)]",
-											children: O("common.lastUpdated", "Last updated")
-										}), /* @__PURE__ */ x("dd", {
+											children: j("common.lastUpdated", "Last updated")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 text-sm text-[var(--color-text-primary)]",
-											children: D(I.updatedAt)
+											children: A(z.updatedAt)
 										})] }),
-										I.region ? /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("dt", {
+										z.region ? /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("dt", {
 											className: "text-sm font-medium text-[var(--color-text-secondary)]",
-											children: O("workspaces.detail.region", "Region")
-										}), /* @__PURE__ */ x("dd", {
+											children: j("workspaces.detail.region", "Region")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 text-sm text-[var(--color-text-primary)]",
-											children: I.region
+											children: z.region
 										})] }) : null
 									]
 								})]
 							})]
-						}) : /* @__PURE__ */ S("section", {
+						}) : /* @__PURE__ */ T("section", {
 							className: "space-y-4",
-							children: [/* @__PURE__ */ S("div", {
+							children: [/* @__PURE__ */ T("div", {
 								className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between",
-								children: [/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("h2", {
+								children: [/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("h2", {
 									className: "text-lg font-semibold text-[var(--color-text-primary)]",
-									children: O("workspaces.detail.membersTitle", "Workspace members")
-								}), /* @__PURE__ */ x("p", {
+									children: j("workspaces.detail.membersTitle", "Workspace members")
+								}), /* @__PURE__ */ w("p", {
 									className: "text-sm text-[var(--color-text-secondary)]",
-									children: O("workspaces.detail.membersSubtitle", "Add organization members to this workspace and manage access.")
-								})] }), P(s.MEMBER_INVITE) && /* @__PURE__ */ S("button", {
+									children: j("workspaces.detail.membersSubtitle", "Add organization members to this workspace and manage access.")
+								})] }), L(o.MEMBER_INVITE) && /* @__PURE__ */ T("button", {
 									type: "button",
-									onClick: () => H(!0),
+									onClick: () => G(!0),
 									className: "inline-flex min-h-11 items-center justify-center gap-2 rounded-lg bg-[var(--color-action-primary-bg)] px-4 py-2.5 text-[var(--color-action-primary-text)] transition-all duration-200 hover:opacity-90",
-									children: [/* @__PURE__ */ x(_, {
+									children: [/* @__PURE__ */ w(te, {
 										size: 16,
 										"aria-hidden": "true"
-									}), /* @__PURE__ */ x("span", { children: O("workspaces.detail.addMember", "Add Member") })]
+									}), /* @__PURE__ */ w("span", { children: j("workspaces.detail.addMember", "Add Member") })]
 								})]
-							}), K ? /* @__PURE__ */ x("div", {
+							}), Y ? /* @__PURE__ */ w("div", {
 								className: "py-8",
-								children: /* @__PURE__ */ x(r, { message: O("workspaces.detail.loadingMembers", "Loading workspace members...") })
-							}) : q ? /* @__PURE__ */ x(i, {
-								message: q.message,
+								children: /* @__PURE__ */ w(r, { message: j("workspaces.detail.loadingMembers", "Loading workspace members...") })
+							}) : X ? /* @__PURE__ */ w(i, {
+								message: X.message,
 								action: {
-									label: O("common.retry", "Retry"),
+									label: j("common.retry", "Retry"),
 									onClick: () => {
-										J();
+										Z();
 									}
 								}
-							}) : G.length > 0 ? /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x("div", {
-								className: "grid gap-4 md:hidden",
-								children: G.map((e) => /* @__PURE__ */ x("article", {
-									className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-4",
-									children: /* @__PURE__ */ S("div", {
-										className: "space-y-3",
-										children: [
-											/* @__PURE__ */ S("div", {
-												className: "flex items-start justify-between gap-3",
-												children: [/* @__PURE__ */ S("div", {
-													className: "min-w-0",
-													children: [/* @__PURE__ */ x(w, {
-														profile: Q[e.userId] ?? T({
-															actorId: e.userId,
-															actorType: "user"
-														}),
-														variant: "inline"
-													}), /* @__PURE__ */ S("p", {
-														className: "mt-1 text-sm text-[var(--color-text-secondary)]",
-														children: [
-															O("members.list.joined", "Joined"),
-															" ",
-															D(e.joinedAt)
-														]
-													})]
-												}), /* @__PURE__ */ x(c, { role: e.role })]
-											}),
-											/* @__PURE__ */ x("dl", {
-												className: "grid grid-cols-1 gap-3 text-sm",
-												children: /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("dt", {
-													className: "text-[var(--color-text-secondary)]",
-													children: O("members.list.invitedBy", "Invited by")
-												}), /* @__PURE__ */ x("dd", {
-													className: "mt-1 break-all font-mono text-[var(--color-text-primary)]",
-													children: e.invitedBy || "—"
-												})] })
-											}),
-											/* @__PURE__ */ S("button", {
-												type: "button",
-												onClick: () => $(e.userId),
-												disabled: X,
-												className: "inline-flex min-h-10 items-center gap-2 rounded-lg border border-[var(--color-status-error-border)] px-3 py-2 text-sm text-[var(--color-status-error-text)] transition-all duration-200 hover:bg-[var(--color-status-error-bgSubtle)] disabled:cursor-not-allowed disabled:opacity-50",
-												children: [/* @__PURE__ */ x(g, {
-													size: 16,
-													"aria-hidden": "true"
-												}), O("common.remove", "Remove")]
-											})
-										]
-									})
-								}, e.id))
-							}), /* @__PURE__ */ x("div", {
-								className: "hidden overflow-hidden rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] md:block",
-								children: /* @__PURE__ */ x("div", {
-									className: "overflow-x-auto",
-									children: /* @__PURE__ */ S("table", {
-										className: "min-w-full",
-										children: [/* @__PURE__ */ x("thead", {
-											className: "bg-[var(--color-bg-subtle)]",
-											children: /* @__PURE__ */ S("tr", { children: [
-												/* @__PURE__ */ x("th", {
-													className: "px-6 py-3 text-left text-xs font-semibold uppercase tracking-wide text-[var(--color-text-secondary)]",
-													children: O("members.detail.userId", "User ID")
-												}),
-												/* @__PURE__ */ x("th", {
-													className: "px-6 py-3 text-left text-xs font-semibold uppercase tracking-wide text-[var(--color-text-secondary)]",
-													children: O("members.list.column.role", "Role")
-												}),
-												/* @__PURE__ */ x("th", {
-													className: "px-6 py-3 text-left text-xs font-semibold uppercase tracking-wide text-[var(--color-text-secondary)]",
-													children: O("members.list.joined", "Joined")
-												}),
-												/* @__PURE__ */ x("th", {
-													className: "px-6 py-3 text-left text-xs font-semibold uppercase tracking-wide text-[var(--color-text-secondary)]",
-													children: O("members.list.invitedBy", "Invited by")
-												}),
-												/* @__PURE__ */ x("th", {
-													className: "px-6 py-3 text-right text-xs font-semibold uppercase tracking-wide text-[var(--color-text-secondary)]",
-													children: O("common.actions", "Actions")
-												})
-											] })
-										}), /* @__PURE__ */ x("tbody", {
-											className: "divide-y divide-[var(--color-border-default)]",
-											children: G.map((e) => /* @__PURE__ */ S("tr", {
-												className: "transition-colors hover:bg-[var(--color-bg-subtle)]",
-												children: [
-													/* @__PURE__ */ x("td", {
-														className: "px-6 py-4",
-														children: /* @__PURE__ */ x(w, {
-															profile: Q[e.userId] ?? T({
-																actorId: e.userId,
-																actorType: "user"
-															}),
-															variant: "cell"
-														})
-													}),
-													/* @__PURE__ */ x("td", {
-														className: "px-6 py-4",
-														children: /* @__PURE__ */ x(c, { role: e.role })
-													}),
-													/* @__PURE__ */ x("td", {
-														className: "px-6 py-4 text-sm text-[var(--color-text-secondary)]",
-														children: D(e.joinedAt)
-													}),
-													/* @__PURE__ */ x("td", {
-														className: "px-6 py-4 break-all font-mono text-sm text-[var(--color-text-secondary)]",
-														children: e.invitedBy || "—"
-													}),
-													/* @__PURE__ */ x("td", {
-														className: "px-6 py-4 text-right",
-														children: /* @__PURE__ */ x("button", {
-															type: "button",
-															onClick: () => $(e.userId),
-															disabled: X,
-															className: "rounded-lg p-2 text-[var(--color-status-error-text)] transition-all duration-200 hover:bg-[var(--color-status-error-bgSubtle)] disabled:cursor-not-allowed disabled:opacity-50",
-															"aria-label": `${O("workspaces.removeMember.ariaPrefix", "Remove")} ${e.userId} ${O("workspaces.removeMember.ariaSuffix", "from workspace")}`,
-															title: `${O("workspaces.removeMember.ariaPrefix", "Remove")} ${e.userId} ${O("workspaces.removeMember.ariaSuffix", "from workspace")}`,
-															children: /* @__PURE__ */ x(g, {
-																size: 18,
-																"aria-hidden": "true"
-															})
-														})
-													})
-												]
-											}, e.id))
-										})]
+							}) : J.length > 0 ? /* @__PURE__ */ w("div", {
+								className: "overflow-hidden rounded-xl border border-[var(--color-border-seam)] bg-[var(--color-bg-canvas)] md:p-2",
+								children: /* @__PURE__ */ w(C, {
+									columns: se,
+									data: J,
+									rowKey: (e) => e.id,
+									rowActions: (e) => /* @__PURE__ */ w("button", {
+										type: "button",
+										onClick: () => oe(e.userId),
+										disabled: re,
+										className: "rounded-lg p-2 text-[var(--color-status-error-text)] transition-all duration-200 hover:bg-[var(--color-status-error-bgSubtle)] disabled:cursor-not-allowed disabled:opacity-50",
+										"aria-label": `${j("workspaces.removeMember.ariaPrefix", "Remove")} ${e.userId} ${j("workspaces.removeMember.ariaSuffix", "from workspace")}`,
+										title: `${j("workspaces.removeMember.ariaPrefix", "Remove")} ${e.userId} ${j("workspaces.removeMember.ariaSuffix", "from workspace")}`,
+										children: /* @__PURE__ */ w(v, {
+											size: 18,
+											"aria-hidden": "true"
+										})
 									})
 								})
-							})] }) : /* @__PURE__ */ x("div", {
+							}) : /* @__PURE__ */ w("div", {
 								className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-6",
-								children: /* @__PURE__ */ x(a, {
-									icon: /* @__PURE__ */ x(v, {
+								children: /* @__PURE__ */ w(ee, {
+									icon: /* @__PURE__ */ w(y, {
 										size: 40,
 										"aria-hidden": "true"
 									}),
-									title: O("workspaces.detail.emptyMembersTitle", "No workspace members yet"),
-									description: O("workspaces.detail.emptyMembersDescription", "Add people from the parent organization to grant workspace access."),
+									title: j("workspaces.detail.emptyMembersTitle", "No workspace members yet"),
+									description: j("workspaces.detail.emptyMembersDescription", "Add people from the parent organization to grant workspace access."),
 									action: {
-										label: O("workspaces.detail.addMember", "Add Member"),
-										onClick: () => H(!0)
+										label: j("workspaces.detail.addMember", "Add Member"),
+										onClick: () => G(!0)
 									}
 								})
 							})]
@@ -425,25 +356,25 @@ function O() {
 					})]
 				})]
 			}),
-			/* @__PURE__ */ x(d, {
-				open: V,
-				onOpenChange: H,
-				workspaceId: I.id,
-				organizationId: I.organizationId,
-				existingMembers: G,
-				onInviteOrganizationMember: () => A(`${j}/${I.organizationId}/members/invite`)
+			/* @__PURE__ */ w(f, {
+				open: W,
+				onOpenChange: G,
+				workspaceId: z.id,
+				organizationId: z.organizationId,
+				existingMembers: J,
+				onInviteOrganizationMember: () => N(`${P}/${z.organizationId}/members/invite`)
 			}),
-			W
+			q
 		]
-	}) : /* @__PURE__ */ x("div", {
+	}) : /* @__PURE__ */ w("div", {
 		className: "min-h-full bg-[var(--color-bg-canvas)] p-6",
-		children: /* @__PURE__ */ x("div", {
+		children: /* @__PURE__ */ w("div", {
 			className: "p-8 text-center text-[var(--color-text-secondary)]",
-			children: O("workspaces.detail.noPermission", "You don't have permission to view this workspace.")
+			children: j("workspaces.detail.noPermission", "You don't have permission to view this workspace.")
 		})
 	});
 }
 //#endregion
-export { O as WorkspaceDetailPage };
+export { j as WorkspaceDetailPage };
 
 //# sourceMappingURL=WorkspaceDetailPage.js.map