@burdenoff/microfe-devportal 2026.830.1 → 2026.830.2

package/dist/devportal/pages/OrganizationsPage.js

@@ -1,68 +1,65 @@
 import { useDevportal as e } from "../providers/DevportalProvider.js";
-import { EmptyState as t } from "../components/EmptyState.js";
-import { useGetMyOrganizationsQuery as n } from "../../generated/global-operations.js";
-import { getErrorMessage as r } from "../hooks/useGraphQL.js";
-import { PageLayout as i } from "../components/PageLayout.js";
-import { StatusBadge as a, VerifiedBadge as o } from "../components/StatusBadge.js";
-import { PermissionGuard as s } from "../components/PermissionGuard.js";
+import { useTr as t } from "../utils/i18n.js";
+import { EmptyState as n } from "../components/EmptyState.js";
+import { useGetMyOrganizationsQuery as r } from "../../generated/global-operations.js";
+import { getErrorMessage as i } from "../hooks/useGraphQL.js";
+import { PageLayout as a } from "../components/PageLayout.js";
+import { StatusBadge as o, VerifiedBadge as s } from "../components/StatusBadge.js";
+import { PermissionGuard as c } from "../components/PermissionGuard.js";
 import "../components/index.js";
 import "../hooks/index.js";
-import { useI18n as c } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 import { AlertCircle as l, AppWindow as u, Building2 as d, CheckCircle as f, DollarSign as p, Loader2 as m, Plus as h, Users as g } from "lucide-react";
 import { jsx as _, jsxs as v } from "react/jsx-runtime";
 import { EmphasisPanel as y, GlassCard as b } from "@burdenoff/fe-libs/ui";
 //#region src/devportal/pages/OrganizationsPage.tsx
 var x = () => {
-	let { navigate: a, basePath: o } = e(), { t: u } = c(), d = (e, t) => {
-		let n = u(e);
-		return n === e ? t : n;
-	}, { data: f, loading: p, error: g, refetch: x } = n({ fetchPolicy: "cache-and-network" }), C = f?.myDeveloperOrganizations ?? [], w = (e) => {
-		a?.(`${o}${e}`);
+	let { navigate: o, basePath: s } = e(), u = t(), { data: d, loading: f, error: p, refetch: g } = r({ fetchPolicy: "cache-and-network" }), x = d?.myDeveloperOrganizations ?? [], C = (e) => {
+		o?.(`${s}${e}`);
 	};
-	return p && !f ? /* @__PURE__ */ _(i, {
-		title: d("devportal.developerOrganizations", "Developer Organizations"),
-		description: d("devportal.manageYourDevTeams", "Manage your development teams"),
+	return f && !d ? /* @__PURE__ */ _(a, {
+		title: u("devportal.developerOrganizations", "Developer Organizations"),
+		description: u("devportal.manageYourDevTeams", "Manage your development teams"),
 		children: /* @__PURE__ */ v("div", {
 			className: "flex items-center justify-center py-12",
 			children: [/* @__PURE__ */ _(m, { className: "h-8 w-8 animate-spin text-text-secondary" }), /* @__PURE__ */ _("span", {
 				className: "ml-2 text-text-secondary",
-				children: d("devportal.loadingOrganizations", "Loading organizations...")
+				children: u("devportal.loadingOrganizations", "Loading organizations...")
 			})]
 		})
-	}) : g ? /* @__PURE__ */ _(i, {
-		title: d("devportal.developerOrganizations", "Developer Organizations"),
-		description: d("devportal.manageYourDevTeams", "Manage your development teams"),
+	}) : p ? /* @__PURE__ */ _(a, {
+		title: u("devportal.developerOrganizations", "Developer Organizations"),
+		description: u("devportal.manageYourDevTeams", "Manage your development teams"),
 		children: /* @__PURE__ */ v("div", {
 			className: "rounded-lg border border-status-error-border/50 bg-status-error-bg/10 p-6 text-center",
 			children: [
 				/* @__PURE__ */ _(l, { className: "mx-auto h-8 w-8 text-status-error-text" }),
 				/* @__PURE__ */ _("h3", {
 					className: "mt-2 font-medium text-status-error-text",
-					children: d("devportal.failedToLoadOrganizations", "Failed to load organizations")
+					children: u("devportal.failedToLoadOrganizations", "Failed to load organizations")
 				}),
 				/* @__PURE__ */ _("p", {
 					className: "mt-1 text-sm text-text-secondary",
-					children: r(g)
+					children: i(p)
 				}),
 				/* @__PURE__ */ _("button", {
-					onClick: () => x(),
+					onClick: () => g(),
 					className: "mt-4 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90",
-					children: d("devportal.tryAgain", "Try Again")
+					children: u("devportal.tryAgain", "Try Again")
 				})
 			]
 		})
-	}) : /* @__PURE__ */ _(s, {
+	}) : /* @__PURE__ */ _(c, {
 		authOnly: !0,
-		children: /* @__PURE__ */ v(i, {
-			title: d("devportal.developerOrganizations", "Developer Organizations"),
-			description: d("devportal.manageYourDevTeams", "Manage your development teams"),
-			purpose: d("devportal.organizationsPurpose", "An organization is the team that owns your apps, members, and revenue. Create one so collaborators can share access to the same applications, billing, and store presence instead of working in isolation."),
+		children: /* @__PURE__ */ v(a, {
+			title: u("devportal.developerOrganizations", "Developer Organizations"),
+			description: u("devportal.manageYourDevTeams", "Manage your development teams"),
+			purpose: u("devportal.organizationsPurpose", "An organization is the team that owns your apps, members, and revenue. Create one so collaborators can share access to the same applications, billing, and store presence instead of working in isolation."),
 			actions: /* @__PURE__ */ v("button", {
-				onClick: () => w("/organizations/new"),
+				onClick: () => C("/organizations/new"),
 				className: "inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 transition-colors",
-				children: [/* @__PURE__ */ _(h, { size: 16 }), d("devportal.createOrganization", "Create Organization")]
+				children: [/* @__PURE__ */ _(h, { size: 16 }), u("devportal.createOrganization", "Create Organization")]
 			}),
-			children: [C.length > 0 && /* @__PURE__ */ _(y, {
+			children: [x.length > 0 && /* @__PURE__ */ _(y, {
 				className: "mb-6",
 				children: /* @__PURE__ */ v("div", {
 					className: "grid grid-cols-2 gap-4 sm:grid-cols-3",
@@ -72,10 +69,10 @@ var x = () => {
 							className: "p-4",
 							children: [/* @__PURE__ */ _("p", {
 								className: "text-sm text-text-secondary",
-								children: d("devportal.organizations", "Organizations")
+								children: u("devportal.organizations", "Organizations")
 							}), /* @__PURE__ */ _("p", {
 								className: "mt-1 text-2xl font-semibold tabular-nums",
-								children: C.length
+								children: x.length
 							})]
 						}),
 						/* @__PURE__ */ v(b, {
@@ -83,10 +80,10 @@ var x = () => {
 							className: "p-4",
 							children: [/* @__PURE__ */ _("p", {
 								className: "text-sm text-text-secondary",
-								children: d("devportal.totalApps", "Total Apps")
+								children: u("devportal.totalApps", "Total Apps")
 							}), /* @__PURE__ */ _("p", {
 								className: "mt-1 text-2xl font-semibold tabular-nums",
-								children: C.reduce((e, t) => e + (t.totalApps ?? 0), 0)
+								children: x.reduce((e, t) => e + (t.totalApps ?? 0), 0)
 							})]
 						}),
 						/* @__PURE__ */ v(b, {
@@ -94,146 +91,158 @@ var x = () => {
 							className: "p-4",
 							children: [/* @__PURE__ */ _("p", {
 								className: "text-sm text-text-secondary",
-								children: d("devportal.activeInstalls", "Active Installs")
+								children: u("devportal.activeInstalls", "Active Installs")
 							}), /* @__PURE__ */ _("p", {
 								className: "mt-1 text-2xl font-semibold tabular-nums",
-								children: C.reduce((e, t) => e + (t.activeInstalls ?? 0), 0).toLocaleString()
+								children: x.reduce((e, t) => e + (t.activeInstalls ?? 0), 0).toLocaleString()
 							})]
 						})
 					]
 				})
-			}), C.length > 0 ? /* @__PURE__ */ _("div", {
+			}), x.length > 0 ? /* @__PURE__ */ _("div", {
 				className: "grid gap-6",
-				children: C.map((e) => /* @__PURE__ */ _(S, {
+				children: x.map((e) => /* @__PURE__ */ _(S, {
 					org: e,
-					onClick: () => w(`/organizations/${e.id}`)
+					onClick: () => C(`/organizations/${e.id}`)
 				}, e.id))
-			}) : /* @__PURE__ */ _(t, {
+			}) : /* @__PURE__ */ _(n, {
 				illustration: "empty-people",
-				title: d("devportal.noOrganizationsYet", "No organizations yet"),
-				description: d("devportal.createOrgToCollaborate", "Create an organization to collaborate with your team and manage apps together"),
+				title: u("devportal.noOrganizationsYet", "No organizations yet"),
+				description: u("devportal.createOrgToCollaborate", "Create an organization to collaborate with your team and manage apps together"),
 				action: /* @__PURE__ */ v("button", {
-					onClick: () => w("/organizations/new"),
+					onClick: () => C("/organizations/new"),
 					className: "inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90",
-					children: [/* @__PURE__ */ _(h, { size: 16 }), d("devportal.createOrganization", "Create Organization")]
+					children: [/* @__PURE__ */ _(h, { size: 16 }), u("devportal.createOrganization", "Create Organization")]
 				})
 			})]
 		})
 	});
-}, S = ({ org: e, onClick: t }) => /* @__PURE__ */ v("div", {
-	role: "button",
-	tabIndex: 0,
-	onClick: t,
-	onKeyDown: (e) => {
-		(e.key === "Enter" || e.key === " ") && (e.preventDefault(), t());
-	},
-	className: "cursor-pointer rounded-card border border-border-seam bg-bg-surface p-6 shadow-[var(--shadow-pop)] transition-[box-shadow,border-color] hover:shadow-[var(--shadow-pop-hover)] hover:border-border-strong focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-	children: [/* @__PURE__ */ v("div", {
-		className: "flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between",
+}, S = ({ org: e, onClick: n }) => {
+	let r = t();
+	return /* @__PURE__ */ v("div", {
+		role: "button",
+		tabIndex: 0,
+		onClick: n,
+		onKeyDown: (e) => {
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), n());
+		},
+		className: "cursor-pointer rounded-card border border-border-seam bg-bg-surface p-6 shadow-[var(--shadow-pop)] transition-[box-shadow,border-color] hover:shadow-[var(--shadow-pop-hover)] hover:border-border-strong focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
 		children: [/* @__PURE__ */ v("div", {
-			className: "flex items-start gap-4",
-			children: [e.logoUrl ? /* @__PURE__ */ _("img", {
-				src: e.logoUrl,
-				alt: e.name,
-				className: "h-16 w-16 rounded-lg object-cover"
-			}) : /* @__PURE__ */ _("div", {
-				className: "flex h-16 w-16 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary",
-				children: /* @__PURE__ */ _(d, { size: 32 })
-			}), /* @__PURE__ */ v("div", { children: [
-				/* @__PURE__ */ v("div", {
-					className: "flex items-center gap-2 flex-wrap",
-					children: [
-						/* @__PURE__ */ _("h3", {
-							className: "text-lg font-semibold",
-							children: e.name
-						}),
-						e.isVerified && /* @__PURE__ */ _(o, { verified: !0 }),
-						e.isCertified && /* @__PURE__ */ v("span", {
-							className: "inline-flex items-center gap-1 rounded-full bg-status-info-bg-subtle px-2 py-0.5 text-xs font-medium text-status-info-text",
-							children: [/* @__PURE__ */ _(f, { size: 12 }), " Certified"]
-						})
-					]
-				}),
-				e.description && /* @__PURE__ */ _("p", {
-					className: "mt-1 text-sm text-text-secondary",
-					children: e.description
-				}),
-				/* @__PURE__ */ v("div", {
-					className: "mt-2 flex flex-wrap items-center gap-2",
-					children: [/* @__PURE__ */ _(a, {
-						status: e.tier,
-						type: "tier"
-					}), e.partnerTier && /* @__PURE__ */ _(a, {
-						status: e.partnerTier,
-						type: "partner"
-					})]
-				})
-			] })]
+			className: "flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between",
+			children: [/* @__PURE__ */ v("div", {
+				className: "flex items-start gap-4",
+				children: [e.logoUrl ? /* @__PURE__ */ _("img", {
+					src: e.logoUrl,
+					alt: e.name,
+					className: "h-16 w-16 rounded-lg object-cover"
+				}) : /* @__PURE__ */ _("div", {
+					className: "flex h-16 w-16 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary",
+					children: /* @__PURE__ */ _(d, { size: 32 })
+				}), /* @__PURE__ */ v("div", { children: [
+					/* @__PURE__ */ v("div", {
+						className: "flex items-center gap-2 flex-wrap",
+						children: [
+							/* @__PURE__ */ _("h3", {
+								className: "text-lg font-semibold",
+								children: e.name
+							}),
+							e.isVerified && /* @__PURE__ */ _(s, { verified: !0 }),
+							e.isCertified && /* @__PURE__ */ v("span", {
+								className: "inline-flex items-center gap-1 rounded-full bg-status-info-bg-subtle px-2 py-0.5 text-xs font-medium text-status-info-text",
+								children: [
+									/* @__PURE__ */ _(f, { size: 12 }),
+									" ",
+									r("devportal.certified", "Certified")
+								]
+							})
+						]
+					}),
+					e.description && /* @__PURE__ */ _("p", {
+						className: "mt-1 text-sm text-text-secondary",
+						children: e.description
+					}),
+					/* @__PURE__ */ v("div", {
+						className: "mt-2 flex flex-wrap items-center gap-2",
+						children: [/* @__PURE__ */ _(o, {
+							status: e.tier,
+							type: "tier"
+						}), e.partnerTier && /* @__PURE__ */ _(o, {
+							status: e.partnerTier,
+							type: "partner"
+						})]
+					})
+				] })]
+			}), /* @__PURE__ */ v("div", {
+				className: "flex flex-wrap gap-6 text-sm",
+				children: [
+					/* @__PURE__ */ v("div", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ _(g, {
+							size: 16,
+							className: "text-text-secondary"
+						}), /* @__PURE__ */ v("span", { children: [
+							e.members?.length || 0,
+							" ",
+							r("devportal.membersLower", "members")
+						] })]
+					}),
+					/* @__PURE__ */ v("div", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ _(u, {
+							size: 16,
+							className: "text-text-secondary"
+						}), /* @__PURE__ */ v("span", { children: [
+							e.publishedApps,
+							" / ",
+							e.totalApps,
+							" ",
+							r("devportal.appsLower", "apps")
+						] })]
+					}),
+					/* @__PURE__ */ v("div", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ _(p, {
+							size: 16,
+							className: "text-text-secondary"
+						}), /* @__PURE__ */ v("span", { children: ["$", (e.totalRevenue || 0).toLocaleString()] })]
+					})
+				]
+			})]
 		}), /* @__PURE__ */ v("div", {
-			className: "flex flex-wrap gap-6 text-sm",
+			className: "mt-4 grid grid-cols-2 gap-4 rounded-lg bg-bg-sunken/50 p-4 sm:grid-cols-4",
 			children: [
-				/* @__PURE__ */ v("div", {
-					className: "flex items-center gap-2",
-					children: [/* @__PURE__ */ _(g, {
-						size: 16,
-						className: "text-text-secondary"
-					}), /* @__PURE__ */ v("span", { children: [e.members?.length || 0, " members"] })]
-				}),
-				/* @__PURE__ */ v("div", {
-					className: "flex items-center gap-2",
-					children: [/* @__PURE__ */ _(u, {
-						size: 16,
-						className: "text-text-secondary"
-					}), /* @__PURE__ */ v("span", { children: [
-						e.publishedApps,
-						" / ",
-						e.totalApps,
-						" apps"
-					] })]
-				}),
-				/* @__PURE__ */ v("div", {
-					className: "flex items-center gap-2",
-					children: [/* @__PURE__ */ _(p, {
-						size: 16,
-						className: "text-text-secondary"
-					}), /* @__PURE__ */ v("span", { children: ["$", (e.totalRevenue || 0).toLocaleString()] })]
-				})
+				/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
+					className: "text-xs text-text-secondary",
+					children: r("devportal.totalInstalls", "Total Installs")
+				}), /* @__PURE__ */ _("p", {
+					className: "text-lg font-semibold",
+					children: (e.totalInstalls || 0).toLocaleString()
+				})] }),
+				/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
+					className: "text-xs text-text-secondary",
+					children: r("devportal.activeInstalls", "Active Installs")
+				}), /* @__PURE__ */ _("p", {
+					className: "text-lg font-semibold",
+					children: (e.activeInstalls || 0).toLocaleString()
+				})] }),
+				/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
+					className: "text-xs text-text-secondary",
+					children: r("devportal.apiCalls", "API Calls")
+				}), /* @__PURE__ */ _("p", {
+					className: "text-lg font-semibold",
+					children: e.totalApiCalls ? `${(parseInt(e.totalApiCalls) / 1e6).toFixed(1)}M` : "0"
+				})] }),
+				/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
+					className: "text-xs text-text-secondary",
+					children: r("devportal.avgRating", "Avg Rating")
+				}), /* @__PURE__ */ _("p", {
+					className: "text-lg font-semibold",
+					children: e.averageRating ? `${e.averageRating.toFixed(1)} ★` : r("devportal.notAvailable", "N/A")
+				})] })
 			]
 		})]
