@burdenoff/microfe-devportal 2026.625.9 → 2026.625.10

package/dist/devportal/pages/ApplicationsPage.js

@@ -3,24 +3,25 @@ import { EmptyState as t } from "../components/EmptyState.js";
 import { useDeactivateAppMutation as n, useDeleteApplicationMutation as r, useGetApplicationsQuery as ee } from "../../generated/global-operations.js";
 import { getErrorMessage as te } from "../hooks/useGraphQL.js";
 import { PageLayout as i } from "../components/PageLayout.js";
-import { APP_STATUS_COLORS as ne, APP_TYPE_LABELS as a } from "../utils/constants.js";
-import { SelectionCheckbox as re } from "../components/SelectionCheckbox.js";
-import { AppCard as ie, AppListItem as ae } from "../components/AppCard.js";
-import { ConfirmDialog as o } from "../components/ConfirmDialog.js";
-import { PermissionGuard as oe } from "../components/PermissionGuard.js";
+import { APP_STATUS_COLORS as ne, APP_TYPE_LABELS as re } from "../utils/constants.js";
+import { SelectionCheckbox as ie } from "../components/SelectionCheckbox.js";
+import { AppCard as ae, AppListItem as oe } from "../components/AppCard.js";
+import { ConfirmDialog as a } from "../components/ConfirmDialog.js";
+import { PermissionGuard as se } from "../components/PermissionGuard.js";
 import "../components/index.js";
-import { DEVPORTAL_PERMISSIONS as s } from "../constants/permissions.js";
-import { useDevportalPermission as c } from "../hooks/usePermission.js";
+import { DEVPORTAL_PERMISSIONS as o } from "../constants/permissions.js";
+import { useDevportalPermission as s } from "../hooks/usePermission.js";
 import "../hooks/index.js";
-import { useMemo as l, useState as u } from "react";
-import { useI18n as d } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { AlertCircle as f, AppWindow as p, Archive as m, Grid as h, List as g, Loader2 as se, Plus as _, Search as ce, Trash2 as le } from "lucide-react";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
+import { useMemo as c, useState as l } from "react";
+import { useI18n as ce } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AlertCircle as u, AppWindow as d, Archive as f, Grid as p, List as m, Loader2 as le, Plus as h, Search as ue, Trash2 as de } from "lucide-react";
+import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { EmphasisPanel as fe, GlassCard as v } from "@burdenoff/fe-libs/ui";
 //#region src/devportal/pages/ApplicationsPage.tsx
