@burdenoff/microfe-devportal 2026.609.3 → 2026.611.1

package/dist/devportal/pages/WebhooksPage.js

@@ -5,20 +5,20 @@ import { PageLayout as r } from "../components/PageLayout.js";
 import { StatusBadge as i } from "../components/StatusBadge.js";
 import { AppListItem as a } from "../components/AppCard.js";
 import { DataTable as o } from "../components/DataTable.js";
-import { useGetApplicationsQuery as s, useGetWebhooksQuery as c } from "../../generated/global-operations.js";
-import { PermissionGuard as l } from "../components/PermissionGuard.js";
+import { useGetApplicationQuery as s, useGetApplicationsQuery as c, useGetWebhooksQuery as l } from "../../generated/global-operations.js";
+import { PermissionGuard as u } from "../components/PermissionGuard.js";
 import "../components/index.js";
-import { DEVPORTAL_PERMISSIONS as u } from "../constants/permissions.js";
-import { getErrorMessage as d } from "../hooks/useGraphQL.js";
-import { useDevportalPermission as f } from "../hooks/usePermission.js";
+import { DEVPORTAL_PERMISSIONS as d } from "../constants/permissions.js";
+import { getErrorMessage as f } from "../hooks/useGraphQL.js";
+import { useDevportalPermission as p } from "../hooks/usePermission.js";
 import "../hooks/index.js";
-import { useState as p } from "react";
-import { useI18n as m } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { AlertCircle as h, AlertTriangle as g, AppWindow as _, CheckCircle as v, Loader2 as y, PauseCircle as b, Plus as x, Search as S, Webhook as C, XCircle as w } from "lucide-react";
-import { useParams as T } from "react-router-dom";
-import { jsx as E, jsxs as D } from "react/jsx-runtime";
+import { useEffect as m, useState as h } from "react";
+import { useI18n as g } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AlertCircle as _, AlertTriangle as v, AppWindow as y, CheckCircle as b, Loader2 as x, PauseCircle as S, Plus as C, Search as w, Webhook as T, XCircle as E } from "lucide-react";
+import { useParams as D } from "react-router-dom";
+import { jsx as O, jsxs as k } from "react/jsx-runtime";
 //#region src/devportal/pages/WebhooksPage.tsx
