@burdenoff/microfe-devportal 2026.623.5 → 2026.623.7

package/dist/devportal/pages/OrganizationDetailPage.js

@@ -1,12 +1,12 @@
 import { useDevportal as e } from "../providers/DevportalProvider.js";
 import { cn as t } from "../utils/cn.js";
 import { EmptyState as n } from "../components/EmptyState.js";
-import { PageLayout as r, PageSection as i } from "../components/PageLayout.js";
-import { StatCard as a, StatCardGrid as o } from "../components/StatCard.js";
-import { ORG_ROLE_LABELS as s } from "../utils/constants.js";
-import { AppListItem as c } from "../components/AppCard.js";
-import { DataTable as l, DetailList as u } from "../components/DataTable.js";
-import { useGetApplicationsQuery as d, useGetOrganizationQuery as f, useRequestOrgVerificationMutation as p } from "../../generated/global-operations.js";
+import { useGetApplicationsQuery as r, useGetOrganizationQuery as i, useRequestOrgVerificationMutation as a } from "../../generated/global-operations.js";
+import { PageLayout as o, PageSection as s } from "../components/PageLayout.js";
+import { StatCard as c, StatCardGrid as l } from "../components/StatCard.js";
+import { ORG_ROLE_LABELS as u } from "../utils/constants.js";
+import { AppListItem as d } from "../components/AppCard.js";
+import { DataTable as f, DetailList as p } from "../components/DataTable.js";
 import { DEVPORTAL_PERMISSIONS as m } from "../constants/permissions.js";
 import { useDevportalPermission as h } from "../hooks/usePermission.js";
 import { useEffect as g, useState as _ } from "react";