-function b(e, t, n) {
+function y(e, t, n) {
 	return `${e} ${t} application${t === 1 ? "" : "s"}${n > 0 ? ` • ${n} failed` : ""}`;
 }
-function ue(e) {
+function pe(e) {
 	let t = Array.isArray(e.screenshots) ? e.screenshots.length > 0 ? e.screenshots : void 0 : e.screenshots, n = e.pricingDetails && typeof e.pricingDetails == "object" ? e.pricingDetails : void 0;
 	return {
 		id: e.id,
@@ -66,209 +67,267 @@ function ue(e) {
 		updatedAt: e.updatedAt
 	};
 }
-var x = () => {
-	let { navigate: x, basePath: S, activeOrgId: C } = e(), { t: w } = d(), T = (e, t) => {
-		let n = w(e);
+var b = () => {
+	let { navigate: b, basePath: x, activeOrgId: S } = e(), { t: C } = ce(), w = (e, t) => {
+		let n = C(e);
 		return n === e ? t : n;
-	}, E = c(s.APP_CREATE), D = c(s.APP_DELETE), O = c(s.APP_UPDATE), [k, A] = u("grid"), [j, de] = u(""), [M, N] = u(""), [P, F] = u(""), [I, L] = u(/* @__PURE__ */ new Set()), [R, z] = u(null), [B, V] = u(null), { data: H, loading: fe, error: U, refetch: W } = ee({
+	}, T = s(o.APP_CREATE), E = s(o.APP_DELETE), D = s(o.APP_UPDATE), [O, k] = l("grid"), [A, me] = l(""), [j, M] = l(""), [N, P] = l(""), [F, I] = l(/* @__PURE__ */ new Set()), [L, R] = l(null), [z, B] = l(null), { data: V, loading: he, error: H, refetch: U } = ee({
 		variables: {
 			limit: 50,
 			offset: 0,
-			status: M || void 0
+			status: j || void 0
 		},
 		fetchPolicy: "cache-and-network"
-	}), G = l(() => H?.applications?.edges?.map((e) => ue(e.node)) ?? [], [H?.applications?.edges]), [pe] = r(), [K] = n(), q = (e) => {
-		x?.(`${S}${e}`);
-	}, J = G.filter((e) => {
-		let t = !C || e.developerOrganizationId === C, n = !j || e.name.toLowerCase().includes(j.toLowerCase()) || e.shortDescription?.toLowerCase().includes(j.toLowerCase()), r = !P || e.appType === P;
+	}), W = c(() => V?.applications?.edges?.map((e) => pe(e.node)) ?? [], [V?.applications?.edges]), [ge] = r(), [G] = n(), K = (e) => {
+		b?.(`${x}${e}`);
+	}, q = W.filter((e) => {
+		let t = !S || e.developerOrganizationId === S, n = !A || e.name.toLowerCase().includes(A.toLowerCase()) || e.shortDescription?.toLowerCase().includes(A.toLowerCase()), r = !N || e.appType === N;
 		return t && n && r;
-	}), Y = l(() => G.filter((e) => I.has(e.id)), [G, I]), X = l(() => Y.filter((e) => e.status !== "INACTIVE" && e.status !== "REVOKED"), [Y]), Z = J.length > 0 && J.every((e) => I.has(e.id)), me = J.some((e) => I.has(e.id)) && !Z, Q = (e, t) => {
-		L((n) => {
+	}), J = c(() => ({
+		total: V?.applications?.totalCount ?? W.length,
+		active: W.filter((e) => e.status === "ACTIVE").length,
+		draft: W.filter((e) => e.status === "DRAFT").length,
+		published: W.filter((e) => e.status === "PUBLISHED").length
+	}), [W, V?.applications?.totalCount]), Y = c(() => W.filter((e) => F.has(e.id)), [W, F]), X = c(() => Y.filter((e) => e.status !== "INACTIVE" && e.status !== "REVOKED"), [Y]), Z = q.length > 0 && q.every((e) => F.has(e.id)), _e = q.some((e) => F.has(e.id)) && !Z, Q = (e, t) => {
+		I((n) => {
 			let r = new Set(n);
 			return t ? r.add(e) : r.delete(e), r;
 		});
-	}, he = (e) => {
-		L((t) => {
+	}, ve = (e) => {
+		I((t) => {
 			let n = new Set(t);
-			return J.forEach((t) => {
+			return q.forEach((t) => {
 				e ? n.add(t.id) : n.delete(t.id);
 			}), n;
 		});
-	}, $ = () => L(/* @__PURE__ */ new Set());
-	return fe && !H ? /* @__PURE__ */ v(i, {
-		title: T("devportal.myApplications", "My Applications"),
-		description: T("devportal.manageYourApps", "Manage your developer applications"),
-		children: /* @__PURE__ */ y("div", {
+	}, $ = () => I(/* @__PURE__ */ new Set());
+	return he && !V ? /* @__PURE__ */ g(i, {
+		title: w("devportal.myApplications", "My Applications"),
+		description: w("devportal.manageYourApps", "Manage your developer applications"),
+		children: /* @__PURE__ */ _("div", {
 			className: "flex items-center justify-center py-12",
-			children: [/* @__PURE__ */ v(se, { className: "h-8 w-8 animate-spin text-muted-foreground" }), /* @__PURE__ */ v("span", {
-				className: "ml-2 text-muted-foreground",
-				children: T("devportal.loadingApplications", "Loading applications...")
+			children: [/* @__PURE__ */ g(le, { className: "h-8 w-8 animate-spin text-text-secondary" }), /* @__PURE__ */ g("span", {
+				className: "ml-2 text-text-secondary",
+				children: w("devportal.loadingApplications", "Loading applications...")
 			})]
 		})
-	}) : U ? /* @__PURE__ */ v(i, {
-		title: T("devportal.myApplications", "My Applications"),
-		description: T("devportal.manageYourApps", "Manage your developer applications"),
-		children: /* @__PURE__ */ y("div", {
-			className: "rounded-lg border border-destructive/50 bg-destructive/10 p-6 text-center",
+	}) : H ? /* @__PURE__ */ g(i, {
+		title: w("devportal.myApplications", "My Applications"),
+		description: w("devportal.manageYourApps", "Manage your developer applications"),
+		children: /* @__PURE__ */ _("div", {
+			className: "rounded-lg border border-status-error-border/50 bg-status-error-bg/10 p-6 text-center",
 			children: [
-				/* @__PURE__ */ v(f, { className: "mx-auto h-8 w-8 text-destructive" }),
-				/* @__PURE__ */ v("h3", {
-					className: "mt-2 font-medium text-destructive",
-					children: T("devportal.failedToLoadApplications", "Failed to load applications")
+				/* @__PURE__ */ g(u, { className: "mx-auto h-8 w-8 text-status-error-text" }),
+				/* @__PURE__ */ g("h3", {
+					className: "mt-2 font-medium text-status-error-text",
+					children: w("devportal.failedToLoadApplications", "Failed to load applications")
 				}),
-				/* @__PURE__ */ v("p", {
-					className: "mt-1 text-sm text-muted-foreground",
-					children: te(U)
+				/* @__PURE__ */ g("p", {
+					className: "mt-1 text-sm text-text-secondary",
+					children: te(H)
 				}),
-				/* @__PURE__ */ v("button", {
-					onClick: () => W(),
-					className: "mt-4 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90",
-					children: T("devportal.tryAgain", "Try Again")
+				/* @__PURE__ */ g("button", {
+					onClick: () => U(),
+					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: w("devportal.tryAgain", "Try Again")
 				})
 			]
 		})
-	}) : /* @__PURE__ */ v(oe, {
-		permission: s.APP_READ,
-		children: /* @__PURE__ */ y(i, {
-			title: T("devportal.myApplications", "My Applications"),
-			description: T("devportal.manageYourApps", "Manage your developer applications"),
-			actions: /* @__PURE__ */ y("button", {
-				onClick: () => q("/apps/new"),
-				disabled: !E.allowed,
-				"aria-disabled": !E.allowed,
-				title: E.allowed ? void 0 : T("devportal.common.noPermission", "You do not have permission to perform this action"),
-				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 disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary",
-				children: [/* @__PURE__ */ v(_, {
+	}) : /* @__PURE__ */ g(se, {
+		permission: o.APP_READ,
+		children: /* @__PURE__ */ _(i, {
+			title: w("devportal.myApplications", "My Applications"),
+			description: w("devportal.manageYourApps", "Manage your developer applications"),
+			purpose: w("devportal.applicationsPurpose", "Applications are the integrations you build on the platform — OAuth apps, store listings, and API consumers. Create one here to get client credentials, request scopes, and ship to the marketplace."),
+			actions: /* @__PURE__ */ _("button", {
+				onClick: () => K("/apps/new"),
+				disabled: !T.allowed,
+				"aria-disabled": !T.allowed,
+				title: T.allowed ? void 0 : w("devportal.common.noPermission", "You do not have permission to perform this action"),
+				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 disabled:opacity-50 disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary",
+				children: [/* @__PURE__ */ g(h, {
 					size: 16,
 					"aria-hidden": "true"
-				}), T("devportal.createApp", "Create App")]
+				}), w("devportal.createApp", "Create App")]
 			}),
 			children: [
-				/* @__PURE__ */ y("div", {
+				/* @__PURE__ */ _("div", {
 					className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
-					children: [/* @__PURE__ */ y("div", {
+					children: [/* @__PURE__ */ _("div", {
 						className: "flex flex-1 items-center gap-4",
 						children: [
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ _("div", {
 								className: "relative flex-1 max-w-md",
-								children: [/* @__PURE__ */ v(ce, {
+								children: [/* @__PURE__ */ g(ue, {
 									size: 16,
-									className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
-								}), /* @__PURE__ */ v("input", {
+									className: "absolute left-3 top-1/2 -translate-y-1/2 text-text-secondary"
+								}), /* @__PURE__ */ g("input", {
 									type: "text",
-									placeholder: T("devportal.searchApplications", "Search applications..."),
-									value: j,
-									onChange: (e) => de(e.target.value),
-									className: "w-full rounded-md border bg-background pl-9 pr-4 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary"
+									placeholder: w("devportal.searchApplications", "Search applications..."),
+									value: A,
+									onChange: (e) => me(e.target.value),
+									className: "w-full rounded-md border bg-bg-surface pl-9 pr-4 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary"
 								})]
 							}),
-							/* @__PURE__ */ y("select", {
-								value: M,
-								onChange: (e) => N(e.target.value),
-								className: "rounded-md border bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
-								children: [/* @__PURE__ */ v("option", {
+							/* @__PURE__ */ _("select", {
+								value: j,
+								onChange: (e) => M(e.target.value),
+								className: "rounded-md border bg-bg-surface px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
+								children: [/* @__PURE__ */ g("option", {
 									value: "",
-									children: T("devportal.allStatus", "All Status")
-								}), Object.keys(ne).map((e) => /* @__PURE__ */ v("option", {
+									children: w("devportal.allStatus", "All Status")
+								}), Object.keys(ne).map((e) => /* @__PURE__ */ g("option", {
 									value: e,
 									children: e.replace(/_/g, " ")
 								}, e))]
 							}),
-							/* @__PURE__ */ y("select", {
-								value: P,
-								onChange: (e) => F(e.target.value),
-								className: "rounded-md border bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
-								children: [/* @__PURE__ */ v("option", {
+							/* @__PURE__ */ _("select", {
+								value: N,
+								onChange: (e) => P(e.target.value),
+								className: "rounded-md border bg-bg-surface px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
+								children: [/* @__PURE__ */ g("option", {
 									value: "",
-									children: T("devportal.allTypes", "All Types")
-								}), Object.entries(a).map(([e, t]) => /* @__PURE__ */ v("option", {
+									children: w("devportal.allTypes", "All Types")
+								}), Object.entries(re).map(([e, t]) => /* @__PURE__ */ g("option", {
 									value: e,
 									children: t
 								}, e))]
 							})
 						]
-					}), /* @__PURE__ */ y("div", {
+					}), /* @__PURE__ */ _("div", {
 						className: "flex items-center gap-1 rounded-md border p-1",
-						children: [/* @__PURE__ */ v("button", {
-							onClick: () => A("grid"),
-							className: `rounded p-1.5 ${k === "grid" ? "bg-muted" : "hover:bg-muted/50"}`,
+						children: [/* @__PURE__ */ g("button", {
+							onClick: () => k("grid"),
+							className: `rounded p-1.5 ${O === "grid" ? "bg-bg-sunken" : "hover:bg-bg-sunken/50"}`,
 							title: "Grid view",
-							children: /* @__PURE__ */ v(h, { size: 16 })
-						}), /* @__PURE__ */ v("button", {
-							onClick: () => A("list"),
-							className: `rounded p-1.5 ${k === "list" ? "bg-muted" : "hover:bg-muted/50"}`,
+							children: /* @__PURE__ */ g(p, { size: 16 })
+						}), /* @__PURE__ */ g("button", {
+							onClick: () => k("list"),
+							className: `rounded p-1.5 ${O === "list" ? "bg-bg-sunken" : "hover:bg-bg-sunken/50"}`,
 							title: "List view",
-							children: /* @__PURE__ */ v(g, { size: 16 })
+							children: /* @__PURE__ */ g(m, { size: 16 })
 						})]
 					})]
 				}),
-				B && /* @__PURE__ */ v("div", {
-					className: `rounded-lg border px-4 py-3 text-sm ${B.type === "success" ? "border-border-subtle bg-status-success-bg-subtle text-status-success-text" : "border-destructive/40 bg-destructive/10 text-destructive"}`,
-					children: /* @__PURE__ */ y("div", {
+				/* @__PURE__ */ g(fe, {
+					className: "mt-4",
+					children: /* @__PURE__ */ _("div", {
+						className: "grid grid-cols-2 gap-4 sm:grid-cols-4",
+						children: [
+							/* @__PURE__ */ _(v, {
+								treatment: "metric",
+								className: "p-4",
+								children: [/* @__PURE__ */ g("p", {
+									className: "text-sm text-text-secondary",
+									children: w("devportal.totalApps", "Total Apps")
+								}), /* @__PURE__ */ g("p", {
+									className: "mt-1 text-2xl font-semibold tabular-nums",
+									children: J.total
+								})]
+							}),
+							/* @__PURE__ */ _(v, {
+								treatment: "metric",
+								className: "p-4",
+								children: [/* @__PURE__ */ g("p", {
+									className: "text-sm text-status-success-text",
+									children: w("devportal.active", "Active")
+								}), /* @__PURE__ */ g("p", {
+									className: "mt-1 text-2xl font-semibold tabular-nums",
+									children: J.active
+								})]
+							}),
+							/* @__PURE__ */ _(v, {
+								treatment: "metric",
+								className: "p-4",
+								children: [/* @__PURE__ */ g("p", {
+									className: "text-sm text-text-secondary",
+									children: w("devportal.published", "Published")
+								}), /* @__PURE__ */ g("p", {
+									className: "mt-1 text-2xl font-semibold tabular-nums",
+									children: J.published
+								})]
+							}),
+							/* @__PURE__ */ _(v, {
+								treatment: "metric",
+								className: "p-4",
+								children: [/* @__PURE__ */ g("p", {
+									className: "text-sm text-text-secondary",
+									children: w("devportal.draft", "Draft")
+								}), /* @__PURE__ */ g("p", {
+									className: "mt-1 text-2xl font-semibold tabular-nums",
+									children: J.draft
+								})]
+							})
+						]
+					})
+				}),
+				z && /* @__PURE__ */ g("div", {
+					className: `rounded-lg border px-4 py-3 text-sm ${z.type === "success" ? "border-border-subtle bg-status-success-bg-subtle text-status-success-text" : "border-status-error-border/40 bg-status-error-bg/10 text-status-error-text"}`,
+					children: /* @__PURE__ */ _("div", {
 						className: "flex items-center justify-between gap-3",
-						children: [/* @__PURE__ */ v("span", { children: B.message }), /* @__PURE__ */ v("button", {
-							onClick: () => V(null),
+						children: [/* @__PURE__ */ g("span", { children: z.message }), /* @__PURE__ */ g("button", {
+							onClick: () => B(null),
 							className: "text-xs font-medium underline underline-offset-2",
 							children: "Dismiss"
 						})]
 					})
 				}),
-				J.length > 0 && /* @__PURE__ */ v("div", {
-					className: "rounded-lg border bg-card p-4",
-					children: /* @__PURE__ */ y("div", {
+				q.length > 0 && /* @__PURE__ */ g("div", {
+					className: "rounded-card border border-border-seam bg-bg-surface p-4 shadow-[var(--shadow-pop)]",
+					children: /* @__PURE__ */ _("div", {
 						className: "flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between",
-						children: [/* @__PURE__ */ y("div", {
+						children: [/* @__PURE__ */ _("div", {
 							className: "flex flex-wrap items-center gap-3",
-							children: [/* @__PURE__ */ y("div", {
+							children: [/* @__PURE__ */ _("div", {
 								className: "flex items-center gap-2",
-								children: [/* @__PURE__ */ v(re, {
+								children: [/* @__PURE__ */ g(ie, {
 									checked: Z,
-									indeterminate: me,
-									onChange: he,
+									indeterminate: _e,
+									onChange: ve,
 									ariaLabel: "Select all visible applications"
-								}), /* @__PURE__ */ v("span", {
+								}), /* @__PURE__ */ g("span", {
 									className: "text-sm font-medium",
 									children: "Select all visible"
 								})]
-							}), I.size > 0 && /* @__PURE__ */ v("button", {
+							}), F.size > 0 && /* @__PURE__ */ g("button", {
 								onClick: $,
-								className: "text-sm text-muted-foreground hover:text-foreground",
+								className: "text-sm text-text-secondary hover:text-text-primary",
 								children: "Clear selection"
 							})]
-						}), /* @__PURE__ */ y("div", {
+						}), /* @__PURE__ */ _("div", {
 							className: "flex flex-wrap items-center gap-2",
 							children: [
-								/* @__PURE__ */ y("span", {
-									className: "rounded-full bg-muted px-3 py-1 text-sm font-medium text-muted-foreground",
-									children: [I.size, " selected"]
+								/* @__PURE__ */ _("span", {
+									className: "rounded-full bg-bg-sunken px-3 py-1 text-sm font-medium text-text-secondary",
+									children: [F.size, " selected"]
 								}),
-								/* @__PURE__ */ y("button", {
-									onClick: () => z("deactivate"),
-									disabled: X.length === 0 || !O.allowed,
-									"aria-disabled": X.length === 0 || !O.allowed,
-									title: O.allowed ? void 0 : T("devportal.common.noPermission", "You do not have permission to perform this action"),
+								/* @__PURE__ */ _("button", {
+									onClick: () => R("deactivate"),
+									disabled: X.length === 0 || !D.allowed,
+									"aria-disabled": X.length === 0 || !D.allowed,
+									title: D.allowed ? void 0 : w("devportal.common.noPermission", "You do not have permission to perform this action"),
 									className: "inline-flex items-center gap-2 rounded-md border border-status-warning-bg px-3 py-2 text-sm font-medium text-status-warning-text transition-colors hover:bg-status-warning-bg-subtle disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary",
 									children: [
-										/* @__PURE__ */ v(m, {
+										/* @__PURE__ */ g(f, {
 											size: 16,
 											"aria-hidden": "true"
 										}),
-										T("devportal.deactivateSelected", "Deactivate Selected"),
+										w("devportal.deactivateSelected", "Deactivate Selected"),
 										X.length > 0 ? ` (${X.length})` : ""
 									]
 								}),
-								/* @__PURE__ */ y("button", {
-									onClick: () => z("delete"),
-									disabled: Y.length === 0 || !D.allowed,
-									"aria-disabled": Y.length === 0 || !D.allowed,
-									title: D.allowed ? void 0 : T("devportal.common.noPermission", "You do not have permission to perform this action"),
+								/* @__PURE__ */ _("button", {
+									onClick: () => R("delete"),
+									disabled: Y.length === 0 || !E.allowed,
+									"aria-disabled": Y.length === 0 || !E.allowed,
+									title: E.allowed ? void 0 : w("devportal.common.noPermission", "You do not have permission to perform this action"),
 									className: "inline-flex items-center gap-2 rounded-md border border-status-error-bg px-3 py-2 text-sm font-medium text-status-error-text transition-colors hover:bg-status-error-bg-subtle disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary",
 									children: [
-										/* @__PURE__ */ v(le, {
+										/* @__PURE__ */ g(de, {
 											size: 16,
 											"aria-hidden": "true"
 										}),
-										T("devportal.deleteSelected", "Delete Selected"),
+										w("devportal.deleteSelected", "Delete Selected"),
 										Y.length > 0 ? ` (${Y.length})` : ""
 									]
 								})
@@ -276,51 +335,52 @@ var x = () => {
 						})]
 					})
 				}),
-				/* @__PURE__ */ y("p", {
-					className: "text-sm text-muted-foreground",
+				/* @__PURE__ */ _("p", {
+					className: "text-sm text-text-secondary",
 					children: [
-						J.length,
+						q.length,
 						" application",
-						J.length === 1 ? "" : "s",
+						q.length === 1 ? "" : "s",
 						" found"
 					]
 				}),
-				J.length > 0 ? k === "grid" ? /* @__PURE__ */ v("div", {
+				q.length > 0 ? O === "grid" ? /* @__PURE__ */ g("div", {
 					className: "grid gap-4 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
-					children: J.map((e) => /* @__PURE__ */ v(ie, {
+					children: q.map((e) => /* @__PURE__ */ g(ae, {
 						app: e,
-						selected: I.has(e.id),
+						selected: F.has(e.id),
 						onToggleSelect: (t) => Q(e.id, t)
 					}, e.id))
-				}) : /* @__PURE__ */ v("div", {
+				}) : /* @__PURE__ */ g("div", {
 					className: "space-y-2",
-					children: J.map((e) => /* @__PURE__ */ v(ae, {
+					children: q.map((e) => /* @__PURE__ */ g(oe, {
 						app: e,
-						selected: I.has(e.id),
+						selected: F.has(e.id),
 						onToggleSelect: (t) => Q(e.id, t)
 					}, e.id))
-				}) : /* @__PURE__ */ v(t, {
-					icon: /* @__PURE__ */ v(p, { size: 32 }),
-					title: T("devportal.noApplicationsFound", "No applications found"),
-					description: j || M || P ? T("devportal.tryAdjustingFilters", "Try adjusting your filters") : T("devportal.createFirstApp", "Create your first application to get started"),
-					action: !j && !M && !P ? /* @__PURE__ */ y("button", {
-						onClick: () => q("/apps/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__ */ v(_, { size: 16 }), T("devportal.createApp", "Create App")]
+				}) : /* @__PURE__ */ g(t, {
+					illustration: A || j || N ? "empty-search" : "empty-data",
+					icon: /* @__PURE__ */ g(d, { size: 32 }),
+					title: w("devportal.noApplicationsFound", "No applications found"),
+					description: A || j || N ? w("devportal.tryAdjustingFilters", "Try adjusting your filters") : w("devportal.createFirstApp", "Create your first application to get started"),
+					action: !A && !j && !N ? /* @__PURE__ */ _("button", {
+						onClick: () => K("/apps/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__ */ g(h, { size: 16 }), w("devportal.createApp", "Create App")]
 					}) : void 0
 				}),
-				/* @__PURE__ */ v(o, {
-					open: R === "deactivate",
+				/* @__PURE__ */ g(a, {
+					open: L === "deactivate",
 					onOpenChange: (e) => {
-						e || z(null);
+						e || R(null);
 					},
 					onConfirm: async () => {
 						if (X.length === 0) return;
-						let e = await Promise.allSettled(X.map((e) => K({ variables: { id: e.id } }))), t = e.filter((e) => e.status === "fulfilled").length, n = e.length - t;
-						V({
+						let e = await Promise.allSettled(X.map((e) => G({ variables: { id: e.id } }))), t = e.filter((e) => e.status === "fulfilled").length, n = e.length - t;
+						B({
 							type: n === 0 ? "success" : "error",
-							message: b("Deactivated", t, n)
-						}), $(), z(null), await W();
+							message: y("Deactivated", t, n)
+						}), $(), R(null), await U();
 					},
 					title: "Deactivate selected applications",
 					description: `Deactivate ${X.length} selected application${X.length === 1 ? "" : "s"}? Users and integrations may lose access until these apps are re-enabled.`,
@@ -328,18 +388,18 @@ var x = () => {
 					cancelLabel: "Cancel",
 					variant: "warning"
 				}),
-				/* @__PURE__ */ v(o, {
-					open: R === "delete",
+				/* @__PURE__ */ g(a, {
+					open: L === "delete",
 					onOpenChange: (e) => {
-						e || z(null);
+						e || R(null);
 					},
 					onConfirm: async () => {
 						if (Y.length === 0) return;
-						let e = await Promise.allSettled(Y.map((e) => pe({ variables: { id: e.id } }))), t = e.filter((e) => e.status === "fulfilled").length, n = e.length - t;
-						V({
+						let e = await Promise.allSettled(Y.map((e) => ge({ variables: { id: e.id } }))), t = e.filter((e) => e.status === "fulfilled").length, n = e.length - t;
+						B({
 							type: n === 0 ? "success" : "error",
-							message: b("Deleted", t, n)
-						}), $(), z(null), await W();
+							message: y("Deleted", t, n)
+						}), $(), R(null), await U();
 					},
 					title: "Delete selected applications",
 					description: `Delete ${Y.length} selected application${Y.length === 1 ? "" : "s"}? This cannot be undone.`,
@@ -352,6 +412,6 @@ var x = () => {
 	});
 };
 //#endregion
-export { x as ApplicationsPage };
+export { b as ApplicationsPage };
 
 //# sourceMappingURL=ApplicationsPage.js.map