@burdenoff/microfe-devportal 2026.624.13 → 2026.624.15

package/dist/devportal/pages/OAuthClientDetailPage.js

@@ -1,308 +1,332 @@
 import { useDevportal as e } from "../providers/DevportalProvider.js";
 import { cn as t } from "../utils/cn.js";
-import { useDeactivateAppMutation as n, useGetAuthAppQuery as r, useRotateAppSecretMutation as i, useUpdateAuthAppMutation as ee } from "../../generated/global-operations.js";
-import { getErrorMessage as a } from "../hooks/useGraphQL.js";
-import { PageLayout as o } from "../components/PageLayout.js";
-import { ActiveIndicator as s } from "../components/StatusBadge.js";
-import { nativeCopyText as c, nativeImpact as l, nativeNotify as u } from "../../utils/nativeBridge.js";
-import { PermissionGuard as d } from "../components/PermissionGuard.js";
+import { useDeactivateAppMutation as n, useGetAuthAppQuery as r, useRotateAppSecretMutation as i, useUpdateAuthAppMutation as a } from "../../generated/global-operations.js";
+import { getErrorMessage as o } from "../hooks/useGraphQL.js";
+import { PageLayout as s } from "../components/PageLayout.js";
+import { ActiveIndicator as c } from "../components/StatusBadge.js";
+import { nativeCopyText as l, nativeImpact as u, nativeNotify as d } from "../../utils/nativeBridge.js";
+import { PermissionGuard as f } from "../components/PermissionGuard.js";
 import "../components/index.js";
-import { DEVPORTAL_PERMISSIONS as f } from "../constants/permissions.js";
+import { DEVPORTAL_PERMISSIONS as p } from "../constants/permissions.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, ArrowLeft as g, Copy as _, Eye as te, EyeOff as ne, Loader2 as re, RefreshCw as v, Trash2 as ie } from "lucide-react";
-import { useParams as y } from "react-router-dom";
-import { jsx as b, jsxs as x } from "react/jsx-runtime";
-import { AlertDialog as S, AlertDialogAction as C, AlertDialogCancel as w, AlertDialogContent as T, AlertDialogDescription as E, AlertDialogFooter as D, AlertDialogHeader as O, AlertDialogTitle as k } from "@burdenoff/fe-libs/ui";
+import { useState as m } from "react";
+import { useI18n as h } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AlertCircle as g, ArrowLeft as _, Copy as v, Eye as y, EyeOff as b, Loader2 as x, RefreshCw as S, Trash2 as C } from "lucide-react";
+import { useParams as w } from "react-router-dom";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
 //#region src/devportal/pages/OAuthClientDetailPage.tsx