-function O(e) {
+function A(e) {
 	return {
 		id: e.id,
 		applicationId: e.applicationId,
@@ -42,167 +42,185 @@ function O(e) {
 		updatedAt: e.updatedAt
 	};
 }
-var k = () => {
-	let { appId: k } = T(), { navigate: j, basePath: M } = e(), { t: ee } = m(), N = (e, t) => {
-		let n = ee(e);
+var j = () => {
+	let { appId: j } = D(), { navigate: ee, basePath: te } = e(), { t: N } = g(), P = (e, t) => {
+		let n = N(e);
 		return n === e ? t : n;
-	}, P = f(u.WEBHOOK_CREATE), [F, I] = p(""), [L, R] = p(""), { data: z, loading: B, error: V, refetch: H } = s({
+	}, F = p(d.WEBHOOK_CREATE), [I, L] = h(""), [R, z] = h(""), { data: B } = s({
+		variables: { id: j ?? "" },
+		skip: !j,
+		fetchPolicy: "cache-first"
+	});
+	m(() => {
+		let e = B?.application?.name;
+		if (!j || !e) return;
+		let t = window.__breadcrumbRegistry;
+		return t?.register(j, e), () => t?.unregister(j);
+	}, [j, B?.application?.name]);
+	let { data: V, loading: H, error: U, refetch: W } = c({
 		variables: { limit: 100 },
-		skip: !!k,
+		skip: !!j,
 		fetchPolicy: "cache-and-network"
-	}), { data: U, loading: W, error: G, refetch: K } = c({
-		variables: { applicationId: k || "" },
-		skip: !k,
+	}), { data: G, loading: K, error: q, refetch: J } = l({
+		variables: { applicationId: j || "" },
+		skip: !j,
 		fetchPolicy: "cache-and-network"
-	}), q = U?.webhooks?.map(O) ?? [], J = z?.applications?.edges?.map((e) => e.node) ?? [], Y = (e) => {
-		j?.(`${M}${e}`);
-	}, X = q.filter((e) => {
-		let t = !F || e.name.toLowerCase().includes(F.toLowerCase()) || e.url.toLowerCase().includes(F.toLowerCase()), n = !L || e.status === L;
+	}), Y = G?.webhooks?.map(A) ?? [], X = V?.applications?.edges?.map((e) => e.node) ?? [], Z = (e) => {
+		ee?.(`${te}${e}`);
+	}, Q = Y.filter((e) => {
+		let t = !I || e.name.toLowerCase().includes(I.toLowerCase()) || e.url.toLowerCase().includes(I.toLowerCase()), n = !R || e.status === R;
 		return t && n;
-	}), Z = (e) => {
+	}), ne = (e) => {
 		switch (e) {
-			case "ACTIVE": return /* @__PURE__ */ E(v, {
+			case "ACTIVE": return /* @__PURE__ */ O(b, {
 				size: 16,
 				className: "text-status-success-text"
 			});
-			case "PAUSED": return /* @__PURE__ */ E(b, {
+			case "PAUSED": return /* @__PURE__ */ O(S, {
 				size: 16,
 				className: "text-status-warning-text"
 			});
-			case "FAILED": return /* @__PURE__ */ E(w, {
+			case "FAILED": return /* @__PURE__ */ O(E, {
 				size: 16,
 				className: "text-status-error-text"
 			});
-			case "DISABLED": return /* @__PURE__ */ E(g, {
+			case "DISABLED": return /* @__PURE__ */ O(v, {
 				size: 16,
 				className: "text-text-tertiary"
 			});
 			default: return null;
 		}
-	}, Q = (e) => {
+	}, re = (e) => {
 		let t = e.successCount + e.failureCount;
 		return t === 0 ? 100 : Math.round(e.successCount / t * 100);
 	};
-	if (!k) {
-		let e = J.filter((e) => {
-			if (!F) return !0;
-			let t = F.toLowerCase();
+	if (!j) {
+		let e = X.filter((e) => {
+			if (!I) return !0;
+			let t = I.toLowerCase();
 			return e.name.toLowerCase().includes(t) || (e.slug ?? "").toLowerCase().includes(t);
 		});
-		return /* @__PURE__ */ E(l, {
-			permission: u.WEBHOOK_READ,
-			children: /* @__PURE__ */ E(r, {
-				title: N("devportal.webhooks", "Webhooks"),
-				description: N("devportal.manageWebhooksApps", "Manage webhooks for your applications"),
-				children: /* @__PURE__ */ D("div", {
+		return /* @__PURE__ */ O(u, {
+			permission: d.WEBHOOK_READ,
+			children: /* @__PURE__ */ O(r, {
+				title: P("devportal.webhooks", "Webhooks"),
+				description: P("devportal.manageWebhooksApps", "Manage webhooks for your applications"),
+				children: /* @__PURE__ */ k("div", {
 					className: "space-y-4",
-					children: [/* @__PURE__ */ E("div", {
-						className: "max-w-md",
-						children: /* @__PURE__ */ D("div", {
-							className: "relative",
-							children: [/* @__PURE__ */ E(S, {
-								size: 16,
-								className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
-							}), /* @__PURE__ */ E("input", {
-								type: "text",
-								placeholder: "Search applications...",
-								value: F,
-								onChange: (e) => I(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"
-							})]
-						})
-					}), B ? /* @__PURE__ */ E("div", {
-						className: "flex items-center justify-center py-12 text-muted-foreground",
-						children: /* @__PURE__ */ E(y, { className: "h-8 w-8 animate-spin" })
-					}) : V ? /* @__PURE__ */ D("div", {
-						className: "rounded-lg border border-destructive/50 bg-destructive/10 p-6 text-center",
-						children: [
-							/* @__PURE__ */ E(h, { className: "mx-auto h-8 w-8 text-destructive" }),
-							/* @__PURE__ */ E("h3", {
-								className: "mt-2 font-medium text-destructive",
-								children: "Failed to load applications"
-							}),
-							/* @__PURE__ */ E("p", {
-								className: "mt-1 text-sm text-muted-foreground",
-								children: d(V)
-							}),
-							/* @__PURE__ */ E("button", {
-								onClick: () => H(),
-								className: "mt-4 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90",
-								children: "Try Again"
+					children: [
+						/* @__PURE__ */ O("p", {
+							className: "text-sm text-muted-foreground",
+							children: P("devportal.webhooksSelectAppHint", "Select an application below to view and manage its webhooks.")
+						}),
+						/* @__PURE__ */ O("div", {
+							className: "max-w-md",
+							children: /* @__PURE__ */ k("div", {
+								className: "relative",
+								children: [/* @__PURE__ */ O(w, {
+									size: 16,
+									className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
+								}), /* @__PURE__ */ O("input", {
+									type: "text",
+									placeholder: "Search applications...",
+									value: I,
+									onChange: (e) => L(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"
+								})]
+							})
+						}),
+						H ? /* @__PURE__ */ O("div", {
+							className: "flex items-center justify-center py-12 text-muted-foreground",
+							children: /* @__PURE__ */ O(x, { className: "h-8 w-8 animate-spin" })
+						}) : U ? /* @__PURE__ */ k("div", {
+							className: "rounded-lg border border-destructive/50 bg-destructive/10 p-6 text-center",
+							children: [
+								/* @__PURE__ */ O(_, { className: "mx-auto h-8 w-8 text-destructive" }),
+								/* @__PURE__ */ O("h3", {
+									className: "mt-2 font-medium text-destructive",
+									children: "Failed to load applications"
+								}),
+								/* @__PURE__ */ O("p", {
+									className: "mt-1 text-sm text-muted-foreground",
+									children: f(U)
+								}),
+								/* @__PURE__ */ O("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: "Try Again"
+								})
+							]
+						}) : e.length > 0 ? /* @__PURE__ */ O("div", {
+							className: "space-y-2",
+							children: e.map((e) => /* @__PURE__ */ O(a, {
+								app: e,
+								onClick: () => Z(`/apps/${e.id}/webhooks`)
+							}, e.id))
+						}) : /* @__PURE__ */ O(n, {
+							icon: /* @__PURE__ */ O(y, { size: 32 }),
+							title: "No applications available",
+							description: I ? "No applications matched your search." : "Create an application before configuring webhooks.",
+							action: /* @__PURE__ */ k("button", {
+								onClick: () => Z("/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__ */ O(C, { size: 16 }), "Create Application"]
 							})
-						]
-					}) : e.length > 0 ? /* @__PURE__ */ E("div", {
-						className: "space-y-2",
-						children: e.map((e) => /* @__PURE__ */ E(a, {
-							app: e,
-							onClick: () => Y(`/apps/${e.id}/webhooks`)
-						}, e.id))
-					}) : /* @__PURE__ */ E(n, {
-						icon: /* @__PURE__ */ E(_, { size: 32 }),
-						title: "No applications available",
-						description: F ? "No applications matched your search." : "Create an application before configuring webhooks.",
-						action: /* @__PURE__ */ D("button", {
-							onClick: () => Y("/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__ */ E(x, { size: 16 }), "Create Application"]
 						})
-					})]
+					]
 				})
 			})
 		});
 	}
-	if (W && !U) return /* @__PURE__ */ E(r, {
-		title: N("devportal.webhooks", "Webhooks"),
-		description: N("devportal.manageWebhooksApp", "Manage webhooks for this application"),
-		backLink: `/apps/${k}`,
-		backLabel: N("devportal.backToApplication", "Back to Application"),
-		children: /* @__PURE__ */ D("div", {
+	if (K && !G) return /* @__PURE__ */ O(r, {
+		title: P("devportal.webhooks", "Webhooks"),
+		description: P("devportal.manageWebhooksApp", "Manage webhooks for this application"),
+		backLink: `/apps/${j}`,
+		backLabel: P("devportal.backToApplication", "Back to Application"),
+		children: /* @__PURE__ */ k("div", {
 			className: "flex items-center justify-center py-12",
-			children: [/* @__PURE__ */ E(y, { className: "h-8 w-8 animate-spin text-muted-foreground" }), /* @__PURE__ */ E("span", {
+			children: [/* @__PURE__ */ O(x, { className: "h-8 w-8 animate-spin text-muted-foreground" }), /* @__PURE__ */ O("span", {
 				className: "ml-2 text-muted-foreground",
-				children: N("devportal.loadingWebhooks", "Loading webhooks...")
+				children: P("devportal.loadingWebhooks", "Loading webhooks...")
 			})]
 		})
 	});
-	if (G) return /* @__PURE__ */ E(r, {
-		title: N("devportal.webhooks", "Webhooks"),
-		description: N("devportal.manageWebhooksApp", "Manage webhooks for this application"),
-		backLink: `/apps/${k}`,
-		backLabel: N("devportal.backToApplication", "Back to Application"),
-		children: /* @__PURE__ */ D("div", {
+	if (q) return /* @__PURE__ */ O(r, {
+		title: P("devportal.webhooks", "Webhooks"),
+		description: P("devportal.manageWebhooksApp", "Manage webhooks for this application"),
+		backLink: `/apps/${j}`,
+		backLabel: P("devportal.backToApplication", "Back to Application"),
+		children: /* @__PURE__ */ k("div", {
 			className: "rounded-lg border border-destructive/50 bg-destructive/10 p-6 text-center",
 			children: [
-				/* @__PURE__ */ E(h, { className: "mx-auto h-8 w-8 text-destructive" }),
-				/* @__PURE__ */ E("h3", {
+				/* @__PURE__ */ O(_, { className: "mx-auto h-8 w-8 text-destructive" }),
+				/* @__PURE__ */ O("h3", {
 					className: "mt-2 font-medium text-destructive",
-					children: N("devportal.failedToLoadWebhooks", "Failed to load webhooks")
+					children: P("devportal.failedToLoadWebhooks", "Failed to load webhooks")
 				}),
-				/* @__PURE__ */ E("p", {
+				/* @__PURE__ */ O("p", {
 					className: "mt-1 text-sm text-muted-foreground",
-					children: d(G)
+					children: f(q)
 				}),
-				/* @__PURE__ */ E("button", {
-					onClick: () => K(),
+				/* @__PURE__ */ O("button", {
+					onClick: () => J(),
 					className: "mt-4 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90",
-					children: N("devportal.tryAgain", "Try Again")
+					children: P("devportal.tryAgain", "Try Again")
 				})
 			]
 		})
 	});
-	let te = [
+	let ie = [
 		{
 			key: "name",
 			header: "Webhook",
-			render: (e) => /* @__PURE__ */ D("div", {
+			render: (e) => /* @__PURE__ */ k("div", {
 				className: "flex items-center gap-3",
-				children: [/* @__PURE__ */ E("div", {
+				children: [/* @__PURE__ */ O("div", {
 					className: t("flex h-10 w-10 items-center justify-center rounded-lg", e.status === "ACTIVE" ? "bg-status-success-bg-subtle text-status-success-text" : e.status === "FAILED" ? "bg-status-error-bg-subtle text-status-error-text" : e.status === "PAUSED" ? "bg-status-warning-bg-subtle text-status-warning-text" : "bg-bg-sunken text-text-tertiary"),
-					children: /* @__PURE__ */ E(C, { size: 20 })
-				}), /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
+					children: /* @__PURE__ */ O(T, { size: 20 })
+				}), /* @__PURE__ */ k("div", { children: [/* @__PURE__ */ O("p", {
 					className: "font-medium",
 					children: e.name
-				}), /* @__PURE__ */ E("p", {
+				}), /* @__PURE__ */ O("p", {
 					className: "text-xs text-muted-foreground truncate max-w-xs",
 					children: e.url
 				})] })]
@@ -211,12 +229,12 @@ var k = () => {
 		{
 			key: "events",
 			header: "Events",
-			render: (e) => /* @__PURE__ */ D("div", {
+			render: (e) => /* @__PURE__ */ k("div", {
 				className: "flex flex-wrap gap-1",
-				children: [e.events.slice(0, 2).map((e) => /* @__PURE__ */ E("span", {
+				children: [e.events.slice(0, 2).map((e) => /* @__PURE__ */ O("span", {
 					className: "inline-flex rounded bg-muted px-1.5 py-0.5 text-xs",
 					children: e.split(".")[0]
-				}, e)), e.events.length > 2 && /* @__PURE__ */ D("span", {
+				}, e)), e.events.length > 2 && /* @__PURE__ */ k("span", {
 					className: "text-xs text-muted-foreground",
 					children: [
 						"+",
@@ -229,9 +247,9 @@ var k = () => {
 		{
 			key: "status",
 			header: "Status",
-			render: (e) => /* @__PURE__ */ D("div", {
+			render: (e) => /* @__PURE__ */ k("div", {
 				className: "flex items-center gap-2",
-				children: [Z(e.status), /* @__PURE__ */ E(i, {
+				children: [ne(e.status), /* @__PURE__ */ O(i, {
 					status: e.status,
 					type: "webhook"
 				})]
@@ -241,18 +259,18 @@ var k = () => {
 			key: "successRate",
 			header: "Success Rate",
 			render: (e) => {
-				let n = Q(e);
-				return /* @__PURE__ */ D("div", {
+				let n = re(e);
+				return /* @__PURE__ */ k("div", {
 					className: "w-24",
-					children: [/* @__PURE__ */ E("div", {
+					children: [/* @__PURE__ */ O("div", {
 						className: "flex items-center justify-between text-xs mb-1",
-						children: /* @__PURE__ */ D("span", {
+						children: /* @__PURE__ */ k("span", {
 							className: t(n >= 95 ? "text-status-success-text" : n >= 80 ? "text-status-warning-text" : "text-status-error-text"),
 							children: [n, "%"]
 						})
-					}), /* @__PURE__ */ E("div", {
+					}), /* @__PURE__ */ O("div", {
 						className: "h-1.5 rounded-full bg-muted",
-						children: /* @__PURE__ */ E("div", {
+						children: /* @__PURE__ */ O("div", {
 							className: t("h-full rounded-full transition-all", n >= 95 ? "bg-status-success-bg-subtle" : n >= 80 ? "bg-status-warning-bg-subtle" : "bg-status-error-bg-subtle"),
 							style: { width: `${n}%` }
 						})
@@ -263,18 +281,18 @@ var k = () => {
 		{
 			key: "deliveries",
 			header: "Deliveries",
-			render: (e) => /* @__PURE__ */ D("div", {
+			render: (e) => /* @__PURE__ */ k("div", {
 				className: "text-sm",
 				children: [
-					/* @__PURE__ */ E("span", {
+					/* @__PURE__ */ O("span", {
 						className: "text-status-success-text",
 						children: e.successCount.toLocaleString()
 					}),
-					/* @__PURE__ */ E("span", {
+					/* @__PURE__ */ O("span", {
 						className: "text-muted-foreground",
 						children: " / "
 					}),
-					/* @__PURE__ */ E("span", {
+					/* @__PURE__ */ O("span", {
 						className: "text-status-error-text",
 						children: e.failureCount.toLocaleString()
 					})
@@ -284,74 +302,74 @@ var k = () => {
 		{
 			key: "lastTriggered",
 			header: "Last Triggered",
-			render: (e) => /* @__PURE__ */ E("span", {
+			render: (e) => /* @__PURE__ */ O("span", {
 				className: "text-sm text-muted-foreground",
-				children: e.lastTriggeredAt ? A(e.lastTriggeredAt) : "Never"
+				children: e.lastTriggeredAt ? M(e.lastTriggeredAt) : "Never"
 			})
 		}
 	], $ = {
-		total: q.length,
-		active: q.filter((e) => e.status === "ACTIVE").length,
-		failed: q.filter((e) => e.status === "FAILED").length,
-		paused: q.filter((e) => e.status === "PAUSED").length
+		total: Y.length,
+		active: Y.filter((e) => e.status === "ACTIVE").length,
+		failed: Y.filter((e) => e.status === "FAILED").length,
+		paused: Y.filter((e) => e.status === "PAUSED").length
 	};
-	return /* @__PURE__ */ E(l, {
-		permission: u.WEBHOOK_READ,
-		children: /* @__PURE__ */ D(r, {
-			title: N("devportal.webhooks", "Webhooks"),
-			description: N("devportal.manageWebhooksApp", "Manage webhooks for this application"),
-			backLink: `/apps/${k}`,
-			backLabel: N("devportal.backToApplication", "Back to Application"),
-			actions: /* @__PURE__ */ D("button", {
-				onClick: () => Y(`/apps/${k}/webhooks/new`),
-				disabled: !P.allowed,
-				"aria-disabled": !P.allowed,
-				title: P.allowed ? void 0 : N("devportal.common.noPermission", "You do not have permission to perform this action"),
+	return /* @__PURE__ */ O(u, {
+		permission: d.WEBHOOK_READ,
+		children: /* @__PURE__ */ k(r, {
+			title: P("devportal.webhooks", "Webhooks"),
+			description: P("devportal.manageWebhooksApp", "Manage webhooks for this application"),
+			backLink: `/apps/${j}`,
+			backLabel: P("devportal.backToApplication", "Back to Application"),
+			actions: /* @__PURE__ */ k("button", {
+				onClick: () => Z(`/apps/${j}/webhooks/new`),
+				disabled: !F.allowed,
+				"aria-disabled": !F.allowed,
+				title: F.allowed ? void 0 : P("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__ */ E(x, {
+				children: [/* @__PURE__ */ O(C, {
 					size: 16,
 					"aria-hidden": "true"
-				}), N("devportal.createWebhook", "Create Webhook")]
+				}), P("devportal.createWebhook", "Create Webhook")]
 			}),
 			children: [
-				/* @__PURE__ */ E("div", {
+				/* @__PURE__ */ O("div", {
 					className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
-					children: /* @__PURE__ */ D("div", {
+					children: /* @__PURE__ */ k("div", {
 						className: "flex flex-1 items-center gap-4",
-						children: [/* @__PURE__ */ D("div", {
+						children: [/* @__PURE__ */ k("div", {
 							className: "relative flex-1 max-w-md",
-							children: [/* @__PURE__ */ E(S, {
+							children: [/* @__PURE__ */ O(w, {
 								size: 16,
 								className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
-							}), /* @__PURE__ */ E("input", {
+							}), /* @__PURE__ */ O("input", {
 								type: "text",
 								placeholder: "Search by name or URL...",
-								value: F,
-								onChange: (e) => I(e.target.value),
+								value: I,
+								onChange: (e) => L(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"
 							})]
-						}), /* @__PURE__ */ D("select", {
-							value: L,
-							onChange: (e) => R(e.target.value),
+						}), /* @__PURE__ */ k("select", {
+							value: R,
+							onChange: (e) => z(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__ */ E("option", {
+								/* @__PURE__ */ O("option", {
 									value: "",
 									children: "All Status"
 								}),
-								/* @__PURE__ */ E("option", {
+								/* @__PURE__ */ O("option", {
 									value: "ACTIVE",
 									children: "Active"
 								}),
-								/* @__PURE__ */ E("option", {
+								/* @__PURE__ */ O("option", {
 									value: "PAUSED",
 									children: "Paused"
 								}),
-								/* @__PURE__ */ E("option", {
+								/* @__PURE__ */ O("option", {
 									value: "FAILED",
 									children: "Failed"
 								}),
-								/* @__PURE__ */ E("option", {
+								/* @__PURE__ */ O("option", {
 									value: "DISABLED",
 									children: "Disabled"
 								})
@@ -359,96 +377,96 @@ var k = () => {
 						})]
 					})
 				}),
-				/* @__PURE__ */ D("div", {
+				/* @__PURE__ */ k("div", {
 					className: "grid grid-cols-2 gap-4 sm:grid-cols-4",
 					children: [
-						/* @__PURE__ */ D("div", {
+						/* @__PURE__ */ k("div", {
 							className: "rounded-lg border bg-card p-4",
-							children: [/* @__PURE__ */ D("div", {
+							children: [/* @__PURE__ */ k("div", {
 								className: "flex items-center gap-2 text-muted-foreground",
-								children: [/* @__PURE__ */ E(C, { size: 16 }), /* @__PURE__ */ E("span", {
+								children: [/* @__PURE__ */ O(T, { size: 16 }), /* @__PURE__ */ O("span", {
 									className: "text-sm",
 									children: "Total Webhooks"
 								})]
-							}), /* @__PURE__ */ E("p", {
+							}), /* @__PURE__ */ O("p", {
 								className: "mt-1 text-2xl font-semibold",
 								children: $.total
 							})]
 						}),
-						/* @__PURE__ */ D("div", {
+						/* @__PURE__ */ k("div", {
 							className: "rounded-lg border bg-card p-4",
-							children: [/* @__PURE__ */ D("div", {
+							children: [/* @__PURE__ */ k("div", {
 								className: "flex items-center gap-2 text-status-success-text",
-								children: [/* @__PURE__ */ E(v, { size: 16 }), /* @__PURE__ */ E("span", {
+								children: [/* @__PURE__ */ O(b, { size: 16 }), /* @__PURE__ */ O("span", {
 									className: "text-sm",
 									children: "Active"
 								})]
-							}), /* @__PURE__ */ E("p", {
+							}), /* @__PURE__ */ O("p", {
 								className: "mt-1 text-2xl font-semibold",
 								children: $.active
 							})]
 						}),
-						/* @__PURE__ */ D("div", {
+						/* @__PURE__ */ k("div", {
 							className: "rounded-lg border bg-card p-4",
-							children: [/* @__PURE__ */ D("div", {
+							children: [/* @__PURE__ */ k("div", {
 								className: "flex items-center gap-2 text-status-warning-text",
-								children: [/* @__PURE__ */ E(b, { size: 16 }), /* @__PURE__ */ E("span", {
+								children: [/* @__PURE__ */ O(S, { size: 16 }), /* @__PURE__ */ O("span", {
 									className: "text-sm",
 									children: "Paused"
 								})]
-							}), /* @__PURE__ */ E("p", {
+							}), /* @__PURE__ */ O("p", {
 								className: "mt-1 text-2xl font-semibold",
 								children: $.paused
 							})]
 						}),
-						/* @__PURE__ */ D("div", {
+						/* @__PURE__ */ k("div", {
 							className: "rounded-lg border bg-card p-4",
-							children: [/* @__PURE__ */ D("div", {
+							children: [/* @__PURE__ */ k("div", {
 								className: "flex items-center gap-2 text-status-error-text",
-								children: [/* @__PURE__ */ E(w, { size: 16 }), /* @__PURE__ */ E("span", {
+								children: [/* @__PURE__ */ O(E, { size: 16 }), /* @__PURE__ */ O("span", {
 									className: "text-sm",
 									children: "Failed"
 								})]
-							}), /* @__PURE__ */ E("p", {
+							}), /* @__PURE__ */ O("p", {
 								className: "mt-1 text-2xl font-semibold",
 								children: $.failed
 							})]
 						})
 					]
 				}),
-				/* @__PURE__ */ D("p", {
+				/* @__PURE__ */ k("p", {
 					className: "text-sm text-muted-foreground",
 					children: [
-						X.length,
+						Q.length,
 						" webhook",
-						X.length === 1 ? "" : "s",
+						Q.length === 1 ? "" : "s",
 						" found"
 					]
 				}),
-				X.length > 0 ? /* @__PURE__ */ E(o, {
-					data: X,
-					columns: te,
+				Q.length > 0 ? /* @__PURE__ */ O(o, {
+					data: Q,
+					columns: ie,
 					keyField: "id",
-					onRowClick: (e) => Y(`/apps/${k}/webhooks/${e.id}`)
-				}) : /* @__PURE__ */ E(n, {
-					icon: /* @__PURE__ */ E(C, { size: 32 }),
-					title: N("devportal.noWebhooksFound", "No webhooks found"),
-					description: F || L ? N("devportal.tryAdjustingFilters", "Try adjusting your filters") : N("devportal.createFirstWebhook", "Create your first webhook to receive real-time event notifications"),
-					action: !F && !L ? /* @__PURE__ */ D("button", {
-						onClick: () => Y(`/apps/${k}/webhooks/new`),
+					onRowClick: (e) => Z(`/apps/${j}/webhooks/${e.id}`)
+				}) : /* @__PURE__ */ O(n, {
+					icon: /* @__PURE__ */ O(T, { size: 32 }),
+					title: P("devportal.noWebhooksFound", "No webhooks found"),
+					description: I || R ? P("devportal.tryAdjustingFilters", "Try adjusting your filters") : P("devportal.createFirstWebhook", "Create your first webhook to receive real-time event notifications"),
+					action: !I && !R ? /* @__PURE__ */ k("button", {
+						onClick: () => Z(`/apps/${j}/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__ */ E(x, { size: 16 }), N("devportal.createWebhook", "Create Webhook")]
+						children: [/* @__PURE__ */ O(C, { size: 16 }), P("devportal.createWebhook", "Create Webhook")]
 					}) : void 0
 				})
 			]
 		})
 	});
 };
-function A(e) {
+function M(e) {
 	let t = new Date(e), n = (/* @__PURE__ */ new Date()).getTime() - t.getTime(), r = Math.floor(n / 6e4), i = Math.floor(r / 60), a = Math.floor(i / 24);
 	return r < 1 ? "Just now" : r < 60 ? `${r}m ago` : i < 24 ? `${i}h ago` : a < 7 ? `${a}d ago` : t.toLocaleDateString();
 }
 //#endregion
-export { k as WebhooksPage };
+export { j as WebhooksPage };
 
 //# sourceMappingURL=WebhooksPage.js.map