@burdenoff/microfe-organization 2026.616.1 → 2026.624.2

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

@@ -9,16 +9,17 @@ 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 { useRemoveWorkspaceMember as d, useWorkspaceMembers as f } from "../hooks/useWorkspaceMembers.js";
+import { AddWorkspaceMemberDialog as p } from "../components/AddWorkspaceMemberDialog.js";
+import { useMemo as m, useState as h } from "react";
+import { ArrowLeft as g, Briefcase as _, Edit as v, Trash2 as y, UserPlus as b, Users as x } from "lucide-react";
+import { ResponsiveTable as S } from "@burdenoff/fe-libs/ui";
+import { usePermissions as C } from "@burdenoff/fe-libs/shared/providers/shell";
+import { jsx as w, jsxs as T } from "react/jsx-runtime";
+import { useParams as ee } from "react-router-dom";
+import { ActorIdentity as E, buildActorFallback as D, useActorProfiles as O } from "@burdenoff/fe-libs/shared";
 //#region src/organization-management/modules/workspaces/pages/WorkspaceDetailPage.tsx
-function D(e) {
+function k(e) {
 	return new Date(e).toLocaleDateString("en-US", {
 		year: "numeric",
 		month: "long",
@@ -27,397 +28,326 @@ 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 A() {
+	let A = n(), { id: j } = ee(), { navigate: M, basePath: N = "/organizations", apiGatewayUrl: P, authToken: F } = e(), { hasPermission: I, isLoading: L } = C(), { workspace: R, loading: z, error: B } = l(j ?? ""), [V, H] = h("overview"), [U, W] = h(!1), { openConfirmDialog: G, ConfirmDialog: K } = o(), { members: q, loading: J, error: Y, refetch: X } = f(V === "members" && j ? j ?? "" : "", 50, 0), { removeWorkspaceMember: Z, loading: Q } = d(), $ = q.length > 0 || V === "members" ? q.length : R?.memberCount ?? 0, te = O(m(() => q.map((e) => ({
 		actorId: e.userId,
 		actorType: "user"
-	})), [G]), {
-		apiGatewayUrl: M,
-		authToken: N,
-		orgId: I?.organizationId,
-		workspaceId: k
-	}), re = f(() => [{
+	})), [q]), {
+		apiGatewayUrl: P,
+		authToken: F,
+		orgId: R?.organizationId,
+		workspaceId: j
+	}), ne = m(() => [{
 		id: "overview",
-		label: O("workspaces.detail.tab.overview", "Overview")
+		label: A("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: `${A("workspaces.detail.tab.members", "Members")} (${$})`
+	}], [$, A]), re = (e) => {
+		j && G({
+			title: A("workspaces.removeMember.title", "Remove workspace member"),
+			description: `${A("workspaces.removeMember.prefix", "Remove")} ${e} ${A("workspaces.removeMember.suffix", "from this workspace? They will keep their organization membership.")}`,
+			confirmText: A("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 Z(j, e);
+						if (n.errors?.length) throw Error(n.errors[0]?.message ?? A("workspaces.removeMember.failed", "Failed to remove workspace member"));
+						await X(), t.success(A("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 : A("workspaces.removeMember.failed", "Failed to remove workspace member"));
 					}
 				})();
 			}
 		});
-	};
-	return F ? /* @__PURE__ */ x("div", {
+	}, ie = [
+		{
+			key: "user",
+			header: A("members.detail.userId", "User ID"),
+			priority: "primary",
+			cell: (e) => /* @__PURE__ */ w(E, {
+				profile: te[e.userId] ?? D({
+					actorId: e.userId,
+					actorType: "user"
+				}),
+				variant: "cell"
+			})
+		},
+		{
+			key: "role",
+			header: A("members.list.column.role", "Role"),
+			priority: "secondary",
+			cell: (e) => /* @__PURE__ */ w(c, { role: e.role })
+		},
+		{
+			key: "joined",
+			header: A("members.list.joined", "Joined"),
+			priority: "secondary",
+			cell: (e) => /* @__PURE__ */ w("span", {
+				className: "text-sm text-[var(--color-text-secondary)]",
+				children: k(e.joinedAt)
+			})
+		},
+		{
+			key: "invitedBy",
+			header: A("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 L ? /* @__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: A("common.loadingPermissions", "Loading permissions...") })
+	}) : I(s.WORKSPACE_READ) ? z ? /* @__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: A("workspaces.detail.loading", "Loading workspace details...") })
+	}) : B || !R ? /* @__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: B?.message || A("workspaces.detail.notFound", "Workspace not found"),
 			action: {
-				label: O("workspaces.create.backToWorkspaces", "Back to Workspaces"),
-				onClick: () => A(`${j}/workspaces`)
+				label: A("workspaces.create.backToWorkspaces", "Back to Workspaces"),
+				onClick: () => M(`${N}/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`),
-						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)] active:scale-[0.98]",
-						children: [/* @__PURE__ */ x(m, {
+						onClick: () => M(`${N}/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__ */ w(g, {
 							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: A("workspaces.create.backToWorkspaces", "Back to Workspaces")
 						})]
-					}), /* @__PURE__ */ S("div", {
+					}), /* @__PURE__ */ T("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", {
+						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(_, {
 									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: R.name
+									}), /* @__PURE__ */ w(u, { status: R.status })]
+								}), /* @__PURE__ */ T("p", {
 									className: "break-all font-mono text-sm text-[var(--color-text-secondary)]",
-									children: ["/", I.slug]
+									children: ["/", R.slug]
 								})]
 							})]
-						}), /* @__PURE__ */ S("div", {
+						}), /* @__PURE__ */ T("div", {
 							className: "flex flex-col gap-3 sm:flex-row",
-							children: [/* @__PURE__ */ S("button", {
+							children: [/* @__PURE__ */ T("button", {
 								type: "button",
-								onClick: () => A(`${j}/${I.organizationId}`),
+								onClick: () => M(`${N}/${R.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, {
+								children: [/* @__PURE__ */ w(x, {
 									size: 16,
 									"aria-hidden": "true"
-								}), /* @__PURE__ */ x("span", { children: O("workspaces.detail.viewOrganization", "View Organization") })]
-							}), P(s.WORKSPACE_UPDATE) && /* @__PURE__ */ S("button", {
+								}), /* @__PURE__ */ w("span", { children: A("workspaces.detail.viewOrganization", "View Organization") })]
+							}), I(s.WORKSPACE_UPDATE) && /* @__PURE__ */ T("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 active:scale-[0.98]",
-								children: [/* @__PURE__ */ x(ne, {
+								onClick: () => M(`${N}/workspaces/${j}/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__ */ w(v, {
 									size: 16,
 									"aria-hidden": "true"
-								}), /* @__PURE__ */ x("span", { children: O("workspaces.edit.title", "Edit Workspace") })]
+								}), /* @__PURE__ */ w("span", { children: A("workspaces.edit.title", "Edit Workspace") })]
 							})]
 						})]
 					})]
-				}), /* @__PURE__ */ S("div", {
+				}), /* @__PURE__ */ T("div", {
 					className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] shadow-[var(--shadow-elevation-1)]",
-					children: [/* @__PURE__ */ x("div", {
+					children: [/* @__PURE__ */ w("div", {
 						className: "overflow-x-auto border-b border-[var(--color-border-default)]",
-						children: /* @__PURE__ */ x("div", {
+						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: ne.map((e) => {
+								let t = V === e.id;
+								return /* @__PURE__ */ w("button", {
 									type: "button",
-									onClick: () => B(e.id),
+									onClick: () => H(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: V === "overview" ? /* @__PURE__ */ T("div", {
 							className: "grid grid-cols-1 gap-6 xl:grid-cols-[minmax(0,1fr)_320px]",
-							children: [/* @__PURE__ */ S("section", {
+							children: [/* @__PURE__ */ T("section", {
 								className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-5",
-								children: [/* @__PURE__ */ x("h2", {
+								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: A("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: A("common.name", "Name")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 text-sm text-[var(--color-text-primary)]",
-											children: I.name
+											children: R.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: A("common.slug", "Slug")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 break-all font-mono text-sm text-[var(--color-text-primary)]",
-											children: I.slug
+											children: R.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: A("common.status", "Status")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1",
-											children: /* @__PURE__ */ x(u, { status: I.status })
+											children: /* @__PURE__ */ w(u, { status: R.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: A("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: R.organizationId
 											})]
 										}),
-										I.endpoint ? /* @__PURE__ */ S("div", {
+										R.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: A("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: R.endpoint
 											})]
 										}) : null
 									]
 								})]
-							}), /* @__PURE__ */ S("aside", {
+							}), /* @__PURE__ */ T("aside", {
 								className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-5",
-								children: [/* @__PURE__ */ x("h2", {
+								children: [/* @__PURE__ */ w("h2", {
 									className: "text-lg font-semibold text-[var(--color-text-primary)]",
-									children: O("common.metadata", "Metadata")
-								}), /* @__PURE__ */ S("dl", {
+									children: A("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: A("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: A("common.created", "Created")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 text-sm text-[var(--color-text-primary)]",
-											children: D(I.createdAt)
+											children: k(R.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: A("common.lastUpdated", "Last updated")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 text-sm text-[var(--color-text-primary)]",
-											children: D(I.updatedAt)
+											children: k(R.updatedAt)
 										})] }),
-										I.region ? /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("dt", {
+										R.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: A("workspaces.detail.region", "Region")
+										}), /* @__PURE__ */ w("dd", {
 											className: "mt-1 text-sm text-[var(--color-text-primary)]",
-											children: I.region
+											children: R.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: A("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: A("workspaces.detail.membersSubtitle", "Add organization members to this workspace and manage access.")
+								})] }), I(s.MEMBER_INVITE) && /* @__PURE__ */ T("button", {
 									type: "button",
-									onClick: () => H(!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 active:scale-[0.98]",
-									children: [/* @__PURE__ */ x(_, {
+									onClick: () => W(!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__ */ w(b, {
 										size: 16,
 										"aria-hidden": "true"
-									}), /* @__PURE__ */ x("span", { children: O("workspaces.detail.addMember", "Add Member") })]
+									}), /* @__PURE__ */ w("span", { children: A("workspaces.detail.addMember", "Add Member") })]
 								})]
-							}), K ? /* @__PURE__ */ x("div", {
+							}), J ? /* @__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: A("workspaces.detail.loadingMembers", "Loading workspace members...") })
+							}) : Y ? /* @__PURE__ */ w(i, {
+								message: Y.message,
 								action: {
-									label: O("common.retry", "Retry"),
+									label: A("common.retry", "Retry"),
 									onClick: () => {
-										J();
+										X();
 									}
 								}
-							}) : 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))
-										})]
+							}) : q.length > 0 ? /* @__PURE__ */ w("div", {
+								className: "overflow-hidden rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] md:p-2",
+								children: /* @__PURE__ */ w(S, {
+									columns: ie,
+									data: q,
+									rowKey: (e) => e.id,
+									rowActions: (e) => /* @__PURE__ */ w("button", {
+										type: "button",
+										onClick: () => re(e.userId),
+										disabled: Q,
+										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": `${A("workspaces.removeMember.ariaPrefix", "Remove")} ${e.userId} ${A("workspaces.removeMember.ariaSuffix", "from workspace")}`,
+										title: `${A("workspaces.removeMember.ariaPrefix", "Remove")} ${e.userId} ${A("workspaces.removeMember.ariaSuffix", "from workspace")}`,
+										children: /* @__PURE__ */ w(y, {
+											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(a, {
+									icon: /* @__PURE__ */ w(x, {
 										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: A("workspaces.detail.emptyMembersTitle", "No workspace members yet"),
+									description: A("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: A("workspaces.detail.addMember", "Add Member"),
+										onClick: () => W(!0)
 									}
 								})
 							})]
@@ -425,25 +355,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(p, {
+				open: U,
+				onOpenChange: W,
+				workspaceId: R.id,
+				organizationId: R.organizationId,
+				existingMembers: q,
+				onInviteOrganizationMember: () => M(`${N}/${R.organizationId}/members/invite`)
 			}),
-			W
+			K
 		]
-	}) : /* @__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: A("workspaces.detail.noPermission", "You don't have permission to view this workspace.")
 		})
 	});
 }
 //#endregion
-export { O as WorkspaceDetailPage };
+export { A as WorkspaceDetailPage };
 
 //# sourceMappingURL=WorkspaceDetailPage.js.map