@burdenoff/microfe-devportal 2026.510.110

package/dist/devportal/pages/ApplicationDetailPage.js

@@ -0,0 +1,1269 @@
+import { useDevportal as e } from "../providers/DevportalProvider.js";
+import { cn as t } from "../utils/cn.js";
+import { LoadingState as n } from "../components/LoadingState.js";
+import { EmptyState as r } from "../components/EmptyState.js";
+import { PageLayout as i, PageSection as a } from "../components/PageLayout.js";
+import { APP_TYPE_LABELS as o } from "../utils/constants.js";
+import { FeaturedBadge as s, StatusBadge as c, VerifiedBadge as l } from "../components/StatusBadge.js";
+import { SelectionCheckbox as u } from "../components/SelectionCheckbox.js";
+import { NewSecretAlert as d } from "../components/SecretDisplay.js";
+import { DataTable as f, DetailList as p } from "../components/DataTable.js";
+import { ConfirmDialog as m } from "../components/ConfirmDialog.js";
+import { useCurrentUserDelegationsQuery as h, useDeactivateAppMutation as g, useGetApplicationAnalyticsQuery as _, useGetApplicationQuery as v, useGetWebhooksQuery as y, useRevokeDelegationMutation as b, useRotateAppSecretMutation as x } from "../../generated/global-operations.js";
+import { GrantDelegationModal as S } from "../components/GrantDelegationModal.js";
+import { DEVPORTAL_PERMISSIONS as C } from "../constants/permissions.js";
+import { useDevportalPermission as w } from "../hooks/usePermission.js";
+import { useCallback as T, useMemo as E, useState as D } from "react";
+import { useI18n as O } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AlertCircle as k, AppWindow as A, BarChart3 as j, CheckCircle as M, Clock as N, Edit as P, ExternalLink as F, Key as I, Loader2 as L, MoreHorizontal as R, Plus as z, Power as ee, RefreshCw as te, Shield as B, Users as V, Webhook as H, XCircle as U } from "lucide-react";
+import { useParams as ne } from "react-router-dom";
+import { Fragment as W, jsx as G, jsxs as K } from "react/jsx-runtime";
+//#region src/devportal/pages/ApplicationDetailPage.tsx
+function re(e) {
+	return e ? {
+		id: e.id,
+		name: e.name,
+		slug: e.slug,
+		shortDescription: e.shortDescription || void 0,
+		description: e.description || void 0,
+		appType: e.appType,
+		status: e.status,
+		visibility: e.visibility,
+		tenantId: e.tenantId,
+		developerId: e.developerId,
+		developerOrganizationId: e.developerOrganizationId || void 0,
+		category: e.category || void 0,
+		tags: e.tags || [],
+		keywords: e.keywords || [],
+		iconUrl: e.iconUrl || void 0,
+		websiteUrl: e.websiteUrl || void 0,
+		documentationUrl: e.documentationUrl || void 0,
+		supportUrl: e.supportUrl || void 0,
+		privacyPolicyUrl: e.privacyPolicyUrl || void 0,
+		termsOfServiceUrl: e.termsOfServiceUrl || void 0,
+		githubUrl: e.githubUrl || void 0,
+		pricingType: e.pricingType || void 0,
+		installCount: e.installCount,
+		activeInstallCount: e.activeInstallCount,
+		averageRating: e.averageRating ?? void 0,
+		reviewCount: e.reviewCount,
+		submittedAt: e.submittedAt || void 0,
+		publishedAt: e.publishedAt || void 0,
+		lastReviewedAt: e.lastReviewedAt || void 0,
+		reviewStatus: e.reviewStatus,
+		isFeatured: e.isFeatured,
+		isVerified: e.isVerified,
+		requiresApproval: e.requiresApproval,
+		appId: e.appId || void 0,
+		createdAt: e.createdAt,
+		updatedAt: e.updatedAt
+	} : null;
+}
+function ie(e) {
+	return {
+		id: e.id,
+		applicationId: e.applicationId,
+		name: e.name,
+		description: e.description || void 0,
+		url: e.url,
+		secret: e.secret,
+		events: e.events,
+		isActive: e.isActive,
+		status: e.status,
+		maxRetries: e.maxRetries,
+		retryDelay: e.retryDelay,
+		retryEnabled: e.retryEnabled,
+		lastTriggeredAt: e.lastTriggeredAt || void 0,
+		lastSuccessAt: e.lastSuccessAt || void 0,
+		lastFailureAt: e.lastFailureAt || void 0,
+		lastFailureReason: e.lastFailureReason || void 0,
+		failureCount: e.failureCount,
+		successCount: e.successCount,
+		createdAt: e.createdAt,
+		updatedAt: e.updatedAt
+	};
+}
+function q(e) {
+	return {
+		id: e.id,
+		applicationId: e.applicationId,
+		date: e.date,
+		period: e.period,
+		apiCalls: e.apiCalls,
+		errors: e.errors,
+		sessions: e.sessions,
+		activeUsers: e.activeUsers,
+		newUsers: e.newUsers,
+		avgResponseTime: e.avgResponseTime ?? void 0,
+		avgSessionDuration: e.avgSessionDuration ?? void 0,
+		createdAt: e.createdAt
+	};
+}
+function ae(e) {
+	return {
+		id: e.id,
+		appId: e.appId,
+		app: {
+			id: e.app.id,
+			name: e.app.name,
+			description: e.app.description || void 0,
+			type: e.app.type,
+			status: e.app.status
+		},
+		userId: e.userId,
+		scopes: e.scopes,
+		workspaceIds: e.workspaceIds ?? [],
+		status: e.status,
+		grantedAt: e.grantedAt,
+		grantedBy: e.grantedBy,
+		expiresAt: e.expiresAt || void 0,
+		revokedAt: e.revokedAt || void 0,
+		revokedBy: e.revokedBy || void 0
+	};
+}
+var oe = [
+	{
+		id: "overview",
+		label: "Overview",
+		icon: A
+	},
+	{
+		id: "oauth",
+		label: "OAuth Clients",
+		icon: B
+	},
+	{
+		id: "api-keys",
+		label: "API Keys",
+		icon: I
+	},
+	{
+		id: "webhooks",
+		label: "Webhooks",
+		icon: H
+	},
+	{
+		id: "delegations",
+		label: "Delegations",
+		icon: V
+	},
+	{
+		id: "analytics",
+		label: "Analytics",
+		icon: j
+	},
+	{
+		id: "playground",
+		label: "API Playground",
+		icon: F
+	}
+], J = {
+	ACTIVE: "bg-status-success-bg-subtle text-status-success-text",
+	REVOKED: "bg-status-error-bg-subtle text-status-error-text",
+	EXPIRED: "bg-bg-sunken text-text-secondary"
+}, Y = ({ message: e = "Loading..." }) => /* @__PURE__ */ K("div", {
+	className: "flex items-center justify-center gap-3 py-12",
+	children: [/* @__PURE__ */ G(L, {
+		size: 20,
+		className: "animate-spin text-muted-foreground"
+	}), /* @__PURE__ */ G("p", {
+		className: "text-sm text-muted-foreground",
+		children: e
+	})]
+}), X = ({ message: e }) => /* @__PURE__ */ K("div", {
+	className: "flex flex-col items-center justify-center gap-2 py-12 text-center",
+	children: [/* @__PURE__ */ G(k, {
+		size: 32,
+		className: "text-destructive"
+	}), /* @__PURE__ */ G("p", {
+		className: "text-sm text-muted-foreground",
+		children: e
+	})]
+}), Z = () => {
+	let { navigate: a, basePath: u } = e(), { t: f } = O(), p = (e, t) => {
+		let n = f(e);
+		return n === e ? t : n;
+	}, { allowed: h } = w(C.APP_UPDATE), { allowed: _ } = w(C.APP_DELETE), { appId: y } = ne(), [b, E] = D("overview"), [j, M] = D(!1), [F, I] = D(!1), [L, R] = D(null), [z, B] = D(!1), { data: V, loading: H, error: U } = v({
+		variables: { id: y },
+		skip: !y
+	}), [W, { loading: ie }] = x(), [q, { loading: ae }] = g(), J = T((e) => {
+		a?.(`${u}${e}`);
+	}, [a, u]), Y = T(async () => {
+		if (y) try {
+			let e = (await W({ variables: { id: y } })).data?.rotateAppSecret.clientSecret;
+			e && R(e), M(!1);
+		} catch {}
+	}, [y, W]), X = T(async () => {
+		if (y) try {
+			await q({ variables: { id: y } }), I(!1), J("/apps");
+		} catch {}
+	}, [
+		y,
+		q,
+		J
+	]);
+	if (H) return /* @__PURE__ */ G(n, { message: p("devportal.loadingApplication", "Loading application...") });
+	if (U) return /* @__PURE__ */ G(i, {
+		title: p("devportal.error", "Error"),
+		backLink: `${u}/apps`,
+		backLabel: p("devportal.backToApplications", "Back to Applications"),
+		children: /* @__PURE__ */ K("div", {
+			className: "flex flex-col items-center justify-center py-12 text-center",
+			children: [
+				/* @__PURE__ */ G(k, {
+					size: 48,
+					className: "text-destructive mb-4"
+				}),
+				/* @__PURE__ */ G("h3", {
+					className: "text-lg font-semibold mb-2",
+					children: p("devportal.failedToLoadApplication", "Failed to load application")
+				}),
+				/* @__PURE__ */ G("p", {
+					className: "text-sm text-muted-foreground",
+					children: U.message
+				})
+			]
+		})
+	});
+	let Z = re(V?.application);
+	return Z ? /* @__PURE__ */ K(i, {
+		title: Z.name,
+		description: Z.shortDescription,
+		backLink: `${u}/apps`,
+		backLabel: p("devportal.backToApplications", "Back to Applications"),
+		actions: /* @__PURE__ */ K("div", {
+			className: "flex items-center gap-2",
+			children: [
+				/* @__PURE__ */ K("button", {
+					onClick: () => M(!0),
+					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__ */ G(te, { size: 16 }), p("devportal.rotateSecret", "Rotate Secret")]
+				}),
+				/* @__PURE__ */ K("button", {
+					onClick: () => J(`/apps/${Z.id}/versions`),
+					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__ */ G(N, { size: 16 }), p("devportal.versions", "Versions")]
+				}),
+				/* @__PURE__ */ K("button", {
+					onClick: () => J(`/apps/${Z.id}/edit`),
+					disabled: !h,
+					"aria-disabled": !h,
+					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__ */ G(P, { size: 16 }), p("devportal.editApp", "Edit App")]
+				}),
+				/* @__PURE__ */ K("button", {
+					onClick: () => I(!0),
+					disabled: !_,
+					"aria-disabled": !_,
+					className: "inline-flex items-center gap-2 rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg-subtle transition-colors disabled:opacity-50",
+					children: [/* @__PURE__ */ G(ee, { size: 16 }), p("devportal.deactivate", "Deactivate")]
+				})
+			]
+		}),
+		children: [
+			L && /* @__PURE__ */ G(d, {
+				title: p("devportal.newAppSecretGenerated", "New App Secret Generated"),
+				secret: L,
+				description: p("devportal.appSecretRotatedDescription", "Your app secret has been rotated. The old secret is no longer valid."),
+				onDismiss: () => R(null)
+			}),
+			/* @__PURE__ */ K("div", {
+				className: "flex flex-wrap items-center gap-2",
+				children: [
+					/* @__PURE__ */ G(c, {
+						status: Z.status,
+						type: "app"
+					}),
+					/* @__PURE__ */ G(c, {
+						status: Z.visibility,
+						type: "app"
+					}),
+					Z.isVerified && /* @__PURE__ */ G(l, { verified: !0 }),
+					Z.isFeatured && /* @__PURE__ */ G(s, {}),
+					/* @__PURE__ */ G("span", {
+						className: "text-sm text-muted-foreground",
+						children: o[Z.appType] || Z.appType
+					})
+				]
+			}),
+			/* @__PURE__ */ G("div", {
+				className: "border-b",
+				children: /* @__PURE__ */ G("nav", {
+					className: "-mb-px flex gap-4 overflow-x-auto",
+					role: "tablist",
+					"aria-label": p("devportal.applicationSections", "Application sections"),
+					children: oe.map((e) => {
+						let n = e.icon;
+						return /* @__PURE__ */ K("button", {
+							id: `application-tab-${e.id}`,
+							role: "tab",
+							"aria-selected": b === e.id,
+							"aria-controls": `application-panel-${e.id}`,
+							onClick: () => E(e.id),
+							className: t("flex items-center gap-2 border-b-2 px-1 py-3 text-sm font-medium transition-colors", b === e.id ? "border-primary text-primary" : "border-transparent text-muted-foreground hover:text-foreground hover:border-muted-foreground"),
+							children: [/* @__PURE__ */ G(n, { size: 16 }), e.label]
+						}, e.id);
+					})
+				})
+			}),
+			/* @__PURE__ */ K("div", {
+				className: "mt-6",
+				id: `application-panel-${b}`,
+				role: "tabpanel",
+				"aria-labelledby": `application-tab-${b}`,
+				tabIndex: 0,
+				children: [
+					b === "overview" && /* @__PURE__ */ G(fe, { app: Z }),
+					b === "oauth" && /* @__PURE__ */ G(se, {
+						appId: Z.appId || Z.id,
+						onNavigate: J
+					}),
+					b === "api-keys" && /* @__PURE__ */ G(ce, {
+						appId: Z.appId || Z.id,
+						onNavigate: J
+					}),
+					b === "webhooks" && /* @__PURE__ */ G(le, {
+						appId: Z.id,
+						onNavigate: J
+					}),
+					b === "delegations" && /* @__PURE__ */ G(ue, {
+						authAppId: Z.appId || void 0,
+						appName: Z.name,
+						onGrantDelegation: () => B(!0),
+						onNavigate: J
+					}),
+					b === "analytics" && /* @__PURE__ */ G(de, { appId: Z.id }),
+					b === "playground" && /* @__PURE__ */ G(_e, { app: Z })
+				]
+			}),
+			/* @__PURE__ */ G(m, {
+				open: j,
+				onOpenChange: M,
+				onConfirm: Y,
+				title: p("devportal.rotateAppSecret", "Rotate App Secret"),
+				description: p("devportal.rotateAppSecretDescription", "This will generate a new client secret and invalidate the current one. All existing integrations using the old secret will stop working immediately."),
+				confirmLabel: p("devportal.rotateSecret", "Rotate Secret"),
+				cancelLabel: p("devportal.cancel", "Cancel"),
+				variant: "warning",
+				loading: ie
+			}),
+			/* @__PURE__ */ G(m, {
+				open: F,
+				onOpenChange: I,
+				onConfirm: X,
+				title: p("devportal.deactivateApplication", "Deactivate Application"),
+				description: p("devportal.deactivateApplicationDescription", "This will deactivate the application. All OAuth clients, API keys, and webhooks associated with this app will stop functioning. This action can be reversed by reactivating the app."),
+				confirmLabel: p("devportal.deactivate", "Deactivate"),
+				cancelLabel: p("devportal.cancel", "Cancel"),
+				variant: "destructive",
+				loading: ae
+			}),
+			/* @__PURE__ */ G(S, {
+				open: z,
+				onOpenChange: B,
+				appId: Z.appId || "",
+				appName: Z.name,
+				appScopes: Z.scopes?.map((e) => e.scope) ?? [],
+				onSuccess: () => {
+					B(!1);
+				}
+			})
+		]
+	}) : /* @__PURE__ */ G(i, {
+		title: p("devportal.notFound", "Not Found"),
+		backLink: `${u}/apps`,
+		backLabel: p("devportal.backToApplications", "Back to Applications"),
+		children: /* @__PURE__ */ G(r, {
+			icon: /* @__PURE__ */ G(A, { size: 48 }),
+			title: p("devportal.applicationNotFound", "Application not found"),
+			description: p("devportal.applicationNotFoundDescription", "The application you're looking for doesn't exist or you don't have access to it.")
+		})
+	});
+}, se = ({ onNavigate: e }) => {
+	let { t } = O(), n = (e, n) => {
+		let r = t(e);
+		return r === e ? n : r;
+	};
+	return /* @__PURE__ */ K("div", {
+		className: "space-y-4 py-4 text-center",
+		children: [
+			/* @__PURE__ */ G(B, { className: "mx-auto h-10 w-10 text-muted-foreground" }),
+			/* @__PURE__ */ G("h3", {
+				className: "font-medium",
+				children: n("devportal.oauthApps", "OAuth Apps")
+			}),
+			/* @__PURE__ */ G("p", {
+				className: "text-sm text-muted-foreground",
+				children: n("devportal.oauthAppsManagedCentrally", "OAuth apps are now managed centrally. Visit the OAuth Apps page to create and manage your apps.")
+			}),
+			/* @__PURE__ */ K("button", {
+				onClick: () => e("/oauth"),
+				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__ */ G(F, { size: 16 }), n("devportal.manageOAuthApps", "Manage OAuth Apps")]
+			})
+		]
+	});
+}, ce = ({ onNavigate: e }) => {
+	let { t } = O(), n = (e, n) => {
+		let r = t(e);
+		return r === e ? n : r;
+	};
+	return /* @__PURE__ */ K("div", {
+		className: "space-y-4 py-4 text-center",
+		children: [
+			/* @__PURE__ */ G(I, { className: "mx-auto h-10 w-10 text-muted-foreground" }),
+			/* @__PURE__ */ G("h3", {
+				className: "font-medium",
+				children: n("devportal.apiKeys", "API Keys")
+			}),
+			/* @__PURE__ */ G("p", {
+				className: "text-sm text-muted-foreground",
+				children: n("devportal.apiKeysManagedCentrally", "API keys are now managed centrally. Visit the API Keys page to generate and manage your keys.")
+			}),
+			/* @__PURE__ */ K("button", {
+				onClick: () => e("/api-keys"),
+				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__ */ G(F, { size: 16 }), n("devportal.manageApiKeys", "Manage API Keys")]
+			})
+		]
+	});
+}, le = ({ appId: e, onNavigate: t }) => {
+	let { t: n } = O(), r = (e, t) => {
+		let r = n(e);
+		return r === e ? t : r;
+	}, { data: i, loading: a, error: o } = y({ variables: { applicationId: e } });
+	return a ? /* @__PURE__ */ G(Y, { message: r("devportal.loadingWebhooks", "Loading webhooks...") }) : o ? /* @__PURE__ */ G(X, { message: o.message }) : /* @__PURE__ */ G(pe, {
+		appId: e,
+		webhooks: (i?.webhooks ?? []).map(ie),
+		onNavigate: t
+	});
+}, ue = ({ authAppId: e, appName: t, onGrantDelegation: n, onNavigate: i }) => {
+	let { t: a } = O(), o = (e, t) => {
+		let n = a(e);
+		return n === e ? t : n;
+	}, { data: s, loading: c, error: l, refetch: u } = h(), [d] = b(), [f, p] = D([]), [g, _] = D(!1), [v, y] = D(/* @__PURE__ */ new Set()), [x, S] = D(null), C = E(() => s?.currentUserDelegations ? s.currentUserDelegations.filter((t) => t.appId === e).map(ae) : [], [e, s]), w = E(() => C.filter((e) => e.status === "ACTIVE"), [C]), k = E(() => w.filter((e) => v.has(e.id)), [w, v]), A = w.length > 0 && w.every((e) => v.has(e.id)), j = w.some((e) => v.has(e.id)) && !A, M = T((e, t) => {
+		y((n) => {
+			let r = new Set(n);
+			return t ? r.add(e) : r.delete(e), r;
+		});
+	}, []), N = T((e) => {
+		y((t) => {
+			let n = new Set(t);
+			return w.forEach((t) => {
+				e ? n.add(t.id) : n.delete(t.id);
+			}), n;
+		});
+	}, [w]), P = T(() => {
+		y(/* @__PURE__ */ new Set());
+	}, []), I = T(async (e) => {
+		_(!0);
+		try {
+			let t = await Promise.allSettled(e.map((e) => d({ variables: { id: e } }))), n = t.filter((e) => e.status === "fulfilled").length, r = t.length - n;
+			S(`Revoked ${n} delegation${n === 1 ? "" : "s"}${r > 0 ? ` • ${r} failed` : ""}`), y((t) => {
+				let n = new Set(t);
+				return e.forEach((e) => n.delete(e)), n;
+			}), p([]), u();
+		} catch {} finally {
+			_(!1);
+		}
+	}, [d, u]);
+	return e ? c ? /* @__PURE__ */ G(Y, { message: o("devportal.loadingDelegations", "Loading delegations...") }) : l ? /* @__PURE__ */ G(X, { message: l.message }) : /* @__PURE__ */ K(W, { children: [
+		x && /* @__PURE__ */ G("div", {
+			className: "rounded-lg border border-border-subtle bg-status-success-bg-subtle p-3 text-sm text-status-success-text",
+			children: /* @__PURE__ */ K("div", {
+				className: "flex items-center justify-between gap-3",
+				children: [/* @__PURE__ */ G("span", { children: x }), /* @__PURE__ */ G("button", {
+					onClick: () => S(null),
+					className: "text-status-success-text hover:text-status-success-text",
+					children: o("devportal.dismiss", "Dismiss")
+				})]
+			})
+		}),
+		/* @__PURE__ */ G(me, {
+			appName: t,
+			delegations: C,
+			onGrantDelegation: n,
+			onRevokeDelegation: (e) => p([e]),
+			selectedDelegationIds: v,
+			onToggleSelectDelegation: M,
+			onToggleAllDelegations: N,
+			onClearSelection: P,
+			onRevokeSelected: () => p(k.map((e) => e.id)),
+			allVisibleSelected: A,
+			partiallySelected: j
+		}),
+		/* @__PURE__ */ G(m, {
+			open: f.length > 0,
+			onOpenChange: (e) => {
+				e || p([]);
+			},
+			onConfirm: () => {
+				f.length > 0 && I(f);
+			},
+			title: f.length > 1 ? o("devportal.revokeDelegations", "Revoke Delegations") : o("devportal.revokeDelegation", "Revoke Delegation"),
+			description: f.length > 1 ? o("devportal.revokeMultipleDelegationsDescription", `This will immediately revoke ${f.length} selected delegations.`) : o("devportal.revokeDelegationDescription", "This will immediately revoke the delegation. The app will no longer be able to act on your behalf with the selected permissions."),
+			confirmLabel: o("devportal.revoke", "Revoke"),
+			cancelLabel: o("devportal.cancel", "Cancel"),
+			variant: "destructive",
+			loading: g
+		})
+	] }) : /* @__PURE__ */ G(r, {
+		icon: /* @__PURE__ */ G(B, { size: 32 }),
+		title: o("devportal.linkAuthAppFirst", "Link an auth app first"),
+		description: o("devportal.linkAuthAppFirstDescription", "Delegations are managed through auth apps. Create or link an auth app before granting app-as-user access."),
+		action: /* @__PURE__ */ K("button", {
+			onClick: () => i("/oauth"),
+			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",
+			children: [/* @__PURE__ */ G(F, { size: 16 }), o("devportal.manageOAuthApps", "Manage OAuth Apps")]
+		})
+	});
+}, de = ({ appId: e }) => {
+	let { t } = O(), n = (e, n) => {
+		let r = t(e);
+		return r === e ? n : r;
+	}, r = E(() => /* @__PURE__ */ new Date(), []), { data: i, loading: a, error: o } = _({ variables: {
+		applicationId: e,
+		period: "daily",
+		startDate: E(() => {
+			let e = new Date(r);
+			return e.setDate(e.getDate() - 30), e;
+		}, [r]).toISOString(),
+		endDate: r.toISOString()
+	} });
+	return a ? /* @__PURE__ */ G(Y, { message: n("devportal.loadingAnalytics", "Loading analytics...") }) : o ? /* @__PURE__ */ G(X, { message: o.message }) : /* @__PURE__ */ G(he, { analytics: (i?.applicationAnalytics ?? []).map(q) });
+}, fe = ({ app: e }) => {
+	let { t } = O(), n = (e, n) => {
+		let r = t(e);
+		return r === e ? n : r;
+	};
+	return /* @__PURE__ */ K("div", {
+		className: "grid gap-6 lg:grid-cols-3",
+		children: [/* @__PURE__ */ K("div", {
+			className: "lg:col-span-2 space-y-6",
+			children: [
+				/* @__PURE__ */ K("div", {
+					className: "grid gap-4 sm:grid-cols-4",
+					children: [
+						/* @__PURE__ */ G(Q, {
+							label: n("devportal.totalInstalls", "Total Installs"),
+							value: e.installCount.toLocaleString()
+						}),
+						/* @__PURE__ */ G(Q, {
+							label: n("devportal.activeInstalls", "Active Installs"),
+							value: e.activeInstallCount.toLocaleString()
+						}),
+						/* @__PURE__ */ G(Q, {
+							label: n("devportal.averageRating", "Average Rating"),
+							value: e.averageRating ? `${e.averageRating.toFixed(1)} ★` : n("devportal.notAvailable", "N/A")
+						}),
+						/* @__PURE__ */ G(Q, {
+							label: n("devportal.reviews", "Reviews"),
+							value: e.reviewCount.toString()
+						})
+					]
+				}),
+				/* @__PURE__ */ G(a, {
+					title: n("devportal.description", "Description"),
+					children: /* @__PURE__ */ G("div", {
+						className: "prose prose-sm max-w-none",
+						children: /* @__PURE__ */ G("pre", {
+							className: "whitespace-pre-wrap font-sans text-sm text-foreground bg-transparent p-0 m-0",
+							children: e.description || n("devportal.noDescriptionProvided", "No description provided.")
+						})
+					})
+				}),
+				/* @__PURE__ */ G(a, {
+					title: n("devportal.tagsAndKeywords", "Tags & Keywords"),
+					children: /* @__PURE__ */ K("div", {
+						className: "space-y-3",
+						children: [e.tags.length > 0 && /* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+							className: "text-xs text-muted-foreground mb-2",
+							children: n("devportal.tags", "Tags")
+						}), /* @__PURE__ */ G("div", {
+							className: "flex flex-wrap gap-2",
+							children: e.tags.map((e) => /* @__PURE__ */ G("span", {
+								className: "rounded-full bg-primary/10 px-3 py-1 text-xs font-medium text-primary",
+								children: e
+							}, e))
+						})] }), e.keywords.length > 0 && /* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+							className: "text-xs text-muted-foreground mb-2",
+							children: n("devportal.keywords", "Keywords")
+						}), /* @__PURE__ */ G("div", {
+							className: "flex flex-wrap gap-2",
+							children: e.keywords.map((e) => /* @__PURE__ */ G("span", {
+								className: "rounded-full bg-muted px-3 py-1 text-xs",
+								children: e
+							}, e))
+						})] })]
+					})
+				})
+			]
+		}), /* @__PURE__ */ K("div", {
+			className: "space-y-6",
+			children: [/* @__PURE__ */ G(a, {
+				title: n("devportal.details", "Details"),
+				children: /* @__PURE__ */ G(p, { items: [
+					{
+						label: n("devportal.appId", "App ID"),
+						value: /* @__PURE__ */ G("code", {
+							className: "text-xs",
+							children: e.id
+						})
+					},
+					{
+						label: n("devportal.slug", "Slug"),
+						value: e.slug
+					},
+					{
+						label: n("devportal.category", "Category"),
+						value: e.category || n("devportal.uncategorized", "Uncategorized")
+					},
+					{
+						label: n("devportal.pricing", "Pricing"),
+						value: e.pricingType || n("devportal.free", "Free")
+					},
+					{
+						label: n("devportal.created", "Created"),
+						value: new Date(e.createdAt).toLocaleDateString()
+					},
+					{
+						label: n("devportal.updated", "Updated"),
+						value: new Date(e.updatedAt).toLocaleDateString()
+					},
+					{
+						label: n("devportal.published", "Published"),
+						value: e.publishedAt ? new Date(e.publishedAt).toLocaleDateString() : n("devportal.notPublished", "Not published")
+					}
+				] })
+			}), /* @__PURE__ */ G(a, {
+				title: n("devportal.links", "Links"),
+				children: /* @__PURE__ */ K("div", {
+					className: "space-y-2",
+					children: [
+						e.websiteUrl && /* @__PURE__ */ G($, {
+							label: n("devportal.website", "Website"),
+							url: e.websiteUrl
+						}),
+						e.documentationUrl && /* @__PURE__ */ G($, {
+							label: n("devportal.documentation", "Documentation"),
+							url: e.documentationUrl
+						}),
+						e.supportUrl && /* @__PURE__ */ G($, {
+							label: n("devportal.support", "Support"),
+							url: e.supportUrl
+						}),
+						e.githubUrl && /* @__PURE__ */ G($, {
+							label: n("devportal.github", "GitHub"),
+							url: e.githubUrl
+						}),
+						e.privacyPolicyUrl && /* @__PURE__ */ G($, {
+							label: n("devportal.privacyPolicy", "Privacy Policy"),
+							url: e.privacyPolicyUrl
+						}),
+						e.termsOfServiceUrl && /* @__PURE__ */ G($, {
+							label: n("devportal.termsOfService", "Terms of Service"),
+							url: e.termsOfServiceUrl
+						})
+					]
+				})
+			})]
+		})]
+	});
+}, pe = ({ appId: e, webhooks: t, onNavigate: n }) => {
+	let { t: i } = O(), a = (e, t) => {
+		let n = i(e);
+		return n === e ? t : n;
+	};
+	return /* @__PURE__ */ K("div", {
+		className: "space-y-6",
+		children: [/* @__PURE__ */ K("div", {
+			className: "flex items-center justify-between",
+			children: [/* @__PURE__ */ K("p", {
+				className: "text-sm text-muted-foreground",
+				children: [
+					t.length,
+					" ",
+					t.length === 1 ? a("devportal.webhook", "webhook") : a("devportal.webhooks", "webhooks"),
+					" ",
+					a("devportal.configured", "configured")
+				]
+			}), /* @__PURE__ */ K("button", {
+				onClick: () => n(`/apps/${e}/webhooks/new`),
+				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__ */ G(z, { size: 16 }), a("devportal.addWebhook", "Add Webhook")]
+			})]
+		}), t.length > 0 ? /* @__PURE__ */ G("div", {
+			className: "space-y-4",
+			children: t.map((t) => /* @__PURE__ */ K("div", {
+				className: "rounded-lg border bg-card p-4 space-y-4",
+				children: [
+					/* @__PURE__ */ K("div", {
+						className: "flex items-start justify-between",
+						children: [/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ K("div", {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ G("h3", {
+								className: "font-medium",
+								children: t.name
+							}), /* @__PURE__ */ G(c, {
+								status: t.status,
+								type: "webhook"
+							})]
+						}), t.description && /* @__PURE__ */ G("p", {
+							className: "text-sm text-muted-foreground mt-1",
+							children: t.description
+						})] }), /* @__PURE__ */ G("button", {
+							onClick: () => n(`/apps/${e}/webhooks/${t.id}`),
+							className: "rounded-md p-1 hover:bg-muted",
+							children: /* @__PURE__ */ G(R, { size: 20 })
+						})]
+					}),
+					/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+						className: "text-xs text-muted-foreground mb-1",
+						children: a("devportal.endpointUrl", "Endpoint URL")
+					}), /* @__PURE__ */ G("code", {
+						className: "text-sm bg-muted px-2 py-1 rounded block truncate",
+						children: t.url
+					})] }),
+					/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+						className: "text-xs text-muted-foreground mb-2",
+						children: a("devportal.events", "Events")
+					}), /* @__PURE__ */ G("div", {
+						className: "flex flex-wrap gap-2",
+						children: t.events.map((e) => /* @__PURE__ */ G("span", {
+							className: "rounded-full bg-muted px-2 py-0.5 text-xs",
+							children: e
+						}, e))
+					})] }),
+					/* @__PURE__ */ K("div", {
+						className: "grid gap-4 sm:grid-cols-4 text-sm",
+						children: [
+							/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+								className: "text-xs text-muted-foreground",
+								children: a("devportal.success", "Success")
+							}), /* @__PURE__ */ G("p", {
+								className: "font-medium text-status-success-text",
+								children: t.successCount.toLocaleString()
+							})] }),
+							/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+								className: "text-xs text-muted-foreground",
+								children: a("devportal.failed", "Failed")
+							}), /* @__PURE__ */ G("p", {
+								className: "font-medium text-status-error-text",
+								children: t.failureCount.toLocaleString()
+							})] }),
+							/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+								className: "text-xs text-muted-foreground",
+								children: a("devportal.successRate", "Success Rate")
+							}), /* @__PURE__ */ K("p", {
+								className: "font-medium",
+								children: [t.successCount + t.failureCount > 0 ? (t.successCount / (t.successCount + t.failureCount) * 100).toFixed(1) : "0.0", "%"]
+							})] }),
+							/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+								className: "text-xs text-muted-foreground",
+								children: a("devportal.lastTriggered", "Last Triggered")
+							}), /* @__PURE__ */ G("p", {
+								className: "font-medium",
+								children: t.lastTriggeredAt ? new Date(t.lastTriggeredAt).toLocaleString() : a("devportal.never", "Never")
+							})] })
+						]
+					})
+				]
+			}, t.id))
+		}) : /* @__PURE__ */ G(r, {
+			icon: /* @__PURE__ */ G(H, { size: 32 }),
+			title: a("devportal.noWebhooks", "No webhooks"),
+			description: a("devportal.noWebhooksDescription", "Add a webhook to receive event notifications"),
+			action: /* @__PURE__ */ K("button", {
+				onClick: () => n(`/apps/${e}/webhooks/new`),
+				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",
+				children: [/* @__PURE__ */ G(z, { size: 16 }), a("devportal.addWebhook", "Add Webhook")]
+			})
+		})]
+	});
+}, me = ({ appName: e, delegations: n, onGrantDelegation: i, onRevokeDelegation: a, selectedDelegationIds: o, onToggleSelectDelegation: s, onToggleAllDelegations: c, onClearSelection: l, onRevokeSelected: d, allVisibleSelected: f, partiallySelected: p }) => {
+	let { t: m } = O(), h = (e, t) => {
+		let n = m(e);
+		return n === e ? t : n;
+	}, g = n.filter((e) => e.status === "ACTIVE"), _ = n.filter((e) => e.status !== "ACTIVE");
+	return /* @__PURE__ */ K("div", {
+		className: "space-y-6",
+		children: [
+			/* @__PURE__ */ K("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ K("p", {
+					className: "text-sm text-muted-foreground",
+					children: [
+						n.length,
+						" ",
+						n.length === 1 ? h("devportal.delegation", "delegation") : h("devportal.delegations", "delegations"),
+						" ",
+						h("devportal.for", "for"),
+						" ",
+						e
+					]
+				}), g.length > 0 && /* @__PURE__ */ K("p", {
+					className: "text-xs text-muted-foreground mt-0.5",
+					children: [
+						g.length,
+						" ",
+						h("devportal.active", "active"),
+						",",
+						" ",
+						_.length,
+						" ",
+						h("devportal.revokedExpired", "revoked/expired")
+					]
+				})] }), /* @__PURE__ */ K("button", {
+					onClick: i,
+					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__ */ G(z, { size: 16 }), h("devportal.grantDelegation", "Grant Delegation")]
+				})]
+			}),
+			g.length > 0 && /* @__PURE__ */ G("div", {
+				className: "rounded-lg border bg-card p-4",
+				children: /* @__PURE__ */ K("div", {
+					className: "flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between",
+					children: [/* @__PURE__ */ K("div", {
+						className: "flex flex-wrap items-center gap-3",
+						children: [/* @__PURE__ */ K("div", {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ G(u, {
+								checked: f,
+								indeterminate: p,
+								onChange: c,
+								ariaLabel: h("devportal.selectAllActiveDelegations", "Select all active app delegations")
+							}), /* @__PURE__ */ G("span", {
+								className: "text-sm font-medium",
+								children: h("devportal.selectAllActive", "Select all active")
+							})]
+						}), o.size > 0 && /* @__PURE__ */ G("button", {
+							onClick: l,
+							className: "text-sm text-muted-foreground hover:text-foreground",
+							children: h("devportal.clearSelection", "Clear selection")
+						})]
+					}), /* @__PURE__ */ K("div", {
+						className: "flex flex-wrap items-center gap-2",
+						children: [/* @__PURE__ */ K("span", {
+							className: "rounded-full bg-muted px-3 py-1 text-sm font-medium text-muted-foreground",
+							children: [
+								o.size,
+								" ",
+								h("devportal.selected", "selected")
+							]
+						}), /* @__PURE__ */ K("button", {
+							onClick: d,
+							disabled: o.size === 0,
+							className: "rounded-md border border-status-error-bg px-3 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg-subtle disabled:cursor-not-allowed disabled:opacity-50",
+							children: [h("devportal.revokeSelected", "Revoke Selected"), o.size > 0 ? ` (${o.size})` : ""]
+						})]
+					})]
+				})
+			}),
+			n.length > 0 ? /* @__PURE__ */ G("div", {
+				className: "space-y-4",
+				children: n.map((e) => /* @__PURE__ */ K("div", {
+					className: "rounded-lg border bg-card p-4 space-y-4",
+					children: [
+						/* @__PURE__ */ K("div", {
+							className: "flex items-start justify-between",
+							children: [/* @__PURE__ */ K("div", {
+								className: "flex items-start gap-3",
+								children: [e.status === "ACTIVE" && /* @__PURE__ */ G("div", {
+									onClick: (e) => e.stopPropagation(),
+									children: /* @__PURE__ */ G(u, {
+										checked: o.has(e.id),
+										onChange: (t) => s(e.id, t),
+										ariaLabel: `Select delegation ${e.id}`,
+										className: "mt-1"
+									})
+								}), /* @__PURE__ */ K("div", { children: [/* @__PURE__ */ K("div", {
+									className: "flex items-center gap-2",
+									children: [/* @__PURE__ */ K("h3", {
+										className: "font-medium",
+										children: ["Delegation #", e.id.slice(0, 8)]
+									}), /* @__PURE__ */ G("span", {
+										className: t("rounded-full px-2 py-0.5 text-xs font-medium", J[e.status]),
+										children: e.status
+									})]
+								}), /* @__PURE__ */ K("p", {
+									className: "text-sm text-muted-foreground mt-1",
+									children: [
+										h("devportal.granted", "Granted"),
+										" ",
+										new Date(e.grantedAt).toLocaleDateString(),
+										" ",
+										h("devportal.by", "by"),
+										" ",
+										e.grantedBy === e.userId ? h("devportal.you", "you") : e.grantedBy.slice(0, 8)
+									]
+								})] })]
+							}), e.status === "ACTIVE" && /* @__PURE__ */ K("button", {
+								onClick: () => a(e.id),
+								className: "inline-flex items-center gap-1.5 rounded-md border border-border-subtle px-3 py-1.5 text-xs font-medium text-status-error-text hover:bg-status-error-bg-subtle transition-colors",
+								children: [/* @__PURE__ */ G(U, { size: 14 }), h("devportal.revoke", "Revoke")]
+							})]
+						}),
+						/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+							className: "text-xs text-muted-foreground mb-2",
+							children: h("devportal.grantedScopes", "Granted Scopes")
+						}), /* @__PURE__ */ G("div", {
+							className: "flex flex-wrap gap-2",
+							children: e.scopes.map((e) => /* @__PURE__ */ G("span", {
+								className: "rounded-full bg-status-success-bg-subtle px-2 py-0.5 text-xs text-status-success-text",
+								children: e
+							}, e))
+						})] }),
+						e.workspaceIds.length > 0 && /* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("p", {
+							className: "text-xs text-muted-foreground mb-2",
+							children: h("devportal.workspaceScope", "Workspace Scope")
+						}), /* @__PURE__ */ G("div", {
+							className: "flex flex-wrap gap-2",
+							children: e.workspaceIds.map((e) => /* @__PURE__ */ G("code", {
+								className: "rounded bg-muted px-2 py-0.5 text-xs",
+								children: e
+							}, e))
+						})] }),
+						/* @__PURE__ */ K("div", {
+							className: "flex items-center gap-4 text-xs text-muted-foreground",
+							children: [
+								e.expiresAt && /* @__PURE__ */ K("span", {
+									className: "flex items-center gap-1",
+									children: [
+										/* @__PURE__ */ G(N, { size: 12 }),
+										h("devportal.expires", "Expires"),
+										" ",
+										new Date(e.expiresAt).toLocaleDateString()
+									]
+								}),
+								!e.expiresAt && e.status === "ACTIVE" && /* @__PURE__ */ K("span", {
+									className: "flex items-center gap-1",
+									children: [/* @__PURE__ */ G(M, {
+										size: 12,
+										className: "text-status-success-text"
+									}), h("devportal.noExpiration", "No expiration")]
+								}),
+								e.revokedAt && /* @__PURE__ */ K("span", {
+									className: "flex items-center gap-1",
+									children: [
+										/* @__PURE__ */ G(U, {
+											size: 12,
+											className: "text-status-error-text"
+										}),
+										h("devportal.revoked", "Revoked"),
+										" ",
+										new Date(e.revokedAt).toLocaleDateString()
+									]
+								})
+							]
+						})
+					]
+				}, e.id))
+			}) : /* @__PURE__ */ G(r, {
+				icon: /* @__PURE__ */ G(V, { size: 32 }),
+				title: h("devportal.noDelegations", "No delegations"),
+				description: h("devportal.noDelegationsDescription", "Grant a delegation to allow this app to act on your behalf"),
+				action: /* @__PURE__ */ K("button", {
+					onClick: i,
+					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",
+					children: [/* @__PURE__ */ G(z, { size: 16 }), h("devportal.grantDelegation", "Grant Delegation")]
+				})
+			})
+		]
+	});
+}, he = ({ analytics: e }) => {
+	let { t } = O(), n = (e, n) => {
+		let r = t(e);
+		return r === e ? n : r;
+	}, i = e[0], o = e[1], s = (e, t) => t ? (e - t) / t * 100 : 0;
+	return /* @__PURE__ */ K("div", {
+		className: "space-y-6",
+		children: [/* @__PURE__ */ K("div", {
+			className: "grid gap-4 sm:grid-cols-4",
+			children: [
+				/* @__PURE__ */ G(Q, {
+					label: n("devportal.activeUsers", "Active Users"),
+					value: i?.activeUsers.toLocaleString() || "0",
+					trend: o ? s(i.activeUsers, o.activeUsers) : void 0
+				}),
+				/* @__PURE__ */ G(Q, {
+					label: n("devportal.apiCalls", "API Calls"),
+					value: i ? `${(i.apiCalls / 1e3).toFixed(1)}K` : "0",
+					trend: o ? s(i.apiCalls, o.apiCalls) : void 0
+				}),
+				/* @__PURE__ */ G(Q, {
+					label: n("devportal.avgResponseTime", "Avg Response Time"),
+					value: i?.avgResponseTime ? `${i.avgResponseTime}ms` : n("devportal.notAvailable", "N/A"),
+					trend: o && i?.avgResponseTime ? -s(i.avgResponseTime, o.avgResponseTime || 1) : void 0
+				}),
+				/* @__PURE__ */ G(Q, {
+					label: n("devportal.errorRate", "Error Rate"),
+					value: i && i.apiCalls > 0 ? `${(i.errors / i.apiCalls * 100).toFixed(2)}%` : "0%",
+					trend: o && i && i.apiCalls > 0 && o.apiCalls > 0 ? -s(i.errors / i.apiCalls, o.errors / o.apiCalls) : void 0
+				})
+			]
+		}), /* @__PURE__ */ G(a, {
+			title: n("devportal.dailyBreakdown", "Daily Breakdown"),
+			children: e.length > 0 ? /* @__PURE__ */ G(f, {
+				data: e,
+				keyField: "id",
+				columns: [
+					{
+						key: "date",
+						header: n("devportal.date", "Date"),
+						render: (e) => new Date(e.date).toLocaleDateString()
+					},
+					{
+						key: "activeUsers",
+						header: n("devportal.activeUsers", "Active Users"),
+						render: (e) => e.activeUsers.toLocaleString()
+					},
+					{
+						key: "newUsers",
+						header: n("devportal.newUsers", "New Users"),
+						render: (e) => e.newUsers.toLocaleString()
+					},
+					{
+						key: "apiCalls",
+						header: n("devportal.apiCalls", "API Calls"),
+						render: (e) => e.apiCalls.toLocaleString()
+					},
+					{
+						key: "errors",
+						header: n("devportal.errors", "Errors"),
+						render: (e) => e.errors.toLocaleString()
+					},
+					{
+						key: "avgResponseTime",
+						header: n("devportal.avgResponse", "Avg Response"),
+						render: (e) => e.avgResponseTime ? `${e.avgResponseTime}ms` : n("devportal.notAvailable", "N/A")
+					},
+					{
+						key: "sessions",
+						header: n("devportal.sessions", "Sessions"),
+						render: (e) => e.sessions.toLocaleString()
+					}
+				]
+			}) : /* @__PURE__ */ G(r, {
+				icon: /* @__PURE__ */ G(j, { size: 32 }),
+				title: n("devportal.noAnalyticsData", "No analytics data"),
+				description: n("devportal.noAnalyticsDataDescription", "Analytics data will appear here once the application starts receiving traffic.")
+			})
+		})]
+	});
+}, ge = "# Sample query - modify as needed\nquery IntrospectSchema {\n  __schema {\n    queryType { name }\n    mutationType { name }\n    types {\n      name\n      kind\n    }\n  }\n}", _e = ({ app: t }) => {
+	let { apiGatewayUrl: n, authToken: r } = e(), { t: i } = O(), a = (e, t) => {
+		let n = i(e);
+		return n === e ? t : n;
+	}, [o, s] = D(ge), [c, l] = D("{}"), [u, d] = D(""), [f, p] = D(!1), [m, h] = D(`${n || "http://localhost:4000"}/global/graphql`), [g, _] = D(r || ""), [v, y] = D(!1), b = T(async () => {
+		p(!0), d("");
+		try {
+			let e = {};
+			try {
+				e = JSON.parse(c);
+			} catch {
+				d(JSON.stringify({ error: "Invalid JSON in variables" }, null, 2)), p(!1);
+				return;
+			}
+			let t = { "Content-Type": "application/json" };
+			g && (t.Authorization = `Bearer ${g}`);
+			let n = await (await fetch(m, {
+				method: "POST",
+				headers: t,
+				body: JSON.stringify({
+					query: o,
+					variables: e
+				})
+			})).json();
+			d(JSON.stringify(n, null, 2));
+		} catch (e) {
+			d(JSON.stringify({ error: e instanceof Error ? e.message : "Request failed" }, null, 2));
+		} finally {
+			p(!1);
+		}
+	}, [
+		o,
+		c,
+		m,
+		g
+	]), x = T(() => {
+		r && _(r), y(!0);
+	}, [r]);
+	return /* @__PURE__ */ K("div", {
+		className: "space-y-4",
+		children: [
+			/* @__PURE__ */ K("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("h3", {
+					className: "text-lg font-semibold",
+					children: a("devportal.apiPlayground", "API Playground")
+				}), /* @__PURE__ */ K("p", {
+					className: "text-sm text-muted-foreground",
+					children: [
+						a("devportal.apiPlaygroundDescription", "Test GraphQL APIs in the context of"),
+						" ",
+						/* @__PURE__ */ G("strong", { children: t.name }),
+						t.appId && /* @__PURE__ */ K("span", {
+							className: "ml-1 text-xs text-muted-foreground",
+							children: [
+								"(OAuth App: ",
+								t.appId.slice(0, 8),
+								"...)"
+							]
+						})
+					]
+				})] }), /* @__PURE__ */ K("button", {
+					onClick: x,
+					className: "flex items-center gap-2 rounded-md border px-3 py-1.5 text-sm font-medium hover:bg-accent transition-colors",
+					children: [/* @__PURE__ */ G(I, { size: 14 }), a("devportal.autoFillCredentials", "Auto-fill Credentials")]
+				})]
+			}),
+			v && /* @__PURE__ */ K("div", {
+				className: "rounded-lg border bg-status-info-bg-subtle p-4 text-sm space-y-2",
+				children: [
+					/* @__PURE__ */ G("p", {
+						className: "font-medium text-status-info-text",
+						children: a("devportal.authenticationGuide", "Authentication Guide")
+					}),
+					/* @__PURE__ */ K("p", {
+						className: "text-status-info-text",
+						children: [
+							a("devportal.authenticationGuideText", "Your current session token has been filled in. For app-level authentication (Client Credentials flow), use the"),
+							" ",
+							/* @__PURE__ */ G("strong", { children: a("devportal.oauthClientsTab", "OAuth Clients") }),
+							" ",
+							a("devportal.authenticationGuideText2", "tab to get the app's clientId and clientSecret, then call:")
+						]
+					}),
+					/* @__PURE__ */ G("pre", {
+						className: "rounded bg-status-info-bg-subtle p-2 text-xs overflow-x-auto text-status-info-text",
+						children: "mutation {\n  authenticateApp(input: {\n    clientId: \"<your-client-id>\"\n    clientSecret: \"<your-client-secret>\"\n    scopes: []\n  }) {\n    accessToken\n    tokenType\n    expiresIn\n  }\n}"
+					}),
+					/* @__PURE__ */ K("p", {
+						className: "text-status-info-text",
+						children: [
+							a("devportal.useReturnedAccessToken", "Use the returned"),
+							" ",
+							/* @__PURE__ */ G("code", {
+								className: "bg-status-info-bg-subtle px-1 rounded",
+								children: "accessToken"
+							}),
+							" ",
+							a("devportal.asBearerToken", "as the Bearer token below.")
+						]
+					}),
+					/* @__PURE__ */ G("button", {
+						onClick: () => y(!1),
+						className: "text-xs text-accent-blue hover:underline",
+						children: a("devportal.dismiss", "Dismiss")
+					})
+				]
+			}),
+			/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("label", {
+				className: "block text-sm font-medium mb-1",
+				children: a("devportal.gatewayEndpoint", "Gateway Endpoint")
+			}), /* @__PURE__ */ K("div", {
+				className: "flex gap-2",
+				children: [/* @__PURE__ */ G("input", {
+					type: "text",
+					value: m,
+					onChange: (e) => h(e.target.value),
+					className: "flex-1 rounded-md border px-3 py-2 text-sm font-mono bg-background"
+				}), /* @__PURE__ */ K("select", {
+					onChange: (e) => h(e.target.value),
+					className: "rounded-md border px-3 py-2 text-sm bg-background",
+					value: m,
+					children: [/* @__PURE__ */ G("option", {
+						value: `${n || "http://localhost:4000"}/global/graphql`,
+						children: a("devportal.globalGateway", "Global Gateway")
+					}), /* @__PURE__ */ G("option", {
+						value: `${n || "http://localhost:4000"}/workspaces/graphql`,
+						children: a("devportal.workspaceGateway", "Workspace Gateway")
+					})]
+				})]
+			})] }),
+			/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("label", {
+				className: "block text-sm font-medium mb-1",
+				children: a("devportal.bearerToken", "Bearer Token")
+			}), /* @__PURE__ */ G("input", {
+				type: "password",
+				value: g,
+				onChange: (e) => _(e.target.value),
+				placeholder: a("devportal.pasteAccessToken", "Paste access token here..."),
+				className: "w-full rounded-md border px-3 py-2 text-sm font-mono bg-background"
+			})] }),
+			/* @__PURE__ */ K("div", {
+				className: "grid grid-cols-1 lg:grid-cols-2 gap-4",
+				children: [/* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("label", {
+					className: "block text-sm font-medium mb-1",
+					children: a("devportal.query", "Query")
+				}), /* @__PURE__ */ G("textarea", {
+					value: o,
+					onChange: (e) => s(e.target.value),
+					className: "w-full h-64 rounded-md border px-3 py-2 text-sm font-mono bg-background resize-y",
+					spellCheck: !1
+				})] }), /* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("label", {
+					className: "block text-sm font-medium mb-1",
+					children: a("devportal.variablesJson", "Variables (JSON)")
+				}), /* @__PURE__ */ G("textarea", {
+					value: c,
+					onChange: (e) => l(e.target.value),
+					className: "w-full h-64 rounded-md border px-3 py-2 text-sm font-mono bg-background resize-y",
+					spellCheck: !1
+				})] })]
+			}),
+			/* @__PURE__ */ K("button", {
+				onClick: b,
+				disabled: f,
+				className: "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: [f ? /* @__PURE__ */ G(L, {
+					size: 16,
+					className: "animate-spin"
+				}) : /* @__PURE__ */ G(F, { size: 16 }), f ? a("devportal.executing", "Executing...") : a("devportal.executeQuery", "Execute Query")]
+			}),
+			u && /* @__PURE__ */ K("div", { children: [/* @__PURE__ */ G("label", {
+				className: "block text-sm font-medium mb-1",
+				children: a("devportal.response", "Response")
+			}), /* @__PURE__ */ G("pre", {
+				className: "w-full max-h-96 overflow-auto rounded-md border bg-muted p-4 text-xs font-mono",
+				children: u
+			})] })
+		]
+	});
+}, Q = ({ label: e, value: n, trend: r }) => {
+	let { t: i } = O();
+	return /* @__PURE__ */ K("div", {
+		className: "rounded-lg border bg-card p-4",
+		children: [
+			/* @__PURE__ */ G("p", {
+				className: "text-sm text-muted-foreground",
+				children: e
+			}),
+			/* @__PURE__ */ G("p", {
+				className: "text-2xl font-bold",
+				children: n
+			}),
+			r !== void 0 && /* @__PURE__ */ K("p", {
+				className: t("text-xs mt-1", r > 0 ? "text-status-success-text" : r < 0 ? "text-status-error-text" : "text-muted-foreground"),
+				children: [
+					r > 0 ? "+" : "",
+					r.toFixed(1),
+					"% ",
+					((e, t) => {
+						let n = i(e);
+						return n === e ? t : n;
+					})("devportal.vsYesterday", "vs yesterday")
+				]
+			})
+		]
+	});
+}, $ = ({ label: e, url: t }) => /* @__PURE__ */ K("a", {
+	href: t,
+	target: "_blank",
+	rel: "noopener noreferrer",
+	className: "flex items-center gap-2 text-sm text-primary hover:underline",
+	children: [/* @__PURE__ */ G(F, { size: 14 }), e]
+});
+//#endregion
+export { Z as ApplicationDetailPage };
+
+//# sourceMappingURL=ApplicationDetailPage.js.map