npm - @burdenoff/microfe-devportal - Versions diffs - 2026.624.12 → 2026.624.14 - Mend

@burdenoff/microfe-devportal 2026.624.12 → 2026.624.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1988) hide show

package/dist/devportal/pages/AdminReviewPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AdminReviewPage.js","names":[],"sources":["../../../src/devportal/pages/AdminReviewPage.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useState } from \"react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport {\n CheckCircle,\n XCircle,\n Clock,\n Search,\n Loader2,\n AlertCircle,\n Eye,\n ChevronDown,\n ChevronUp,\n Download,\n FileJson,\n} from \"lucide-react\";\nimport { PageLayout, PageSection } from \"../components/PageLayout\";\nimport { EmptyState } from \"../components/EmptyState\";\nimport { useDevportal } from \"../providers/DevportalProvider\";\nimport { PermissionGuard } from \"../components\";\nimport { DEVPORTAL_PERMISSIONS } from \"../constants/permissions\";\nimport {\n useGetApplicationsQuery,\n useApproveApplicationMutation,\n useRejectApplicationMutation,\n useGetApplicationForReviewQuery,\n getErrorMessage,\n useDevportalPermission,\n type ApplicationFieldsFragment,\n} from \"../hooks\";\n\n// ============================================================================\n// Manifest Viewer\n// ============================================================================\n\ninterface ManifestViewerProps {\n manifest: Record<string, unknown>;\n tr: (key: string, fallback: string) => string;\n}\n\nconst ManifestViewer: FC<ManifestViewerProps> = ({ manifest, tr }) => {\n const [open, setOpen] = useState(false);\n return (\n <div>\n <button\n type=\"button\"\n onClick={() => setOpen((v) => !v)}\n className=\"inline-flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground\"\n >\n <FileJson size={13} />\n {open\n ? tr(\"devportal.hideManifest\", \"Hide manifest\")\n : tr(\"devportal.viewManifest\", \"View manifest.json\")}\n </button>\n {open && (\n <pre className=\"mt-2 max-h-48 overflow-auto rounded-md bg-muted p-3 text-xs font-mono whitespace-pre-wrap break-all\">\n {JSON.stringify(manifest, null, 2)}\n </pre>\n )}\n </div>\n );\n};\n\n// ============================================================================\n// Review Row Component\n// ============================================================================\n\ninterface ReviewRowProps {\n app: ApplicationFieldsFragment;\n onApprove: (id: string, notes: string) => void;\n onReject: (id: string, notes: string) => void;\n processing: boolean;\n}\n\nconst ReviewRow: FC<ReviewRowProps> = ({\n app,\n onApprove,\n onReject,\n processing,\n}) => {\n const { navigate, basePath } = useDevportal();\n const { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n };\n const [expanded, setExpanded] = useState(false);\n const [reviewNotes, setReviewNotes] = useState(\"\");\n const approvePerm = useDevportalPermission(DEVPORTAL_PERMISSIONS.APP_APPROVE);\n const rejectPerm = useDevportalPermission(DEVPORTAL_PERMISSIONS.APP_REJECT);\n\n const { data: versionData } = useGetApplicationForReviewQuery({\n variables: { id: app.id },\n skip: !expanded,\n fetchPolicy: \"cache-first\",\n });\n const latestVersion = versionData?.application?.versions?.edges?.[0]?.node;\n\n return (\n <div className=\"rounded-lg border bg-card overflow-hidden\">\n {/* Header row /}\n <div className=\"flex items-center gap-4 p-4\">\n {app.iconUrl ? (\n <img\n src={app.iconUrl}\n alt={app.name}\n className=\"h-12 w-12 rounded-lg object-cover flex-shrink-0\"\n />\n ) : (\n <div className=\"h-12 w-12 rounded-lg bg-muted flex items-center justify-center flex-shrink-0\">\n <span className=\"text-lg font-bold text-muted-foreground\">\n {app.name.charAt(0).toUpperCase()}\n </span>\n </div>\n )}\n\n <div className=\"flex-1 min-w-0\">\n <div className=\"flex items-center gap-2\">\n <h3 className=\"font-semibold truncate\">{app.name}</h3>\n <span className=\"inline-flex items-center rounded-full bg-status-warning-bg-subtle px-2 py-0.5 text-xs font-medium text-status-warning-text\">\n {app.status}\n </span>\n <span className=\"inline-flex items-center rounded-full bg-muted px-2 py-0.5 text-xs text-muted-foreground\">\n {app.appType.replace(/_/g, \" \")}\n </span>\n </div>\n <p className=\"text-sm text-muted-foreground truncate\">\n {app.shortDescription ??\n app.description ??\n tr(\"devportal.noDescription\", \"No description\")}\n </p>\n <p className=\"text-xs text-muted-foreground mt-0.5\">\n {tr(\"devportal.submitted\", \"Submitted\")}:{\" \"}\n {app.submittedAt\n ? new Date(app.submittedAt).toLocaleDateString(undefined, {\n year: \"numeric\",\n month: \"short\",\n day: \"numeric\",\n })\n : tr(\"devportal.unknown\", \"Unknown\")}\n </p>\n </div>\n\n <div className=\"flex items-center gap-2 flex-shrink-0\">\n <button\n onClick={() => navigate?.(`${basePath}/apps/${app.id}`)}\n className=\"inline-flex items-center gap-1.5 rounded-md border px-3 py-1.5 text-sm hover:bg-muted\"\n title={tr(\"devportal.viewAppDetails\", \"View app details\")}\n >\n <Eye size={14} />\n {tr(\"devportal.view\", \"View\")}\n </button>\n <button\n onClick={() => setExpanded((v) => !v)}\n className=\"inline-flex items-center gap-1.5 rounded-md border px-3 py-1.5 text-sm hover:bg-muted\"\n >\n {expanded ? <ChevronUp size={14} /> : <ChevronDown size={14} />}\n {tr(\"devportal.review\", \"Review\")}\n </button>\n </div>\n </div>\n\n {/ Expanded review panel /}\n {expanded && (\n <div className=\"border-t bg-muted/30 p-4 space-y-4\">\n {/ Submission notes from developer /}\n {app.reviewNotes && (\n <div className=\"rounded-md border bg-background p-3\">\n <p className=\"text-xs font-medium text-muted-foreground mb-1\">\n {tr(\"devportal.developerNotes\", \"Developer Notes\")}\n </p>\n <p className=\"text-sm\">{app.reviewNotes}</p>\n </div>\n )}\n\n {/ App details summary /}\n <div className=\"grid grid-cols-2 gap-3 text-sm\">\n <div>\n <span className=\"text-muted-foreground\">\n {tr(\"devportal.category\", \"Category\")}:{\" \"}\n </span>\n <span>{app.category ?? \"—\"}</span>\n </div>\n <div>\n <span className=\"text-muted-foreground\">\n {tr(\"devportal.pricing\", \"Pricing\")}:{\" \"}\n </span>\n <span>{app.pricingType ?? \"FREE\"}</span>\n </div>\n <div>\n <span className=\"text-muted-foreground\">\n {tr(\"devportal.website\", \"Website\")}:{\" \"}\n </span>\n {app.websiteUrl ? (\n <a\n href={app.websiteUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"text-primary underline hover:no-underline\"\n >\n {tr(\"devportal.link\", \"Link\")}\n </a>\n ) : (\n <span>—</span>\n )}\n </div>\n <div>\n <span className=\"text-muted-foreground\">\n {tr(\"devportal.privacyPolicy\", \"Privacy Policy\")}:{\" \"}\n </span>\n {app.privacyPolicyUrl ? (\n <a\n href={app.privacyPolicyUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"text-primary underline hover:no-underline\"\n >\n {tr(\"devportal.link\", \"Link\")}\n </a>\n ) : (\n <span className=\"text-status-error-text\">\n {tr(\"devportal.missing\", \"Missing\")}\n </span>\n )}\n </div>\n </div>\n\n {/ Latest version package for review /}\n {latestVersion && (\n <div className=\"rounded-md border bg-background p-3 space-y-3\">\n <p className=\"text-xs font-medium text-muted-foreground\">\n {tr(\"devportal.latestVersion\", \"Latest Version\")}:{\" \"}\n <span className=\"font-mono text-foreground\">\n {latestVersion.version}\n </span>\n </p>\n <div className=\"flex flex-wrap gap-2\">\n {latestVersion.packageUrl && (\n <a\n href={latestVersion.packageUrl}\n download\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"inline-flex items-center gap-1.5 rounded-md border px-3 py-1.5 text-sm hover:bg-muted\"\n >\n <Download size={14} />\n {tr(\"devportal.downloadPackage\", \"Download Package\")}\n {latestVersion.packageSize && (\n <span className=\"text-muted-foreground text-xs ml-1\">\n ({latestVersion.packageSize})\n </span>\n )}\n </a>\n )}\n </div>\n {latestVersion.manifest && (\n <ManifestViewer\n manifest={latestVersion.manifest as Record<string, unknown>}\n tr={tr}\n />\n )}\n </div>\n )}\n\n {/ Reviewer notes input /}\n <div>\n <label className=\"text-sm font-medium\">\n {tr(\"devportal.reviewNotes\", \"Review Notes\")}\n </label>\n <textarea\n value={reviewNotes}\n onChange={(e) => setReviewNotes(e.target.value)}\n placeholder={tr(\n \"devportal.reviewNotesPlaceholder\",\n \"Add feedback for the developer (required for rejection)...\",\n )}\n rows={3}\n className=\"mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring resize-none\"\n />\n </div>\n\n {/ Action buttons /}\n <div className=\"flex gap-3\">\n <button\n onClick={() => onApprove(app.id, reviewNotes)}\n disabled={processing \|\| !approvePerm.allowed}\n aria-disabled={processing \|\| !approvePerm.allowed}\n title={\n !approvePerm.allowed\n ? tr(\n \"devportal.common.noPermission\",\n \"You do not have permission to perform this action\",\n )\n : undefined\n }\n className=\"inline-flex items-center gap-2 rounded-md bg-status-success-bg px-4 py-2 text-sm font-medium text-white hover:bg-status-success-bg/90 disabled:opacity-50 disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n >\n {processing ? (\n <Loader2\n size={14}\n className=\"animate-spin\"\n aria-hidden=\"true\"\n />\n ) : (\n <CheckCircle size={14} aria-hidden=\"true\" />\n )}\n {tr(\"devportal.approve\", \"Approve\")}\n </button>\n <button\n onClick={() => onReject(app.id, reviewNotes)}\n disabled={\n processing \|\| !reviewNotes.trim() \|\| !rejectPerm.allowed\n }\n aria-disabled={\n processing \|\| !reviewNotes.trim() \|\| !rejectPerm.allowed\n }\n className=\"inline-flex items-center gap-2 rounded-md bg-destructive px-4 py-2 text-sm font-medium text-destructive-foreground hover:bg-destructive/90 disabled:opacity-50 disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n title={\n !rejectPerm.allowed\n ? tr(\n \"devportal.common.noPermission\",\n \"You do not have permission to perform this action\",\n )\n : !reviewNotes.trim()\n ? tr(\n \"devportal.notesRequiredForRejection\",\n \"Notes required for rejection\",\n )\n : undefined\n }\n >\n {processing ? (\n <Loader2\n size={14}\n className=\"animate-spin\"\n aria-hidden=\"true\"\n />\n ) : (\n <XCircle size={14} aria-hidden=\"true\" />\n )}\n {tr(\"devportal.reject\", \"Reject\")}\n </button>\n </div>\n </div>\n )}\n </div>\n );\n};\n\n// ============================================================================\n// Admin Review Page\n// ============================================================================\n\nexport const AdminReviewPage: FC = () => {\n const { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n };\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [processingIds, setProcessingIds] = useState<Set<string>>(new Set());\n const [actionError, setActionError] = useState<string \| null>(null);\n const [actionSuccess, setActionSuccess] = useState<string \| null>(null);\n\n const addProcessing = (id: string) =>\n setProcessingIds((prev) => new Set(prev).add(id));\n const removeProcessing = (id: string) =>\n setProcessingIds((prev) => {\n const next = new Set(prev);\n next.delete(id);\n return next;\n });\n\n const { data, loading, error, refetch } = useGetApplicationsQuery({\n variables: { status: \"SUBMITTED\" as const, limit: 100 },\n fetchPolicy: \"cache-and-network\",\n });\n\n const [approveApplication] = useApproveApplicationMutation();\n const [rejectApplication] = useRejectApplicationMutation();\n\n const apps =\n data?.applications?.edges?.map(\n (edge: { node: ApplicationFieldsFragment }) => edge.node,\n ) ?? [];\n\n const filteredApps = searchQuery\n ? apps.filter(\n (app: ApplicationFieldsFragment) =>\n app.name.toLowerCase().includes(searchQuery.toLowerCase()) \|\|\n (app.shortDescription ?? \"\")\n .toLowerCase()\n .includes(searchQuery.toLowerCase()),\n )\n : apps;\n\n const handleApprove = async (id: string, notes: string) => {\n addProcessing(id);\n setActionError(null);\n setActionSuccess(null);\n try {\n const result = await approveApplication({\n variables: { id, notes: notes \|\| undefined },\n });\n if (result.error) {\n throw result.error;\n }\n setActionSuccess(\n tr(\n \"devportal.applicationApprovedSuccess\",\n \"Application approved successfully.\",\n ),\n );\n await refetch();\n } catch (err) {\n setActionError(\n err instanceof Error\n ? err.message\n : tr(\n \"devportal.failedToApproveApplication\",\n \"Failed to approve application\",\n ),\n );\n } finally {\n removeProcessing(id);\n }\n };\n\n const handleReject = async (id: string, notes: string) => {\n if (!notes.trim()) return;\n addProcessing(id);\n setActionError(null);\n setActionSuccess(null);\n try {\n const result = await rejectApplication({ variables: { id, notes } });\n if (result.error) {\n throw result.error;\n }\n setActionSuccess(\n tr(\"devportal.applicationRejected\", \"Application rejected.\"),\n );\n await refetch();\n } catch (err) {\n setActionError(\n err instanceof Error\n ? err.message\n : tr(\n \"devportal.failedToRejectApplication\",\n \"Failed to reject application\",\n ),\n );\n } finally {\n removeProcessing(id);\n }\n };\n\n if (loading && !data) {\n return (\n <PageLayout\n title={tr(\"devportal.appReviewQueue\", \"App Review Queue\")}\n description={tr(\n \"devportal.appReviewQueueDescription\",\n \"Review submitted applications for approval\",\n )}\n >\n <div className=\"flex items-center justify-center py-12\">\n <Loader2 className=\"h-8 w-8 animate-spin text-muted-foreground\" />\n </div>\n </PageLayout>\n );\n }\n\n if (error) {\n return (\n <PageLayout\n title={tr(\"devportal.appReviewQueue\", \"App Review Queue\")}\n description={tr(\n \"devportal.appReviewQueueDescription\",\n \"Review submitted applications for approval\",\n )}\n >\n <div className=\"rounded-lg border border-destructive/50 bg-destructive/10 p-6 text-center\">\n <AlertCircle className=\"mx-auto h-8 w-8 text-destructive\" />\n <p className=\"mt-2 text-sm text-muted-foreground\">\n {getErrorMessage(error)}\n </p>\n <button\n onClick={() => refetch()}\n className=\"mt-4 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90\"\n >\n {tr(\"devportal.retry\", \"Retry\")}\n </button>\n </div>\n </PageLayout>\n );\n }\n\n return (\n <PermissionGuard permission={DEVPORTAL_PERMISSIONS.REVIEW_MANAGE}>\n <PageLayout\n title={tr(\"devportal.appReviewQueue\", \"App Review Queue\")}\n description={tr(\n \"devportal.appReviewQueueFullDescription\",\n \"Review submitted applications for approval or rejection\",\n )}\n actions={\n <button\n onClick={() => refetch()}\n className=\"rounded-md border px-3 py-1.5 text-sm hover:bg-muted\"\n >\n {tr(\"devportal.refresh\", \"Refresh\")}\n </button>\n }\n >\n {/ Stats bar /}\n <div className=\"flex items-center gap-6 rounded-lg border bg-card p-4\">\n <div className=\"flex items-center gap-2\">\n <Clock size={18} className=\"text-status-warning-text\" />\n <span className=\"text-sm font-medium\">\n {apps.length} {tr(\"devportal.pendingReview\", \"pending review\")}\n </span>\n </div>\n {processingIds.size > 0 && (\n <div className=\"flex items-center gap-2 text-sm text-muted-foreground\">\n <Loader2 size={14} className=\"animate-spin\" />\n {tr(\"devportal.processing\", \"Processing...\")}\n </div>\n )}\n </div>\n\n {/ Feedback messages /}\n {actionSuccess && (\n <div className=\"flex items-center gap-2 rounded-lg border border-border-subtle bg-status-success-bg-subtle px-4 py-3 text-sm text-status-success-text\">\n <CheckCircle size={16} />\n {actionSuccess}\n </div>\n )}\n {actionError && (\n <div className=\"flex items-center gap-2 rounded-lg border border-destructive/50 bg-destructive/10 px-4 py-3 text-sm text-destructive\">\n <AlertCircle size={16} />\n {actionError}\n </div>\n )}\n\n {/ Search /}\n {apps.length > 0 && (\n <div className=\"relative max-w-sm\">\n <Search\n size={14}\n className=\"absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground\"\n />\n <input\n type=\"text\"\n placeholder={tr(\n \"devportal.searchSubmittedApps\",\n \"Search submitted apps...\",\n )}\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n 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\"\n />\n </div>\n )}\n\n {/ Review list */}\n <PageSection>\n {filteredApps.length === 0 ? (\n <EmptyState\n icon={<CheckCircle size={32} />}\n title={tr(\n \"devportal.noAppsPendingReview\",\n \"No apps pending review\",\n )}\n description={\n searchQuery\n ? tr(\n \"devportal.noAppsMatchSearch\",\n \"No apps match your search\",\n )\n : tr(\n \"devportal.allApplicationsReviewed\",\n \"All submitted applications have been reviewed\",\n )\n }\n />\n ) : (\n <div className=\"space-y-3\">\n {filteredApps.map((app: ApplicationFieldsFragment) => (\n <ReviewRow\n key={app.id}\n app={app}\n onApprove={handleApprove}\n onReject={handleReject}\n processing={processingIds.has(app.id)}\n />\n ))}\n </div>\n )}\n </PageSection>\n </PageLayout>\n </PermissionGuard>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"AdminReviewPage.js","names":[],"sources":["../../../src/devportal/pages/AdminReviewPage.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useState } from \"react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport {\n CheckCircle,\n XCircle,\n Clock,\n Search,\n Loader2,\n AlertCircle,\n Eye,\n ChevronDown,\n ChevronUp,\n Download,\n FileJson,\n} from \"lucide-react\";\nimport { PageLayout, PageSection } from \"../components/PageLayout\";\nimport { EmptyState } from \"../components/EmptyState\";\nimport { useDevportal } from \"../providers/DevportalProvider\";\nimport { PermissionGuard } from \"../components\";\nimport { DEVPORTAL_PERMISSIONS } from \"../constants/permissions\";\nimport {\n useGetApplicationsQuery,\n useApproveApplicationMutation,\n useRejectApplicationMutation,\n useGetApplicationForReviewQuery,\n getErrorMessage,\n useDevportalPermission,\n type ApplicationFieldsFragment,\n} from \"../hooks\";\n\n// ============================================================================\n// Manifest Viewer\n// ============================================================================\n\ninterface ManifestViewerProps {\n manifest: Record<string, unknown>;\n tr: (key: string, fallback: string) => string;\n}\n\nconst ManifestViewer: FC<ManifestViewerProps> = ({ manifest, tr }) => {\n const [open, setOpen] = useState(false);\n return (\n <div>\n <button\n type=\"button\"\n onClick={() => setOpen((v) => !v)}\n className=\"inline-flex items-center gap-1.5 text-xs text-text-secondary hover:text-text-primary\"\n >\n <FileJson size={13} />\n {open\n ? tr(\"devportal.hideManifest\", \"Hide manifest\")\n : tr(\"devportal.viewManifest\", \"View manifest.json\")}\n </button>\n {open && (\n <pre className=\"mt-2 max-h-48 overflow-auto rounded-md bg-bg-sunken p-3 text-xs font-mono whitespace-pre-wrap break-all\">\n {JSON.stringify(manifest, null, 2)}\n </pre>\n )}\n </div>\n );\n};\n\n// ============================================================================\n// Review Row Component\n// ============================================================================\n\ninterface ReviewRowProps {\n app: ApplicationFieldsFragment;\n onApprove: (id: string, notes: string) => void;\n onReject: (id: string, notes: string) => void;\n processing: boolean;\n}\n\nconst ReviewRow: FC<ReviewRowProps> = ({\n app,\n onApprove,\n onReject,\n processing,\n}) => {\n const { navigate, basePath } = useDevportal();\n const { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n };\n const [expanded, setExpanded] = useState(false);\n const [reviewNotes, setReviewNotes] = useState(\"\");\n const approvePerm = useDevportalPermission(DEVPORTAL_PERMISSIONS.APP_APPROVE);\n const rejectPerm = useDevportalPermission(DEVPORTAL_PERMISSIONS.APP_REJECT);\n\n const { data: versionData } = useGetApplicationForReviewQuery({\n variables: { id: app.id },\n skip: !expanded,\n fetchPolicy: \"cache-first\",\n });\n const latestVersion = versionData?.application?.versions?.edges?.[0]?.node;\n\n return (\n <div className=\"rounded-lg border bg-bg-surface overflow-hidden\">\n {/* Header row /}\n <div className=\"flex items-center gap-4 p-4\">\n {app.iconUrl ? (\n <img\n src={app.iconUrl}\n alt={app.name}\n className=\"h-12 w-12 rounded-lg object-cover flex-shrink-0\"\n />\n ) : (\n <div className=\"h-12 w-12 rounded-lg bg-bg-sunken flex items-center justify-center flex-shrink-0\">\n <span className=\"text-lg font-bold text-text-secondary\">\n {app.name.charAt(0).toUpperCase()}\n </span>\n </div>\n )}\n\n <div className=\"flex-1 min-w-0\">\n <div className=\"flex items-center gap-2\">\n <h3 className=\"font-semibold truncate\">{app.name}</h3>\n <span className=\"inline-flex items-center rounded-full bg-status-warning-bg-subtle px-2 py-0.5 text-xs font-medium text-status-warning-text\">\n {app.status}\n </span>\n <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5 text-xs text-text-secondary\">\n {app.appType.replace(/_/g, \" \")}\n </span>\n </div>\n <p className=\"text-sm text-text-secondary truncate\">\n {app.shortDescription ??\n app.description ??\n tr(\"devportal.noDescription\", \"No description\")}\n </p>\n <p className=\"text-xs text-text-secondary mt-0.5\">\n {tr(\"devportal.submitted\", \"Submitted\")}:{\" \"}\n {app.submittedAt\n ? new Date(app.submittedAt).toLocaleDateString(undefined, {\n year: \"numeric\",\n month: \"short\",\n day: \"numeric\",\n })\n : tr(\"devportal.unknown\", \"Unknown\")}\n </p>\n </div>\n\n <div className=\"flex items-center gap-2 flex-shrink-0\">\n <button\n onClick={() => navigate?.(`${basePath}/apps/${app.id}`)}\n className=\"inline-flex items-center gap-1.5 rounded-md border px-3 py-1.5 text-sm hover:bg-bg-sunken\"\n title={tr(\"devportal.viewAppDetails\", \"View app details\")}\n >\n <Eye size={14} />\n {tr(\"devportal.view\", \"View\")}\n </button>\n <button\n onClick={() => setExpanded((v) => !v)}\n className=\"inline-flex items-center gap-1.5 rounded-md border px-3 py-1.5 text-sm hover:bg-bg-sunken\"\n >\n {expanded ? <ChevronUp size={14} /> : <ChevronDown size={14} />}\n {tr(\"devportal.review\", \"Review\")}\n </button>\n </div>\n </div>\n\n {/ Expanded review panel /}\n {expanded && (\n <div className=\"border-t bg-bg-sunken/30 p-4 space-y-4\">\n {/ Submission notes from developer /}\n {app.reviewNotes && (\n <div className=\"rounded-md border bg-bg-surface p-3\">\n <p className=\"text-xs font-medium text-text-secondary mb-1\">\n {tr(\"devportal.developerNotes\", \"Developer Notes\")}\n </p>\n <p className=\"text-sm\">{app.reviewNotes}</p>\n </div>\n )}\n\n {/ App details summary /}\n <div className=\"grid grid-cols-2 gap-3 text-sm\">\n <div>\n <span className=\"text-text-secondary\">\n {tr(\"devportal.category\", \"Category\")}:{\" \"}\n </span>\n <span>{app.category ?? \"—\"}</span>\n </div>\n <div>\n <span className=\"text-text-secondary\">\n {tr(\"devportal.pricing\", \"Pricing\")}:{\" \"}\n </span>\n <span>{app.pricingType ?? \"FREE\"}</span>\n </div>\n <div>\n <span className=\"text-text-secondary\">\n {tr(\"devportal.website\", \"Website\")}:{\" \"}\n </span>\n {app.websiteUrl ? (\n <a\n href={app.websiteUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"text-primary underline hover:no-underline\"\n >\n {tr(\"devportal.link\", \"Link\")}\n </a>\n ) : (\n <span>—</span>\n )}\n </div>\n <div>\n <span className=\"text-text-secondary\">\n {tr(\"devportal.privacyPolicy\", \"Privacy Policy\")}:{\" \"}\n </span>\n {app.privacyPolicyUrl ? (\n <a\n href={app.privacyPolicyUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"text-primary underline hover:no-underline\"\n >\n {tr(\"devportal.link\", \"Link\")}\n </a>\n ) : (\n <span className=\"text-status-error-text\">\n {tr(\"devportal.missing\", \"Missing\")}\n </span>\n )}\n </div>\n </div>\n\n {/ Latest version package for review /}\n {latestVersion && (\n <div className=\"rounded-md border bg-bg-surface p-3 space-y-3\">\n <p className=\"text-xs font-medium text-text-secondary\">\n {tr(\"devportal.latestVersion\", \"Latest Version\")}:{\" \"}\n <span className=\"font-mono text-text-primary\">\n {latestVersion.version}\n </span>\n </p>\n <div className=\"flex flex-wrap gap-2\">\n {latestVersion.packageUrl && (\n <a\n href={latestVersion.packageUrl}\n download\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"inline-flex items-center gap-1.5 rounded-md border px-3 py-1.5 text-sm hover:bg-bg-sunken\"\n >\n <Download size={14} />\n {tr(\"devportal.downloadPackage\", \"Download Package\")}\n {latestVersion.packageSize && (\n <span className=\"text-text-secondary text-xs ml-1\">\n ({latestVersion.packageSize})\n </span>\n )}\n </a>\n )}\n </div>\n {latestVersion.manifest && (\n <ManifestViewer\n manifest={latestVersion.manifest as Record<string, unknown>}\n tr={tr}\n />\n )}\n </div>\n )}\n\n {/ Reviewer notes input /}\n <div>\n <label className=\"text-sm font-medium\">\n {tr(\"devportal.reviewNotes\", \"Review Notes\")}\n </label>\n <textarea\n value={reviewNotes}\n onChange={(e) => setReviewNotes(e.target.value)}\n placeholder={tr(\n \"devportal.reviewNotesPlaceholder\",\n \"Add feedback for the developer (required for rejection)...\",\n )}\n rows={3}\n className=\"mt-1 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm ring-offset-background placeholder:text-text-secondary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)] resize-none\"\n />\n </div>\n\n {/ Action buttons /}\n <div className=\"flex gap-3\">\n <button\n onClick={() => onApprove(app.id, reviewNotes)}\n disabled={processing \|\| !approvePerm.allowed}\n aria-disabled={processing \|\| !approvePerm.allowed}\n title={\n !approvePerm.allowed\n ? tr(\n \"devportal.common.noPermission\",\n \"You do not have permission to perform this action\",\n )\n : undefined\n }\n className=\"inline-flex items-center gap-2 rounded-md bg-status-success-bg px-4 py-2 text-sm font-medium text-white hover:bg-status-success-bg/90 disabled:opacity-50 disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n >\n {processing ? (\n <Loader2\n size={14}\n className=\"animate-spin\"\n aria-hidden=\"true\"\n />\n ) : (\n <CheckCircle size={14} aria-hidden=\"true\" />\n )}\n {tr(\"devportal.approve\", \"Approve\")}\n </button>\n <button\n onClick={() => onReject(app.id, reviewNotes)}\n disabled={\n processing \|\| !reviewNotes.trim() \|\| !rejectPerm.allowed\n }\n aria-disabled={\n processing \|\| !reviewNotes.trim() \|\| !rejectPerm.allowed\n }\n className=\"inline-flex items-center gap-2 rounded-md bg-status-error-bg px-4 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg/90 disabled:opacity-50 disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n title={\n !rejectPerm.allowed\n ? tr(\n \"devportal.common.noPermission\",\n \"You do not have permission to perform this action\",\n )\n : !reviewNotes.trim()\n ? tr(\n \"devportal.notesRequiredForRejection\",\n \"Notes required for rejection\",\n )\n : undefined\n }\n >\n {processing ? (\n <Loader2\n size={14}\n className=\"animate-spin\"\n aria-hidden=\"true\"\n />\n ) : (\n <XCircle size={14} aria-hidden=\"true\" />\n )}\n {tr(\"devportal.reject\", \"Reject\")}\n </button>\n </div>\n </div>\n )}\n </div>\n );\n};\n\n// ============================================================================\n// Admin Review Page\n// ============================================================================\n\nexport const AdminReviewPage: FC = () => {\n const { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n };\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [processingIds, setProcessingIds] = useState<Set<string>>(new Set());\n const [actionError, setActionError] = useState<string \| null>(null);\n const [actionSuccess, setActionSuccess] = useState<string \| null>(null);\n\n const addProcessing = (id: string) =>\n setProcessingIds((prev) => new Set(prev).add(id));\n const removeProcessing = (id: string) =>\n setProcessingIds((prev) => {\n const next = new Set(prev);\n next.delete(id);\n return next;\n });\n\n const { data, loading, error, refetch } = useGetApplicationsQuery({\n variables: { status: \"SUBMITTED\" as const, limit: 100 },\n fetchPolicy: \"cache-and-network\",\n });\n\n const [approveApplication] = useApproveApplicationMutation();\n const [rejectApplication] = useRejectApplicationMutation();\n\n const apps =\n data?.applications?.edges?.map(\n (edge: { node: ApplicationFieldsFragment }) => edge.node,\n ) ?? [];\n\n const filteredApps = searchQuery\n ? apps.filter(\n (app: ApplicationFieldsFragment) =>\n app.name.toLowerCase().includes(searchQuery.toLowerCase()) \|\|\n (app.shortDescription ?? \"\")\n .toLowerCase()\n .includes(searchQuery.toLowerCase()),\n )\n : apps;\n\n const handleApprove = async (id: string, notes: string) => {\n addProcessing(id);\n setActionError(null);\n setActionSuccess(null);\n try {\n const result = await approveApplication({\n variables: { id, notes: notes \|\| undefined },\n });\n if (result.error) {\n throw result.error;\n }\n setActionSuccess(\n tr(\n \"devportal.applicationApprovedSuccess\",\n \"Application approved successfully.\",\n ),\n );\n await refetch();\n } catch (err) {\n setActionError(\n err instanceof Error\n ? err.message\n : tr(\n \"devportal.failedToApproveApplication\",\n \"Failed to approve application\",\n ),\n );\n } finally {\n removeProcessing(id);\n }\n };\n\n const handleReject = async (id: string, notes: string) => {\n if (!notes.trim()) return;\n addProcessing(id);\n setActionError(null);\n setActionSuccess(null);\n try {\n const result = await rejectApplication({ variables: { id, notes } });\n if (result.error) {\n throw result.error;\n }\n setActionSuccess(\n tr(\"devportal.applicationRejected\", \"Application rejected.\"),\n );\n await refetch();\n } catch (err) {\n setActionError(\n err instanceof Error\n ? err.message\n : tr(\n \"devportal.failedToRejectApplication\",\n \"Failed to reject application\",\n ),\n );\n } finally {\n removeProcessing(id);\n }\n };\n\n if (loading && !data) {\n return (\n <PageLayout\n title={tr(\"devportal.appReviewQueue\", \"App Review Queue\")}\n description={tr(\n \"devportal.appReviewQueueDescription\",\n \"Review submitted applications for approval\",\n )}\n >\n <div className=\"flex items-center justify-center py-12\">\n <Loader2 className=\"h-8 w-8 animate-spin text-text-secondary\" />\n </div>\n </PageLayout>\n );\n }\n\n if (error) {\n return (\n <PageLayout\n title={tr(\"devportal.appReviewQueue\", \"App Review Queue\")}\n description={tr(\n \"devportal.appReviewQueueDescription\",\n \"Review submitted applications for approval\",\n )}\n >\n <div className=\"rounded-lg border border-status-error-border/50 bg-status-error-bg/10 p-6 text-center\">\n <AlertCircle className=\"mx-auto h-8 w-8 text-status-error-text\" />\n <p className=\"mt-2 text-sm text-text-secondary\">\n {getErrorMessage(error)}\n </p>\n <button\n onClick={() => refetch()}\n className=\"mt-4 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n >\n {tr(\"devportal.retry\", \"Retry\")}\n </button>\n </div>\n </PageLayout>\n );\n }\n\n return (\n <PermissionGuard permission={DEVPORTAL_PERMISSIONS.REVIEW_MANAGE}>\n <PageLayout\n title={tr(\"devportal.appReviewQueue\", \"App Review Queue\")}\n description={tr(\n \"devportal.appReviewQueueFullDescription\",\n \"Review submitted applications for approval or rejection\",\n )}\n actions={\n <button\n onClick={() => refetch()}\n className=\"rounded-md border px-3 py-1.5 text-sm hover:bg-bg-sunken\"\n >\n {tr(\"devportal.refresh\", \"Refresh\")}\n </button>\n }\n >\n {/ Stats bar /}\n <div className=\"flex items-center gap-6 rounded-lg border bg-bg-surface p-4\">\n <div className=\"flex items-center gap-2\">\n <Clock size={18} className=\"text-status-warning-text\" />\n <span className=\"text-sm font-medium\">\n {apps.length} {tr(\"devportal.pendingReview\", \"pending review\")}\n </span>\n </div>\n {processingIds.size > 0 && (\n <div className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <Loader2 size={14} className=\"animate-spin\" />\n {tr(\"devportal.processing\", \"Processing...\")}\n </div>\n )}\n </div>\n\n {/ Feedback messages /}\n {actionSuccess && (\n <div className=\"flex items-center gap-2 rounded-lg border border-border-subtle bg-status-success-bg-subtle px-4 py-3 text-sm text-status-success-text\">\n <CheckCircle size={16} />\n {actionSuccess}\n </div>\n )}\n {actionError && (\n <div className=\"flex items-center gap-2 rounded-lg border border-status-error-border/50 bg-status-error-bg/10 px-4 py-3 text-sm text-status-error-text\">\n <AlertCircle size={16} />\n {actionError}\n </div>\n )}\n\n {/ Search /}\n {apps.length > 0 && (\n <div className=\"relative max-w-sm\">\n <Search\n size={14}\n className=\"absolute left-3 top-1/2 -translate-y-1/2 text-text-secondary\"\n />\n <input\n type=\"text\"\n placeholder={tr(\n \"devportal.searchSubmittedApps\",\n \"Search submitted apps...\",\n )}\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n 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\"\n />\n </div>\n )}\n\n {/ Review list */}\n <PageSection>\n {filteredApps.length === 0 ? (\n <EmptyState\n icon={<CheckCircle size={32} />}\n title={tr(\n \"devportal.noAppsPendingReview\",\n \"No apps pending review\",\n )}\n description={\n searchQuery\n ? tr(\n \"devportal.noAppsMatchSearch\",\n \"No apps match your search\",\n )\n : tr(\n \"devportal.allApplicationsReviewed\",\n \"All submitted applications have been reviewed\",\n )\n }\n />\n ) : (\n <div className=\"space-y-3\">\n {filteredApps.map((app: ApplicationFieldsFragment) => (\n <ReviewRow\n key={app.id}\n app={app}\n onApprove={handleApprove}\n onReject={handleReject}\n processing={processingIds.has(app.id)}\n />\n ))}\n </div>\n )}\n </PageSection>\n </PageLayout>\n </PermissionGuard>\n );\n};\n"],"mappings":"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"}