-	}), /* @__PURE__ */ v("div", {
-		className: "mt-4 grid grid-cols-2 gap-4 rounded-lg bg-bg-sunken/50 p-4 sm:grid-cols-4",
-		children: [
-			/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
-				className: "text-xs text-text-secondary",
-				children: "Total Installs"
-			}), /* @__PURE__ */ _("p", {
-				className: "text-lg font-semibold",
-				children: (e.totalInstalls || 0).toLocaleString()
-			})] }),
-			/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
-				className: "text-xs text-text-secondary",
-				children: "Active Installs"
-			}), /* @__PURE__ */ _("p", {
-				className: "text-lg font-semibold",
-				children: (e.activeInstalls || 0).toLocaleString()
-			})] }),
-			/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
-				className: "text-xs text-text-secondary",
-				children: "API Calls"
-			}), /* @__PURE__ */ _("p", {
-				className: "text-lg font-semibold",
-				children: e.totalApiCalls ? `${(parseInt(e.totalApiCalls) / 1e6).toFixed(1)}M` : "0"
-			})] }),
-			/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
-				className: "text-xs text-text-secondary",
-				children: "Avg Rating"
-			}), /* @__PURE__ */ _("p", {
-				className: "text-lg font-semibold",
-				children: e.averageRating ? `${e.averageRating.toFixed(1)} ★` : "N/A"
-			})] })
-		]
-	})]
-});
+	});
+};
 //#endregion
 export { x as OrganizationsPage };
 

