@burdenoff/microfe-export 2026.623.2 → 2026.625.1

package/dist/export/pages/ExportDashboardPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExportDashboardPage.js","names":[],"sources":["../../../src/export/pages/ExportDashboardPage.tsx"],"sourcesContent":["import {\n  Plus,\n  Download,\n  Clock,\n  FileBox,\n  ArrowRight,\n  Activity,\n} from \"lucide-react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { useExport } from \"../providers/ExportProvider\";\nimport { useExportJobs } from \"../hooks/useExportQueries\";\nimport { ExportStatusBadge } from \"../components/ExportStatusBadge\";\nimport { ExportProgressBar } from \"../components/ExportProgressBar\";\nimport { PageLayout, PageSection, EmptyState } from \"../components/PageLayout\";\nimport { cn } from \"../utils/cn\";\nimport { tWithFallback } from \"../utils/i18n\";\n\n/**\n * Helper to join paths correctly, avoiding double slashes\n */\nconst joinPath = (base: string, path: string): string => {\n  const cleanBase = base.endsWith(\"/\") ? base.slice(0, -1) : base;\n  const cleanPath = path.startsWith(\"/\") ? path : `/${path}`;\n  return cleanBase + cleanPath;\n};\n\n/**\n * Export Dashboard Page\n * Overview with recent exports, quick actions, and status summary\n */\nexport function ExportDashboardPage() {\n  const { basePath = \"/\", navigate } = useExport();\n  const { t } = useI18n();\n  const tr = (\n    key: string,\n    fallback: string,\n    params?: Record<string, string | number>,\n  ) => tWithFallback(t, key, fallback, params);\n  const { data: jobs, isLoading } = useExportJobs({});\n\n  const recentJobs = jobs.slice(0, 5);\n  const activeJobs = jobs.filter(\n    (j) => j.status === \"RUNNING\" || j.status === \"QUEUED\",\n  );\n\n  const handleNavigate = (path: string) => {\n    if (!navigate) return;\n    navigate(joinPath(basePath, path));\n  };\n\n  return (\n    <PageLayout\n      title={tr(\"export.dashboard.title\", \"Export\")}\n      subtitle={tr(\n        \"export.dashboard.subtitle\",\n        \"Export your workspace data in multiple formats\",\n      )}\n      icon={<Download size={24} />}\n    >\n      {/* Quick Actions */}\n      <div\n        className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4\"\n        data-tour=\"export-dashboard-quick-actions\"\n      >\n        {[\n          {\n            icon: <Plus size={20} />,\n            label: tr(\"export.dashboard.actions.newExport.label\", \"New Export\"),\n            description: tr(\n              \"export.dashboard.actions.newExport.description\",\n              \"Create a new data export\",\n            ),\n            path: \"new\",\n            color: \"bg-primary/10 text-primary\",\n          },\n          {\n            icon: <Clock size={20} />,\n            label: tr(\"export.dashboard.actions.history.label\", \"History\"),\n            description: tr(\n              \"export.dashboard.actions.history.description\",\n              \"View past exports\",\n            ),\n            path: \"history\",\n            color: \"bg-status-info-bg-subtle text-status-info-text\",\n          },\n          {\n            icon: <FileBox size={20} />,\n            label: tr(\"export.dashboard.actions.templates.label\", \"Templates\"),\n            description: tr(\n              \"export.dashboard.actions.templates.description\",\n              \"Reusable export configs\",\n            ),\n            path: \"templates\",\n            color: \"bg-accent-purple-subtle text-accent-purple\",\n          },\n          {\n            icon: <Activity size={20} />,\n            label: tr(\n              \"export.dashboard.actions.activeJobs.label\",\n              \"Active Jobs\",\n            ),\n            description: tr(\n              \"export.dashboard.actions.activeJobs.description\",\n              \"{count} running\",\n              { count: activeJobs.length },\n            ),\n            path: \"history?status=RUNNING\",\n            color: \"bg-status-success-bg-subtle text-status-success-text\",\n          },\n        ].map((action) => (\n          <button\n            type=\"button\"\n            key={action.path + action.label}\n            onClick={() => handleNavigate(action.path)}\n            className={cn(\n              \"group relative overflow-hidden border-2 border-border/50 rounded-xl p-5\",\n              \"bg-gradient-to-br from-card/50 to-background shadow-sm\",\n              \"hover:shadow-md hover:border-primary/30 transition-all duration-200\",\n              \"text-left\",\n            )}\n          >\n            <div className={cn(\"p-2.5 rounded-lg w-fit mb-3\", action.color)}>\n              {action.icon}\n            </div>\n            <h3 className=\"font-semibold text-foreground mb-1\">\n              {action.label}\n            </h3>\n            <p className=\"text-sm text-muted-foreground\">\n              {action.description}\n            </p>\n            <ArrowRight\n              size={16}\n              className=\"absolute top-5 right-5 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity\"\n            />\n          </button>\n        ))}\n      </div>\n\n      {/* Active Exports */}\n      {activeJobs.length > 0 && (\n        <PageSection\n          data-tour=\"export-dashboard-active-section\"\n          title={tr(\"export.dashboard.active.title\", \"Active Exports\")}\n          description={tr(\n            \"export.dashboard.active.description\",\n            \"Currently running export jobs\",\n          )}\n        >\n          <div className=\"space-y-3\">\n            {activeJobs.map((job) => (\n              <button\n                type=\"button\"\n                key={job.id}\n                onClick={() => handleNavigate(job.id)}\n                className={cn(\n                  \"w-full text-left border-2 border-border/50 rounded-xl p-4\",\n                  \"hover:shadow-md hover:border-primary/30 transition-all duration-200\",\n                  \"bg-gradient-to-r from-card/50 to-background\",\n                )}\n              >\n                <div className=\"flex items-center justify-between mb-2\">\n                  <h4 className=\"font-semibold text-foreground\">{job.name}</h4>\n                  <ExportStatusBadge status={job.status} />\n                </div>\n                <ExportProgressBar progress={job.progress} size=\"sm\" />\n              </button>\n            ))}\n          </div>\n        </PageSection>\n      )}\n\n      {/* Recent Exports */}\n      <PageSection\n        data-tour=\"export-dashboard-recent-section\"\n        title={tr(\"export.dashboard.recent.title\", \"Recent Exports\")}\n        description={tr(\n          \"export.dashboard.recent.description\",\n          \"Your latest export jobs\",\n        )}\n        actions={\n          recentJobs.length > 0 ? (\n            <button\n              type=\"button\"\n              onClick={() => handleNavigate(\"history\")}\n              className=\"text-sm text-primary hover:underline font-medium\"\n            >\n              {tr(\"export.dashboard.recent.actions.viewAll\", \"View All\")}\n            </button>\n          ) : undefined\n        }\n      >\n        {isLoading ? (\n          <div className=\"space-y-3\">\n            {[...Array(3)].map((_, i) => (\n              <div\n                key={i}\n                className=\"border-2 border-border/50 rounded-xl p-4 animate-pulse\"\n              >\n                <div className=\"flex items-center justify-between mb-2\">\n                  <div className=\"h-4 w-48 bg-muted rounded\" />\n                  <div className=\"h-5 w-20 bg-muted rounded-full\" />\n                </div>\n                <div className=\"h-3 w-32 bg-muted rounded mt-2\" />\n              </div>\n            ))}\n          </div>\n        ) : recentJobs.length > 0 ? (\n          <div className=\"space-y-3\">\n            {recentJobs.map((job, index) => (\n              <button\n                type=\"button\"\n                key={job.id}\n                onClick={() => handleNavigate(job.id)}\n                className={cn(\n                  \"w-full text-left border-2 border-border/50 rounded-xl p-4\",\n                  \"hover:shadow-md hover:border-primary/30 transition-all duration-200\",\n                  \"bg-gradient-to-r from-card/50 to-background\",\n                  \"animate-in fade-in-0 slide-in-from-bottom-2\",\n                )}\n                style={{ animationDelay: `${index * 50}ms` }}\n              >\n                <div className=\"flex items-start sm:items-center justify-between gap-3\">\n                  <div className=\"flex-1 min-w-0\">\n                    <h4 className=\"font-semibold text-foreground truncate\">\n                      {job.name}\n                    </h4>\n                    <p className=\"text-sm text-muted-foreground mt-1 line-clamp-2\">\n                      {job.entityTypes.join(\", \")} &middot; {job.format}\n                      {job.totalEntities != null &&\n                        ` · ${tr(\n                          \"export.dashboard.recent.entitiesCount\",\n                          \"{count} entities\",\n                          { count: job.totalEntities.toLocaleString() },\n                        )}`}\n                    </p>\n                  </div>\n                  <div className=\"flex items-center gap-2 flex-shrink-0\">\n                    <ExportStatusBadge status={job.status} />\n                    <ArrowRight\n                      size={16}\n                      className=\"text-muted-foreground hidden sm:block\"\n                    />\n                  </div>\n                </div>\n              </button>\n            ))}\n          </div>\n        ) : (\n          <EmptyState\n            icon={<Download size={48} />}\n            title={tr(\"export.dashboard.empty.title\", \"No exports yet\")}\n            description={tr(\n              \"export.dashboard.empty.description\",\n              \"Create your first export to start downloading your workspace data.\",\n            )}\n            action={\n              <button\n                type=\"button\"\n                onClick={() => handleNavigate(\"new\")}\n                className=\"inline-flex items-center gap-2 px-4 py-2 bg-primary text-primary-foreground rounded-lg hover:bg-primary/90 transition-colors font-medium\"\n              >\n                <Plus size={16} />\n                {tr(\n                  \"export.dashboard.empty.actions.createFirst\",\n                  \"Create First Export\",\n                )}\n              </button>\n            }\n          />\n        )}\n      </PageSection>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ExportDashboardPage.js","names":[],"sources":["../../../src/export/pages/ExportDashboardPage.tsx"],"sourcesContent":["import {\n  Plus,\n  Download,\n  Clock,\n  FileBox,\n  ArrowRight,\n  Activity,\n  CheckCircle2,\n} from \"lucide-react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { GlassCard, EmphasisPanel } from \"@burdenoff/fe-libs/ui\";\nimport { useExport } from \"../providers/ExportProvider\";\nimport { useExportJobs } from \"../hooks/useExportQueries\";\nimport { ExportStatusBadge } from \"../components/ExportStatusBadge\";\nimport { ExportProgressBar } from \"../components/ExportProgressBar\";\nimport { PageLayout, PageSection, EmptyState } from \"../components/PageLayout\";\nimport { cn } from \"../utils/cn\";\nimport { tWithFallback } from \"../utils/i18n\";\n\n/**\n * Helper to join paths correctly, avoiding double slashes\n */\nconst joinPath = (base: string, path: string): string => {\n  const cleanBase = base.endsWith(\"/\") ? base.slice(0, -1) : base;\n  const cleanPath = path.startsWith(\"/\") ? path : `/${path}`;\n  return cleanBase + cleanPath;\n};\n\n/**\n * Export Dashboard Page\n * Overview with recent exports, quick actions, and status summary\n */\nexport function ExportDashboardPage() {\n  const { basePath = \"/\", navigate } = useExport();\n  const { t } = useI18n();\n  const tr = (\n    key: string,\n    fallback: string,\n    params?: Record<string, string | number>,\n  ) => tWithFallback(t, key, fallback, params);\n  const { data: jobs, isLoading } = useExportJobs({});\n\n  const recentJobs = jobs.slice(0, 5);\n  const activeJobs = jobs.filter(\n    (j) => j.status === \"RUNNING\" || j.status === \"QUEUED\",\n  );\n  const completedJobs = jobs.filter((j) => j.status === \"COMPLETED\");\n\n  const metrics = [\n    {\n      icon: <Download size={18} />,\n      label: tr(\"export.dashboard.metrics.total\", \"Total Exports\"),\n      value: jobs.length,\n      treatment: \"glass\" as const,\n    },\n    {\n      icon: <Activity size={18} />,\n      label: tr(\"export.dashboard.metrics.active\", \"Active\"),\n      value: activeJobs.length,\n      treatment: \"metric\" as const,\n    },\n    {\n      icon: <CheckCircle2 size={18} />,\n      label: tr(\"export.dashboard.metrics.completed\", \"Completed\"),\n      value: completedJobs.length,\n      treatment: \"metric\" as const,\n    },\n  ];\n\n  const handleNavigate = (path: string) => {\n    if (!navigate) return;\n    navigate(joinPath(basePath, path));\n  };\n\n  return (\n    <PageLayout\n      title={tr(\"export.dashboard.title\", \"Export\")}\n      subtitle={tr(\n        \"export.dashboard.subtitle\",\n        \"Export your workspace data in multiple formats\",\n      )}\n      icon={<Download size={24} />}\n    >\n      {/* Metric strip */}\n      {!isLoading && jobs.length > 0 && (\n        <div className=\"grid grid-cols-1 sm:grid-cols-3 gap-4\">\n          {metrics.map((m) => (\n            <GlassCard\n              key={m.label}\n              treatment={m.treatment}\n              className=\"p-5 border-border-seam\"\n            >\n              <div className=\"flex items-center gap-2 text-text-secondary mb-2\">\n                {m.icon}\n                <span className=\"text-xs font-medium\">{m.label}</span>\n              </div>\n              <p className=\"text-3xl font-bold tabular-nums text-text-primary\">\n                {m.value.toLocaleString()}\n              </p>\n            </GlassCard>\n          ))}\n        </div>\n      )}\n\n      {/* Quick Actions */}\n      <div\n        className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4\"\n        data-tour=\"export-dashboard-quick-actions\"\n      >\n        {[\n          {\n            icon: <Plus size={20} />,\n            label: tr(\"export.dashboard.actions.newExport.label\", \"New Export\"),\n            description: tr(\n              \"export.dashboard.actions.newExport.description\",\n              \"Create a new data export\",\n            ),\n            path: \"new\",\n            color: \"bg-action-primary-bg/10 text-primary\",\n          },\n          {\n            icon: <Clock size={20} />,\n            label: tr(\"export.dashboard.actions.history.label\", \"History\"),\n            description: tr(\n              \"export.dashboard.actions.history.description\",\n              \"View past exports\",\n            ),\n            path: \"history\",\n            color: \"bg-status-info-bg-subtle text-status-info-text\",\n          },\n          {\n            icon: <FileBox size={20} />,\n            label: tr(\"export.dashboard.actions.templates.label\", \"Templates\"),\n            description: tr(\n              \"export.dashboard.actions.templates.description\",\n              \"Reusable export configs\",\n            ),\n            path: \"templates\",\n            color: \"bg-accent-purple-subtle text-accent-purple\",\n          },\n          {\n            icon: <Activity size={20} />,\n            label: tr(\n              \"export.dashboard.actions.activeJobs.label\",\n              \"Active Jobs\",\n            ),\n            description: tr(\n              \"export.dashboard.actions.activeJobs.description\",\n              \"{count} running\",\n              { count: activeJobs.length },\n            ),\n            path: \"history?status=RUNNING\",\n            color: \"bg-status-success-bg-subtle text-status-success-text\",\n          },\n        ].map((action) => (\n          <button\n            type=\"button\"\n            key={action.path + action.label}\n            onClick={() => handleNavigate(action.path)}\n            className={cn(\n              \"group relative overflow-hidden border border-border-seam rounded-xl p-5\",\n              \"bg-bg-surface shadow-[var(--shadow-pop)]\",\n              \"hover:border-primary/40 transition-colors duration-200\",\n              \"text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40\",\n            )}\n          >\n            <div className={cn(\"p-2.5 rounded-lg w-fit mb-3\", action.color)}>\n              {action.icon}\n            </div>\n            <h3 className=\"font-semibold text-text-primary mb-1\">\n              {action.label}\n            </h3>\n            <p className=\"text-sm text-text-secondary\">\n              {action.description}\n            </p>\n            <ArrowRight\n              size={16}\n              className=\"absolute top-5 right-5 text-text-secondary opacity-0 group-hover:opacity-100 transition-opacity\"\n            />\n          </button>\n        ))}\n      </div>\n\n      {/* Active Exports — the single emphasised zone on this page */}\n      {activeJobs.length > 0 && (\n        <EmphasisPanel\n          data-tour=\"export-dashboard-active-section\"\n          className=\"p-5 sm:p-6\"\n        >\n          <div className=\"mb-4\">\n            <h2 className=\"text-lg font-semibold text-text-primary\">\n              {tr(\"export.dashboard.active.title\", \"Active Exports\")}\n            </h2>\n            <p className=\"text-sm text-text-secondary\">\n              {tr(\n                \"export.dashboard.active.description\",\n                \"Currently running export jobs\",\n              )}\n            </p>\n          </div>\n          <div className=\"space-y-3\">\n            {activeJobs.map((job) => (\n              <button\n                type=\"button\"\n                key={job.id}\n                onClick={() => handleNavigate(job.id)}\n                className={cn(\n                  \"w-full text-left border border-border-seam rounded-xl p-4 bg-bg-surface/70\",\n                  \"hover:border-primary/40 transition-colors duration-200\",\n                  \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40\",\n                )}\n              >\n                <div className=\"flex items-center justify-between mb-2\">\n                  <h4 className=\"font-semibold text-text-primary\">{job.name}</h4>\n                  <ExportStatusBadge status={job.status} />\n                </div>\n                <ExportProgressBar progress={job.progress} size=\"sm\" />\n              </button>\n            ))}\n          </div>\n        </EmphasisPanel>\n      )}\n\n      {/* Recent Exports */}\n      <PageSection\n        data-tour=\"export-dashboard-recent-section\"\n        title={tr(\"export.dashboard.recent.title\", \"Recent Exports\")}\n        description={tr(\n          \"export.dashboard.recent.description\",\n          \"Your latest export jobs\",\n        )}\n        actions={\n          recentJobs.length > 0 ? (\n            <button\n              type=\"button\"\n              onClick={() => handleNavigate(\"history\")}\n              className=\"text-sm text-primary hover:underline font-medium\"\n            >\n              {tr(\"export.dashboard.recent.actions.viewAll\", \"View All\")}\n            </button>\n          ) : undefined\n        }\n      >\n        {isLoading ? (\n          <div className=\"space-y-3\">\n            {[...Array(3)].map((_, i) => (\n              <div\n                key={i}\n                className=\"border border-border-seam rounded-xl p-4 animate-pulse\"\n              >\n                <div className=\"flex items-center justify-between mb-2\">\n                  <div className=\"h-4 w-48 bg-bg-sunken rounded\" />\n                  <div className=\"h-5 w-20 bg-bg-sunken rounded-full\" />\n                </div>\n                <div className=\"h-3 w-32 bg-bg-sunken rounded mt-2\" />\n              </div>\n            ))}\n          </div>\n        ) : recentJobs.length > 0 ? (\n          <div className=\"space-y-3\">\n            {recentJobs.map((job, index) => (\n              <button\n                type=\"button\"\n                key={job.id}\n                onClick={() => handleNavigate(job.id)}\n                className={cn(\n                  \"w-full text-left border border-border-seam rounded-xl p-4 bg-bg-surface\",\n                  \"hover:border-primary/40 transition-colors duration-200\",\n                  \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40\",\n                  \"animate-in fade-in-0\",\n                )}\n                style={{ animationDelay: `${index * 50}ms` }}\n              >\n                <div className=\"flex items-start sm:items-center justify-between gap-3\">\n                  <div className=\"flex-1 min-w-0\">\n                    <h4 className=\"font-semibold text-text-primary truncate\">\n                      {job.name}\n                    </h4>\n                    <p className=\"text-sm text-text-secondary mt-1 line-clamp-2\">\n                      {job.entityTypes.join(\", \")} &middot; {job.format}\n                      {job.totalEntities != null &&\n                        ` · ${tr(\n                          \"export.dashboard.recent.entitiesCount\",\n                          \"{count} entities\",\n                          { count: job.totalEntities.toLocaleString() },\n                        )}`}\n                    </p>\n                  </div>\n                  <div className=\"flex items-center gap-2 flex-shrink-0\">\n                    <ExportStatusBadge status={job.status} />\n                    <ArrowRight\n                      size={16}\n                      className=\"text-text-secondary hidden sm:block\"\n                    />\n                  </div>\n                </div>\n              </button>\n            ))}\n          </div>\n        ) : (\n          <EmptyState\n            icon={<Download size={48} />}\n            title={tr(\"export.dashboard.empty.title\", \"No exports yet\")}\n            description={tr(\n              \"export.dashboard.empty.description\",\n              \"Create your first export to start downloading your workspace data.\",\n            )}\n            action={\n              <button\n                type=\"button\"\n                onClick={() => handleNavigate(\"new\")}\n                className=\"inline-flex items-center gap-2 px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg/90 transition-colors font-medium\"\n              >\n                <Plus size={16} />\n                {tr(\n                  \"export.dashboard.empty.actions.createFirst\",\n                  \"Create First Export\",\n                )}\n              </button>\n            }\n          />\n        )}\n      </PageSection>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/export/pages/ExportDetailPage.js

@@ -4,14 +4,15 @@ import { cn as o } from "../utils/cn.js";
 import { getArchiveFormatDisplayName as s, getFormatDisplayName as c } from "../constants/enums.js";
 import { ExportStatusBadge as l } from "../components/ExportStatusBadge.js";
 import { ExportProgressBar as u } from "../components/ExportProgressBar.js";
-import { PageLayout as d, PageSection as f } from "../components/PageLayout.js";
-import { nativeImpact as p, nativeNotify as m } from "../../utils/nativeBridge.js";
-import { useState as h } from "react";
-import { AlertCircle as g, ArrowLeft as _, CheckCircle2 as v, Clock as y, Download as b, FileDown as x, FileText as S, HardDrive as C, Loader2 as w, RotateCcw as T, Trash2 as E, XCircle as D } from "lucide-react";
-import { useNavigate as O, useParams as k } from "react-router-dom";
-import { jsx as A, jsxs as j } from "react/jsx-runtime";
+import { PageLayout as d, PageSection as ee } from "../components/PageLayout.js";
+import { nativeImpact as te, nativeNotify as f } from "../../utils/nativeBridge.js";
+import { useState as p } from "react";
+import { AlertCircle as m, ArrowLeft as h, CheckCircle2 as g, Clock as _, Download as v, FileDown as y, FileText as b, HardDrive as x, Loader2 as S, RotateCcw as C, Trash2 as w, XCircle as ne } from "lucide-react";
+import { useNavigate as re, useParams as ie } from "react-router-dom";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
+import { CTAOverflowMenu as D, GlassCard as O } from "@burdenoff/fe-libs/ui";
 //#region src/export/pages/ExportDetailPage.tsx
-function M(e) {
+function k(e) {
 	if (e === 0) return "0 B";
 	let t = 1024, n = [
 		"B",
@@ -22,312 +23,327 @@ function M(e) {
 	], r = Math.floor(Math.log(e) / Math.log(t));
 	return `${parseFloat((e / t ** +r).toFixed(2))} ${n[r]}`;
 }
-var N = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`);
-function P() {
-	let { jobId: P } = k(), { basePath: F = "/", navigate: I } = e(), L = O(), R = () => {
-		window.history.length > 1 ? L(-1) : I?.(F);
-	}, { data: z, isLoading: B } = r(P), { data: V } = i(P), [H, U] = h(null), { cancelJob: W, isPending: G } = t(), { deleteJob: K, isPending: q } = n(), { retryJob: J, isPending: Y } = a(), X = V ?? z ?? null, Z = X?.status === "CREATED" || X?.status === "QUEUED" || X?.status === "RUNNING", Q = X?.status === "COMPLETED", $ = X?.status === "FAILED", ee = X?.status === "FAILED" || X?.status === "CANCELLED" || X?.status === "EXPIRED";
-	return B ? /* @__PURE__ */ j("div", {
+var A = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`);
+function j() {
+	let { jobId: j } = ie(), { basePath: M = "/", navigate: N } = e(), P = re(), F = () => {
+		window.history.length > 1 ? P(-1) : N?.(M);
+	}, { data: I, isLoading: L } = r(j), { data: R } = i(j), [z, B] = p(null), { cancelJob: V, isPending: H } = t(), { deleteJob: U, isPending: W } = n(), { retryJob: G, isPending: K } = a(), q = R ?? I ?? null, J = q?.status === "CREATED" || q?.status === "QUEUED" || q?.status === "RUNNING", ae = q?.status === "COMPLETED", oe = q?.status === "FAILED", Y = q?.status === "FAILED" || q?.status === "CANCELLED" || q?.status === "EXPIRED", se = async () => {
+		j && B("cancel");
+	}, ce = async () => {
+		j && (te("medium"), B("delete"));
+	}, le = async () => {
+		if (!(!j || !z)) {
+			try {
+				z === "cancel" ? await V(j) : (await U(j), N?.(M)), f("success");
+			} catch {
+				f("error");
+			}
+			B(null);
+		}
+	}, X = async () => {
+		if (!j) return;
+		let e = await G(j);
+		e?.id && N?.(A(M, e.id));
+	}, Z = q?.parts.find((e) => e.downloadUrl);
+	if (L) return /* @__PURE__ */ E("div", {
 		className: "flex flex-col items-center justify-center py-20",
-		children: [/* @__PURE__ */ A(w, {
+		children: [/* @__PURE__ */ T(S, {
 			size: 48,
 			className: "animate-spin text-primary"
-		}), /* @__PURE__ */ A("span", {
-			className: "mt-6 text-sm font-medium text-muted-foreground",
+		}), /* @__PURE__ */ T("span", {
+			className: "mt-6 text-sm font-medium text-text-secondary",
 			children: "Loading export details…"
 		})]
-	}) : X ? /* @__PURE__ */ j(d, {
+	});
+	if (!q) return /* @__PURE__ */ E(d, {
+		showHeader: !1,
+		children: [/* @__PURE__ */ E("div", {
+			className: "flex items-center gap-3 mb-6",
+			children: [/* @__PURE__ */ T("button", {
+				type: "button",
+				onClick: F,
+				className: "p-2.5 hover:bg-accent rounded-lg transition-all duration-200",
+				children: /* @__PURE__ */ T(h, { size: 20 })
+			}), /* @__PURE__ */ T("h1", {
+				className: "text-xl font-bold",
+				children: "Export Not Found"
+			})]
+		}), /* @__PURE__ */ E("div", {
+			className: "border-2 border-border-default rounded-xl bg-status-error-bg-subtle p-12 text-center",
+			children: [
+				/* @__PURE__ */ T(m, {
+					size: 48,
+					className: "text-status-error-text mx-auto mb-4"
+				}),
+				/* @__PURE__ */ T("h3", {
+					className: "text-lg font-bold text-status-error-text mb-2",
+					children: "Export Not Found"
+				}),
+				/* @__PURE__ */ T("p", {
+					className: "text-status-error-text mb-6",
+					children: "The export job you are looking for does not exist or has been deleted."
+				}),
+				/* @__PURE__ */ E("button", {
+					type: "button",
+					onClick: F,
+					className: "inline-flex items-center gap-2 px-6 py-3 bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg/90 transition-colors font-medium",
+					children: [/* @__PURE__ */ T(h, { size: 18 }), "Back to Dashboard"]
+				})
+			]
+		})]
+	});
+	let Q = Z ? {
+		label: "Download",
+		icon: /* @__PURE__ */ T(v, { size: 16 }),
+		onSelect: () => {
+			Z.downloadUrl && window.location.assign(Z.downloadUrl);
+		}
+	} : Y ? {
+		label: "Retry Export",
+		icon: /* @__PURE__ */ T(C, { size: 16 }),
+		disabled: K,
+		onSelect: () => {
+			X();
+		}
+	} : void 0, $ = [];
+	return Y && Z && $.push({
+		label: "Retry Export",
+		icon: /* @__PURE__ */ T(C, { size: 16 }),
+		disabled: K,
+		onSelect: () => {
+			X();
+		}
+	}), J && $.push({
+		label: "Cancel Export",
+		icon: /* @__PURE__ */ T(ne, { size: 16 }),
+		disabled: H,
+		onSelect: () => {
+			se();
+		}
+	}), J || $.push({
+		label: "Delete Export",
+		icon: /* @__PURE__ */ T(w, { size: 16 }),
+		intent: "destructive",
+		disabled: W,
+		onSelect: () => {
+			ce();
+		}
+	}), /* @__PURE__ */ E(d, {
 		showHeader: !1,
 		children: [
-			/* @__PURE__ */ A("div", {
-				className: "relative overflow-hidden rounded-xl bg-gradient-to-br from-primary/5 via-primary/3 to-background border border-border/50 p-6 shadow-sm",
-				children: /* @__PURE__ */ j("div", {
-					className: "relative z-10 flex items-center gap-4",
-					children: [/* @__PURE__ */ A("button", {
-						type: "button",
-						onClick: R,
-						className: "p-2.5 hover:bg-accent rounded-lg transition-all duration-200",
-						children: /* @__PURE__ */ A(_, { size: 20 })
-					}), /* @__PURE__ */ j("div", {
-						className: "flex items-center gap-3 flex-1",
-						children: [
-							/* @__PURE__ */ A("div", {
-								className: "p-2.5 rounded-lg bg-primary/10",
-								children: /* @__PURE__ */ A(b, {
-									size: 24,
-									className: "text-primary"
-								})
-							}),
-							/* @__PURE__ */ j("div", {
-								className: "flex-1 min-w-0",
-								children: [/* @__PURE__ */ A("h1", {
-									className: "text-xl sm:text-2xl font-bold truncate",
-									children: X.name
-								}), /* @__PURE__ */ A("p", {
-									className: "text-sm text-muted-foreground mt-1",
-									children: X.entityTypes.join(", ")
-								})]
-							}),
-							/* @__PURE__ */ A(l, { status: X.status })
-						]
-					})]
+			/* @__PURE__ */ T("div", {
+				className: "relative overflow-hidden rounded-xl bg-accent-wash border border-border-seam p-6 shadow-[var(--shadow-pop)]",
+				children: /* @__PURE__ */ E("div", {
+					className: "relative z-10 flex flex-col sm:flex-row sm:items-center gap-4",
+					children: [
+						/* @__PURE__ */ T("button", {
+							type: "button",
+							onClick: F,
+							"aria-label": "Go back",
+							className: "p-2.5 hover:bg-accent rounded-lg transition-colors duration-200 self-start focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40",
+							children: /* @__PURE__ */ T(h, { size: 20 })
+						}),
+						/* @__PURE__ */ E("div", {
+							className: "flex items-center gap-3 flex-1 min-w-0",
+							children: [
+								/* @__PURE__ */ T("div", {
+									className: "p-2.5 rounded-lg bg-action-primary-bg/10",
+									children: /* @__PURE__ */ T(v, {
+										size: 24,
+										className: "text-primary"
+									})
+								}),
+								/* @__PURE__ */ E("div", {
+									className: "flex-1 min-w-0",
+									children: [/* @__PURE__ */ T("h1", {
+										className: "text-xl sm:text-2xl font-bold truncate",
+										children: q.name
+									}), /* @__PURE__ */ T("p", {
+										className: "text-sm text-text-secondary mt-1",
+										children: q.entityTypes.join(", ")
+									})]
+								}),
+								/* @__PURE__ */ T(l, { status: q.status })
+							]
+						}),
+						(Q || $.length > 0) && /* @__PURE__ */ T("div", {
+							className: "flex-shrink-0",
+							children: /* @__PURE__ */ T(D, {
+								primary: Q,
+								actions: $
+							})
+						})
+					]
 				})
 			}),
-			(X.status === "RUNNING" || X.status === "QUEUED") && /* @__PURE__ */ j("div", {
-				className: "border-2 border-border-default rounded-xl bg-status-info-bg-subtle p-6",
-				children: [/* @__PURE__ */ A(u, {
-					progress: X.progress,
+			(q.status === "RUNNING" || q.status === "QUEUED") && /* @__PURE__ */ E("div", {
+				className: "border border-border-seam rounded-xl bg-status-info-bg-subtle p-6",
+				children: [/* @__PURE__ */ T(u, {
+					progress: q.progress,
 					size: "lg"
-				}), X.processedEntities != null && X.totalEntities != null && /* @__PURE__ */ j("p", {
-					className: "text-sm text-muted-foreground mt-2",
+				}), q.processedEntities != null && q.totalEntities != null && /* @__PURE__ */ E("p", {
+					className: "text-sm text-text-secondary mt-2",
 					children: [
-						X.processedEntities.toLocaleString(),
+						q.processedEntities.toLocaleString(),
 						" /",
 						" ",
-						X.totalEntities.toLocaleString(),
+						q.totalEntities.toLocaleString(),
 						" entities processed"
 					]
 				})]
 			}),
-			$ && X.errorMessage && /* @__PURE__ */ j("div", {
+			oe && q.errorMessage && /* @__PURE__ */ E("div", {
 				className: "border-2 border-border-default rounded-xl bg-status-error-bg-subtle p-6 flex items-start gap-4",
-				children: [/* @__PURE__ */ A(g, {
+				children: [/* @__PURE__ */ T(m, {
 					size: 24,
 					className: "text-status-error-text flex-shrink-0 mt-0.5"
-				}), /* @__PURE__ */ j("div", { children: [/* @__PURE__ */ A("h3", {
+				}), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("h3", {
 					className: "font-semibold text-status-error-text mb-1",
 					children: "Export Failed"
-				}), /* @__PURE__ */ A("p", {
+				}), /* @__PURE__ */ T("p", {
 					className: "text-sm text-status-error-text",
-					children: X.errorMessage
+					children: q.errorMessage
 				})] })]
 			}),
-			/* @__PURE__ */ A("div", {
+			/* @__PURE__ */ T("div", {
 				className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4",
 				children: [
 					{
-						icon: /* @__PURE__ */ A(S, { size: 18 }),
+						icon: /* @__PURE__ */ T(b, { size: 18 }),
 						label: "Format",
-						value: c(X.format)
+						value: c(q.format)
 					},
 					{
-						icon: /* @__PURE__ */ A(C, { size: 18 }),
+						icon: /* @__PURE__ */ T(x, { size: 18 }),
 						label: "Archive",
-						value: s(X.archiveFormat)
+						value: s(q.archiveFormat)
 					},
 					{
-						icon: /* @__PURE__ */ A(b, { size: 18 }),
+						icon: /* @__PURE__ */ T(v, { size: 18 }),
 						label: "Total Size",
-						value: X.totalSizeBytes == null ? "-" : M(X.totalSizeBytes)
+						value: q.totalSizeBytes == null ? "-" : k(q.totalSizeBytes)
 					},
 					{
-						icon: /* @__PURE__ */ A(y, { size: 18 }),
+						icon: /* @__PURE__ */ T(_, { size: 18 }),
 						label: "Created",
-						value: new Date(X.createdAt).toLocaleDateString()
+						value: new Date(q.createdAt).toLocaleDateString()
 					}
-				].map((e) => /* @__PURE__ */ j("div", {
-					className: "border-2 border-border/50 rounded-xl p-4 bg-gradient-to-br from-card/50 to-background",
-					children: [/* @__PURE__ */ j("div", {
-						className: "flex items-center gap-2 text-muted-foreground mb-1",
-						children: [e.icon, /* @__PURE__ */ A("span", {
+				].map((e) => /* @__PURE__ */ E(O, {
+					treatment: "metric",
+					className: "p-4 border-border-seam",
+					children: [/* @__PURE__ */ E("div", {
+						className: "flex items-center gap-2 text-text-secondary mb-1",
+						children: [e.icon, /* @__PURE__ */ T("span", {
 							className: "text-xs font-medium",
 							children: e.label
 						})]
-					}), /* @__PURE__ */ A("p", {
-						className: "font-bold text-lg",
+					}), /* @__PURE__ */ T("p", {
+						className: "font-bold text-lg tabular-nums",
 						children: e.value
 					})]
 				}, e.label))
 			}),
-			X.parts.length > 0 && /* @__PURE__ */ A(f, {
+			q.parts.length > 0 && /* @__PURE__ */ T(ee, {
 				title: "Export Parts",
-				description: `${X.parts.length} file(s) generated`,
-				children: /* @__PURE__ */ A("div", {
+				description: `${q.parts.length} file(s) generated`,
+				children: /* @__PURE__ */ T("div", {
 					className: "space-y-2",
-					children: X.parts.map((e) => /* @__PURE__ */ j("div", {
-						className: o("border-2 border-border/50 rounded-xl p-4 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3", "hover:border-primary/30 transition-all duration-200"),
-						children: [/* @__PURE__ */ j("div", {
+					children: q.parts.map((e) => /* @__PURE__ */ E("div", {
+						className: o("border border-border-seam rounded-xl p-4 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3 bg-bg-surface", "hover:border-primary/40 transition-colors duration-200"),
+						children: [/* @__PURE__ */ E("div", {
 							className: "flex items-center gap-3 min-w-0",
-							children: [/* @__PURE__ */ A(x, {
+							children: [/* @__PURE__ */ T(y, {
 								size: 20,
 								className: "text-primary flex-shrink-0"
-							}), /* @__PURE__ */ j("div", {
+							}), /* @__PURE__ */ E("div", {
 								className: "min-w-0",
-								children: [/* @__PURE__ */ A("p", {
+								children: [/* @__PURE__ */ T("p", {
 									className: "font-medium truncate",
 									children: e.fileName
-								}), /* @__PURE__ */ j("p", {
-									className: "text-sm text-muted-foreground",
+								}), /* @__PURE__ */ E("p", {
+									className: "text-sm text-text-secondary",
 									children: [
 										e.entityTypes.join(", "),
 										" ·",
 										" ",
-										M(e.sizeBytes),
+										k(e.sizeBytes),
 										e.downloadExpiresAt && ` · expires ${new Date(e.downloadExpiresAt).toLocaleDateString()}`
 									]
 								})]
 							})]
-						}), /* @__PURE__ */ A("div", {
+						}), /* @__PURE__ */ T("div", {
 							className: "flex items-center gap-2 flex-shrink-0",
-							children: e.downloadUrl ? /* @__PURE__ */ j("a", {
+							children: e.downloadUrl ? /* @__PURE__ */ E("a", {
 								href: e.downloadUrl,
-								className: "inline-flex items-center gap-2 px-3 py-1.5 bg-primary text-primary-foreground rounded-lg hover:bg-primary/90 transition-colors text-sm font-medium",
-								children: [/* @__PURE__ */ A(b, { size: 14 }), "Download"]
-							}) : /* @__PURE__ */ j("span", {
-								className: "inline-flex items-center gap-1.5 text-sm text-muted-foreground",
-								children: [/* @__PURE__ */ A(y, { size: 14 }), "Pending"]
+								className: "inline-flex items-center gap-2 px-3 py-1.5 bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg/90 transition-colors text-sm font-medium",
+								children: [/* @__PURE__ */ T(v, { size: 14 }), "Download"]
+							}) : /* @__PURE__ */ E("span", {
+								className: "inline-flex items-center gap-1.5 text-sm text-text-secondary",
+								children: [/* @__PURE__ */ T(_, { size: 14 }), "Pending"]
 							})
 						})]
 					}, e.id))
 				})
 			}),
-			Q && X.parts.length === 0 && /* @__PURE__ */ j("div", {
+			ae && q.parts.length === 0 && /* @__PURE__ */ E("div", {
 				className: "border-2 border-border-default rounded-xl bg-status-success-bg-subtle p-6 text-center",
 				children: [
-					/* @__PURE__ */ A(v, {
+					/* @__PURE__ */ T(g, {
 						size: 48,
 						className: "text-status-success-text mx-auto mb-3"
 					}),
-					/* @__PURE__ */ A("h3", {
+					/* @__PURE__ */ T("h3", {
 						className: "text-lg font-bold text-status-success-text mb-1",
 						children: "Export Complete"
 					}),
-					/* @__PURE__ */ A("p", {
+					/* @__PURE__ */ T("p", {
 						className: "text-sm text-status-success-text",
 						children: "Your export has completed but no download parts are available yet."
 					})
 				]
 			}),
-			/* @__PURE__ */ j("div", {
-				className: "flex flex-col sm:flex-row gap-3 pt-2",
-				children: [
-					Z && /* @__PURE__ */ j("button", {
-						type: "button",
-						onClick: async () => {
-							P && U("cancel");
-						},
-						disabled: G,
-						className: "inline-flex items-center justify-center gap-2 px-6 py-3 border-2 border-status-warning-bg/50 text-status-warning-text rounded-lg hover:bg-status-warning-bg-subtle transition-all duration-200 font-medium disabled:opacity-50",
-						children: [G ? /* @__PURE__ */ A(w, {
-							size: 18,
-							className: "animate-spin"
-						}) : /* @__PURE__ */ A(D, { size: 18 }), "Cancel Export"]
-					}),
-					ee && /* @__PURE__ */ j("button", {
-						type: "button",
-						onClick: async () => {
-							if (!P) return;
-							let e = await J(P);
-							e?.id && I?.(N(F, e.id));
-						},
-						disabled: Y,
-						className: "inline-flex items-center justify-center gap-2 px-6 py-3 border-2 border-primary/50 text-primary rounded-lg hover:bg-primary/5 transition-all duration-200 font-medium disabled:opacity-50",
-						children: [Y ? /* @__PURE__ */ A(w, {
-							size: 18,
-							className: "animate-spin"
-						}) : /* @__PURE__ */ A(T, { size: 18 }), "Retry Export"]
-					}),
-					!Z && /* @__PURE__ */ j("button", {
-						type: "button",
-						onClick: async () => {
-							P && (p("medium"), U("delete"));
-						},
-						disabled: q,
-						className: "inline-flex items-center justify-center gap-2 px-6 py-3 border-2 border-status-error-bg/50 text-status-error-text rounded-lg hover:bg-status-error-bg-subtle transition-all duration-200 font-medium disabled:opacity-50",
-						children: [q ? /* @__PURE__ */ A(w, {
-							size: 18,
-							className: "animate-spin"
-						}) : /* @__PURE__ */ A(E, { size: 18 }), "Delete Export"]
-					})
-				]
-			}),
-			H && /* @__PURE__ */ A("div", {
+			z && /* @__PURE__ */ T("div", {
 				role: "dialog",
 				"aria-modal": "true",
 				"aria-labelledby": "export-confirm-title",
-				className: "fixed inset-0 z-50 flex items-center justify-center bg-background/80 backdrop-blur-sm p-4",
-				children: /* @__PURE__ */ j("div", {
-					className: "w-full max-w-md rounded-xl border-2 border-border bg-card p-6 shadow-xl",
+				className: "fixed inset-0 z-50 flex items-center justify-center bg-bg-surface/80 backdrop-blur-sm p-4",
+				children: /* @__PURE__ */ E("div", {
+					className: "w-full max-w-md rounded-xl border-2 border-border-subtle bg-bg-surface p-6 shadow-xl",
 					children: [
-						/* @__PURE__ */ A("h2", {
+						/* @__PURE__ */ T("h2", {
 							id: "export-confirm-title",
 							className: "text-lg font-bold",
-							children: H === "cancel" ? "Cancel export?" : "Delete export?"
+							children: z === "cancel" ? "Cancel export?" : "Delete export?"
 						}),
-						/* @__PURE__ */ A("p", {
-							className: "mt-2 text-sm text-muted-foreground",
-							children: H === "cancel" ? "This stops the running export job. You can retry it later if needed." : "This removes the export job from history. This action cannot be undone."
+						/* @__PURE__ */ T("p", {
+							className: "mt-2 text-sm text-text-secondary",
+							children: z === "cancel" ? "This stops the running export job. You can retry it later if needed." : "This removes the export job from history. This action cannot be undone."
 						}),
-						/* @__PURE__ */ j("div", {
+						/* @__PURE__ */ E("div", {
 							className: "mt-6 flex flex-col-reverse sm:flex-row sm:justify-end gap-3",
-							children: [/* @__PURE__ */ A("button", {
+							children: [/* @__PURE__ */ T("button", {
 								type: "button",
-								onClick: () => U(null),
-								className: "px-4 py-2 rounded-lg border-2 border-border hover:bg-accent transition-colors font-medium",
+								onClick: () => B(null),
+								className: "px-4 py-2 rounded-lg border-2 border-border-subtle hover:bg-accent transition-colors font-medium",
 								children: "Keep Export"
-							}), /* @__PURE__ */ j("button", {
+							}), /* @__PURE__ */ E("button", {
 								type: "button",
-								onClick: async () => {
-									if (!(!P || !H)) {
-										try {
-											H === "cancel" ? await W(P) : (await K(P), I?.(F)), m("success");
-										} catch {
-											m("error");
-										}
-										U(null);
-									}
-								},
-								disabled: G || q,
-								className: "inline-flex items-center justify-center gap-2 px-4 py-2 rounded-lg bg-destructive text-destructive-foreground hover:bg-destructive/90 transition-colors font-medium disabled:opacity-50",
-								children: [G || q ? /* @__PURE__ */ A(w, {
+								onClick: le,
+								disabled: H || W,
+								className: "inline-flex items-center justify-center gap-2 px-4 py-2 rounded-lg bg-status-error-bg text-status-error-text hover:bg-status-error-bg/90 transition-colors font-medium disabled:opacity-50",
+								children: [H || W ? /* @__PURE__ */ T(S, {
 									size: 16,
 									className: "animate-spin"
-								}) : null, H === "cancel" ? "Cancel Export" : "Delete Export"]
+								}) : null, z === "cancel" ? "Cancel Export" : "Delete Export"]
 							})]
 						})
 					]
 				})
 			})
 		]
-	}) : /* @__PURE__ */ j(d, {
-		showHeader: !1,
-		children: [/* @__PURE__ */ j("div", {
-			className: "flex items-center gap-3 mb-6",
-			children: [/* @__PURE__ */ A("button", {
-				type: "button",
-				onClick: R,
-				className: "p-2.5 hover:bg-accent rounded-lg transition-all duration-200",
-				children: /* @__PURE__ */ A(_, { size: 20 })
-			}), /* @__PURE__ */ A("h1", {
-				className: "text-xl font-bold",
-				children: "Export Not Found"
-			})]
-		}), /* @__PURE__ */ j("div", {
-			className: "border-2 border-border-default rounded-xl bg-status-error-bg-subtle p-12 text-center",
-			children: [
-				/* @__PURE__ */ A(g, {
-					size: 48,
-					className: "text-status-error-text mx-auto mb-4"
-				}),
-				/* @__PURE__ */ A("h3", {
-					className: "text-lg font-bold text-status-error-text mb-2",
-					children: "Export Not Found"
-				}),
-				/* @__PURE__ */ A("p", {
-					className: "text-status-error-text mb-6",
-					children: "The export job you are looking for does not exist or has been deleted."
-				}),
-				/* @__PURE__ */ j("button", {
-					type: "button",
-					onClick: R,
-					className: "inline-flex items-center gap-2 px-6 py-3 bg-primary text-primary-foreground rounded-lg hover:bg-primary/90 transition-colors font-medium",
-					children: [/* @__PURE__ */ A(_, { size: 18 }), "Back to Dashboard"]
-				})
-			]
-		})]
 	});
 }
 //#endregion
-export { P as ExportDetailPage };
+export { j as ExportDetailPage };
 
 //# sourceMappingURL=ExportDetailPage.js.map