package/dist/devportal/pages/AnalyticsDashboardPage.js CHANGED Viewed

@@ -7,15 +7,15 @@ import { StatCard as s, StatCardGrid as ee } from "../components/StatCard.js";
 import { AppListItem as te } from "../components/AppCard.js";
 import { DataTable as ne } from "../components/DataTable.js";
 import "../hooks/index.js";
-import { Tooltip as c } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/component/Tooltip.js";
-import { ResponsiveContainer as l } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/component/ResponsiveContainer.js";
-import { Bar as u } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/cartesian/Bar.js";
-import { CartesianGrid as d } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/cartesian/CartesianGrid.js";
-import { Line as f } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/cartesian/Line.js";
-import { XAxis as p } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/cartesian/XAxis.js";
-import { YAxis as m } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/cartesian/YAxis.js";
-import { LineChart as re } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/chart/LineChart.js";
-import { BarChart as ie } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/chart/BarChart.js";
+import { Tooltip as c } from "../../node_modules/recharts/es6/component/Tooltip.js";
+import { ResponsiveContainer as l } from "../../node_modules/recharts/es6/component/ResponsiveContainer.js";
+import { Bar as u } from "../../node_modules/recharts/es6/cartesian/Bar.js";
+import { CartesianGrid as d } from "../../node_modules/recharts/es6/cartesian/CartesianGrid.js";
+import { Line as f } from "../../node_modules/recharts/es6/cartesian/Line.js";
+import { XAxis as p } from "../../node_modules/recharts/es6/cartesian/XAxis.js";
+import { YAxis as m } from "../../node_modules/recharts/es6/cartesian/YAxis.js";
+import { LineChart as re } from "../../node_modules/recharts/es6/chart/LineChart.js";
+import { BarChart as ie } from "../../node_modules/recharts/es6/chart/BarChart.js";
 import { useTr as ae } from "../utils/i18n.js";
 import { useEffect as h, useMemo as g, useState as _ } from "react";
 import { Activity as v, AlertCircle as y, AlertTriangle as b, BarChart3 as x, Clock as oe, Loader2 as S, Users as C } from "lucide-react";
