@burdenoff/microfe-organization 2026.510.110

package/dist/organization-management/modules/organizations/pages/OrganizationDetailPage.js

@@ -0,0 +1,306 @@
+import { useOrgConsole as e } from "../../../providers/OrgConsoleProvider.js";
+import { useOrganization as t } from "../hooks/useOrganizations.js";
+import { OrganizationStatusBadge as n } from "../components/OrganizationStatusBadge.js";
+import { useTr as r } from "../../../shared/hooks/useTr.js";
+import { LoadingState as i } from "../../../shared/components/feedback/LoadingState.js";
+import { ErrorState as a } from "../../../shared/components/feedback/ErrorState.js";
+import { EmptyState as o } from "../../../shared/components/feedback/EmptyState.js";
+import { PERMISSIONS as s } from "../../../constants/permissions.js";
+import { useOrganizationPageView as c } from "../../../hooks/useOrganizationPageView.js";
+import { useWorkspacesByOrganization as l } from "../../workspaces/hooks/useWorkspaces.js";
+import { WorkspaceCard as u } from "../../workspaces/components/WorkspaceCard.js";
+import { useMemo as d, useState as f } from "react";
+import { ArrowLeft as p, Briefcase as m, Building as h, Edit as g, Users as _ } from "lucide-react";
+import { usePermissions as v } from "@burdenoff/fe-libs/shared/providers/shell";
+import { jsx as y, jsxs as b } from "react/jsx-runtime";
+import { useParams as x } from "react-router-dom";
+//#region src/organization-management/modules/organizations/pages/OrganizationDetailPage.tsx
+function S(e) {
+	return new Date(e).toLocaleDateString("en-US", {
+		year: "numeric",
+		month: "long",
+		day: "numeric",
+		hour: "2-digit",
+		minute: "2-digit"
+	});
+}
+function C() {
+	let C = r(), { id: w } = x();
+	c("organizations.detail", { organizationId: w });
+	let { navigate: T, basePath: E = "/organizations" } = e(), { hasPermission: D, isLoading: O } = v(), { organization: k, loading: A, error: j } = t(w ?? ""), [M, N] = f("overview"), { workspaces: P, loading: F, error: I, refetch: L } = l(M === "workspaces" && w ? w ?? "" : "", 50, 0), R = d(() => [{
+		id: "overview",
+		label: C("organizations.detail.tab.overview", "Overview")
+	}, {
+		id: "workspaces",
+		label: `${C("organizations.detail.tab.workspaces", "Workspaces")} (${M === "workspaces" ? P.length : k?.workspaceCount ?? 0})`
+	}], [
+		M,
+		k?.workspaceCount,
+		C,
+		P.length
+	]);
+	return O ? /* @__PURE__ */ y("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] p-6",
+		children: /* @__PURE__ */ y(i, { message: C("common.loadingPermissions", "Loading permissions...") })
+	}) : D(s.ORG_READ) ? A ? /* @__PURE__ */ y("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6",
+		children: /* @__PURE__ */ y(i, { message: C("organizations.detail.loading", "Loading organization details...") })
+	}) : j || !k ? /* @__PURE__ */ y("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6",
+		children: /* @__PURE__ */ y(a, {
+			message: j?.message || C("organizations.detail.notFound", "Organization not found"),
+			action: {
+				label: C("organizations.create.back", "Back to Organizations"),
+				onClick: () => T(E)
+			}
+		})
+	}) : /* @__PURE__ */ y("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6 animate-in fade-in duration-300",
+		children: /* @__PURE__ */ b("div", {
+			className: "mx-auto flex w-full max-w-7xl flex-col gap-6",
+			children: [/* @__PURE__ */ b("div", {
+				className: "space-y-4",
+				children: [/* @__PURE__ */ b("button", {
+					onClick: () => T(E),
+					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__ */ y(p, {
+						size: 20,
+						"aria-hidden": "true"
+					}), /* @__PURE__ */ y("span", {
+						className: "text-sm font-medium",
+						children: C("organizations.create.back", "Back to Organizations")
+					})]
+				}), /* @__PURE__ */ b("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__ */ b("div", {
+						className: "flex min-w-0 items-start gap-4",
+						children: [/* @__PURE__ */ y("div", {
+							className: "flex h-16 w-16 items-center justify-center rounded-xl bg-[var(--color-status-info-bgSubtle)] text-[var(--color-status-info-text)]",
+							children: /* @__PURE__ */ y(h, {
+								size: 28,
+								"aria-hidden": "true"
+							})
+						}), /* @__PURE__ */ b("div", {
+							className: "min-w-0 space-y-2",
+							children: [
+								/* @__PURE__ */ b("div", {
+									className: "flex flex-wrap items-start gap-3",
+									children: [/* @__PURE__ */ y("h1", {
+										className: "text-3xl font-bold text-[var(--color-text-primary)]",
+										children: k.name
+									}), /* @__PURE__ */ y(n, { status: k.status })]
+								}),
+								/* @__PURE__ */ b("p", {
+									className: "break-all font-mono text-sm text-[var(--color-text-secondary)]",
+									children: ["/", k.slug]
+								}),
+								k.description ? /* @__PURE__ */ y("p", {
+									className: "max-w-2xl text-sm text-[var(--color-text-secondary)]",
+									children: k.description
+								}) : null
+							]
+						})]
+					}), /* @__PURE__ */ b("div", {
+						className: "flex flex-col gap-3 sm:flex-row",
+						children: [/* @__PURE__ */ b("button", {
+							onClick: () => T(`${E}/${w}/members`),
+							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__ */ y(_, {
+								size: 16,
+								"aria-hidden": "true"
+							}), /* @__PURE__ */ y("span", { children: C("organizations.detail.manageMembers", "Manage Members") })]
+						}), D(s.ORG_UPDATE) && /* @__PURE__ */ b("button", {
+							onClick: () => T(`${E}/${w}/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__ */ y(g, {
+								size: 16,
+								"aria-hidden": "true"
+							}), /* @__PURE__ */ y("span", { children: C("organizations.edit.title", "Edit Organization") })]
+						})]
+					})]
+				})]
+			}), /* @__PURE__ */ b("div", {
+				className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] shadow-[var(--shadow-elevation-1)]",
+				children: [/* @__PURE__ */ y("div", {
+					className: "overflow-x-auto border-b border-[var(--color-border-default)]",
+					children: /* @__PURE__ */ y("div", {
+						className: "flex min-w-max gap-2 px-4 pt-4 sm:px-6",
+						children: R.map((e) => {
+							let t = M === e.id;
+							return /* @__PURE__ */ y("button", {
+								onClick: () => N(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__ */ y("div", {
+					className: "p-4 sm:p-6",
+					children: M === "overview" ? /* @__PURE__ */ b("div", {
+						className: "grid grid-cols-1 gap-6 xl:grid-cols-[minmax(0,1fr)_320px]",
+						children: [/* @__PURE__ */ b("section", {
+							className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-5",
+							children: [/* @__PURE__ */ y("h2", {
+								className: "text-lg font-semibold text-[var(--color-text-primary)]",
+								children: C("organizations.detail.detailsSection", "Organization details")
+							}), /* @__PURE__ */ b("dl", {
+								className: "mt-5 grid grid-cols-1 gap-4 sm:grid-cols-2",
+								children: [
+									/* @__PURE__ */ b("div", { children: [/* @__PURE__ */ y("dt", {
+										className: "text-sm font-medium text-[var(--color-text-secondary)]",
+										children: C("common.name", "Name")
+									}), /* @__PURE__ */ y("dd", {
+										className: "mt-1 text-sm text-[var(--color-text-primary)]",
+										children: k.name
+									})] }),
+									/* @__PURE__ */ b("div", { children: [/* @__PURE__ */ y("dt", {
+										className: "text-sm font-medium text-[var(--color-text-secondary)]",
+										children: C("common.slug", "Slug")
+									}), /* @__PURE__ */ y("dd", {
+										className: "mt-1 break-all font-mono text-sm text-[var(--color-text-primary)]",
+										children: k.slug
+									})] }),
+									/* @__PURE__ */ b("div", { children: [/* @__PURE__ */ y("dt", {
+										className: "text-sm font-medium text-[var(--color-text-secondary)]",
+										children: C("common.status", "Status")
+									}), /* @__PURE__ */ y("dd", {
+										className: "mt-1",
+										children: /* @__PURE__ */ y(n, { status: k.status })
+									})] }),
+									/* @__PURE__ */ b("div", { children: [/* @__PURE__ */ y("dt", {
+										className: "text-sm font-medium text-[var(--color-text-secondary)]",
+										children: C("organizations.detail.workspaceCount", "Workspace count")
+									}), /* @__PURE__ */ y("dd", {
+										className: "mt-1 text-sm text-[var(--color-text-primary)]",
+										children: k.workspaceCount ?? 0
+									})] }),
+									k.website ? /* @__PURE__ */ b("div", {
+										className: "sm:col-span-2",
+										children: [/* @__PURE__ */ y("dt", {
+											className: "text-sm font-medium text-[var(--color-text-secondary)]",
+											children: C("organizations.detail.website", "Website")
+										}), /* @__PURE__ */ y("dd", {
+											className: "mt-1 break-all text-sm",
+											children: /* @__PURE__ */ y("a", {
+												href: k.website,
+												target: "_blank",
+												rel: "noreferrer",
+												className: "text-[var(--color-action-primary-bg)] underline-offset-2 hover:underline",
+												children: k.website
+											})
+										})]
+									}) : null,
+									k.description ? /* @__PURE__ */ b("div", {
+										className: "sm:col-span-2",
+										children: [/* @__PURE__ */ y("dt", {
+											className: "text-sm font-medium text-[var(--color-text-secondary)]",
+											children: C("common.description", "Description")
+										}), /* @__PURE__ */ y("dd", {
+											className: "mt-1 text-sm leading-6 text-[var(--color-text-primary)]",
+											children: k.description
+										})]
+									}) : null
+								]
+							})]
+						}), /* @__PURE__ */ b("aside", {
+							className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-5",
+							children: [/* @__PURE__ */ y("h2", {
+								className: "text-lg font-semibold text-[var(--color-text-primary)]",
+								children: C("common.metadata", "Metadata")
+							}), /* @__PURE__ */ b("dl", {
+								className: "mt-5 space-y-4",
+								children: [
+									/* @__PURE__ */ b("div", { children: [/* @__PURE__ */ y("dt", {
+										className: "text-sm font-medium text-[var(--color-text-secondary)]",
+										children: C("common.created", "Created")
+									}), /* @__PURE__ */ y("dd", {
+										className: "mt-1 text-sm text-[var(--color-text-primary)]",
+										children: S(k.createdAt)
+									})] }),
+									/* @__PURE__ */ b("div", { children: [/* @__PURE__ */ y("dt", {
+										className: "text-sm font-medium text-[var(--color-text-secondary)]",
+										children: C("common.lastUpdated", "Last updated")
+									}), /* @__PURE__ */ y("dd", {
+										className: "mt-1 text-sm text-[var(--color-text-primary)]",
+										children: S(k.updatedAt)
+									})] }),
+									/* @__PURE__ */ b("div", { children: [/* @__PURE__ */ y("dt", {
+										className: "text-sm font-medium text-[var(--color-text-secondary)]",
+										children: C("organizations.detail.tenantId", "Tenant ID")
+									}), /* @__PURE__ */ y("dd", {
+										className: "mt-1 break-all font-mono text-sm text-[var(--color-text-primary)]",
+										children: k.tenantId
+									})] })
+								]
+							})]
+						})]
+					}) : /* @__PURE__ */ b("section", {
+						className: "space-y-4",
+						children: [/* @__PURE__ */ b("div", {
+							className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between",
+							children: [/* @__PURE__ */ b("div", { children: [/* @__PURE__ */ y("h2", {
+								className: "text-lg font-semibold text-[var(--color-text-primary)]",
+								children: C("organizations.detail.workspacesTitle", "Organization workspaces")
+							}), /* @__PURE__ */ y("p", {
+								className: "text-sm text-[var(--color-text-secondary)]",
+								children: C("organizations.detail.workspacesSubtitle", "Create and manage workspaces for this organization.")
+							})] }), D(s.WORKSPACE_CREATE) && /* @__PURE__ */ b("button", {
+								onClick: () => T(`${E}/workspaces/new?organizationId=${w}`),
+								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__ */ y(m, {
+									size: 16,
+									"aria-hidden": "true"
+								}), /* @__PURE__ */ y("span", { children: C("workspaces.create.button", "Create Workspace") })]
+							})]
+						}), F ? /* @__PURE__ */ y("div", {
+							className: "py-8",
+							children: /* @__PURE__ */ y(i, { message: C("workspaces.list.loading", "Loading workspaces...") })
+						}) : I ? /* @__PURE__ */ y(a, {
+							message: I.message,
+							action: {
+								label: C("common.retry", "Retry"),
+								onClick: () => {
+									L();
+								}
+							}
+						}) : P.length > 0 ? /* @__PURE__ */ y("div", {
+							className: "grid grid-cols-1 gap-4 xl:grid-cols-2",
+							children: P.map((e) => /* @__PURE__ */ y(u, {
+								workspace: e,
+								showActions: !1,
+								onClick: (e) => {
+									T(`${E}/workspaces/${e.id}`);
+								}
+							}, e.id))
+						}) : /* @__PURE__ */ y("div", {
+							className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-6",
+							children: /* @__PURE__ */ y(o, {
+								icon: /* @__PURE__ */ y(m, {
+									size: 40,
+									"aria-hidden": "true"
+								}),
+								title: C("workspaces.list.emptyTitle", "No workspaces yet"),
+								description: C("workspaces.list.emptyDescription", "Create a workspace when this organization is ready to collaborate with teams or projects."),
+								action: {
+									label: C("workspaces.create.button", "Create Workspace"),
+									onClick: () => T(`${E}/workspaces/new?organizationId=${w}`)
+								}
+							})
+						})]
+					})
+				})]
+			})]
+		})
+	}) : /* @__PURE__ */ y("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] p-6",
+		children: /* @__PURE__ */ y("div", {
+			className: "p-8 text-center text-[var(--color-text-secondary)]",
+			children: C("organizations.detail.noPermission", "You don't have permission to view this organization.")
+		})
+	});
+}
+//#endregion
+export { C as OrganizationDetailPage };
+
+//# sourceMappingURL=OrganizationDetailPage.js.map

package/dist/organization-management/modules/organizations/pages/OrganizationDetailPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationDetailPage.js","names":[],"sources":["../../../../../src/organization-management/modules/organizations/pages/OrganizationDetailPage.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { ArrowLeft, Briefcase, Building, Edit, Users } from 'lucide-react';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useOrgConsole } from '../../../providers/OrgConsoleProvider';\nimport { useOrganization } from '../hooks/useOrganizations';\nimport { OrganizationStatusBadge } from '../components/OrganizationStatusBadge';\nimport { LoadingState } from '../../../shared/components/feedback/LoadingState';\nimport { ErrorState } from '../../../shared/components/feedback/ErrorState';\nimport { EmptyState } from '../../../shared/components/feedback/EmptyState';\nimport { useWorkspacesByOrganization } from '../../workspaces/hooks/useWorkspaces';\nimport { WorkspaceCard } from '../../workspaces/components/WorkspaceCard';\nimport { PERMISSIONS } from '../../../constants/permissions';\nimport { useTr } from '../../../shared/hooks/useTr';\nimport { useOrganizationPageView } from '../../../hooks/useOrganizationPageView';\n\ntype ActiveTab = 'overview' | 'workspaces';\n\nfunction formatDate(dateString: string) {\n  return new Date(dateString).toLocaleDateString('en-US', {\n    year: 'numeric',\n    month: 'long',\n    day: 'numeric',\n    hour: '2-digit',\n    minute: '2-digit',\n  });\n}\n\nexport function OrganizationDetailPage() {\n  const tr = useTr();\n  const { id } = useParams<{ id: string }>();\n  useOrganizationPageView('organizations.detail', { organizationId: id });\n  const { navigate, basePath = '/organizations' } = useOrgConsole();\n  const { hasPermission, isLoading: permissionsLoading } = usePermissions();\n  const { organization, loading, error } = useOrganization(id ?? '');\n  const [activeTab, setActiveTab] = useState<ActiveTab>('overview');\n\n  const shouldFetchWorkspaces = activeTab === 'workspaces' && Boolean(id);\n  const {\n    workspaces,\n    loading: workspacesLoading,\n    error: workspacesError,\n    refetch: refetchWorkspaces,\n  } = useWorkspacesByOrganization(shouldFetchWorkspaces ? (id ?? '') : '', 50, 0);\n\n  const tabItems = useMemo(\n    () => [\n      { id: 'overview' as const, label: tr('organizations.detail.tab.overview', 'Overview') },\n      {\n        id: 'workspaces' as const,\n        label: `${tr('organizations.detail.tab.workspaces', 'Workspaces')} (${activeTab === 'workspaces' ? workspaces.length : (organization?.workspaceCount ?? 0)})`,\n      },\n    ],\n    [activeTab, organization?.workspaceCount, tr, workspaces.length]\n  );\n\n  if (permissionsLoading) {\n    return (\n      <div className=\"min-h-full bg-[var(--color-bg-canvas)] p-6\">\n        <LoadingState message={tr('common.loadingPermissions', 'Loading permissions...')} />\n      </div>\n    );\n  }\n\n  if (!hasPermission(PERMISSIONS.ORG_READ)) {\n    return (\n      <div className=\"min-h-full bg-[var(--color-bg-canvas)] p-6\">\n        <div className=\"p-8 text-center text-[var(--color-text-secondary)]\">\n          {tr(\n            'organizations.detail.noPermission',\n            \"You don't have permission to view this organization.\"\n          )}\n        </div>\n      </div>\n    );\n  }\n\n  if (loading) {\n    return (\n      <div className=\"min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6\">\n        <LoadingState\n          message={tr('organizations.detail.loading', 'Loading organization details...')}\n        />\n      </div>\n    );\n  }\n\n  if (error || !organization) {\n    return (\n      <div className=\"min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6\">\n        <ErrorState\n          message={error?.message || tr('organizations.detail.notFound', 'Organization not found')}\n          action={{\n            label: tr('organizations.create.back', 'Back to Organizations'),\n            onClick: () => navigate(basePath),\n          }}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6 animate-in fade-in duration-300\">\n      <div className=\"mx-auto flex w-full max-w-7xl flex-col gap-6\">\n        <div className=\"space-y-4\">\n          <button\n            onClick={() => navigate(basePath)}\n            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]\"\n          >\n            <ArrowLeft size={20} aria-hidden=\"true\" />\n            <span className=\"text-sm font-medium\">\n              {tr('organizations.create.back', 'Back to Organizations')}\n            </span>\n          </button>\n\n          <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\">\n            <div className=\"flex min-w-0 items-start gap-4\">\n              <div className=\"flex h-16 w-16 items-center justify-center rounded-xl bg-[var(--color-status-info-bgSubtle)] text-[var(--color-status-info-text)]\">\n                <Building size={28} aria-hidden=\"true\" />\n              </div>\n\n              <div className=\"min-w-0 space-y-2\">\n                <div className=\"flex flex-wrap items-start gap-3\">\n                  <h1 className=\"text-3xl font-bold text-[var(--color-text-primary)]\">\n                    {organization.name}\n                  </h1>\n                  <OrganizationStatusBadge status={organization.status} />\n                </div>\n                <p className=\"break-all font-mono text-sm text-[var(--color-text-secondary)]\">\n                  /{organization.slug}\n                </p>\n                {organization.description ? (\n                  <p className=\"max-w-2xl text-sm text-[var(--color-text-secondary)]\">\n                    {organization.description}\n                  </p>\n                ) : null}\n              </div>\n            </div>\n\n            <div className=\"flex flex-col gap-3 sm:flex-row\">\n              <button\n                onClick={() => navigate(`${basePath}/${id}/members`)}\n                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)]\"\n              >\n                <Users size={16} aria-hidden=\"true\" />\n                <span>{tr('organizations.detail.manageMembers', 'Manage Members')}</span>\n              </button>\n              {hasPermission(PERMISSIONS.ORG_UPDATE) && (\n                <button\n                  onClick={() => navigate(`${basePath}/${id}/edit`)}\n                  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]\"\n                >\n                  <Edit size={16} aria-hidden=\"true\" />\n                  <span>{tr('organizations.edit.title', 'Edit Organization')}</span>\n                </button>\n              )}\n            </div>\n          </div>\n        </div>\n\n        <div className=\"rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] shadow-[var(--shadow-elevation-1)]\">\n          <div className=\"overflow-x-auto border-b border-[var(--color-border-default)]\">\n            <div className=\"flex min-w-max gap-2 px-4 pt-4 sm:px-6\">\n              {tabItems.map((tabItem) => {\n                const isActive = activeTab === tabItem.id;\n                return (\n                  <button\n                    key={tabItem.id}\n                    onClick={() => setActiveTab(tabItem.id)}\n                    className={`inline-flex min-h-11 items-center rounded-t-lg border-b-2 px-4 py-3 text-sm font-medium transition-colors ${\n                      isActive\n                        ? 'border-[var(--color-action-primary-bg)] text-[var(--color-action-primary-bg)]'\n                        : 'border-transparent text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)]'\n                    }`}\n                    aria-pressed={isActive}\n                  >\n                    {tabItem.label}\n                  </button>\n                );\n              })}\n            </div>\n          </div>\n\n          <div className=\"p-4 sm:p-6\">\n            {activeTab === 'overview' ? (\n              <div className=\"grid grid-cols-1 gap-6 xl:grid-cols-[minmax(0,1fr)_320px]\">\n                <section className=\"rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-5\">\n                  <h2 className=\"text-lg font-semibold text-[var(--color-text-primary)]\">\n                    {tr('organizations.detail.detailsSection', 'Organization details')}\n                  </h2>\n\n                  <dl className=\"mt-5 grid grid-cols-1 gap-4 sm:grid-cols-2\">\n                    <div>\n                      <dt className=\"text-sm font-medium text-[var(--color-text-secondary)]\">\n                        {tr('common.name', 'Name')}\n                      </dt>\n                      <dd className=\"mt-1 text-sm text-[var(--color-text-primary)]\">\n                        {organization.name}\n                      </dd>\n                    </div>\n                    <div>\n                      <dt className=\"text-sm font-medium text-[var(--color-text-secondary)]\">\n                        {tr('common.slug', 'Slug')}\n                      </dt>\n                      <dd className=\"mt-1 break-all font-mono text-sm text-[var(--color-text-primary)]\">\n                        {organization.slug}\n                      </dd>\n                    </div>\n                    <div>\n                      <dt className=\"text-sm font-medium text-[var(--color-text-secondary)]\">\n                        {tr('common.status', 'Status')}\n                      </dt>\n                      <dd className=\"mt-1\">\n                        <OrganizationStatusBadge status={organization.status} />\n                      </dd>\n                    </div>\n                    <div>\n                      <dt className=\"text-sm font-medium text-[var(--color-text-secondary)]\">\n                        {tr('organizations.detail.workspaceCount', 'Workspace count')}\n                      </dt>\n                      <dd className=\"mt-1 text-sm text-[var(--color-text-primary)]\">\n                        {organization.workspaceCount ?? 0}\n                      </dd>\n                    </div>\n                    {organization.website ? (\n                      <div className=\"sm:col-span-2\">\n                        <dt className=\"text-sm font-medium text-[var(--color-text-secondary)]\">\n                          {tr('organizations.detail.website', 'Website')}\n                        </dt>\n                        <dd className=\"mt-1 break-all text-sm\">\n                          <a\n                            href={organization.website}\n                            target=\"_blank\"\n                            rel=\"noreferrer\"\n                            className=\"text-[var(--color-action-primary-bg)] underline-offset-2 hover:underline\"\n                          >\n                            {organization.website}\n                          </a>\n                        </dd>\n                      </div>\n                    ) : null}\n                    {organization.description ? (\n                      <div className=\"sm:col-span-2\">\n                        <dt className=\"text-sm font-medium text-[var(--color-text-secondary)]\">\n                          {tr('common.description', 'Description')}\n                        </dt>\n                        <dd className=\"mt-1 text-sm leading-6 text-[var(--color-text-primary)]\">\n                          {organization.description}\n                        </dd>\n                      </div>\n                    ) : null}\n                  </dl>\n                </section>\n\n                <aside className=\"rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-5\">\n                  <h2 className=\"text-lg font-semibold text-[var(--color-text-primary)]\">\n                    {tr('common.metadata', 'Metadata')}\n                  </h2>\n\n                  <dl className=\"mt-5 space-y-4\">\n                    <div>\n                      <dt className=\"text-sm font-medium text-[var(--color-text-secondary)]\">\n                        {tr('common.created', 'Created')}\n                      </dt>\n                      <dd className=\"mt-1 text-sm text-[var(--color-text-primary)]\">\n                        {formatDate(organization.createdAt)}\n                      </dd>\n                    </div>\n                    <div>\n                      <dt className=\"text-sm font-medium text-[var(--color-text-secondary)]\">\n                        {tr('common.lastUpdated', 'Last updated')}\n                      </dt>\n                      <dd className=\"mt-1 text-sm text-[var(--color-text-primary)]\">\n                        {formatDate(organization.updatedAt)}\n                      </dd>\n                    </div>\n                    <div>\n                      <dt className=\"text-sm font-medium text-[var(--color-text-secondary)]\">\n                        {tr('organizations.detail.tenantId', 'Tenant ID')}\n                      </dt>\n                      <dd className=\"mt-1 break-all font-mono text-sm text-[var(--color-text-primary)]\">\n                        {organization.tenantId}\n                      </dd>\n                    </div>\n                  </dl>\n                </aside>\n              </div>\n            ) : (\n              <section className=\"space-y-4\">\n                <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n                  <div>\n                    <h2 className=\"text-lg font-semibold text-[var(--color-text-primary)]\">\n                      {tr('organizations.detail.workspacesTitle', 'Organization workspaces')}\n                    </h2>\n                    <p className=\"text-sm text-[var(--color-text-secondary)]\">\n                      {tr(\n                        'organizations.detail.workspacesSubtitle',\n                        'Create and manage workspaces for this organization.'\n                      )}\n                    </p>\n                  </div>\n\n                  {hasPermission(PERMISSIONS.WORKSPACE_CREATE) && (\n                    <button\n                      onClick={() => navigate(`${basePath}/workspaces/new?organizationId=${id}`)}\n                      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]\"\n                    >\n                      <Briefcase size={16} aria-hidden=\"true\" />\n                      <span>{tr('workspaces.create.button', 'Create Workspace')}</span>\n                    </button>\n                  )}\n                </div>\n\n                {workspacesLoading ? (\n                  <div className=\"py-8\">\n                    <LoadingState\n                      message={tr('workspaces.list.loading', 'Loading workspaces...')}\n                    />\n                  </div>\n                ) : workspacesError ? (\n                  <ErrorState\n                    message={workspacesError.message}\n                    action={{\n                      label: tr('common.retry', 'Retry'),\n                      onClick: () => {\n                        void refetchWorkspaces();\n                      },\n                    }}\n                  />\n                ) : workspaces.length > 0 ? (\n                  <div className=\"grid grid-cols-1 gap-4 xl:grid-cols-2\">\n                    {workspaces.map((workspace) => (\n                      <WorkspaceCard\n                        key={workspace.id}\n                        workspace={workspace}\n                        showActions={false}\n                        onClick={(selectedWorkspace) => {\n                          navigate(`${basePath}/workspaces/${selectedWorkspace.id}`);\n                        }}\n                      />\n                    ))}\n                  </div>\n                ) : (\n                  <div className=\"rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-canvas)] p-6\">\n                    <EmptyState\n                      icon={<Briefcase size={40} aria-hidden=\"true\" />}\n                      title={tr('workspaces.list.emptyTitle', 'No workspaces yet')}\n                      description={tr(\n                        'workspaces.list.emptyDescription',\n                        'Create a workspace when this organization is ready to collaborate with teams or projects.'\n                      )}\n                      action={{\n                        label: tr('workspaces.create.button', 'Create Workspace'),\n                        onClick: () => navigate(`${basePath}/workspaces/new?organizationId=${id}`),\n                      }}\n                    />\n                  </div>\n                )}\n              </section>\n            )}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/organization-management/modules/organizations/pages/OrganizationEditPage.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Organization Edit Page
+ * Form to edit an existing organization
+ */
+export declare function OrganizationEditPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=OrganizationEditPage.d.ts.map

package/dist/organization-management/modules/organizations/pages/OrganizationEditPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationEditPage.d.ts","sourceRoot":"","sources":["../../../../../src/organization-management/modules/organizations/pages/OrganizationEditPage.tsx"],"names":[],"mappings":"AAcA;;;GAGG;AACH,wBAAgB,oBAAoB,4CAwHnC"}

package/dist/organization-management/modules/organizations/pages/OrganizationEditPage.js

@@ -0,0 +1,93 @@
+import { useOrgConsole as e } from "../../../providers/OrgConsoleProvider.js";
+import { toast as t } from "../../../../node_modules/sonner/dist/index.js";
+import { useOrganization as n, useUpdateOrganization as r } from "../hooks/useOrganizations.js";
+import { useTr as i } from "../../../shared/hooks/useTr.js";
+import { LoadingState as a } from "../../../shared/components/feedback/LoadingState.js";
+import { ErrorState as o } from "../../../shared/components/feedback/ErrorState.js";
+import { PERMISSIONS as s } from "../../../constants/permissions.js";
+import { useOrganizationPageView as c } from "../../../hooks/useOrganizationPageView.js";
+import { OrganizationForm as l } from "../components/OrganizationForm.js";
+import { ArrowLeft as u } from "lucide-react";
+import { usePermissions as d } from "@burdenoff/fe-libs/shared/providers/shell";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { useParams as m } from "react-router-dom";
+//#region src/organization-management/modules/organizations/pages/OrganizationEditPage.tsx
+function h() {
+	let h = i(), { id: g } = m();
+	c("organizations.edit", { organizationId: g });
+	let { navigate: _, basePath: v = "/organizations" } = e(), { hasPermission: y, isLoading: b } = d(), { organization: x, loading: S, error: C } = n(g), { updateOrganization: w, loading: T } = r(), E = async (e) => {
+		if (g) try {
+			let n = await w(g, e);
+			if (n.errors?.length) throw Error(n.errors[0]?.message ?? h("organizations.edit.failed", "Failed to update organization"));
+			t.success(h("organizations.edit.success", "Organization updated successfully")), _(`${v}/${g}`);
+		} catch (e) {
+			t.error(e instanceof Error ? e.message : h("organizations.edit.failed", "Failed to update organization"));
+		}
+	}, D = () => {
+		_(`${v}/${g}`);
+	};
+	return b ? /* @__PURE__ */ f("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] p-6",
+		children: /* @__PURE__ */ f(a, { message: h("common.loadingPermissions", "Loading permissions...") })
+	}) : y(s.ORG_UPDATE) ? S ? /* @__PURE__ */ f("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6",
+		children: /* @__PURE__ */ f(a, { message: h("organizations.edit.loading", "Loading organization...") })
+	}) : C || !x ? /* @__PURE__ */ f("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6",
+		children: /* @__PURE__ */ f(o, {
+			message: C?.message || h("organizations.detail.notFound", "Organization not found"),
+			action: {
+				label: h("organizations.create.back", "Back to Organizations"),
+				onClick: () => _(v)
+			}
+		})
+	}) : /* @__PURE__ */ p("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6 animate-in fade-in duration-300",
+		children: [/* @__PURE__ */ p("div", {
+			className: "mb-6",
+			children: [
+				/* @__PURE__ */ p("button", {
+					onClick: D,
+					className: "\n            inline-flex items-center gap-2 mb-4\n            text-[var(--color-text-secondary)]\n            hover:text-[var(--color-text-primary)]\n            active:scale-[0.98]\n            transition-all duration-200\n          ",
+					children: [/* @__PURE__ */ f(u, { size: 20 }), /* @__PURE__ */ p("span", {
+						className: "text-sm font-medium",
+						children: [
+							h("common.backTo", "Back to"),
+							" ",
+							x.name
+						]
+					})]
+				}),
+				/* @__PURE__ */ f("h1", {
+					className: "text-3xl font-bold text-[var(--color-text-primary)] mb-2",
+					children: h("organizations.edit.title", "Edit Organization")
+				}),
+				/* @__PURE__ */ f("p", {
+					className: "text-[var(--color-text-secondary)]",
+					children: h("organizations.edit.subtitle", "Update organization information")
+				})
+			]
+		}), /* @__PURE__ */ f("div", {
+			className: "max-w-2xl",
+			children: /* @__PURE__ */ f("div", {
+				className: "bg-[var(--color-bg-surface)] border border-[var(--color-border-default)] rounded-lg p-6 shadow-[var(--shadow-elevation-1)]",
+				children: /* @__PURE__ */ f(l, {
+					organization: x,
+					onSubmit: E,
+					onCancel: D,
+					loading: T
+				})
+			})
+		})]
+	}) : /* @__PURE__ */ f("div", {
+		className: "min-h-full bg-[var(--color-bg-canvas)] p-6",
+		children: /* @__PURE__ */ f("div", {
+			className: "p-8 text-center text-[var(--color-text-secondary)]",
+			children: h("organizations.edit.noPermission", "You don't have permission to edit organizations.")
+		})
+	});
+}
+//#endregion
+export { h as OrganizationEditPage };
+
+//# sourceMappingURL=OrganizationEditPage.js.map

package/dist/organization-management/modules/organizations/pages/OrganizationEditPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationEditPage.js","names":[],"sources":["../../../../../src/organization-management/modules/organizations/pages/OrganizationEditPage.tsx"],"sourcesContent":["import { useParams } from 'react-router-dom';\nimport { ArrowLeft } from 'lucide-react';\nimport { toast } from 'sonner';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useOrgConsole } from '../../../providers/OrgConsoleProvider';\nimport { useOrganization, useUpdateOrganization } from '../hooks/useOrganizations';\nimport { OrganizationForm } from '../components/OrganizationForm';\nimport { LoadingState } from '../../../shared/components/feedback/LoadingState';\nimport { ErrorState } from '../../../shared/components/feedback/ErrorState';\nimport { PERMISSIONS } from '../../../constants/permissions';\nimport { useTr } from '../../../shared/hooks/useTr';\nimport { useOrganizationPageView } from '../../../hooks/useOrganizationPageView';\nimport type { UpdateOrganizationInput } from '../types';\n\n/**\n * Organization Edit Page\n * Form to edit an existing organization\n */\nexport function OrganizationEditPage() {\n  const tr = useTr();\n  const { id } = useParams<{ id: string }>();\n  useOrganizationPageView('organizations.edit', { organizationId: id });\n  const { navigate, basePath = '/organizations' } = useOrgConsole();\n  const { hasPermission, isLoading: permissionsLoading } = usePermissions();\n  const { organization, loading: fetchLoading, error } = useOrganization(id!);\n  const { updateOrganization, loading: updateLoading } = useUpdateOrganization();\n\n  const handleSubmit = async (data: UpdateOrganizationInput) => {\n    if (!id) return;\n\n    try {\n      const result = await updateOrganization(id, data);\n      if (result.errors?.length) {\n        throw new Error(\n          result.errors[0]?.message ??\n            tr('organizations.edit.failed', 'Failed to update organization')\n        );\n      }\n\n      toast.success(tr('organizations.edit.success', 'Organization updated successfully'));\n      navigate(`${basePath}/${id}`);\n    } catch (error) {\n      toast.error(\n        error instanceof Error\n          ? error.message\n          : tr('organizations.edit.failed', 'Failed to update organization')\n      );\n    }\n  };\n\n  const handleCancel = () => {\n    navigate(`${basePath}/${id}`);\n  };\n\n  if (permissionsLoading) {\n    return (\n      <div className=\"min-h-full bg-[var(--color-bg-canvas)] p-6\">\n        <LoadingState message={tr('common.loadingPermissions', 'Loading permissions...')} />\n      </div>\n    );\n  }\n\n  if (!hasPermission(PERMISSIONS.ORG_UPDATE)) {\n    return (\n      <div className=\"min-h-full bg-[var(--color-bg-canvas)] p-6\">\n        <div className=\"p-8 text-center text-[var(--color-text-secondary)]\">\n          {tr(\n            'organizations.edit.noPermission',\n            \"You don't have permission to edit organizations.\"\n          )}\n        </div>\n      </div>\n    );\n  }\n\n  if (fetchLoading) {\n    return (\n      <div className=\"min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6\">\n        <LoadingState message={tr('organizations.edit.loading', 'Loading organization...')} />\n      </div>\n    );\n  }\n\n  if (error || !organization) {\n    return (\n      <div className=\"min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6\">\n        <ErrorState\n          message={error?.message || tr('organizations.detail.notFound', 'Organization not found')}\n          action={{\n            label: tr('organizations.create.back', 'Back to Organizations'),\n            onClick: () => navigate(basePath),\n          }}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"min-h-full bg-[var(--color-bg-canvas)] px-4 py-6 sm:px-6 animate-in fade-in duration-300\">\n      {/* Page Header */}\n      <div className=\"mb-6\">\n        <button\n          onClick={handleCancel}\n          className=\"\n            inline-flex items-center gap-2 mb-4\n            text-[var(--color-text-secondary)]\n            hover:text-[var(--color-text-primary)]\n            active:scale-[0.98]\n            transition-all duration-200\n          \"\n        >\n          <ArrowLeft size={20} />\n          <span className=\"text-sm font-medium\">\n            {tr('common.backTo', 'Back to')} {organization.name}\n          </span>\n        </button>\n\n        <h1 className=\"text-3xl font-bold text-[var(--color-text-primary)] mb-2\">\n          {tr('organizations.edit.title', 'Edit Organization')}\n        </h1>\n        <p className=\"text-[var(--color-text-secondary)]\">\n          {tr('organizations.edit.subtitle', 'Update organization information')}\n        </p>\n      </div>\n\n      {/* Form Card */}\n      <div className=\"max-w-2xl\">\n        <div className=\"bg-[var(--color-bg-surface)] border border-[var(--color-border-default)] rounded-lg p-6 shadow-[var(--shadow-elevation-1)]\">\n          <OrganizationForm\n            organization={organization}\n            onSubmit={handleSubmit}\n            onCancel={handleCancel}\n            loading={updateLoading}\n          />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAkBA,SAAgB,IAAuB;CACrC,IAAM,IAAK,GAAO,EACZ,EAAE,UAAO,GAA2B;AAC1C,GAAwB,sBAAsB,EAAE,gBAAgB,GAAI,CAAC;CACrE,IAAM,EAAE,aAAU,cAAW,qBAAqB,GAAe,EAC3D,EAAE,kBAAe,WAAW,MAAuB,GAAgB,EACnE,EAAE,iBAAc,SAAS,GAAc,aAAU,EAAgB,EAAI,EACrE,EAAE,uBAAoB,SAAS,MAAkB,GAAuB,EAExE,IAAe,OAAO,MAAkC;AACvD,QAEL,KAAI;GACF,IAAM,IAAS,MAAM,EAAmB,GAAI,EAAK;AACjD,OAAI,EAAO,QAAQ,OACjB,OAAU,MACR,EAAO,OAAO,IAAI,WAChB,EAAG,6BAA6B,gCAAgC,CACnE;AAIH,GADA,EAAM,QAAQ,EAAG,8BAA8B,oCAAoC,CAAC,EACpF,EAAS,GAAG,EAAS,GAAG,IAAK;WACtB,GAAO;AACd,KAAM,MACJ,aAAiB,QACb,EAAM,UACN,EAAG,6BAA6B,gCAAgC,CACrE;;IAIC,UAAqB;AACzB,IAAS,GAAG,EAAS,GAAG,IAAK;;AA8C/B,QA3CI,IAEA,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,GAAD,EAAc,SAAS,EAAG,6BAA6B,yBAAyB,EAAI,CAAA;EAChF,CAAA,GAIL,EAAc,EAAY,WAAW,GAatC,IAEA,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,GAAD,EAAc,SAAS,EAAG,8BAA8B,0BAA0B,EAAI,CAAA;EAClF,CAAA,GAIN,KAAS,CAAC,IAEV,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,GAAD;GACE,SAAS,GAAO,WAAW,EAAG,iCAAiC,yBAAyB;GACxF,QAAQ;IACN,OAAO,EAAG,6BAA6B,wBAAwB;IAC/D,eAAe,EAAS,EAAS;IAClC;GACD,CAAA;EACE,CAAA,GAKR,kBAAC,OAAD;EAAK,WAAU;YAAf,CAEE,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,UAAD;KACE,SAAS;KACT,WAAU;eAFZ,CAUE,kBAAC,GAAD,EAAW,MAAM,IAAM,CAAA,EACvB,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACG,EAAG,iBAAiB,UAAU;OAAC;OAAE,EAAa;OAC1C;QACA;;IAET,kBAAC,MAAD;KAAI,WAAU;eACX,EAAG,4BAA4B,oBAAoB;KACjD,CAAA;IACL,kBAAC,KAAD;KAAG,WAAU;eACV,EAAG,+BAA+B,kCAAkC;KACnE,CAAA;IACA;MAGN,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,GAAD;KACgB;KACd,UAAU;KACV,UAAU;KACV,SAAS;KACT,CAAA;IACE,CAAA;GACF,CAAA,CACF;MAxEJ,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,OAAD;GAAK,WAAU;aACZ,EACC,mCACA,mDACD;GACG,CAAA;EACF,CAAA"}

package/dist/organization-management/modules/organizations/pages/OrganizationsListPage.d.ts

@@ -0,0 +1,2 @@
+export declare function OrganizationsListPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=OrganizationsListPage.d.ts.map

package/dist/organization-management/modules/organizations/pages/OrganizationsListPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationsListPage.d.ts","sourceRoot":"","sources":["../../../../../src/organization-management/modules/organizations/pages/OrganizationsListPage.tsx"],"names":[],"mappings":"AA+BA,wBAAgB,qBAAqB,4CAohBpC"}