package/dist/devportal/pages/OrganizationsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"OrganizationsPage.js","names":[],"sources":["../../../src/devportal/pages/OrganizationsPage.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport {\n  Plus,\n  Building2,\n  Users,\n  AppWindow,\n  DollarSign,\n  CheckCircle,\n  AlertCircle,\n  Loader2,\n} from \"lucide-react\";\nimport { EmphasisPanel, GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport { PageLayout } from \"../components/PageLayout\";\nimport { EmptyState } from \"../components/EmptyState\";\nimport { StatusBadge, VerifiedBadge } from \"../components/StatusBadge\";\nimport { useDevportal } from \"../providers/DevportalProvider\";\nimport { PermissionGuard } from \"../components\";\nimport type { DeveloperOrganization } from \"../types\";\nimport {\n  useGetMyOrganizationsQuery,\n  getErrorMessage,\n  type OrganizationFieldsFragment,\n} from \"../hooks\";\n\n/**\n * Organizations listing page\n *\n * Displays all developer organizations the current user is a member of.\n * Uses GraphQL to fetch real data from the DevPortal backend.\n */\nexport const OrganizationsPage: FC = () => {\n  const { navigate, basePath } = useDevportal();\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n\n  // Fetch organizations from GraphQL API\n  const { data, loading, error, refetch } = useGetMyOrganizationsQuery({\n    fetchPolicy: \"cache-and-network\",\n  });\n\n  const organizations = data?.myDeveloperOrganizations ?? [];\n\n  const handleNavigate = (path: string) => {\n    navigate?.(`${basePath}${path}`);\n  };\n\n  // Loading state\n  if (loading && !data) {\n    return (\n      <PageLayout\n        title={tr(\n          \"devportal.developerOrganizations\",\n          \"Developer Organizations\",\n        )}\n        description={tr(\n          \"devportal.manageYourDevTeams\",\n          \"Manage your development teams\",\n        )}\n      >\n        <div className=\"flex items-center justify-center py-12\">\n          <Loader2 className=\"h-8 w-8 animate-spin text-text-secondary\" />\n          <span className=\"ml-2 text-text-secondary\">\n            {tr(\"devportal.loadingOrganizations\", \"Loading organizations...\")}\n          </span>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  // Error state\n  if (error) {\n    return (\n      <PageLayout\n        title={tr(\n          \"devportal.developerOrganizations\",\n          \"Developer Organizations\",\n        )}\n        description={tr(\n          \"devportal.manageYourDevTeams\",\n          \"Manage your development teams\",\n        )}\n      >\n        <div className=\"rounded-lg border border-status-error-border/50 bg-status-error-bg/10 p-6 text-center\">\n          <AlertCircle className=\"mx-auto h-8 w-8 text-status-error-text\" />\n          <h3 className=\"mt-2 font-medium text-status-error-text\">\n            {tr(\n              \"devportal.failedToLoadOrganizations\",\n              \"Failed to load organizations\",\n            )}\n          </h3>\n          <p className=\"mt-1 text-sm text-text-secondary\">\n            {getErrorMessage(error)}\n          </p>\n          <button\n            onClick={() => refetch()}\n            className=\"mt-4 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n          >\n            {tr(\"devportal.tryAgain\", \"Try Again\")}\n          </button>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PermissionGuard authOnly>\n      <PageLayout\n        title={tr(\n          \"devportal.developerOrganizations\",\n          \"Developer Organizations\",\n        )}\n        description={tr(\n          \"devportal.manageYourDevTeams\",\n          \"Manage your development teams\",\n        )}\n        purpose={tr(\n          \"devportal.organizationsPurpose\",\n          \"An organization is the team that owns your apps, members, and revenue. Create one so collaborators can share access to the same applications, billing, and store presence instead of working in isolation.\",\n        )}\n        actions={\n          <button\n            onClick={() => handleNavigate(\"/organizations/new\")}\n            className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 transition-colors\"\n          >\n            <Plus size={16} />\n            {tr(\"devportal.createOrganization\", \"Create Organization\")}\n          </button>\n        }\n      >\n        {organizations.length > 0 && (\n          <EmphasisPanel className=\"mb-6\">\n            <div className=\"grid grid-cols-2 gap-4 sm:grid-cols-3\">\n              <GlassCard treatment=\"metric\" className=\"p-4\">\n                <p className=\"text-sm text-text-secondary\">\n                  {tr(\"devportal.organizations\", \"Organizations\")}\n                </p>\n                <p className=\"mt-1 text-2xl font-semibold tabular-nums\">\n                  {organizations.length}\n                </p>\n              </GlassCard>\n              <GlassCard treatment=\"metric\" className=\"p-4\">\n                <p className=\"text-sm text-text-secondary\">\n                  {tr(\"devportal.totalApps\", \"Total Apps\")}\n                </p>\n                <p className=\"mt-1 text-2xl font-semibold tabular-nums\">\n                  {organizations.reduce(\n                    (acc: number, org: OrganizationFieldsFragment) =>\n                      acc + (org.totalApps ?? 0),\n                    0,\n                  )}\n                </p>\n              </GlassCard>\n              <GlassCard treatment=\"metric\" className=\"p-4\">\n                <p className=\"text-sm text-text-secondary\">\n                  {tr(\"devportal.activeInstalls\", \"Active Installs\")}\n                </p>\n                <p className=\"mt-1 text-2xl font-semibold tabular-nums\">\n                  {organizations\n                    .reduce(\n                      (acc: number, org: OrganizationFieldsFragment) =>\n                        acc + (org.activeInstalls ?? 0),\n                      0,\n                    )\n                    .toLocaleString()}\n                </p>\n              </GlassCard>\n            </div>\n          </EmphasisPanel>\n        )}\n        {organizations.length > 0 ? (\n          <div className=\"grid gap-6\">\n            {organizations.map((org: OrganizationFieldsFragment) => (\n              <OrganizationCard\n                key={org.id}\n                org={org as DeveloperOrganization}\n                onClick={() => handleNavigate(`/organizations/${org.id}`)}\n              />\n            ))}\n          </div>\n        ) : (\n          <EmptyState\n            illustration=\"empty-people\"\n            title={tr(\"devportal.noOrganizationsYet\", \"No organizations yet\")}\n            description={tr(\n              \"devportal.createOrgToCollaborate\",\n              \"Create an organization to collaborate with your team and manage apps together\",\n            )}\n            action={\n              <button\n                onClick={() => handleNavigate(\"/organizations/new\")}\n                className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n              >\n                <Plus size={16} />\n                {tr(\"devportal.createOrganization\", \"Create Organization\")}\n              </button>\n            }\n          />\n        )}\n      </PageLayout>\n    </PermissionGuard>\n  );\n};\n\n// Organization card component\nconst OrganizationCard: FC<{\n  org: DeveloperOrganization;\n  onClick: () => void;\n}> = ({ org, onClick }) => {\n  return (\n    <div\n      role=\"button\"\n      tabIndex={0}\n      onClick={onClick}\n      onKeyDown={(event) => {\n        if (event.key === \"Enter\" || event.key === \" \") {\n          event.preventDefault();\n          onClick();\n        }\n      }}\n      className=\"cursor-pointer rounded-card border border-border-seam bg-bg-surface p-6 shadow-[var(--shadow-pop)] transition-[box-shadow,border-color] hover:shadow-[var(--shadow-pop-hover)] hover:border-border-strong focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n    >\n      <div className=\"flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\">\n        {/* Left side - Info */}\n        <div className=\"flex items-start gap-4\">\n          {org.logoUrl ? (\n            <img\n              src={org.logoUrl}\n              alt={org.name}\n              className=\"h-16 w-16 rounded-lg object-cover\"\n            />\n          ) : (\n            <div className=\"flex h-16 w-16 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary\">\n              <Building2 size={32} />\n            </div>\n          )}\n          <div>\n            <div className=\"flex items-center gap-2 flex-wrap\">\n              <h3 className=\"text-lg font-semibold\">{org.name}</h3>\n              {org.isVerified && <VerifiedBadge verified />}\n              {org.isCertified && (\n                <span className=\"inline-flex items-center gap-1 rounded-full bg-status-info-bg-subtle px-2 py-0.5 text-xs font-medium text-status-info-text\">\n                  <CheckCircle size={12} /> Certified\n                </span>\n              )}\n            </div>\n            {org.description && (\n              <p className=\"mt-1 text-sm text-text-secondary\">\n                {org.description}\n              </p>\n            )}\n            <div className=\"mt-2 flex flex-wrap items-center gap-2\">\n              <StatusBadge status={org.tier} type=\"tier\" />\n              {org.partnerTier && (\n                <StatusBadge status={org.partnerTier} type=\"partner\" />\n              )}\n            </div>\n          </div>\n        </div>\n\n        {/* Right side - Stats */}\n        <div className=\"flex flex-wrap gap-6 text-sm\">\n          <div className=\"flex items-center gap-2\">\n            <Users size={16} className=\"text-text-secondary\" />\n            <span>{org.members?.length || 0} members</span>\n          </div>\n          <div className=\"flex items-center gap-2\">\n            <AppWindow size={16} className=\"text-text-secondary\" />\n            <span>\n              {org.publishedApps} / {org.totalApps} apps\n            </span>\n          </div>\n          <div className=\"flex items-center gap-2\">\n            <DollarSign size={16} className=\"text-text-secondary\" />\n            <span>${(org.totalRevenue || 0).toLocaleString()}</span>\n          </div>\n        </div>\n      </div>\n\n      {/* Stats bar */}\n      <div className=\"mt-4 grid grid-cols-2 gap-4 rounded-lg bg-bg-sunken/50 p-4 sm:grid-cols-4\">\n        <div>\n          <p className=\"text-xs text-text-secondary\">Total Installs</p>\n          <p className=\"text-lg font-semibold\">\n            {(org.totalInstalls || 0).toLocaleString()}\n          </p>\n        </div>\n        <div>\n          <p className=\"text-xs text-text-secondary\">Active Installs</p>\n          <p className=\"text-lg font-semibold\">\n            {(org.activeInstalls || 0).toLocaleString()}\n          </p>\n        </div>\n        <div>\n          <p className=\"text-xs text-text-secondary\">API Calls</p>\n          <p className=\"text-lg font-semibold\">\n            {org.totalApiCalls\n              ? `${(parseInt(org.totalApiCalls) / 1000000).toFixed(1)}M`\n              : \"0\"}\n          </p>\n        </div>\n        <div>\n          <p className=\"text-xs text-text-secondary\">Avg Rating</p>\n          <p className=\"text-lg font-semibold\">\n            {org.averageRating ? `${org.averageRating.toFixed(1)} ★` : \"N/A\"}\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"OrganizationsPage.js","names":[],"sources":["../../../src/devportal/pages/OrganizationsPage.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport {\n  Plus,\n  Building2,\n  Users,\n  AppWindow,\n  DollarSign,\n  CheckCircle,\n  AlertCircle,\n  Loader2,\n} from \"lucide-react\";\nimport { EmphasisPanel, GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport { PageLayout } from \"../components/PageLayout\";\nimport { EmptyState } from \"../components/EmptyState\";\nimport { StatusBadge, VerifiedBadge } from \"../components/StatusBadge\";\nimport { useDevportal } from \"../providers/DevportalProvider\";\nimport { PermissionGuard } from \"../components\";\nimport { useTr } from \"../utils/i18n\";\nimport type { DeveloperOrganization } from \"../types\";\nimport {\n  useGetMyOrganizationsQuery,\n  getErrorMessage,\n  type OrganizationFieldsFragment,\n} from \"../hooks\";\n\n/**\n * Organizations listing page\n *\n * Displays all developer organizations the current user is a member of.\n * Uses GraphQL to fetch real data from the DevPortal backend.\n */\nexport const OrganizationsPage: FC = () => {\n  const { navigate, basePath } = useDevportal();\n  const tr = useTr();\n\n  // Fetch organizations from GraphQL API\n  const { data, loading, error, refetch } = useGetMyOrganizationsQuery({\n    fetchPolicy: \"cache-and-network\",\n  });\n\n  const organizations = data?.myDeveloperOrganizations ?? [];\n\n  const handleNavigate = (path: string) => {\n    navigate?.(`${basePath}${path}`);\n  };\n\n  // Loading state\n  if (loading && !data) {\n    return (\n      <PageLayout\n        title={tr(\n          \"devportal.developerOrganizations\",\n          \"Developer Organizations\",\n        )}\n        description={tr(\n          \"devportal.manageYourDevTeams\",\n          \"Manage your development teams\",\n        )}\n      >\n        <div className=\"flex items-center justify-center py-12\">\n          <Loader2 className=\"h-8 w-8 animate-spin text-text-secondary\" />\n          <span className=\"ml-2 text-text-secondary\">\n            {tr(\"devportal.loadingOrganizations\", \"Loading organizations...\")}\n          </span>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  // Error state\n  if (error) {\n    return (\n      <PageLayout\n        title={tr(\n          \"devportal.developerOrganizations\",\n          \"Developer Organizations\",\n        )}\n        description={tr(\n          \"devportal.manageYourDevTeams\",\n          \"Manage your development teams\",\n        )}\n      >\n        <div className=\"rounded-lg border border-status-error-border/50 bg-status-error-bg/10 p-6 text-center\">\n          <AlertCircle className=\"mx-auto h-8 w-8 text-status-error-text\" />\n          <h3 className=\"mt-2 font-medium text-status-error-text\">\n            {tr(\n              \"devportal.failedToLoadOrganizations\",\n              \"Failed to load organizations\",\n            )}\n          </h3>\n          <p className=\"mt-1 text-sm text-text-secondary\">\n            {getErrorMessage(error)}\n          </p>\n          <button\n            onClick={() => refetch()}\n            className=\"mt-4 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n          >\n            {tr(\"devportal.tryAgain\", \"Try Again\")}\n          </button>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PermissionGuard authOnly>\n      <PageLayout\n        title={tr(\n          \"devportal.developerOrganizations\",\n          \"Developer Organizations\",\n        )}\n        description={tr(\n          \"devportal.manageYourDevTeams\",\n          \"Manage your development teams\",\n        )}\n        purpose={tr(\n          \"devportal.organizationsPurpose\",\n          \"An organization is the team that owns your apps, members, and revenue. Create one so collaborators can share access to the same applications, billing, and store presence instead of working in isolation.\",\n        )}\n        actions={\n          <button\n            onClick={() => handleNavigate(\"/organizations/new\")}\n            className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 transition-colors\"\n          >\n            <Plus size={16} />\n            {tr(\"devportal.createOrganization\", \"Create Organization\")}\n          </button>\n        }\n      >\n        {organizations.length > 0 && (\n          <EmphasisPanel className=\"mb-6\">\n            <div className=\"grid grid-cols-2 gap-4 sm:grid-cols-3\">\n              <GlassCard treatment=\"metric\" className=\"p-4\">\n                <p className=\"text-sm text-text-secondary\">\n                  {tr(\"devportal.organizations\", \"Organizations\")}\n                </p>\n                <p className=\"mt-1 text-2xl font-semibold tabular-nums\">\n                  {organizations.length}\n                </p>\n              </GlassCard>\n              <GlassCard treatment=\"metric\" className=\"p-4\">\n                <p className=\"text-sm text-text-secondary\">\n                  {tr(\"devportal.totalApps\", \"Total Apps\")}\n                </p>\n                <p className=\"mt-1 text-2xl font-semibold tabular-nums\">\n                  {organizations.reduce(\n                    (acc: number, org: OrganizationFieldsFragment) =>\n                      acc + (org.totalApps ?? 0),\n                    0,\n                  )}\n                </p>\n              </GlassCard>\n              <GlassCard treatment=\"metric\" className=\"p-4\">\n                <p className=\"text-sm text-text-secondary\">\n                  {tr(\"devportal.activeInstalls\", \"Active Installs\")}\n                </p>\n                <p className=\"mt-1 text-2xl font-semibold tabular-nums\">\n                  {organizations\n                    .reduce(\n                      (acc: number, org: OrganizationFieldsFragment) =>\n                        acc + (org.activeInstalls ?? 0),\n                      0,\n                    )\n                    .toLocaleString()}\n                </p>\n              </GlassCard>\n            </div>\n          </EmphasisPanel>\n        )}\n        {organizations.length > 0 ? (\n          <div className=\"grid gap-6\">\n            {organizations.map((org: OrganizationFieldsFragment) => (\n              <OrganizationCard\n                key={org.id}\n                org={org as DeveloperOrganization}\n                onClick={() => handleNavigate(`/organizations/${org.id}`)}\n              />\n            ))}\n          </div>\n        ) : (\n          <EmptyState\n            illustration=\"empty-people\"\n            title={tr(\"devportal.noOrganizationsYet\", \"No organizations yet\")}\n            description={tr(\n              \"devportal.createOrgToCollaborate\",\n              \"Create an organization to collaborate with your team and manage apps together\",\n            )}\n            action={\n              <button\n                onClick={() => handleNavigate(\"/organizations/new\")}\n                className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n              >\n                <Plus size={16} />\n                {tr(\"devportal.createOrganization\", \"Create Organization\")}\n              </button>\n            }\n          />\n        )}\n      </PageLayout>\n    </PermissionGuard>\n  );\n};\n\n// Organization card component\nconst OrganizationCard: FC<{\n  org: DeveloperOrganization;\n  onClick: () => void;\n}> = ({ org, onClick }) => {\n  const tr = useTr();\n  return (\n    <div\n      role=\"button\"\n      tabIndex={0}\n      onClick={onClick}\n      onKeyDown={(event) => {\n        if (event.key === \"Enter\" || event.key === \" \") {\n          event.preventDefault();\n          onClick();\n        }\n      }}\n      className=\"cursor-pointer rounded-card border border-border-seam bg-bg-surface p-6 shadow-[var(--shadow-pop)] transition-[box-shadow,border-color] hover:shadow-[var(--shadow-pop-hover)] hover:border-border-strong focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n    >\n      <div className=\"flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\">\n        {/* Left side - Info */}\n        <div className=\"flex items-start gap-4\">\n          {org.logoUrl ? (\n            <img\n              src={org.logoUrl}\n              alt={org.name}\n              className=\"h-16 w-16 rounded-lg object-cover\"\n            />\n          ) : (\n            <div className=\"flex h-16 w-16 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary\">\n              <Building2 size={32} />\n            </div>\n          )}\n          <div>\n            <div className=\"flex items-center gap-2 flex-wrap\">\n              <h3 className=\"text-lg font-semibold\">{org.name}</h3>\n              {org.isVerified && <VerifiedBadge verified />}\n              {org.isCertified && (\n                <span className=\"inline-flex items-center gap-1 rounded-full bg-status-info-bg-subtle px-2 py-0.5 text-xs font-medium text-status-info-text\">\n                  <CheckCircle size={12} />{\" \"}\n                  {tr(\"devportal.certified\", \"Certified\")}\n                </span>\n              )}\n            </div>\n            {org.description && (\n              <p className=\"mt-1 text-sm text-text-secondary\">\n                {org.description}\n              </p>\n            )}\n            <div className=\"mt-2 flex flex-wrap items-center gap-2\">\n              <StatusBadge status={org.tier} type=\"tier\" />\n              {org.partnerTier && (\n                <StatusBadge status={org.partnerTier} type=\"partner\" />\n              )}\n            </div>\n          </div>\n        </div>\n\n        {/* Right side - Stats */}\n        <div className=\"flex flex-wrap gap-6 text-sm\">\n          <div className=\"flex items-center gap-2\">\n            <Users size={16} className=\"text-text-secondary\" />\n            <span>\n              {org.members?.length || 0}{\" \"}\n              {tr(\"devportal.membersLower\", \"members\")}\n            </span>\n          </div>\n          <div className=\"flex items-center gap-2\">\n            <AppWindow size={16} className=\"text-text-secondary\" />\n            <span>\n              {org.publishedApps} / {org.totalApps}{\" \"}\n              {tr(\"devportal.appsLower\", \"apps\")}\n            </span>\n          </div>\n          <div className=\"flex items-center gap-2\">\n            <DollarSign size={16} className=\"text-text-secondary\" />\n            <span>${(org.totalRevenue || 0).toLocaleString()}</span>\n          </div>\n        </div>\n      </div>\n\n      {/* Stats bar */}\n      <div className=\"mt-4 grid grid-cols-2 gap-4 rounded-lg bg-bg-sunken/50 p-4 sm:grid-cols-4\">\n        <div>\n          <p className=\"text-xs text-text-secondary\">\n            {tr(\"devportal.totalInstalls\", \"Total Installs\")}\n          </p>\n          <p className=\"text-lg font-semibold\">\n            {(org.totalInstalls || 0).toLocaleString()}\n          </p>\n        </div>\n        <div>\n          <p className=\"text-xs text-text-secondary\">\n            {tr(\"devportal.activeInstalls\", \"Active Installs\")}\n          </p>\n          <p className=\"text-lg font-semibold\">\n            {(org.activeInstalls || 0).toLocaleString()}\n          </p>\n        </div>\n        <div>\n          <p className=\"text-xs text-text-secondary\">\n            {tr(\"devportal.apiCalls\", \"API Calls\")}\n          </p>\n          <p className=\"text-lg font-semibold\">\n            {org.totalApiCalls\n              ? `${(parseInt(org.totalApiCalls) / 1000000).toFixed(1)}M`\n              : \"0\"}\n          </p>\n        </div>\n        <div>\n          <p className=\"text-xs text-text-secondary\">\n            {tr(\"devportal.avgRating\", \"Avg Rating\")}\n          </p>\n          <p className=\"text-lg font-semibold\">\n            {org.averageRating\n              ? `${org.averageRating.toFixed(1)} ★`\n              : tr(\"devportal.notAvailable\", \"N/A\")}\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}