@@ -76,7 +76,7 @@ var O = {
 		title: M("devportal.analytics.title", "Analytics"),
 		description: M("devportal.analytics.description", "Explore live application usage and performance metrics"),
 		children: /* @__PURE__ */ E("div", {
-			className: "flex items-center justify-center py-16 text-muted-foreground",
+			className: "flex items-center justify-center py-16 text-text-secondary",
 			children: /* @__PURE__ */ E(S, { className: "h-8 w-8 animate-spin" })
 		})
 	}) : !A && V ? /* @__PURE__ */ E(a, {
@@ -128,7 +128,7 @@ var O = {
 				value: F,
 				onChange: (e) => I(e.target.value),
 				"aria-label": M("devportal.analytics.selectAppAria", "Select application"),
-				className: "rounded-md border bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
+				className: "rounded-md border bg-bg-surface px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
 				children: K.map((e) => /* @__PURE__ */ E("option", {
 					value: e.id,
 					children: e.name
@@ -137,7 +137,7 @@ var O = {
 				value: N,
 				onChange: (e) => P(e.target.value),
 				"aria-label": M("devportal.analytics.selectRangeAria", "Select time range"),
-				className: "rounded-md border bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
+				className: "rounded-md border bg-bg-surface px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
 				children: [
 					/* @__PURE__ */ E("option", {
 						value: "7d",
@@ -155,7 +155,7 @@ var O = {
 			})]
 		}),
 		children: U && !J.length ? /* @__PURE__ */ E("div", {
-			className: "flex items-center justify-center py-16 text-muted-foreground",
+			className: "flex items-center justify-center py-16 text-text-secondary",
 			children: /* @__PURE__ */ E(S, { className: "h-8 w-8 animate-spin" })
 		}) : J.length > 0 ? /* @__PURE__ */ D(T, { children: [
 			/* @__PURE__ */ D(ee, {
@@ -196,7 +196,7 @@ var O = {
 				children: [/* @__PURE__ */ E(o, {
 					title: M("devportal.analytics.trafficTrend", "Traffic trend"),
 					children: /* @__PURE__ */ E("div", {
-						className: "rounded-lg border bg-card p-4",
+						className: "rounded-lg border bg-bg-surface p-4",
 						children: /* @__PURE__ */ E(l, {
 							width: "100%",
 							height: 300,
@@ -242,7 +242,7 @@ var O = {
 				}), /* @__PURE__ */ E(o, {
 					title: M("devportal.analytics.userActivity", "User activity"),
 					children: /* @__PURE__ */ E("div", {
-						className: "rounded-lg border bg-card p-4",
+						className: "rounded-lg border bg-bg-surface p-4",
 						children: /* @__PURE__ */ E(l, {
 							width: "100%",
 							height: 300,
@@ -348,7 +348,7 @@ var O = {
 			action: A ? void 0 : /* @__PURE__ */ E("button", {
 				type: "button",
 				onClick: () => ue("/apps"),
-				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 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary",
+				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 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary",
 				children: M("devportal.analytics.viewApplications", "View applications")
 			})
 		})

package/dist/devportal/pages/AnalyticsDashboardPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnalyticsDashboardPage.js","names":[],"sources":["../../../src/devportal/pages/AnalyticsDashboardPage.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport { useParams } from \"react-router-dom\";\nimport {\n Activity,\n AlertCircle,\n AlertTriangle,\n BarChart3,\n Clock,\n Loader2,\n Users,\n} from \"lucide-react\";\nimport {\n Bar,\n BarChart,\n CartesianGrid,\n Line,\n LineChart,\n ResponsiveContainer,\n Tooltip,\n XAxis,\n YAxis,\n} from \"recharts\";\nimport { PageLayout, PageSection } from \"../components/PageLayout\";\nimport { DataTable } from \"../components/DataTable\";\nimport { EmptyState } from \"../components/EmptyState\";\nimport { StatCard, StatCardGrid } from \"../components/StatCard\";\nimport { AppListItem } from \"../components/AppCard\";\nimport type { Application } from \"../types\";\nimport { useDevportal } from \"../providers/DevportalProvider\";\nimport {\n type GetAnalyticsDashboardOptionsQuery,\n getErrorMessage,\n useGetAnalyticsDashboardOptionsQuery,\n useGetApplicationAnalyticsDashboardQuery,\n} from \"../hooks\";\nimport { useTr } from \"../utils/i18n\";\n\ntype TimeRange = \"7d\" \| \"30d\" \| \"90d\";\n\nconst daysByRange: Record<TimeRange, number> = {\n \"7d\": 7,\n \"30d\": 30,\n \"90d\": 90,\n};\n\nconst chartColors = {\n primary: \"var(--color-chart-1)\",\n secondary: \"var(--color-chart-2)\",\n tertiary: \"var(--color-chart-4)\",\n negative: \"var(--color-chart-negative)\",\n};\n\nexport const AnalyticsDashboardPage: FC = () => {\n const { appId } = useParams<{ appId: string }>();\n const { navigate, basePath, activeOrgId } = useDevportal();\n const tr = useTr();\n const [timeRange, setTimeRange] = useState<TimeRange>(\"30d\");\n const [selectedApplicationId, setSelectedApplicationId] = useState(\n appId \|\| \"\",\n );\n\n const now = useMemo(() => new Date(), []);\n const startDate = useMemo(() => {\n const nextDate = new Date(now);\n nextDate.setDate(nextDate.getDate() - daysByRange[timeRange]);\n return nextDate.toISOString();\n }, [now, timeRange]);\n\n const {\n data: optionsData,\n loading: optionsLoading,\n error: optionsError,\n } = useGetAnalyticsDashboardOptionsQuery({\n skip: !!appId,\n fetchPolicy: \"cache-and-network\",\n });\n\n const { data, loading, error } = useGetApplicationAnalyticsDashboardQuery({\n variables: {\n applicationId: selectedApplicationId \|\| appId \|\| \"\",\n period: \"daily\",\n startDate,\n endDate: now.toISOString(),\n },\n skip: !(selectedApplicationId \|\| appId),\n fetchPolicy: \"cache-and-network\",\n });\n\n const allApplications: Application[] =\n optionsData?.applications?.edges?.map(\n (\n edge: GetAnalyticsDashboardOptionsQuery[\"applications\"][\"edges\"][number],\n ) => edge.node as Application,\n ) ?? [];\n // Scope the app picker to the active org when one is selected\n const applications = activeOrgId\n ? allApplications.filter((a) => a.developerOrganizationId === activeOrgId)\n : allApplications;\n const selectedApplication = data?.application;\n\n useEffect(() => {\n const name = selectedApplication?.name;\n const id = appId \|\| selectedApplicationId;\n if (!id \|\| !name) return;\n const reg = (\n window as unknown as {\n __breadcrumbRegistry?: {\n register: (id: string, name: string) => void;\n unregister: (id: string) => void;\n };\n }\n ).__breadcrumbRegistry;\n reg?.register(id, name);\n return () => reg?.unregister(id);\n }, [appId, selectedApplicationId, selectedApplication?.name]);\n\n const analytics = [...(data?.applicationAnalytics ?? [])].sort(\n (left, right) =>\n new Date(left.date).getTime() - new Date(right.date).getTime(),\n );\n\n const latest = analytics[analytics.length - 1];\n const previous = analytics[analytics.length - 2];\n const chartData = analytics.map((entry) => ({\n date: new Date(entry.date).toLocaleDateString(undefined, {\n month: \"short\",\n day: \"numeric\",\n }),\n apiCalls: entry.apiCalls,\n errors: entry.errors,\n activeUsers: entry.activeUsers,\n newUsers: entry.newUsers,\n sessions: entry.sessions,\n avgResponseTime: entry.avgResponseTime ?? 0,\n }));\n\n const errorRate =\n latest && latest.apiCalls > 0 ? (latest.errors / latest.apiCalls) * 100 : 0;\n const previousErrorRate =\n previous && previous.apiCalls > 0\n ? (previous.errors / previous.apiCalls) * 100\n : 0;\n const responseTrend =\n latest?.avgResponseTime && previous?.avgResponseTime\n ? previous.avgResponseTime - latest.avgResponseTime\n : undefined;\n\n const handleNavigate = (path: string) => {\n navigate?.(`${basePath}${path}`);\n };\n\n if (!appId && optionsLoading && !optionsData) {\n return (\n <PageLayout\n title={tr(\"devportal.analytics.title\", \"Analytics\")}\n description={tr(\n \"devportal.analytics.description\",\n \"Explore live application usage and performance metrics\",\n )}\n >\n <div className=\"flex items-center justify-center py-16 text-muted-foreground\">\n <Loader2 className=\"h-8 w-8 animate-spin\" />\n </div>\n </PageLayout>\n );\n }\n\n if (!appId && optionsError) {\n return (\n <PageLayout\n title={tr(\"devportal.analytics.title\", \"Analytics\")}\n description={tr(\n \"devportal.analytics.description\",\n \"Explore live application usage and performance metrics\",\n )}\n >\n <EmptyState\n icon={<AlertCircle size={32} className=\"text-status-error-text\" />}\n title={tr(\n \"devportal.analytics.errorLoadApps\",\n \"Unable to load applications\",\n )}\n description={getErrorMessage(optionsError)}\n />\n </PageLayout>\n );\n }\n\n if (!appId && !selectedApplicationId) {\n return (\n <PageLayout\n title={tr(\"devportal.analytics.title\", \"Analytics\")}\n description={tr(\n \"devportal.analytics.selectAppDescription\",\n \"Select an application to review live usage metrics from the public gateway\",\n )}\n >\n {applications.length > 0 ? (\n <div className=\"space-y-2\">\n {applications.map((application) => (\n <AppListItem\n key={application.id}\n app={application}\n onClick={() => setSelectedApplicationId(application.id)}\n />\n ))}\n </div>\n ) : (\n <EmptyState\n icon={<BarChart3 size={32} />}\n title={tr(\n \"devportal.analytics.noAppsTitle\",\n \"No applications available\",\n )}\n description={tr(\n \"devportal.analytics.noAppsDescription\",\n \"Create an application before viewing analytics.\",\n )}\n />\n )}\n </PageLayout>\n );\n }\n\n if (error) {\n return (\n <PageLayout\n title={tr(\"devportal.analytics.title\", \"Analytics\")}\n description={tr(\n \"devportal.analytics.description\",\n \"Explore live application usage and performance metrics\",\n )}\n backLink={\n selectedApplicationId ? `/apps/${selectedApplicationId}` : undefined\n }\n backLabel={tr(\n \"devportal.analytics.backToApplication\",\n \"Back to Application\",\n )}\n >\n <EmptyState\n icon={<AlertCircle size={32} className=\"text-status-error-text\" />}\n title={tr(\n \"devportal.analytics.errorLoadAnalytics\",\n \"Unable to load analytics\",\n )}\n description={getErrorMessage(error)}\n />\n </PageLayout>\n );\n }\n\n return (\n <PageLayout\n title={\n appId\n ? tr(\"devportal.analytics.appTitle\", \"Application Analytics\")\n : tr(\"devportal.analytics.title\", \"Analytics\")\n }\n description={\n selectedApplication\n ? `${tr(\"devportal.analytics.liveUsageFor\", \"Live usage and performance for\")} ${selectedApplication.name}`\n : tr(\n \"devportal.analytics.description\",\n \"Explore live application usage and performance metrics\",\n )\n }\n backLink={\n appId && selectedApplication\n ? `/apps/${selectedApplication.id}`\n : undefined\n }\n backLabel={tr(\n \"devportal.analytics.backToApplication\",\n \"Back to Application\",\n )}\n actions={\n <div className=\"flex flex-wrap gap-2\">\n {!appId && applications.length > 0 && (\n <select\n value={selectedApplicationId}\n onChange={(event) => setSelectedApplicationId(event.target.value)}\n aria-label={tr(\n \"devportal.analytics.selectAppAria\",\n \"Select application\",\n )}\n className=\"rounded-md border bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary\"\n >\n {applications.map((application) => (\n <option key={application.id} value={application.id}>\n {application.name}\n </option>\n ))}\n </select>\n )}\n <select\n value={timeRange}\n onChange={(event) => setTimeRange(event.target.value as TimeRange)}\n aria-label={tr(\n \"devportal.analytics.selectRangeAria\",\n \"Select time range\",\n )}\n className=\"rounded-md border bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary\"\n >\n <option value=\"7d\">\n {tr(\"devportal.analytics.range.7d\", \"Last 7 days\")}\n </option>\n <option value=\"30d\">\n {tr(\"devportal.analytics.range.30d\", \"Last 30 days\")}\n </option>\n <option value=\"90d\">\n {tr(\"devportal.analytics.range.90d\", \"Last 90 days\")}\n </option>\n </select>\n </div>\n }\n >\n {loading && !analytics.length ? (\n <div className=\"flex items-center justify-center py-16 text-muted-foreground\">\n <Loader2 className=\"h-8 w-8 animate-spin\" />\n </div>\n ) : analytics.length > 0 ? (\n <>\n <StatCardGrid columns={4}>\n <StatCard\n title={tr(\"devportal.analytics.apiCalls\", \"API Calls\")}\n value={(latest?.apiCalls ?? 0).toLocaleString()}\n icon={<Activity size={20} />}\n />\n <StatCard\n title={tr(\"devportal.analytics.activeUsers\", \"Active Users\")}\n value={(latest?.activeUsers ?? 0).toLocaleString()}\n icon={<Users size={20} />}\n />\n <StatCard\n title={tr(\"devportal.analytics.errorRate\", \"Error Rate\")}\n value={`${errorRate.toFixed(2)}%`}\n icon={<AlertTriangle size={20} />}\n trend={\n previous\n ? {\n value: previousErrorRate - errorRate,\n label: tr(\n \"devportal.analytics.vsPrevious\",\n \"vs previous period\",\n ),\n }\n : undefined\n }\n />\n <StatCard\n title={tr(\n \"devportal.analytics.avgResponseTime\",\n \"Avg Response Time\",\n )}\n value={\n latest?.avgResponseTime\n ? `${latest.avgResponseTime}ms`\n : tr(\"devportal.common.na\", \"N/A\")\n }\n icon={<Clock size={20} />}\n trend={\n typeof responseTrend === \"number\"\n ? {\n value: responseTrend,\n label: tr(\n \"devportal.analytics.fasterThanPrevious\",\n \"faster than previous\",\n ),\n }\n : undefined\n }\n />\n </StatCardGrid>\n\n <div className=\"grid gap-6 xl:grid-cols-2\">\n <PageSection\n title={tr(\"devportal.analytics.trafficTrend\", \"Traffic trend\")}\n >\n <div className=\"rounded-lg border bg-card p-4\">\n <ResponsiveContainer width=\"100%\" height={300}>\n <LineChart data={chartData}>\n <CartesianGrid\n strokeDasharray=\"3 3\"\n stroke=\"var(--color-chart-grid)\"\n />\n <XAxis\n dataKey=\"date\"\n stroke=\"var(--color-chart-axis)\"\n fontSize={12}\n />\n <YAxis stroke=\"var(--color-chart-axis)\" fontSize={12} />\n <Tooltip\n contentStyle={{\n backgroundColor: \"var(--color-card)\",\n border: \"1px solid var(--color-border-default)\",\n borderRadius: 12,\n }}\n />\n <Line\n type=\"monotone\"\n dataKey=\"apiCalls\"\n stroke={chartColors.primary}\n strokeWidth={2}\n dot={false}\n />\n <Line\n type=\"monotone\"\n dataKey=\"errors\"\n stroke={chartColors.negative}\n strokeWidth={2}\n dot={false}\n />\n </LineChart>\n </ResponsiveContainer>\n </div>\n </PageSection>\n\n <PageSection\n title={tr(\"devportal.analytics.userActivity\", \"User activity\")}\n >\n <div className=\"rounded-lg border bg-card p-4\">\n <ResponsiveContainer width=\"100%\" height={300}>\n <BarChart data={chartData}>\n <CartesianGrid\n strokeDasharray=\"3 3\"\n stroke=\"var(--color-chart-grid)\"\n />\n <XAxis\n dataKey=\"date\"\n stroke=\"var(--color-chart-axis)\"\n fontSize={12}\n />\n <YAxis stroke=\"var(--color-chart-axis)\" fontSize={12} />\n <Tooltip\n contentStyle={{\n backgroundColor: \"var(--color-card)\",\n border: \"1px solid var(--color-border-default)\",\n borderRadius: 12,\n }}\n />\n <Bar\n dataKey=\"activeUsers\"\n fill={chartColors.primary}\n radius={[6, 6, 0, 0]}\n />\n <Bar\n dataKey=\"newUsers\"\n fill={chartColors.secondary}\n radius={[6, 6, 0, 0]}\n />\n </BarChart>\n </ResponsiveContainer>\n </div>\n </PageSection>\n </div>\n\n <PageSection\n title={tr(\"devportal.analytics.dailyBreakdown\", \"Daily breakdown\")}\n >\n <DataTable\n data={analytics}\n keyField=\"id\"\n columns={[\n {\n key: \"date\",\n header: tr(\"devportal.analytics.date\", \"Date\"),\n render: (entry) =>\n new Date(entry.date).toLocaleDateString(undefined, {\n month: \"short\",\n day: \"numeric\",\n year: \"numeric\",\n }),\n },\n {\n key: \"apiCalls\",\n header: tr(\"devportal.analytics.apiCalls\", \"API Calls\"),\n render: (entry) => entry.apiCalls.toLocaleString(),\n },\n {\n key: \"errors\",\n header: tr(\"devportal.analytics.errors\", \"Errors\"),\n render: (entry) => entry.errors.toLocaleString(),\n },\n {\n key: \"activeUsers\",\n header: tr(\"devportal.analytics.activeUsers\", \"Active Users\"),\n render: (entry) => entry.activeUsers.toLocaleString(),\n },\n {\n key: \"newUsers\",\n header: tr(\"devportal.analytics.newUsers\", \"New Users\"),\n render: (entry) => entry.newUsers.toLocaleString(),\n },\n {\n key: \"avgResponseTime\",\n header: tr(\"devportal.analytics.avgResponse\", \"Avg Response\"),\n render: (entry) =>\n entry.avgResponseTime\n ? `${entry.avgResponseTime}ms`\n : tr(\"devportal.common.na\", \"N/A\"),\n },\n {\n key: \"sessions\",\n header: tr(\"devportal.analytics.sessions\", \"Sessions\"),\n render: (entry) => entry.sessions.toLocaleString(),\n },\n ]}\n />\n </PageSection>\n </>\n ) : (\n <EmptyState\n icon={<BarChart3 size={32} />}\n title={tr(\n \"devportal.analytics.noAnalyticsTitle\",\n \"No analytics available yet\",\n )}\n description={tr(\n \"devportal.analytics.noAnalyticsDescription\",\n \"Analytics will appear after this application starts receiving traffic through the public gateway.\",\n )}\n action={\n !appId ? (\n <button\n type=\"button\"\n onClick={() => handleNavigate(\"/apps\")}\n 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 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n >\n {tr(\n \"devportal.analytics.viewApplications\",\n \"View applications\",\n )}\n </button>\n ) : undefined\n }\n />\n )}\n </PageLayout>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"AnalyticsDashboardPage.js","names":[],"sources":["../../../src/devportal/pages/AnalyticsDashboardPage.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport { useParams } from \"react-router-dom\";\nimport {\n Activity,\n AlertCircle,\n AlertTriangle,\n BarChart3,\n Clock,\n Loader2,\n Users,\n} from \"lucide-react\";\nimport {\n Bar,\n BarChart,\n CartesianGrid,\n Line,\n LineChart,\n ResponsiveContainer,\n Tooltip,\n XAxis,\n YAxis,\n} from \"recharts\";\nimport { PageLayout, PageSection } from \"../components/PageLayout\";\nimport { DataTable } from \"../components/DataTable\";\nimport { EmptyState } from \"../components/EmptyState\";\nimport { StatCard, StatCardGrid } from \"../components/StatCard\";\nimport { AppListItem } from \"../components/AppCard\";\nimport type { Application } from \"../types\";\nimport { useDevportal } from \"../providers/DevportalProvider\";\nimport {\n type GetAnalyticsDashboardOptionsQuery,\n getErrorMessage,\n useGetAnalyticsDashboardOptionsQuery,\n useGetApplicationAnalyticsDashboardQuery,\n} from \"../hooks\";\nimport { useTr } from \"../utils/i18n\";\n\ntype TimeRange = \"7d\" \| \"30d\" \| \"90d\";\n\nconst daysByRange: Record<TimeRange, number> = {\n \"7d\": 7,\n \"30d\": 30,\n \"90d\": 90,\n};\n\nconst chartColors = {\n primary: \"var(--color-chart-1)\",\n secondary: \"var(--color-chart-2)\",\n tertiary: \"var(--color-chart-4)\",\n negative: \"var(--color-chart-negative)\",\n};\n\nexport const AnalyticsDashboardPage: FC = () => {\n const { appId } = useParams<{ appId: string }>();\n const { navigate, basePath, activeOrgId } = useDevportal();\n const tr = useTr();\n const [timeRange, setTimeRange] = useState<TimeRange>(\"30d\");\n const [selectedApplicationId, setSelectedApplicationId] = useState(\n appId \|\| \"\",\n );\n\n const now = useMemo(() => new Date(), []);\n const startDate = useMemo(() => {\n const nextDate = new Date(now);\n nextDate.setDate(nextDate.getDate() - daysByRange[timeRange]);\n return nextDate.toISOString();\n }, [now, timeRange]);\n\n const {\n data: optionsData,\n loading: optionsLoading,\n error: optionsError,\n } = useGetAnalyticsDashboardOptionsQuery({\n skip: !!appId,\n fetchPolicy: \"cache-and-network\",\n });\n\n const { data, loading, error } = useGetApplicationAnalyticsDashboardQuery({\n variables: {\n applicationId: selectedApplicationId \|\| appId \|\| \"\",\n period: \"daily\",\n startDate,\n endDate: now.toISOString(),\n },\n skip: !(selectedApplicationId \|\| appId),\n fetchPolicy: \"cache-and-network\",\n });\n\n const allApplications: Application[] =\n optionsData?.applications?.edges?.map(\n (\n edge: GetAnalyticsDashboardOptionsQuery[\"applications\"][\"edges\"][number],\n ) => edge.node as Application,\n ) ?? [];\n // Scope the app picker to the active org when one is selected\n const applications = activeOrgId\n ? allApplications.filter((a) => a.developerOrganizationId === activeOrgId)\n : allApplications;\n const selectedApplication = data?.application;\n\n useEffect(() => {\n const name = selectedApplication?.name;\n const id = appId \|\| selectedApplicationId;\n if (!id \|\| !name) return;\n const reg = (\n window as unknown as {\n __breadcrumbRegistry?: {\n register: (id: string, name: string) => void;\n unregister: (id: string) => void;\n };\n }\n ).__breadcrumbRegistry;\n reg?.register(id, name);\n return () => reg?.unregister(id);\n }, [appId, selectedApplicationId, selectedApplication?.name]);\n\n const analytics = [...(data?.applicationAnalytics ?? [])].sort(\n (left, right) =>\n new Date(left.date).getTime() - new Date(right.date).getTime(),\n );\n\n const latest = analytics[analytics.length - 1];\n const previous = analytics[analytics.length - 2];\n const chartData = analytics.map((entry) => ({\n date: new Date(entry.date).toLocaleDateString(undefined, {\n month: \"short\",\n day: \"numeric\",\n }),\n apiCalls: entry.apiCalls,\n errors: entry.errors,\n activeUsers: entry.activeUsers,\n newUsers: entry.newUsers,\n sessions: entry.sessions,\n avgResponseTime: entry.avgResponseTime ?? 0,\n }));\n\n const errorRate =\n latest && latest.apiCalls > 0 ? (latest.errors / latest.apiCalls) * 100 : 0;\n const previousErrorRate =\n previous && previous.apiCalls > 0\n ? (previous.errors / previous.apiCalls) * 100\n : 0;\n const responseTrend =\n latest?.avgResponseTime && previous?.avgResponseTime\n ? previous.avgResponseTime - latest.avgResponseTime\n : undefined;\n\n const handleNavigate = (path: string) => {\n navigate?.(`${basePath}${path}`);\n };\n\n if (!appId && optionsLoading && !optionsData) {\n return (\n <PageLayout\n title={tr(\"devportal.analytics.title\", \"Analytics\")}\n description={tr(\n \"devportal.analytics.description\",\n \"Explore live application usage and performance metrics\",\n )}\n >\n <div className=\"flex items-center justify-center py-16 text-text-secondary\">\n <Loader2 className=\"h-8 w-8 animate-spin\" />\n </div>\n </PageLayout>\n );\n }\n\n if (!appId && optionsError) {\n return (\n <PageLayout\n title={tr(\"devportal.analytics.title\", \"Analytics\")}\n description={tr(\n \"devportal.analytics.description\",\n \"Explore live application usage and performance metrics\",\n )}\n >\n <EmptyState\n icon={<AlertCircle size={32} className=\"text-status-error-text\" />}\n title={tr(\n \"devportal.analytics.errorLoadApps\",\n \"Unable to load applications\",\n )}\n description={getErrorMessage(optionsError)}\n />\n </PageLayout>\n );\n }\n\n if (!appId && !selectedApplicationId) {\n return (\n <PageLayout\n title={tr(\"devportal.analytics.title\", \"Analytics\")}\n description={tr(\n \"devportal.analytics.selectAppDescription\",\n \"Select an application to review live usage metrics from the public gateway\",\n )}\n >\n {applications.length > 0 ? (\n <div className=\"space-y-2\">\n {applications.map((application) => (\n <AppListItem\n key={application.id}\n app={application}\n onClick={() => setSelectedApplicationId(application.id)}\n />\n ))}\n </div>\n ) : (\n <EmptyState\n icon={<BarChart3 size={32} />}\n title={tr(\n \"devportal.analytics.noAppsTitle\",\n \"No applications available\",\n )}\n description={tr(\n \"devportal.analytics.noAppsDescription\",\n \"Create an application before viewing analytics.\",\n )}\n />\n )}\n </PageLayout>\n );\n }\n\n if (error) {\n return (\n <PageLayout\n title={tr(\"devportal.analytics.title\", \"Analytics\")}\n description={tr(\n \"devportal.analytics.description\",\n \"Explore live application usage and performance metrics\",\n )}\n backLink={\n selectedApplicationId ? `/apps/${selectedApplicationId}` : undefined\n }\n backLabel={tr(\n \"devportal.analytics.backToApplication\",\n \"Back to Application\",\n )}\n >\n <EmptyState\n icon={<AlertCircle size={32} className=\"text-status-error-text\" />}\n title={tr(\n \"devportal.analytics.errorLoadAnalytics\",\n \"Unable to load analytics\",\n )}\n description={getErrorMessage(error)}\n />\n </PageLayout>\n );\n }\n\n return (\n <PageLayout\n title={\n appId\n ? tr(\"devportal.analytics.appTitle\", \"Application Analytics\")\n : tr(\"devportal.analytics.title\", \"Analytics\")\n }\n description={\n selectedApplication\n ? `${tr(\"devportal.analytics.liveUsageFor\", \"Live usage and performance for\")} ${selectedApplication.name}`\n : tr(\n \"devportal.analytics.description\",\n \"Explore live application usage and performance metrics\",\n )\n }\n backLink={\n appId && selectedApplication\n ? `/apps/${selectedApplication.id}`\n : undefined\n }\n backLabel={tr(\n \"devportal.analytics.backToApplication\",\n \"Back to Application\",\n )}\n actions={\n <div className=\"flex flex-wrap gap-2\">\n {!appId && applications.length > 0 && (\n <select\n value={selectedApplicationId}\n onChange={(event) => setSelectedApplicationId(event.target.value)}\n aria-label={tr(\n \"devportal.analytics.selectAppAria\",\n \"Select application\",\n )}\n className=\"rounded-md border bg-bg-surface px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary\"\n >\n {applications.map((application) => (\n <option key={application.id} value={application.id}>\n {application.name}\n </option>\n ))}\n </select>\n )}\n <select\n value={timeRange}\n onChange={(event) => setTimeRange(event.target.value as TimeRange)}\n aria-label={tr(\n \"devportal.analytics.selectRangeAria\",\n \"Select time range\",\n )}\n className=\"rounded-md border bg-bg-surface px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary\"\n >\n <option value=\"7d\">\n {tr(\"devportal.analytics.range.7d\", \"Last 7 days\")}\n </option>\n <option value=\"30d\">\n {tr(\"devportal.analytics.range.30d\", \"Last 30 days\")}\n </option>\n <option value=\"90d\">\n {tr(\"devportal.analytics.range.90d\", \"Last 90 days\")}\n </option>\n </select>\n </div>\n }\n >\n {loading && !analytics.length ? (\n <div className=\"flex items-center justify-center py-16 text-text-secondary\">\n <Loader2 className=\"h-8 w-8 animate-spin\" />\n </div>\n ) : analytics.length > 0 ? (\n <>\n <StatCardGrid columns={4}>\n <StatCard\n title={tr(\"devportal.analytics.apiCalls\", \"API Calls\")}\n value={(latest?.apiCalls ?? 0).toLocaleString()}\n icon={<Activity size={20} />}\n />\n <StatCard\n title={tr(\"devportal.analytics.activeUsers\", \"Active Users\")}\n value={(latest?.activeUsers ?? 0).toLocaleString()}\n icon={<Users size={20} />}\n />\n <StatCard\n title={tr(\"devportal.analytics.errorRate\", \"Error Rate\")}\n value={`${errorRate.toFixed(2)}%`}\n icon={<AlertTriangle size={20} />}\n trend={\n previous\n ? {\n value: previousErrorRate - errorRate,\n label: tr(\n \"devportal.analytics.vsPrevious\",\n \"vs previous period\",\n ),\n }\n : undefined\n }\n />\n <StatCard\n title={tr(\n \"devportal.analytics.avgResponseTime\",\n \"Avg Response Time\",\n )}\n value={\n latest?.avgResponseTime\n ? `${latest.avgResponseTime}ms`\n : tr(\"devportal.common.na\", \"N/A\")\n }\n icon={<Clock size={20} />}\n trend={\n typeof responseTrend === \"number\"\n ? {\n value: responseTrend,\n label: tr(\n \"devportal.analytics.fasterThanPrevious\",\n \"faster than previous\",\n ),\n }\n : undefined\n }\n />\n </StatCardGrid>\n\n <div className=\"grid gap-6 xl:grid-cols-2\">\n <PageSection\n title={tr(\"devportal.analytics.trafficTrend\", \"Traffic trend\")}\n >\n <div className=\"rounded-lg border bg-bg-surface p-4\">\n <ResponsiveContainer width=\"100%\" height={300}>\n <LineChart data={chartData}>\n <CartesianGrid\n strokeDasharray=\"3 3\"\n stroke=\"var(--color-chart-grid)\"\n />\n <XAxis\n dataKey=\"date\"\n stroke=\"var(--color-chart-axis)\"\n fontSize={12}\n />\n <YAxis stroke=\"var(--color-chart-axis)\" fontSize={12} />\n <Tooltip\n contentStyle={{\n backgroundColor: \"var(--color-card)\",\n border: \"1px solid var(--color-border-default)\",\n borderRadius: 12,\n }}\n />\n <Line\n type=\"monotone\"\n dataKey=\"apiCalls\"\n stroke={chartColors.primary}\n strokeWidth={2}\n dot={false}\n />\n <Line\n type=\"monotone\"\n dataKey=\"errors\"\n stroke={chartColors.negative}\n strokeWidth={2}\n dot={false}\n />\n </LineChart>\n </ResponsiveContainer>\n </div>\n </PageSection>\n\n <PageSection\n title={tr(\"devportal.analytics.userActivity\", \"User activity\")}\n >\n <div className=\"rounded-lg border bg-bg-surface p-4\">\n <ResponsiveContainer width=\"100%\" height={300}>\n <BarChart data={chartData}>\n <CartesianGrid\n strokeDasharray=\"3 3\"\n stroke=\"var(--color-chart-grid)\"\n />\n <XAxis\n dataKey=\"date\"\n stroke=\"var(--color-chart-axis)\"\n fontSize={12}\n />\n <YAxis stroke=\"var(--color-chart-axis)\" fontSize={12} />\n <Tooltip\n contentStyle={{\n backgroundColor: \"var(--color-card)\",\n border: \"1px solid var(--color-border-default)\",\n borderRadius: 12,\n }}\n />\n <Bar\n dataKey=\"activeUsers\"\n fill={chartColors.primary}\n radius={[6, 6, 0, 0]}\n />\n <Bar\n dataKey=\"newUsers\"\n fill={chartColors.secondary}\n radius={[6, 6, 0, 0]}\n />\n </BarChart>\n </ResponsiveContainer>\n </div>\n </PageSection>\n </div>\n\n <PageSection\n title={tr(\"devportal.analytics.dailyBreakdown\", \"Daily breakdown\")}\n >\n <DataTable\n data={analytics}\n keyField=\"id\"\n columns={[\n {\n key: \"date\",\n header: tr(\"devportal.analytics.date\", \"Date\"),\n render: (entry) =>\n new Date(entry.date).toLocaleDateString(undefined, {\n month: \"short\",\n day: \"numeric\",\n year: \"numeric\",\n }),\n },\n {\n key: \"apiCalls\",\n header: tr(\"devportal.analytics.apiCalls\", \"API Calls\"),\n render: (entry) => entry.apiCalls.toLocaleString(),\n },\n {\n key: \"errors\",\n header: tr(\"devportal.analytics.errors\", \"Errors\"),\n render: (entry) => entry.errors.toLocaleString(),\n },\n {\n key: \"activeUsers\",\n header: tr(\"devportal.analytics.activeUsers\", \"Active Users\"),\n render: (entry) => entry.activeUsers.toLocaleString(),\n },\n {\n key: \"newUsers\",\n header: tr(\"devportal.analytics.newUsers\", \"New Users\"),\n render: (entry) => entry.newUsers.toLocaleString(),\n },\n {\n key: \"avgResponseTime\",\n header: tr(\"devportal.analytics.avgResponse\", \"Avg Response\"),\n render: (entry) =>\n entry.avgResponseTime\n ? `${entry.avgResponseTime}ms`\n : tr(\"devportal.common.na\", \"N/A\"),\n },\n {\n key: \"sessions\",\n header: tr(\"devportal.analytics.sessions\", \"Sessions\"),\n render: (entry) => entry.sessions.toLocaleString(),\n },\n ]}\n />\n </PageSection>\n </>\n ) : (\n <EmptyState\n icon={<BarChart3 size={32} />}\n title={tr(\n \"devportal.analytics.noAnalyticsTitle\",\n \"No analytics available yet\",\n )}\n description={tr(\n \"devportal.analytics.noAnalyticsDescription\",\n \"Analytics will appear after this application starts receiving traffic through the public gateway.\",\n )}\n action={\n !appId ? (\n <button\n type=\"button\"\n onClick={() => handleNavigate(\"/apps\")}\n className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n >\n {tr(\n \"devportal.analytics.viewApplications\",\n \"View applications\",\n )}\n </button>\n ) : undefined\n }\n />\n )}\n </PageLayout>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAwCA,IAAM,IAAyC;CAC7C,MAAM;CACN,OAAO;CACP,OAAO;CACR,EAEK,IAAc;CAClB,SAAS;CACT,WAAW;CACX,UAAU;CACV,UAAU;CACX,EAEY,UAAmC;CAC9C,IAAM,EAAE,aAAU,GAA8B,EAC1C,EAAE,cAAU,cAAU,mBAAgB,GAAc,EACpD,IAAK,IAAO,EACZ,CAAC,GAAW,KAAgB,EAAoB,MAAM,EACtD,CAAC,GAAuB,KAA4B,EACxD,KAAS,GACV,EAEK,IAAM,wBAAc,IAAI,MAAM,EAAE,EAAE,CAAC,EACnC,IAAY,QAAc;EAC9B,IAAM,IAAW,IAAI,KAAK,EAAI;AAE9B,SADA,EAAS,QAAQ,EAAS,SAAS,GAAG,EAAY,GAAW,EACtD,EAAS,aAAa;IAC5B,CAAC,GAAK,EAAU,CAAC,EAEd,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAqC;EACvC,MAAM,CAAC,CAAC;EACR,aAAa;EACd,CAAC,EAEI,EAAE,SAAM,YAAS,aAAU,EAAyC;EACxE,WAAW;GACT,eAAe,KAAyB,KAAS;GACjD,QAAQ;GACR;GACA,SAAS,EAAI,aAAa;GAC3B;EACD,MAAM,EAAE,KAAyB;EACjC,aAAa;EACd,CAAC,EAEI,IACJ,GAAa,cAAc,OAAO,KAE9B,MACG,EAAK,KACX,IAAI,EAAE,EAEH,IAAe,IACjB,EAAgB,QAAQ,MAAM,EAAE,4BAA4B,EAAY,GACxE,GACE,IAAsB,GAAM;AAElC,SAAgB;EACd,IAAM,IAAO,GAAqB,MAC5B,IAAK,KAAS;AACpB,MAAI,CAAC,KAAM,CAAC,EAAM;EAClB,IAAM,IACJ,OAMA;AAEF,SADA,GAAK,SAAS,GAAI,EAAK,QACV,GAAK,WAAW,EAAG;IAC/B;EAAC;EAAO;EAAuB,GAAqB;EAAK,CAAC;CAE7D,IAAM,IAAY,CAAC,GAAI,GAAM,wBAAwB,EAAE,CAAE,CAAC,MACvD,GAAM,MACL,IAAI,KAAK,EAAK,KAAK,CAAC,SAAS,GAAG,IAAI,KAAK,EAAM,KAAK,CAAC,SAAS,CACjE,EAEK,IAAS,EAAU,EAAU,SAAS,IACtC,IAAW,EAAU,EAAU,SAAS,IACxC,IAAY,EAAU,KAAK,OAAW;EAC1C,MAAM,IAAI,KAAK,EAAM,KAAK,CAAC,mBAAmB,KAAA,GAAW;GACvD,OAAO;GACP,KAAK;GACN,CAAC;EACF,UAAU,EAAM;EAChB,QAAQ,EAAM;EACd,aAAa,EAAM;EACnB,UAAU,EAAM;EAChB,UAAU,EAAM;EAChB,iBAAiB,EAAM,mBAAmB;EAC3C,EAAE,EAEG,IACJ,KAAU,EAAO,WAAW,IAAK,EAAO,SAAS,EAAO,WAAY,MAAM,GACtE,KACJ,KAAY,EAAS,WAAW,IAC3B,EAAS,SAAS,EAAS,WAAY,MACxC,GACA,IACJ,GAAQ,mBAAmB,GAAU,kBACjC,EAAS,kBAAkB,EAAO,kBAClC,KAAA,GAEA,MAAkB,MAAiB;AACvC,OAAW,GAAG,KAAW,IAAO;;AAwGlC,QArGI,CAAC,KAAS,KAAkB,CAAC,IAE7B,kBAAC,GAAD;EACE,OAAO,EAAG,6BAA6B,YAAY;EACnD,aAAa,EACX,mCACA,yDACD;YAED,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,GAAD,EAAS,WAAU,wBAAyB,CAAA;GACxC,CAAA;EACK,CAAA,GAIb,CAAC,KAAS,IAEV,kBAAC,GAAD;EACE,OAAO,EAAG,6BAA6B,YAAY;EACnD,aAAa,EACX,mCACA,yDACD;YAED,kBAAC,GAAD;GACE,MAAM,kBAAC,GAAD;IAAa,MAAM;IAAI,WAAU;IAA2B,CAAA;GAClE,OAAO,EACL,qCACA,8BACD;GACD,aAAa,EAAgB,EAAa;GAC1C,CAAA;EACS,CAAA,GAIb,CAAC,KAAS,CAAC,IAEX,kBAAC,GAAD;EACE,OAAO,EAAG,6BAA6B,YAAY;EACnD,aAAa,EACX,4CACA,6EACD;YAEA,EAAa,SAAS,IACrB,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAa,KAAK,MACjB,kBAAC,IAAD;IAEE,KAAK;IACL,eAAe,EAAyB,EAAY,GAAG;IACvD,EAHK,EAAY,GAGjB,CACF;GACE,CAAA,GAEN,kBAAC,GAAD;GACE,MAAM,kBAAC,GAAD,EAAW,MAAM,IAAM,CAAA;GAC7B,OAAO,EACL,mCACA,4BACD;GACD,aAAa,EACX,yCACA,kDACD;GACD,CAAA;EAEO,CAAA,GAIb,IAEA,kBAAC,GAAD;EACE,OAAO,EAAG,6BAA6B,YAAY;EACnD,aAAa,EACX,mCACA,yDACD;EACD,UACE,IAAwB,SAAS,MAA0B,KAAA;EAE7D,WAAW,EACT,yCACA,sBACD;YAED,kBAAC,GAAD;GACE,MAAM,kBAAC,GAAD;IAAa,MAAM;IAAI,WAAU;IAA2B,CAAA;GAClE,OAAO,EACL,0CACA,2BACD;GACD,aAAa,EAAgB,EAAM;GACnC,CAAA;EACS,CAAA,GAKf,kBAAC,GAAD;EACE,OACE,IACI,EAAG,gCAAgC,wBAAwB,GAC3D,EAAG,6BAA6B,YAAY;EAElD,aACE,IACI,GAAG,EAAG,oCAAoC,iCAAiC,CAAC,GAAG,EAAoB,SACnG,EACE,mCACA,yDACD;EAEP,UACE,KAAS,IACL,SAAS,EAAoB,OAC7B,KAAA;EAEN,WAAW,EACT,yCACA,sBACD;EACD,SACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,CAAC,KAAS,EAAa,SAAS,KAC/B,kBAAC,UAAD;IACE,OAAO;IACP,WAAW,MAAU,EAAyB,EAAM,OAAO,MAAM;IACjE,cAAY,EACV,qCACA,qBACD;IACD,WAAU;cAET,EAAa,KAAK,MACjB,kBAAC,UAAD;KAA6B,OAAO,EAAY;eAC7C,EAAY;KACN,EAFI,EAAY,GAEhB,CACT;IACK,CAAA,EAEX,kBAAC,UAAD;IACE,OAAO;IACP,WAAW,MAAU,EAAa,EAAM,OAAO,MAAmB;IAClE,cAAY,EACV,uCACA,oBACD;IACD,WAAU;cAPZ;KASE,kBAAC,UAAD;MAAQ,OAAM;gBACX,EAAG,gCAAgC,cAAc;MAC3C,CAAA;KACT,kBAAC,UAAD;MAAQ,OAAM;gBACX,EAAG,iCAAiC,eAAe;MAC7C,CAAA;KACT,kBAAC,UAAD;MAAQ,OAAM;gBACX,EAAG,iCAAiC,eAAe;MAC7C,CAAA;KACF;MACL;;YAGP,KAAW,CAAC,EAAU,SACrB,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,GAAD,EAAS,WAAU,wBAAyB,CAAA;GACxC,CAAA,GACJ,EAAU,SAAS,IACrB,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,IAAD;IAAc,SAAS;cAAvB;KACE,kBAAC,GAAD;MACE,OAAO,EAAG,gCAAgC,YAAY;MACtD,QAAQ,GAAQ,YAAY,GAAG,gBAAgB;MAC/C,MAAM,kBAAC,GAAD,EAAU,MAAM,IAAM,CAAA;MAC5B,CAAA;KACF,kBAAC,GAAD;MACE,OAAO,EAAG,mCAAmC,eAAe;MAC5D,QAAQ,GAAQ,eAAe,GAAG,gBAAgB;MAClD,MAAM,kBAAC,GAAD,EAAO,MAAM,IAAM,CAAA;MACzB,CAAA;KACF,kBAAC,GAAD;MACE,OAAO,EAAG,iCAAiC,aAAa;MACxD,OAAO,GAAG,EAAU,QAAQ,EAAE,CAAC;MAC/B,MAAM,kBAAC,GAAD,EAAe,MAAM,IAAM,CAAA;MACjC,OACE,IACI;OACE,OAAO,KAAoB;OAC3B,OAAO,EACL,kCACA,qBACD;OACF,GACD,KAAA;MAEN,CAAA;KACF,kBAAC,GAAD;MACE,OAAO,EACL,uCACA,oBACD;MACD,OACE,GAAQ,kBACJ,GAAG,EAAO,gBAAgB,MAC1B,EAAG,uBAAuB,MAAM;MAEtC,MAAM,kBAAC,IAAD,EAAO,MAAM,IAAM,CAAA;MACzB,OACE,OAAO,KAAkB,WACrB;OACE,OAAO;OACP,OAAO,EACL,0CACA,uBACD;OACF,GACD,KAAA;MAEN,CAAA;KACW;;GAEf,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD;KACE,OAAO,EAAG,oCAAoC,gBAAgB;eAE9D,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD;OAAqB,OAAM;OAAO,QAAQ;iBACxC,kBAAC,IAAD;QAAW,MAAM;kBAAjB;SACE,kBAAC,GAAD;UACE,iBAAgB;UAChB,QAAO;UACP,CAAA;SACF,kBAAC,GAAD;UACE,SAAQ;UACR,QAAO;UACP,UAAU;UACV,CAAA;SACF,kBAAC,GAAD;UAAO,QAAO;UAA0B,UAAU;UAAM,CAAA;SACxD,kBAAC,GAAD,EACE,cAAc;UACZ,iBAAiB;UACjB,QAAQ;UACR,cAAc;UACf,EACD,CAAA;SACF,kBAAC,GAAD;UACE,MAAK;UACL,SAAQ;UACR,QAAQ,EAAY;UACpB,aAAa;UACb,KAAK;UACL,CAAA;SACF,kBAAC,GAAD;UACE,MAAK;UACL,SAAQ;UACR,QAAQ,EAAY;UACpB,aAAa;UACb,KAAK;UACL,CAAA;SACQ;;OACQ,CAAA;MAClB,CAAA;KACM,CAAA,EAEd,kBAAC,GAAD;KACE,OAAO,EAAG,oCAAoC,gBAAgB;eAE9D,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD;OAAqB,OAAM;OAAO,QAAQ;iBACxC,kBAAC,IAAD;QAAU,MAAM;kBAAhB;SACE,kBAAC,GAAD;UACE,iBAAgB;UAChB,QAAO;UACP,CAAA;SACF,kBAAC,GAAD;UACE,SAAQ;UACR,QAAO;UACP,UAAU;UACV,CAAA;SACF,kBAAC,GAAD;UAAO,QAAO;UAA0B,UAAU;UAAM,CAAA;SACxD,kBAAC,GAAD,EACE,cAAc;UACZ,iBAAiB;UACjB,QAAQ;UACR,cAAc;UACf,EACD,CAAA;SACF,kBAAC,GAAD;UACE,SAAQ;UACR,MAAM,EAAY;UAClB,QAAQ;WAAC;WAAG;WAAG;WAAG;WAAE;UACpB,CAAA;SACF,kBAAC,GAAD;UACE,SAAQ;UACR,MAAM,EAAY;UAClB,QAAQ;WAAC;WAAG;WAAG;WAAG;WAAE;UACpB,CAAA;SACO;;OACS,CAAA;MAClB,CAAA;KACM,CAAA,CACV;;GAEN,kBAAC,GAAD;IACE,OAAO,EAAG,sCAAsC,kBAAkB;cAElE,kBAAC,IAAD;KACE,MAAM;KACN,UAAS;KACT,SAAS;MACP;OACE,KAAK;OACL,QAAQ,EAAG,4BAA4B,OAAO;OAC9C,SAAS,MACP,IAAI,KAAK,EAAM,KAAK,CAAC,mBAAmB,KAAA,GAAW;QACjD,OAAO;QACP,KAAK;QACL,MAAM;QACP,CAAC;OACL;MACD;OACE,KAAK;OACL,QAAQ,EAAG,gCAAgC,YAAY;OACvD,SAAS,MAAU,EAAM,SAAS,gBAAgB;OACnD;MACD;OACE,KAAK;OACL,QAAQ,EAAG,8BAA8B,SAAS;OAClD,SAAS,MAAU,EAAM,OAAO,gBAAgB;OACjD;MACD;OACE,KAAK;OACL,QAAQ,EAAG,mCAAmC,eAAe;OAC7D,SAAS,MAAU,EAAM,YAAY,gBAAgB;OACtD;MACD;OACE,KAAK;OACL,QAAQ,EAAG,gCAAgC,YAAY;OACvD,SAAS,MAAU,EAAM,SAAS,gBAAgB;OACnD;MACD;OACE,KAAK;OACL,QAAQ,EAAG,mCAAmC,eAAe;OAC7D,SAAS,MACP,EAAM,kBACF,GAAG,EAAM,gBAAgB,MACzB,EAAG,uBAAuB,MAAM;OACvC;MACD;OACE,KAAK;OACL,QAAQ,EAAG,gCAAgC,WAAW;OACtD,SAAS,MAAU,EAAM,SAAS,gBAAgB;OACnD;MACF;KACD,CAAA;IACU,CAAA;GACb,EAAA,CAAA,GAEH,kBAAC,GAAD;GACE,MAAM,kBAAC,GAAD,EAAW,MAAM,IAAM,CAAA;GAC7B,OAAO,EACL,wCACA,6BACD;GACD,aAAa,EACX,8CACA,oGACD;GACD,QACG,IAWG,KAAA,IAVF,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,GAAe,QAAQ;IACtC,WAAU;cAET,EACC,wCACA,oBACD;IACM,CAAA;GAGb,CAAA;EAEO,CAAA"}

package/dist/devportal/pages/ApiKeysPage.js CHANGED Viewed

@@ -74,8 +74,8 @@ var g = (e) => {
 		description: y("devportal.manageApiKeys", "Manage your API keys for programmatic access"),
 		children: /* @__PURE__ */ h("div", {
 			className: "flex items-center justify-center py-12",
-			children: [/* @__PURE__ */ m(fe, { className: "h-8 w-8 animate-spin text-muted-foreground" }), /* @__PURE__ */ m("span", {
-				className: "ml-2 text-muted-foreground",
+			children: [/* @__PURE__ */ m(fe, { className: "h-8 w-8 animate-spin text-text-secondary" }), /* @__PURE__ */ m("span", {
+				className: "ml-2 text-text-secondary",
 				children: y("devportal.loadingApiKeys", "Loading API keys...")
 			})]
 		})
@@ -84,20 +84,20 @@ var g = (e) => {
 		title: y("devportal.apiKeys", "API Keys"),
 		description: y("devportal.manageApiKeys", "Manage your API keys for programmatic access"),
 		children: /* @__PURE__ */ h("div", {
-			className: "rounded-lg border border-destructive/50 bg-destructive/10 p-6 text-center",
+			className: "rounded-lg border border-status-error-border/50 bg-status-error-bg/10 p-6 text-center",
 			children: [
-				/* @__PURE__ */ m(le, { className: "mx-auto h-8 w-8 text-destructive" }),
+				/* @__PURE__ */ m(le, { className: "mx-auto h-8 w-8 text-status-error-text" }),
 				/* @__PURE__ */ m("h3", {
-					className: "mt-2 font-medium text-destructive",
+					className: "mt-2 font-medium text-status-error-text",
 					children: y("devportal.failedToLoadApiKeys", "Failed to load API keys")
 				}),
 				/* @__PURE__ */ m("p", {
-					className: "mt-1 text-sm text-muted-foreground",
+					className: "mt-1 text-sm text-text-secondary",
 					children: re(I)
 				}),
 				/* @__PURE__ */ m("button", {
 					onClick: () => L(),
-					className: "mt-4 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90",
+					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: y("devportal.tryAgain", "Try Again")
 				})
 			]
@@ -129,7 +129,7 @@ var g = (e) => {
 			render: (e) => /* @__PURE__ */ h("div", {
 				className: "flex items-center gap-3",
 				children: [/* @__PURE__ */ m("div", {
-					className: t("flex h-10 w-10 items-center justify-center rounded-lg", _(e.expiresAt) ? "bg-status-error-bg-subtle text-status-error-text" : "bg-primary/10 text-primary"),
+					className: t("flex h-10 w-10 items-center justify-center rounded-lg", _(e.expiresAt) ? "bg-status-error-bg-subtle text-status-error-text" : "bg-action-primary-bg/10 text-primary"),
 					children: /* @__PURE__ */ m(d, { size: 20 })
 				}), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ h("div", {
 					className: "flex items-center gap-2",
@@ -148,7 +148,7 @@ var g = (e) => {
 						})
 					]
 				}), e.appName && /* @__PURE__ */ h("p", {
-					className: "text-xs text-muted-foreground",
+					className: "text-xs text-text-secondary",
 					children: ["App: ", e.appName]
 				})] })]
 			})
@@ -157,7 +157,7 @@ var g = (e) => {
 			key: "prefix",
 			header: "Key Prefix",
 			render: (e) => /* @__PURE__ */ h("code", {
-				className: "text-sm text-muted-foreground",
+				className: "text-sm text-text-secondary",
 				children: [e.prefix, "..."]
 			})
 		},
@@ -167,10 +167,10 @@ var g = (e) => {
 			render: (e) => /* @__PURE__ */ h("div", {
 				className: "flex flex-wrap gap-1",
 				children: [e.scopes.slice(0, 3).map((e) => /* @__PURE__ */ m("span", {
-					className: "inline-flex rounded bg-muted px-1.5 py-0.5 text-xs",
+					className: "inline-flex rounded bg-bg-sunken px-1.5 py-0.5 text-xs",
 					children: e
 				}, e)), e.scopes.length > 3 && /* @__PURE__ */ h("span", {
-					className: "text-xs text-muted-foreground",
+					className: "text-xs text-text-secondary",
 					children: ["+", e.scopes.length - 3]
 				})]
 			})
@@ -179,7 +179,7 @@ var g = (e) => {
 			key: "lastUsed",
 			header: "Last Used",
 			render: (e) => /* @__PURE__ */ m("span", {
-				className: "text-sm text-muted-foreground",
+				className: "text-sm text-text-secondary",
 				children: e.lastUsedAt ? new Date(e.lastUsedAt).toLocaleDateString() : "Never"
 			})
 		},
@@ -187,7 +187,7 @@ var g = (e) => {
 			key: "expires",
 			header: "Expires",
 			render: (e) => /* @__PURE__ */ m("span", {
-				className: t("text-sm", _(e.expiresAt) ? "text-status-error-text" : g(e.expiresAt) ? "text-status-warning-text" : "text-muted-foreground"),
+				className: t("text-sm", _(e.expiresAt) ? "text-status-error-text" : g(e.expiresAt) ? "text-status-warning-text" : "text-text-secondary"),
 				children: e.expiresAt ? new Date(e.expiresAt).toLocaleDateString() : "Never"
 			})
 		},
@@ -207,7 +207,7 @@ var g = (e) => {
 			header: "Actions",
 			className: "w-28",
 			render: (e) => _(e.expiresAt) ? /* @__PURE__ */ m("span", {
-				className: "text-xs text-muted-foreground",
+				className: "text-xs text-text-secondary",
 				children: "No actions"
 			}) : /* @__PURE__ */ h("div", {
 				className: "flex items-center gap-1",
@@ -251,7 +251,7 @@ var g = (e) => {
 			description: y("devportal.manageApiKeys", "Manage your API keys for programmatic access"),
 			actions: /* @__PURE__ */ h("button", {
 				onClick: () => W("/api-keys/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",
+				className: "inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 transition-colors",
 				children: [/* @__PURE__ */ m(f, { size: 16 }), y("devportal.generateApiKey", "Generate API Key")]
 			}),
 			children: [
@@ -262,7 +262,7 @@ var g = (e) => {
 					onDismiss: () => O(null)
 				}),
 				j && /* @__PURE__ */ m("div", {
-					className: t("rounded-lg border px-4 py-3 text-sm", j.type === "success" ? "border-border-subtle bg-status-success-bg-subtle text-status-success-text" : "border-destructive/40 bg-destructive/10 text-destructive"),
+					className: t("rounded-lg border px-4 py-3 text-sm", j.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__ */ h("div", {
 						className: "flex items-center justify-between gap-3",
 						children: [/* @__PURE__ */ m("span", { children: j.message }), /* @__PURE__ */ m("button", {
@@ -280,18 +280,18 @@ var g = (e) => {
 							className: "relative flex-1 max-w-md",
 							children: [/* @__PURE__ */ m(pe, {
 								size: 16,
-								className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
+								className: "absolute left-3 top-1/2 -translate-y-1/2 text-text-secondary"
 							}), /* @__PURE__ */ m("input", {
 								type: "text",
 								placeholder: "Search by name, prefix, or app...",
 								value: b,
 								onChange: (e) => x(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"
+								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__ */ h("select", {
 							value: S,
 							onChange: (e) => ye(e.target.value),
-							className: "rounded-md border bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
+							className: "rounded-md border bg-bg-surface px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary",
 							children: [
 								/* @__PURE__ */ m("option", {
 									value: "all",
@@ -313,9 +313,9 @@ var g = (e) => {
 					className: "grid grid-cols-2 gap-4 sm:grid-cols-4",
 					children: [
 						/* @__PURE__ */ h("div", {
-							className: "rounded-lg border bg-card p-4",
+							className: "rounded-lg border bg-bg-surface p-4",
 							children: [/* @__PURE__ */ h("div", {
-								className: "flex items-center gap-2 text-muted-foreground",
+								className: "flex items-center gap-2 text-text-secondary",
 								children: [/* @__PURE__ */ m(d, { size: 16 }), /* @__PURE__ */ m("span", {
 									className: "text-sm",
 									children: "Total Keys"
@@ -326,7 +326,7 @@ var g = (e) => {
 							})]
 						}),
 						/* @__PURE__ */ h("div", {
-							className: "rounded-lg border bg-card p-4",
+							className: "rounded-lg border bg-bg-surface p-4",
 							children: [/* @__PURE__ */ h("div", {
 								className: "flex items-center gap-2 text-status-success-text",
 								children: [/* @__PURE__ */ m(me, { size: 16 }), /* @__PURE__ */ m("span", {
@@ -339,7 +339,7 @@ var g = (e) => {
 							})]
 						}),
 						/* @__PURE__ */ h("div", {
-							className: "rounded-lg border bg-card p-4",
+							className: "rounded-lg border bg-bg-surface p-4",
 							children: [/* @__PURE__ */ h("div", {
 								className: "flex items-center gap-2 text-status-warning-text",
 								children: [/* @__PURE__ */ m(de, { size: 16 }), /* @__PURE__ */ m("span", {
@@ -352,7 +352,7 @@ var g = (e) => {
 							})]
 						}),
 						/* @__PURE__ */ h("div", {
-							className: "rounded-lg border bg-card p-4",
+							className: "rounded-lg border bg-bg-surface p-4",
 							children: [/* @__PURE__ */ h("div", {
 								className: "flex items-center gap-2 text-status-error-text",
 								children: [/* @__PURE__ */ m(ue, { size: 16 }), /* @__PURE__ */ m("span", {
@@ -367,7 +367,7 @@ var g = (e) => {
 					]
 				}),
 				/* @__PURE__ */ h("p", {
-					className: "text-sm text-muted-foreground",
+					className: "text-sm text-text-secondary",
 					children: [
 						G.length,
 						" API key",
@@ -377,7 +377,7 @@ var g = (e) => {
 					]
 				}),
 				G.length > 0 && /* @__PURE__ */ m("div", {
-					className: "rounded-lg border bg-card p-4",
+					className: "rounded-lg border bg-bg-surface p-4",
 					children: /* @__PURE__ */ h("div", {
 						className: "flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between",
 						children: [/* @__PURE__ */ h("div", {
@@ -395,13 +395,13 @@ var g = (e) => {
 								})]
 							}), k.size > 0 && /* @__PURE__ */ m("button", {
 								onClick: Q,
-								className: "text-sm text-muted-foreground hover:text-foreground",
+								className: "text-sm text-text-secondary hover:text-text-primary",
 								children: "Clear selection"
 							})]
 						}), /* @__PURE__ */ h("div", {
 							className: "flex flex-wrap items-center gap-2",
 							children: [/* @__PURE__ */ h("span", {
-								className: "rounded-full bg-muted px-3 py-1 text-sm font-medium text-muted-foreground",
+								className: "rounded-full bg-bg-sunken px-3 py-1 text-sm font-medium text-text-secondary",
 								children: [k.size, " selected"]
 							}), /* @__PURE__ */ h("button", {
 								onClick: () => P(!0),
@@ -426,7 +426,7 @@ var g = (e) => {
 					description: b || S !== "all" ? y("devportal.tryAdjustingFilters", "Try adjusting your filters") : y("devportal.generateFirstApiKey", "Generate your first API key to start making API calls"),
 					action: !b && S === "all" ? /* @__PURE__ */ h("button", {
 						onClick: () => W("/api-keys/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",
+						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__ */ m(f, { size: 16 }), y("devportal.generateApiKey", "Generate API Key")]
 					}) : void 0
 				}),