-var A = () => {
-	let { clientId: A } = y(), { navigate: j, basePath: M } = e(), { t: N } = m(), P = (e, t) => {
-		let n = N(e);
+var D = () => {
+	let { clientId: D } = w(), { navigate: O, basePath: k } = e(), { t: A } = h(), j = (e, t) => {
+		let n = A(e);
 		return n === e ? t : n;
-	}, [F, I] = p(!1), [L, R] = p(null), [z, B] = p(!1), [V, H] = p(!1), { data: U, loading: W, error: G, refetch: K } = r({
-		variables: { id: A || "" },
-		skip: !A,
+	}, [M, N] = m(!1), [P, F] = m(null), [I, L] = m(!1), [R, z] = m(!1), { data: B, loading: V, error: H, refetch: U } = r({
+		variables: { id: D || "" },
+		skip: !D,
 		fetchPolicy: "cache-and-network"
-	}), [q, { loading: J }] = i(), [ae, { loading: Y }] = n(), [X] = ee(), Z = U?.app ? {
-		id: U.app.id,
-		name: U.app.name,
-		description: U.app.description ?? void 0,
-		clientId: U.app.clientId,
-		type: U.app.type,
-		status: U.app.status,
-		scopes: U.app.scopes ?? [],
-		redirectUris: U.app.redirectUris ?? [],
-		ownerUserId: U.app.ownerUserId,
-		tenantId: U.app.tenantId,
-		createdAt: U.app.createdAt,
-		updatedAt: U.app.updatedAt
-	} : null, Q = (e) => {
-		j?.(`${M}${e}`);
-	}, $ = async (e) => {
-		l("light"), u(await c(e) ? "success" : "error");
-	}, oe = async () => {
-		if (A) try {
-			let e = (await q({ variables: { id: A } })).data?.rotateAppSecret?.clientSecret;
-			e && (R(e), I(!0)), H(!1), K();
-		} catch {}
-	}, se = async () => {
-		if (A) try {
-			await ae({ variables: { id: A } }), B(!1), Q("/oauth");
-		} catch {}
+	}), [W, { loading: G }] = i(), [K, { loading: q }] = n(), [J] = a(), Y = B?.app ? {
+		id: B.app.id,
+		name: B.app.name,
+		description: B.app.description ?? void 0,
+		clientId: B.app.clientId,
+		type: B.app.type,
+		status: B.app.status,
+		scopes: B.app.scopes ?? [],
+		redirectUris: B.app.redirectUris ?? [],
+		ownerUserId: B.app.ownerUserId,
+		tenantId: B.app.tenantId,
+		createdAt: B.app.createdAt,
+		updatedAt: B.app.updatedAt
+	} : null, X = (e) => {
+		O?.(`${k}${e}`);
+	}, Z = async (e) => {
+		u("light"), d(await l(e) ? "success" : "error");
 	};
-	return W && !U ? /* @__PURE__ */ b(o, {
-		title: P("devportal.appDetails", "App Details"),
-		description: P("devportal.loadingDots", "Loading..."),
+	return V && !B ? /* @__PURE__ */ T(s, {
+		title: j("devportal.appDetails", "App Details"),
+		description: j("devportal.loadingDots", "Loading..."),
 		backLink: "/oauth",
-		backLabel: P("devportal.backToApps", "Back to Apps"),
-		children: /* @__PURE__ */ b("div", {
+		backLabel: j("devportal.backToApps", "Back to Apps"),
+		children: /* @__PURE__ */ T("div", {
 			className: "flex items-center justify-center py-12",
-			children: /* @__PURE__ */ b(re, { className: "h-8 w-8 animate-spin text-text-secondary" })
+			children: /* @__PURE__ */ T(x, { className: "h-8 w-8 animate-spin text-muted-foreground" })
 		})
-	}) : G || !Z ? /* @__PURE__ */ b(o, {
-		title: P("devportal.appDetails", "App Details"),
-		description: P("devportal.failedToLoad", "Failed to load"),
+	}) : H || !Y ? /* @__PURE__ */ T(s, {
+		title: j("devportal.appDetails", "App Details"),
+		description: j("devportal.failedToLoad", "Failed to load"),
 		backLink: "/oauth",
-		backLabel: P("devportal.backToApps", "Back to Apps"),
-		children: /* @__PURE__ */ x("div", {
-			className: "rounded-lg border border-status-error-border/50 bg-status-error-bg/10 p-6 text-center",
+		backLabel: j("devportal.backToApps", "Back to Apps"),
+		children: /* @__PURE__ */ E("div", {
+			className: "rounded-lg border border-destructive/50 bg-destructive/10 p-6 text-center",
 			children: [
-				/* @__PURE__ */ b(h, { className: "mx-auto h-8 w-8 text-status-error-text" }),
-				/* @__PURE__ */ b("h3", {
-					className: "mt-2 font-medium text-status-error-text",
-					children: G ? P("devportal.failedToLoadApp", "Failed to load app") : P("devportal.appNotFound", "App not found")
+				/* @__PURE__ */ T(g, { className: "mx-auto h-8 w-8 text-destructive" }),
+				/* @__PURE__ */ T("h3", {
+					className: "mt-2 font-medium text-destructive",
+					children: H ? j("devportal.failedToLoadApp", "Failed to load app") : j("devportal.appNotFound", "App not found")
 				}),
-				G && /* @__PURE__ */ b("p", {
-					className: "mt-1 text-sm text-text-secondary",
-					children: a(G)
+				H && /* @__PURE__ */ T("p", {
+					className: "mt-1 text-sm text-muted-foreground",
+					children: o(H)
 				}),
-				/* @__PURE__ */ x("button", {
-					onClick: () => Q("/oauth"),
-					className: "mt-4 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__ */ b(g, { size: 16 }), P("devportal.backToApps", "Back to Apps")]
+				/* @__PURE__ */ E("button", {
+					onClick: () => X("/oauth"),
+					className: "mt-4 inline-flex items-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90",
+					children: [/* @__PURE__ */ T(_, { size: 16 }), j("devportal.backToApps", "Back to Apps")]
 				})
 			]
 		})
-	}) : /* @__PURE__ */ b(d, {
-		permission: f.APP_READ,
-		children: /* @__PURE__ */ x(o, {
-			title: Z.name,
-			description: Z.description || P("devportal.oauthAppDetailsAndCredentials", "OAuth App details and credentials"),
+	}) : /* @__PURE__ */ T(f, {
+		permission: p.APP_READ,
+		children: /* @__PURE__ */ E(s, {
+			title: Y.name,
+			description: Y.description || j("devportal.oauthAppDetailsAndCredentials", "OAuth App details and credentials"),
 			backLink: "/oauth",
-			backLabel: P("devportal.backToApps", "Back to Apps"),
-			actions: /* @__PURE__ */ x("div", {
+			backLabel: j("devportal.backToApps", "Back to Apps"),
+			actions: /* @__PURE__ */ E("div", {
 				className: "flex items-center gap-2",
-				children: [/* @__PURE__ */ b("button", {
+				children: [/* @__PURE__ */ T("button", {
 					onClick: async () => {
-						if (!A || !Z) return;
-						let e = Z.status === "ACTIVE" ? "INACTIVE" : "ACTIVE";
+						if (!D || !Y) return;
+						let e = Y.status === "ACTIVE" ? "INACTIVE" : "ACTIVE";
 						try {
-							await X({ variables: {
-								id: A,
+							await J({ variables: {
+								id: D,
 								input: { status: e }
-							} }), K();
+							} }), U();
 						} catch {}
 					},
-					className: t("rounded-md px-3 py-2 text-sm font-medium transition-colors", Z.status === "ACTIVE" ? "bg-status-warning-bg-subtle text-status-warning-text hover:bg-status-warning-bg-subtle" : "bg-status-success-bg-subtle text-status-success-text hover:bg-status-success-bg-subtle"),
-					children: Z.status === "ACTIVE" ? P("devportal.deactivate", "Deactivate") : P("devportal.activate", "Activate")
-				}), /* @__PURE__ */ b("button", {
-					onClick: () => B(!0),
-					className: "rounded-md bg-status-error-bg/10 px-3 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg/20 transition-colors",
-					children: /* @__PURE__ */ b(ie, { size: 16 })
+					className: t("rounded-md px-3 py-2 text-sm font-medium transition-colors", Y.status === "ACTIVE" ? "bg-status-warning-bg-subtle text-status-warning-text hover:bg-status-warning-bg-subtle" : "bg-status-success-bg-subtle text-status-success-text hover:bg-status-success-bg-subtle"),
+					children: Y.status === "ACTIVE" ? j("devportal.deactivate", "Deactivate") : j("devportal.activate", "Activate")
+				}), /* @__PURE__ */ T("button", {
+					onClick: () => L(!0),
+					className: "rounded-md bg-destructive/10 px-3 py-2 text-sm font-medium text-destructive hover:bg-destructive/20 transition-colors",
+					children: /* @__PURE__ */ T(C, { size: 16 })
 				})]
 			}),
 			children: [
-				/* @__PURE__ */ x("div", {
+				/* @__PURE__ */ E("div", {
 					className: "grid gap-6 md:grid-cols-2",
-					children: [/* @__PURE__ */ x("div", {
-						className: "rounded-lg border bg-bg-surface p-6",
-						children: [/* @__PURE__ */ b("h3", {
-							className: "text-sm font-medium text-text-secondary mb-4",
-							children: P("devportal.statusAndConfiguration", "Status & Configuration")
-						}), /* @__PURE__ */ x("div", {
+					children: [/* @__PURE__ */ E("div", {
+						className: "rounded-lg border bg-card p-6",
+						children: [/* @__PURE__ */ T("h3", {
+							className: "text-sm font-medium text-muted-foreground mb-4",
+							children: j("devportal.statusAndConfiguration", "Status & Configuration")
+						}), /* @__PURE__ */ E("div", {
 							className: "space-y-3",
 							children: [
-								/* @__PURE__ */ x("div", {
+								/* @__PURE__ */ E("div", {
 									className: "flex justify-between",
-									children: [/* @__PURE__ */ b("span", {
-										className: "text-sm text-text-secondary",
-										children: P("devportal.status", "Status")
-									}), /* @__PURE__ */ x("div", {
+									children: [/* @__PURE__ */ T("span", {
+										className: "text-sm text-muted-foreground",
+										children: j("devportal.status", "Status")
+									}), /* @__PURE__ */ E("div", {
 										className: "flex items-center gap-2",
-										children: [/* @__PURE__ */ b(s, { active: Z.status === "ACTIVE" }), /* @__PURE__ */ b("span", {
+										children: [/* @__PURE__ */ T(c, { active: Y.status === "ACTIVE" }), /* @__PURE__ */ T("span", {
 											className: "text-sm font-medium",
-											children: Z.status
+											children: Y.status
 										})]
 									})]
 								}),
-								/* @__PURE__ */ x("div", {
+								/* @__PURE__ */ E("div", {
 									className: "flex justify-between",
-									children: [/* @__PURE__ */ b("span", {
-										className: "text-sm text-text-secondary",
-										children: P("devportal.type", "Type")
-									}), /* @__PURE__ */ b("span", {
-										className: t("rounded px-2 py-0.5 text-xs font-medium", Z.type === "SERVICE" ? "bg-accent-purple-subtle text-accent-purple" : Z.type === "INTEGRATION" || Z.type === "API_INTEGRATION" ? "bg-status-info-bg-subtle text-status-info-text" : "bg-status-success-bg-subtle text-status-success-text"),
-										children: Z.type
+									children: [/* @__PURE__ */ T("span", {
+										className: "text-sm text-muted-foreground",
+										children: j("devportal.type", "Type")
+									}), /* @__PURE__ */ T("span", {
+										className: t("rounded px-2 py-0.5 text-xs font-medium", Y.type === "SERVICE" ? "bg-accent-purple-subtle text-accent-purple" : Y.type === "INTEGRATION" || Y.type === "API_INTEGRATION" ? "bg-status-info-bg-subtle text-status-info-text" : "bg-status-success-bg-subtle text-status-success-text"),
+										children: Y.type
 									})]
 								}),
-								/* @__PURE__ */ x("div", {
+								/* @__PURE__ */ E("div", {
 									className: "flex justify-between",
-									children: [/* @__PURE__ */ b("span", {
-										className: "text-sm text-text-secondary",
-										children: P("devportal.created", "Created")
-									}), /* @__PURE__ */ b("span", {
+									children: [/* @__PURE__ */ T("span", {
+										className: "text-sm text-muted-foreground",
+										children: j("devportal.created", "Created")
+									}), /* @__PURE__ */ T("span", {
 										className: "text-sm",
-										children: new Date(Z.createdAt).toLocaleDateString()
+										children: new Date(Y.createdAt).toLocaleDateString()
 									})]
 								})
 							]
 						})]
-					}), /* @__PURE__ */ x("div", {
-						className: "rounded-lg border bg-bg-surface p-6",
-						children: [/* @__PURE__ */ b("h3", {
-							className: "text-sm font-medium text-text-secondary mb-4",
-							children: P("devportal.credentials", "Credentials")
-						}), /* @__PURE__ */ x("div", {
+					}), /* @__PURE__ */ E("div", {
+						className: "rounded-lg border bg-card p-6",
+						children: [/* @__PURE__ */ T("h3", {
+							className: "text-sm font-medium text-muted-foreground mb-4",
+							children: j("devportal.credentials", "Credentials")
+						}), /* @__PURE__ */ E("div", {
 							className: "space-y-3",
 							children: [
-								/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("label", {
-									className: "text-xs text-text-secondary",
-									children: P("devportal.clientId", "Client ID")
-								}), /* @__PURE__ */ x("div", {
+								/* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("label", {
+									className: "text-xs text-muted-foreground",
+									children: j("devportal.clientId", "Client ID")
+								}), /* @__PURE__ */ E("div", {
 									className: "mt-1 flex items-center gap-2",
-									children: [/* @__PURE__ */ b("code", {
-										className: "flex-1 rounded bg-bg-sunken px-3 py-1.5 text-sm font-mono",
-										children: Z.clientId
-									}), /* @__PURE__ */ b("button", {
-										onClick: () => $(Z.clientId),
-										className: "rounded p-1.5 hover:bg-bg-sunken transition-colors",
+									children: [/* @__PURE__ */ T("code", {
+										className: "flex-1 rounded bg-muted px-3 py-1.5 text-sm font-mono",
+										children: Y.clientId
+									}), /* @__PURE__ */ T("button", {
+										onClick: () => Z(Y.clientId),
+										className: "rounded p-1.5 hover:bg-muted transition-colors",
 										title: "Copy",
-										children: /* @__PURE__ */ b(_, { size: 14 })
+										children: /* @__PURE__ */ T(v, { size: 14 })
 									})]
 								})] }),
-								L && /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("label", {
-									className: "text-xs text-status-error-text font-medium",
-									children: P("devportal.newClientSecretShownOnce", "New Client Secret (shown only once!)")
-								}), /* @__PURE__ */ x("div", {
+								P && /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("label", {
+									className: "text-xs text-destructive font-medium",
+									children: j("devportal.newClientSecretShownOnce", "New Client Secret (shown only once!)")
+								}), /* @__PURE__ */ E("div", {
 									className: "mt-1 flex items-center gap-2",
 									children: [
-										/* @__PURE__ */ b("code", {
-											className: "flex-1 rounded bg-status-error-bg/10 border border-status-error-border/30 px-3 py-1.5 text-sm font-mono",
-											children: F ? L : "••••••••••••••••"
+										/* @__PURE__ */ T("code", {
+											className: "flex-1 rounded bg-destructive/10 border border-destructive/30 px-3 py-1.5 text-sm font-mono",
+											children: M ? P : "••••••••••••••••"
 										}),
-										/* @__PURE__ */ b("button", {
-											onClick: () => I(!F),
-											className: "rounded p-1.5 hover:bg-bg-sunken transition-colors",
-											children: b(F ? ne : te, { size: 14 })
+										/* @__PURE__ */ T("button", {
+											onClick: () => N(!M),
+											className: "rounded p-1.5 hover:bg-muted transition-colors",
+											children: T(M ? b : y, { size: 14 })
 										}),
-										/* @__PURE__ */ b("button", {
-											onClick: () => $(L),
-											className: "rounded p-1.5 hover:bg-bg-sunken transition-colors",
-											children: /* @__PURE__ */ b(_, { size: 14 })
+										/* @__PURE__ */ T("button", {
+											onClick: () => Z(P),
+											className: "rounded p-1.5 hover:bg-muted transition-colors",
+											children: /* @__PURE__ */ T(v, { size: 14 })
 										})
 									]
 								})] }),
-								/* @__PURE__ */ x("button", {
-									onClick: () => H(!0),
-									disabled: J,
+								/* @__PURE__ */ E("button", {
+									onClick: () => z(!0),
+									disabled: G,
 									className: "mt-2 inline-flex items-center gap-2 rounded-md bg-status-warning-bg-subtle px-3 py-1.5 text-sm font-medium text-status-warning-text hover:bg-status-warning-bg-subtle transition-colors disabled:opacity-50",
-									children: [/* @__PURE__ */ b(v, {
+									children: [/* @__PURE__ */ T(S, {
 										size: 14,
-										className: J ? "animate-spin" : ""
-									}), P("devportal.rotateSecret", "Rotate Secret")]
+										className: G ? "animate-spin" : ""
+									}), j("devportal.rotateSecret", "Rotate Secret")]
 								})
 							]
 						})]
 					})]
 				}),
-				/* @__PURE__ */ x("div", {
-					className: "rounded-lg border bg-bg-surface p-6",
-					children: [/* @__PURE__ */ x("h3", {
-						className: "text-sm font-medium text-text-secondary mb-3",
+				/* @__PURE__ */ E("div", {
+					className: "rounded-lg border bg-card p-6",
+					children: [/* @__PURE__ */ E("h3", {
+						className: "text-sm font-medium text-muted-foreground mb-3",
 						children: [
-							P("devportal.scopes", "Scopes"),
+							j("devportal.scopes", "Scopes"),
 							" (",
-							Z.scopes.length,
+							Y.scopes.length,
 							")"
 						]
-					}), Z.scopes.length > 0 ? /* @__PURE__ */ b("div", {
+					}), Y.scopes.length > 0 ? /* @__PURE__ */ T("div", {
 						className: "flex flex-wrap gap-2",
-						children: Z.scopes.map((e) => /* @__PURE__ */ b("span", {
-							className: "rounded-full bg-action-primary-bg/10 px-3 py-1 text-xs font-medium text-primary",
+						children: Y.scopes.map((e) => /* @__PURE__ */ T("span", {
+							className: "rounded-full bg-primary/10 px-3 py-1 text-xs font-medium text-primary",
 							children: e
 						}, e))
-					}) : /* @__PURE__ */ b("p", {
-						className: "text-sm text-text-secondary",
-						children: P("devportal.noScopesConfigured", "No scopes configured")
+					}) : /* @__PURE__ */ T("p", {
+						className: "text-sm text-muted-foreground",
+						children: j("devportal.noScopesConfigured", "No scopes configured")
 					})]
 				}),
-				/* @__PURE__ */ x("div", {
-					className: "rounded-lg border bg-bg-surface p-6",
-					children: [/* @__PURE__ */ x("h3", {
-						className: "text-sm font-medium text-text-secondary mb-3",
+				/* @__PURE__ */ E("div", {
+					className: "rounded-lg border bg-card p-6",
+					children: [/* @__PURE__ */ E("h3", {
+						className: "text-sm font-medium text-muted-foreground mb-3",
 						children: [
-							P("devportal.redirectUris", "Redirect URIs"),
+							j("devportal.redirectUris", "Redirect URIs"),
 							" (",
-							Z.redirectUris.length,
+							Y.redirectUris.length,
 							")"
 						]
-					}), Z.redirectUris.length > 0 ? /* @__PURE__ */ b("div", {
+					}), Y.redirectUris.length > 0 ? /* @__PURE__ */ T("div", {
 						className: "space-y-2",
-						children: Z.redirectUris.map((e) => /* @__PURE__ */ x("div", {
+						children: Y.redirectUris.map((e) => /* @__PURE__ */ E("div", {
 							className: "flex items-center gap-2",
-							children: [/* @__PURE__ */ b("code", {
-								className: "rounded bg-bg-sunken px-3 py-1.5 text-sm font-mono",
+							children: [/* @__PURE__ */ T("code", {
+								className: "rounded bg-muted px-3 py-1.5 text-sm font-mono",
 								children: e
-							}), /* @__PURE__ */ b("button", {
-								onClick: () => $(e),
-								className: "rounded p-1 hover:bg-bg-sunken transition-colors",
-								children: /* @__PURE__ */ b(_, { size: 12 })
+							}), /* @__PURE__ */ T("button", {
+								onClick: () => Z(e),
+								className: "rounded p-1 hover:bg-muted transition-colors",
+								children: /* @__PURE__ */ T(v, { size: 12 })
 							})]
 						}, e))
-					}) : /* @__PURE__ */ b("p", {
-						className: "text-sm text-text-secondary",
-						children: P("devportal.noRedirectUrisConfigured", "No redirect URIs configured")
+					}) : /* @__PURE__ */ T("p", {
+						className: "text-sm text-muted-foreground",
+						children: j("devportal.noRedirectUrisConfigured", "No redirect URIs configured")
 					})]
 				}),
-				/* @__PURE__ */ b(S, {
-					open: V,
-					onOpenChange: H,
-					children: /* @__PURE__ */ x(T, { children: [/* @__PURE__ */ x(O, { children: [/* @__PURE__ */ b(k, { children: P("devportal.rotateClientSecretQuestion", "Rotate Client Secret?") }), /* @__PURE__ */ b(E, { children: P("devportal.rotateSecretWarning", "This will invalidate the current client secret. All integrations using the old secret will stop working immediately.") })] }), /* @__PURE__ */ x(D, { children: [/* @__PURE__ */ b(w, {
-						disabled: J,
-						children: P("devportal.cancel", "Cancel")
-					}), /* @__PURE__ */ b(C, {
-						onClick: (e) => {
-							e.preventDefault(), oe();
-						},
-						disabled: J,
-						className: "bg-status-warning-bg text-white hover:bg-status-warning-bg/90",
-						children: J ? P("devportal.rotating", "Rotating...") : P("devportal.rotateSecret", "Rotate Secret")
-					})] })] })
+				R && /* @__PURE__ */ T("div", {
+					className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50",
+					children: /* @__PURE__ */ E("div", {
+						className: "rounded-lg bg-card border shadow-lg p-6 max-w-md w-full mx-4",
+						children: [
+							/* @__PURE__ */ T("h3", {
+								className: "font-medium text-lg",
+								children: j("devportal.rotateClientSecretQuestion", "Rotate Client Secret?")
+							}),
+							/* @__PURE__ */ T("p", {
+								className: "mt-2 text-sm text-muted-foreground",
+								children: j("devportal.rotateSecretWarning", "This will invalidate the current client secret. All integrations using the old secret will stop working immediately.")
+							}),
+							/* @__PURE__ */ E("div", {
+								className: "mt-4 flex justify-end gap-3",
+								children: [/* @__PURE__ */ T("button", {
+									onClick: () => z(!1),
+									className: "rounded-md px-4 py-2 text-sm font-medium hover:bg-muted transition-colors",
+									children: j("devportal.cancel", "Cancel")
+								}), /* @__PURE__ */ T("button", {
+									onClick: async () => {
+										if (D) try {
+											let e = (await W({ variables: { id: D } })).data?.rotateAppSecret?.clientSecret;
+											e && (F(e), N(!0)), z(!1), U();
+										} catch {}
+									},
+									disabled: G,
+									className: "rounded-md bg-status-warning-bg px-4 py-2 text-sm font-medium text-white hover:bg-status-warning-bg/90 disabled:opacity-50 transition-colors",
+									children: G ? j("devportal.rotating", "Rotating...") : j("devportal.rotateSecret", "Rotate Secret")
+								})]
+							})
+						]
+					})
 				}),
-				/* @__PURE__ */ b(S, {
-					open: z,
-					onOpenChange: B,
-					children: /* @__PURE__ */ x(T, { children: [/* @__PURE__ */ x(O, { children: [/* @__PURE__ */ b(k, {
-						className: "text-status-error-text",
-						children: P("devportal.deactivateAppQuestion", "Deactivate App?")
-					}), /* @__PURE__ */ b(E, { children: P("devportal.deactivateAppWarning", "This will deactivate the app and revoke all tokens. This action cannot be undone easily.") })] }), /* @__PURE__ */ x(D, { children: [/* @__PURE__ */ b(w, {
-						disabled: Y,
-						children: P("devportal.cancel", "Cancel")
-					}), /* @__PURE__ */ b(C, {
-						onClick: (e) => {
-							e.preventDefault(), se();
-						},
-						disabled: Y,
-						className: "bg-status-error-bg text-status-error-text hover:bg-status-error-bg/90",
-						children: Y ? P("devportal.deactivating", "Deactivating...") : P("devportal.deactivate", "Deactivate")
-					})] })] })
+				I && /* @__PURE__ */ T("div", {
+					className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50",
+					children: /* @__PURE__ */ E("div", {
+						className: "rounded-lg bg-card border shadow-lg p-6 max-w-md w-full mx-4",
+						children: [
+							/* @__PURE__ */ T("h3", {
+								className: "font-medium text-lg text-destructive",
+								children: j("devportal.deactivateAppQuestion", "Deactivate App?")
+							}),
+							/* @__PURE__ */ T("p", {
+								className: "mt-2 text-sm text-muted-foreground",
+								children: j("devportal.deactivateAppWarning", "This will deactivate the app and revoke all tokens. This action cannot be undone easily.")
+							}),
+							/* @__PURE__ */ E("div", {
+								className: "mt-4 flex justify-end gap-3",
+								children: [/* @__PURE__ */ T("button", {
+									onClick: () => L(!1),
+									className: "rounded-md px-4 py-2 text-sm font-medium hover:bg-muted transition-colors",
+									children: j("devportal.cancel", "Cancel")
+								}), /* @__PURE__ */ T("button", {
+									onClick: async () => {
+										if (D) try {
+											await K({ variables: { id: D } }), L(!1), X("/oauth");
+										} catch {}
+									},
+									disabled: q,
+									className: "rounded-md bg-destructive px-4 py-2 text-sm font-medium text-destructive-foreground hover:bg-destructive/90 disabled:opacity-50 transition-colors",
+									children: q ? j("devportal.deactivating", "Deactivating...") : j("devportal.deactivate", "Deactivate")
+								})]
+							})
+						]
+					})
 				})
 			]
 		})
 	});
 };
 //#endregion
-export { A as OAuthClientDetailPage };
+export { D as OAuthClientDetailPage };
 
 //# sourceMappingURL=OAuthClientDetailPage.js.map