@@ -79,95 +79,95 @@ function z(e) {
 	};
 }
 var B = () => {
-	let { navigate: n, basePath: i } = e(), { orgId: a } = P(), { t: o } = v(), s = (e, t) => {
-		let n = o(e);
+	let { navigate: n, basePath: a } = e(), { orgId: s } = P(), { t: c } = v(), l = (e, t) => {
+		let n = c(e);
 		return n === e ? t : n;
-	}, { allowed: c } = h(m.ORG_UPDATE), [l, u] = _("overview"), p = [
+	}, { allowed: u } = h(m.ORG_UPDATE), [d, f] = _("overview"), p = [
 		{
 			id: "overview",
-			label: s("devportal.overview", "Overview"),
+			label: l("devportal.overview", "Overview"),
 			icon: C
 		},
 		{
 			id: "apps",
-			label: s("devportal.applications", "Applications"),
+			label: l("devportal.applications", "Applications"),
 			icon: b
 		},
 		{
 			id: "members",
-			label: s("devportal.members", "Members"),
+			label: l("devportal.members", "Members"),
 			icon: N
 		},
 		{
 			id: "settings",
-			label: s("devportal.settings", "Settings"),
+			label: l("devportal.settings", "Settings"),
 			icon: A
 		}
-	], { data: x, previousData: S, loading: w, error: D } = f({
-		variables: { id: a },
-		skip: !a
-	}), k = x ?? S, { data: j } = d({
+	], { data: x, previousData: S, loading: w, error: D } = i({
+		variables: { id: s },
+		skip: !s
+	}), k = x ?? S, { data: j } = r({
 		variables: { limit: 50 },
 		fetchPolicy: "cache-and-network"
 	}), M = (e) => {
-		n?.(`${i}${e}`);
+		n?.(`${a}${e}`);
 	};
 	if (g(() => {
 		let e = k?.developerOrganization?.name;
-		if (!a || !e) return;
+		if (!s || !e) return;
 		let t = window.__breadcrumbRegistry;
-		return t?.register(a, e), () => t?.unregister(a);
-	}, [a, x?.developerOrganization?.name]), w && !k) return /* @__PURE__ */ I(r, {
-		title: s("devportal.loadingDots", "Loading..."),
-		backLink: `${i}/organizations`,
-		backLabel: s("devportal.backToOrganizations", "Back to Organizations"),
+		return t?.register(s, e), () => t?.unregister(s);
+	}, [s, x?.developerOrganization?.name]), w && !k) return /* @__PURE__ */ I(o, {
+		title: l("devportal.loadingDots", "Loading..."),
+		backLink: `${a}/organizations`,
+		backLabel: l("devportal.backToOrganizations", "Back to Organizations"),
 		children: /* @__PURE__ */ I("div", {
 			className: "flex items-center justify-center py-12",
 			children: /* @__PURE__ */ I(O, { className: "h-8 w-8 animate-spin text-muted-foreground" })
 		})
 	});
-	if (D || !k?.developerOrganization) return /* @__PURE__ */ I(r, {
-		title: s("devportal.organizationNotFound", "Organization Not Found"),
-		backLink: `${i}/organizations`,
-		backLabel: s("devportal.backToOrganizations", "Back to Organizations"),
+	if (D || !k?.developerOrganization) return /* @__PURE__ */ I(o, {
+		title: l("devportal.organizationNotFound", "Organization Not Found"),
+		backLink: `${a}/organizations`,
+		backLabel: l("devportal.backToOrganizations", "Back to Organizations"),
 		children: /* @__PURE__ */ L("div", {
 			className: "flex flex-col items-center justify-center py-12 gap-4",
 			children: [
 				/* @__PURE__ */ I(y, { className: "h-12 w-12 text-destructive" }),
 				/* @__PURE__ */ I("h2", {
 					className: "text-lg font-semibold",
-					children: s("devportal.organizationNotFoundLower", "Organization not found")
+					children: l("devportal.organizationNotFoundLower", "Organization not found")
 				}),
 				/* @__PURE__ */ I("p", {
 					className: "text-muted-foreground",
-					children: D?.message || s("devportal.organizationNotFoundDescription", "The organization you're looking for doesn't exist or you don't have access to it.")
+					children: D?.message || l("devportal.organizationNotFoundDescription", "The organization you're looking for doesn't exist or you don't have access to it.")
 				}),
 				/* @__PURE__ */ I("button", {
 					onClick: () => M("/organizations"),
 					className: "mt-4 inline-flex items-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90",
-					children: s("devportal.backToOrganizations", "Back to Organizations")
+					children: l("devportal.backToOrganizations", "Back to Organizations")
 				})
 			]
 		})
 	});
-	let F = R(k.developerOrganization), B = (k.developerOrganization.members ?? []).map(z), G = j?.applications?.edges?.map((e) => e.node) ?? [], K = a ? G.filter((e) => e.developerOrganizationId === a) : G, q = parseInt(F.apiCallsUsed) / F.apiCallsLimit * 100, J = parseInt(F.storageUsed) / parseInt(F.storageLimit) * 100;
-	return /* @__PURE__ */ L(r, {
+	let F = R(k.developerOrganization), B = (k.developerOrganization.members ?? []).map(z), G = j?.applications?.edges?.map((e) => e.node) ?? [], K = s ? G.filter((e) => e.developerOrganizationId === s) : G, q = parseInt(F.apiCallsUsed) / F.apiCallsLimit * 100, J = parseInt(F.storageUsed) / parseInt(F.storageLimit) * 100;
+	return /* @__PURE__ */ L(o, {
 		title: F.name,
 		description: F.description,
-		backLink: `${i}/organizations`,
-		backLabel: s("devportal.backToOrganizations", "Back to Organizations"),
+		backLink: `${a}/organizations`,
+		backLabel: l("devportal.backToOrganizations", "Back to Organizations"),
 		actions: /* @__PURE__ */ L("div", {
 			className: "flex items-center gap-2",
 			children: [/* @__PURE__ */ L("button", {
 				onClick: () => n?.(`/billing/earnings?developerOrgId=${encodeURIComponent(F.id)}&developerOrgName=${encodeURIComponent(F.name)}`),
 				className: "inline-flex items-center gap-2 rounded-md border px-4 py-2 text-sm font-medium hover:bg-muted transition-colors",
-				children: [/* @__PURE__ */ I(T, { size: 16 }), s("devportal.revenue", "Revenue")]
+				children: [/* @__PURE__ */ I(T, { size: 16 }), l("devportal.revenue", "Revenue")]
 			}), /* @__PURE__ */ L("button", {
-				onClick: () => u("settings"),
-				disabled: !c,
-				"aria-disabled": !c,
+				onClick: () => f("settings"),
+				disabled: !u,
+				"aria-disabled": !u,
 				className: "inline-flex items-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90 transition-colors disabled:opacity-50",
-				children: [/* @__PURE__ */ I(E, { size: 16 }), s("devportal.settings", "Settings")]
+				children: [/* @__PURE__ */ I(E, { size: 16 }), l("devportal.settings", "Settings")]
 			})]
 		}),
 		children: [/* @__PURE__ */ I("div", {
@@ -175,50 +175,50 @@ var B = () => {
 			children: /* @__PURE__ */ I("nav", {
 				className: "-mb-px flex gap-4 overflow-x-auto",
 				role: "tablist",
-				"aria-label": s("devportal.organizationSections", "Organization sections"),
+				"aria-label": l("devportal.organizationSections", "Organization sections"),
 				children: p.map((e) => {
 					let n = e.icon;
 					return /* @__PURE__ */ L("button", {
 						id: `organization-tab-${e.id}`,
 						role: "tab",
-						"aria-selected": l === e.id,
+						"aria-selected": d === e.id,
 						"aria-controls": `organization-panel-${e.id}`,
-						onClick: () => u(e.id),
-						className: t("flex items-center gap-2 border-b-2 px-1 py-3 text-sm font-medium transition-colors", l === e.id ? "border-primary text-primary" : "border-transparent text-muted-foreground hover:text-foreground hover:border-muted-foreground"),
+						onClick: () => f(e.id),
+						className: t("flex items-center gap-2 border-b-2 px-1 py-3 text-sm font-medium transition-colors", d === e.id ? "border-primary text-primary" : "border-transparent text-muted-foreground hover:text-foreground hover:border-muted-foreground"),
 						children: [/* @__PURE__ */ I(n, { size: 16 }), e.label]
 					}, e.id);
 				})
 			})
 		}), /* @__PURE__ */ L("div", {
 			className: "mt-6",
-			id: `organization-panel-${l}`,
+			id: `organization-panel-${d}`,
 			role: "tabpanel",
-			"aria-labelledby": `organization-tab-${l}`,
+			"aria-labelledby": `organization-tab-${d}`,
 			tabIndex: 0,
 			children: [
-				l === "overview" && /* @__PURE__ */ I(V, {
+				d === "overview" && /* @__PURE__ */ I(V, {
 					org: F,
 					apps: K,
 					members: B,
 					apiCallsPercent: q,
 					storagePercent: J,
 					onNavigate: M,
-					onShowApps: () => u("apps")
+					onShowApps: () => f("apps")
 				}),
-				l === "apps" && /* @__PURE__ */ I(H, {
+				d === "apps" && /* @__PURE__ */ I(H, {
 					apps: K,
 					onNavigate: M
 				}),
-				l === "members" && /* @__PURE__ */ I(U, {
+				d === "members" && /* @__PURE__ */ I(U, {
 					members: B,
 					onNavigate: M,
 					orgId: F.id
 				}),
-				l === "settings" && /* @__PURE__ */ I(W, { org: F })
+				d === "settings" && /* @__PURE__ */ I(W, { org: F })
 			]
 		})]
 	});
-}, V = ({ org: e, apps: t, members: r, apiCallsPercent: l, storagePercent: d, onNavigate: f, onShowApps: p }) => {
+}, V = ({ org: e, apps: t, members: r, apiCallsPercent: i, storagePercent: a, onNavigate: o, onShowApps: f }) => {
 	let { t: m } = v(), h = (e, t) => {
 		let n = m(e);
 		return n === e ? t : n;
@@ -228,15 +228,15 @@ var B = () => {
 		children: [/* @__PURE__ */ L("div", {
 			className: "lg:col-span-2 space-y-6",
 			children: [
-				/* @__PURE__ */ L(o, {
+				/* @__PURE__ */ L(l, {
 					columns: 4,
 					children: [
-						/* @__PURE__ */ I(a, {
+						/* @__PURE__ */ I(c, {
 							title: h("devportal.publishedApps", "Published Apps"),
 							value: `${e.publishedApps}/${e.totalApps}`,
 							icon: /* @__PURE__ */ I(b, { size: 20 })
 						}),
-						/* @__PURE__ */ I(a, {
+						/* @__PURE__ */ I(c, {
 							title: h("devportal.totalInstalls", "Total Installs"),
 							value: e.totalInstalls.toLocaleString(),
 							icon: /* @__PURE__ */ I(M, { size: 20 }),
@@ -245,22 +245,22 @@ var B = () => {
 								label: h("devportal.thisMonth", "this month")
 							}
 						}),
-						/* @__PURE__ */ I(a, {
+						/* @__PURE__ */ I(c, {
 							title: h("devportal.totalRevenue", "Total Revenue"),
 							value: `$${e.totalRevenue.toLocaleString()}`,
 							icon: /* @__PURE__ */ I(T, { size: 20 })
 						}),
-						/* @__PURE__ */ I(a, {
+						/* @__PURE__ */ I(c, {
 							title: h("devportal.avgRating", "Avg Rating"),
 							value: e.averageRating ? `${e.averageRating.toFixed(1)} ★` : h("devportal.notAvailable", "N/A"),
 							icon: /* @__PURE__ */ I(S, { size: 20 })
 						})
 					]
 				}),
-				/* @__PURE__ */ I(i, {
+				/* @__PURE__ */ I(s, {
 					title: h("devportal.recentApplications", "Recent Applications"),
 					actions: /* @__PURE__ */ L("button", {
-						onClick: p,
+						onClick: f,
 						className: "text-sm text-primary hover:underline flex items-center gap-1",
 						children: [
 							h("devportal.viewAll", "View all"),
@@ -270,9 +270,9 @@ var B = () => {
 					}),
 					children: t.length > 0 ? /* @__PURE__ */ I("div", {
 						className: "space-y-2",
-						children: t.slice(0, 3).map((e) => /* @__PURE__ */ I(c, {
+						children: t.slice(0, 3).map((e) => /* @__PURE__ */ I(d, {
 							app: e,
-							onClick: () => f(`/apps/${e.id}`)
+							onClick: () => o(`/apps/${e.id}`)
 						}, e.id))
 					}) : /* @__PURE__ */ I(n, {
 						icon: /* @__PURE__ */ I(b, { size: 24 }),
@@ -280,7 +280,7 @@ var B = () => {
 						description: h("devportal.createYourFirstApplication", "Create your first application")
 					})
 				}),
-				/* @__PURE__ */ L(i, {
+				/* @__PURE__ */ L(s, {
 					title: h("devportal.usageAndQuotas", "Usage & Quotas"),
 					children: [/* @__PURE__ */ L("div", {
 						className: "grid gap-4 sm:grid-cols-2",
@@ -288,13 +288,13 @@ var B = () => {
 							label: h("devportal.apiCalls", "API Calls"),
 							used: parseInt(e.apiCallsUsed),
 							limit: e.apiCallsLimit,
-							percent: l,
+							percent: i,
 							format: "number"
 						}), /* @__PURE__ */ I(G, {
 							label: h("devportal.storage", "Storage"),
 							used: parseInt(e.storageUsed),
 							limit: parseInt(e.storageLimit),
-							percent: d,
+							percent: a,
 							format: "bytes"
 						})]
 					}), e.quotaResetAt && /* @__PURE__ */ L("p", {
@@ -310,9 +310,9 @@ var B = () => {
 		}), /* @__PURE__ */ L("div", {
 			className: "space-y-6",
 			children: [
-				/* @__PURE__ */ I(i, {
+				/* @__PURE__ */ I(s, {
 					title: h("devportal.revenueSummary", "Revenue Summary"),
-					children: /* @__PURE__ */ I(u, { items: [
+					children: /* @__PURE__ */ I(p, { items: [
 						{
 							label: h("devportal.totalRevenue", "Total Revenue"),
 							value: `$${e.totalRevenue.toLocaleString()}`
@@ -335,10 +335,10 @@ var B = () => {
 						}
 					] })
 				}),
-				/* @__PURE__ */ I(i, {
+				/* @__PURE__ */ I(s, {
 					title: h("devportal.teamMembers", "Team Members"),
 					actions: /* @__PURE__ */ I("button", {
-						onClick: () => f(`/organizations/${e.id}/members`),
+						onClick: () => o(`/organizations/${e.id}/members`),
 						className: "text-sm text-primary hover:underline",
 						children: h("devportal.manage", "Manage")
 					}),
@@ -356,7 +356,7 @@ var B = () => {
 									children: e.email
 								}), /* @__PURE__ */ I("p", {
 									className: "text-xs text-muted-foreground",
-									children: s[e.role]
+									children: u[e.role]
 								})] })]
 							})
 						}, e.id)), r.length > 3 && /* @__PURE__ */ L("p", {
@@ -370,7 +370,7 @@ var B = () => {
 						})]
 					})
 				}),
-				/* @__PURE__ */ I(i, {
+				/* @__PURE__ */ I(s, {
 					title: h("devportal.links", "Links"),
 					children: /* @__PURE__ */ L("div", {
 						className: "space-y-2",
@@ -413,7 +413,7 @@ var B = () => {
 			})]
 		}), e.length > 0 ? /* @__PURE__ */ I("div", {
 			className: "space-y-2",
-			children: e.map((e) => /* @__PURE__ */ I(c, {
+			children: e.map((e) => /* @__PURE__ */ I(d, {
 				app: e,
 				onClick: () => t(`/apps/${e.id}`)
 			}, e.id))
@@ -449,7 +449,7 @@ var B = () => {
 				className: "inline-flex items-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90 transition-colors",
 				children: [/* @__PURE__ */ I(k, { size: 16 }), a("devportal.inviteMember", "Invite Member")]
 			})]
-		}), /* @__PURE__ */ I(l, {
+		}), /* @__PURE__ */ I(f, {
 			data: e,
 			keyField: "id",
 			columns: [
@@ -472,7 +472,7 @@ var B = () => {
 					header: a("devportal.roleColumn", "Role"),
 					render: (e) => /* @__PURE__ */ I("span", {
 						className: t("inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium", e.role === "OWNER" ? "bg-accent-purple-subtle text-accent-purple" : e.role === "ADMIN" ? "bg-status-info-bg-subtle text-status-info-text" : e.role === "DEVELOPER" ? "bg-status-success-bg-subtle text-status-success-text" : "bg-bg-sunken text-text-primary"),
-						children: s[e.role]
+						children: u[e.role]
 					})
 				},
 				{
@@ -492,13 +492,13 @@ var B = () => {
 	let { t } = v(), n = (e, n) => {
 		let r = t(e);
 		return r === e ? n : r;
-	}, [r, a] = _("manual"), [o, s] = _(!1), [c, { loading: l }] = p({ onCompleted: () => s(!0) });
+	}, [r, i] = _("manual"), [o, c] = _(!1), [l, { loading: u }] = a({ onCompleted: () => c(!0) });
 	return /* @__PURE__ */ L("div", {
 		className: "space-y-6 max-w-2xl",
 		children: [
-			/* @__PURE__ */ I(i, {
+			/* @__PURE__ */ I(s, {
 				title: n("devportal.organizationDetails", "Organization Details"),
-				children: /* @__PURE__ */ I(u, { items: [
+				children: /* @__PURE__ */ I(p, { items: [
 					{
 						label: n("devportal.organizationId", "Organization ID"),
 						value: /* @__PURE__ */ I("code", {
@@ -528,9 +528,9 @@ var B = () => {
 					}
 				] })
 			}),
-			/* @__PURE__ */ I(i, {
+			/* @__PURE__ */ I(s, {
 				title: n("devportal.legalInformation", "Legal Information"),
-				children: /* @__PURE__ */ I(u, { items: [
+				children: /* @__PURE__ */ I(p, { items: [
 					{
 						label: n("devportal.legalEntityName", "Legal Entity Name"),
 						value: e.legalEntityName || n("devportal.notProvided", "Not provided")
@@ -564,9 +564,9 @@ var B = () => {
 					}
 				] })
 			}),
-			/* @__PURE__ */ L(i, {
+			/* @__PURE__ */ L(s, {
 				title: n("devportal.verificationStatus", "Verification Status"),
-				children: [/* @__PURE__ */ I(u, { items: [{
+				children: [/* @__PURE__ */ I(p, { items: [{
 					label: n("devportal.verifiedLabel", "Verified"),
 					value: e.isVerified ? /* @__PURE__ */ L("span", {
 						className: "text-status-success-text flex items-center gap-1",
@@ -608,20 +608,20 @@ var B = () => {
 								"manual"
 							].map((e) => /* @__PURE__ */ I("button", {
 								type: "button",
-								onClick: () => a(e),
+								onClick: () => i(e),
 								className: `rounded-md border px-3 py-1 text-xs font-medium transition-colors ${r === e ? "bg-primary text-primary-foreground border-primary" : "border-border hover:bg-muted"}`,
 								children: e === "domain" ? n("devportal.domainVerification", "Domain") : e === "document" ? n("devportal.documentVerification", "Document") : n("devportal.manualVerification", "Manual review")
 							}, e))
 						}),
 						/* @__PURE__ */ L("button", {
 							type: "button",
-							disabled: l,
-							onClick: () => c({ variables: {
+							disabled: u,
+							onClick: () => l({ variables: {
 								id: e.id,
 								method: r
 							} }),
 							className: "inline-flex items-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90 disabled:opacity-50",
-							children: [l ? /* @__PURE__ */ I(O, {
+							children: [u ? /* @__PURE__ */ I(O, {
 								size: 14,
 								className: "animate-spin"
 							}) : /* @__PURE__ */ I(j, { size: 14 }), n("devportal.requestVerification", "Request Verification")]