@open-mercato/core 0.4.7-develop-78d7541539 → 0.4.7-develop-74069040de

package/dist/modules/data_sync/backend/data-sync/page.js

@@ -1,15 +1,37 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
+import Link from "next/link";
 import { useRouter } from "next/navigation";
 import { Page, PageBody } from "@open-mercato/ui/backend/Page";
 import { DataTable } from "@open-mercato/ui/backend/DataTable";
+import { useGuardedMutation } from "@open-mercato/ui/backend/injection/useGuardedMutation";
 import { Badge } from "@open-mercato/ui/primitives/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@open-mercato/ui/primitives/card";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { Input } from "@open-mercato/ui/primitives/input";
+import { Label } from "@open-mercato/ui/primitives/label";
+import { Notice } from "@open-mercato/ui/primitives/Notice";
+import { Separator } from "@open-mercato/ui/primitives/separator";
+import { Switch } from "@open-mercato/ui/primitives/switch";
 import { RowActions } from "@open-mercato/ui/backend/RowActions";
 import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
 import { flash } from "@open-mercato/ui/backend/FlashMessages";
 import { useOrganizationScopeVersion } from "@open-mercato/shared/lib/frontend/useOrganizationScope";
 import { useT } from "@open-mercato/shared/lib/i18n/context";
+import {
+  ArrowRightLeft,
+  Boxes,
+  CalendarClock,
+  CircleAlert,
+  Clock3,
+  Gauge,
+  Play,
+  PlugZap,
+  Repeat,
+  Settings2,
+  ShieldCheck
+} from "lucide-react";
 const STATUS_STYLES = {
   pending: "bg-gray-100 text-gray-800",
   running: "bg-blue-100 text-blue-800",
@@ -18,18 +40,78 @@ const STATUS_STYLES = {
   cancelled: "bg-yellow-100 text-yellow-800",
   paused: "bg-orange-100 text-orange-800"
 };
+const DEFAULT_TIMEZONE = Intl.DateTimeFormat().resolvedOptions().timeZone || "UTC";
+function getSummaryBadgeStyle(kind) {
+  if (kind === "enabled" || kind === "ready") {
+    return {
+      variant: "outline",
+      className: "border-emerald-500/30 bg-emerald-500/15 text-emerald-200"
+    };
+  }
+  if (kind === "disabled" || kind === "missing") {
+    return {
+      variant: "outline",
+      className: "border-red-500/30 bg-red-500/15 text-red-200"
+    };
+  }
+  if (kind === "paused") {
+    return {
+      variant: "outline",
+      className: "border-amber-500/30 bg-amber-500/15 text-amber-200"
+    };
+  }
+  if (kind === "scheduled") {
+    return {
+      variant: "outline",
+      className: "border-sky-500/30 bg-sky-500/15 text-sky-200"
+    };
+  }
+  return {
+    variant: "outline",
+    className: "border-muted-foreground/20 bg-muted/40 text-muted-foreground"
+  };
+}
+function formatEntityTypeLabel(entityType) {
+  return entityType.replace(/[_-]+/g, " ").replace(/\b\w/g, (letter) => letter.toUpperCase());
+}
+function buildDefaultScheduleState(entityType) {
+  const normalized = entityType.trim().toLowerCase();
+  const longerInterval = normalized === "categories" || normalized === "attributes";
+  return {
+    scheduleType: "interval",
+    scheduleValue: longerInterval ? "6h" : "1h",
+    timezone: DEFAULT_TIMEZONE,
+    fullSync: normalized !== "products",
+    isEnabled: true,
+    lastRunAt: null
+  };
+}
 function SyncRunsDashboardPage() {
   const router = useRouter();
   const [rows, setRows] = React.useState([]);
+  const [options, setOptions] = React.useState([]);
   const [page, setPage] = React.useState(1);
   const [total, setTotal] = React.useState(0);
   const [totalPages, setTotalPages] = React.useState(1);
   const [search, setSearch] = React.useState("");
   const [filterValues, setFilterValues] = React.useState({});
   const [isLoading, setIsLoading] = React.useState(true);
+  const [isLoadingOptions, setIsLoadingOptions] = React.useState(true);
+  const [selectedIntegrationId, setSelectedIntegrationId] = React.useState("");
+  const [selectedEntityType, setSelectedEntityType] = React.useState("");
+  const [selectedDirection, setSelectedDirection] = React.useState("import");
+  const [batchSize, setBatchSize] = React.useState("100");
+  const [fullSync, setFullSync] = React.useState(false);
+  const [scheduleEditor, setScheduleEditor] = React.useState(() => buildDefaultScheduleState(""));
+  const [isLoadingSchedule, setIsLoadingSchedule] = React.useState(false);
+  const [isSavingSchedule, setIsSavingSchedule] = React.useState(false);
+  const [isDeletingSchedule, setIsDeletingSchedule] = React.useState(false);
   const [reloadToken, setReloadToken] = React.useState(0);
   const scopeVersion = useOrganizationScopeVersion();
   const t = useT();
+  const { runMutation } = useGuardedMutation({
+    contextId: "data_sync.dashboard"
+  });
   React.useEffect(() => {
     let cancelled = false;
     async function load() {
@@ -63,6 +145,99 @@ function SyncRunsDashboardPage() {
       cancelled = true;
     };
   }, [page, filterValues, reloadToken, scopeVersion, t]);
+  React.useEffect(() => {
+    let cancelled = false;
+    async function loadOptions() {
+      setIsLoadingOptions(true);
+      const fallback = { items: [] };
+      const call = await apiCall("/api/data_sync/options", void 0, { fallback });
+      if (!cancelled) {
+        if (!call.ok) {
+          flash(t("data_sync.dashboard.loadError"), "error");
+          setOptions([]);
+          setIsLoadingOptions(false);
+          return;
+        }
+        const nextItems = Array.isArray(call.result?.items) ? call.result.items : [];
+        setOptions(nextItems);
+        setSelectedIntegrationId((current) => {
+          if (current && nextItems.some((item) => item.integrationId === current)) return current;
+          return nextItems[0]?.integrationId ?? "";
+        });
+        setIsLoadingOptions(false);
+      }
+    }
+    void loadOptions();
+    return () => {
+      cancelled = true;
+    };
+  }, [scopeVersion, t]);
+  const selectedIntegration = React.useMemo(
+    () => options.find((item) => item.integrationId === selectedIntegrationId) ?? null,
+    [options, selectedIntegrationId]
+  );
+  const entityOptions = React.useMemo(
+    () => selectedIntegration?.supportedEntities ?? [],
+    [selectedIntegration]
+  );
+  React.useEffect(() => {
+    if (!selectedIntegration) {
+      setSelectedEntityType("");
+      return;
+    }
+    setSelectedEntityType((current) => current && selectedIntegration.supportedEntities.includes(current) ? current : selectedIntegration.supportedEntities[0] ?? "");
+    setSelectedDirection(selectedIntegration.direction === "export" ? "export" : "import");
+  }, [selectedIntegration]);
+  React.useEffect(() => {
+    if (!selectedIntegration || !selectedEntityType) {
+      setScheduleEditor(buildDefaultScheduleState(selectedEntityType));
+      return;
+    }
+    const currentIntegration = selectedIntegration;
+    let cancelled = false;
+    async function loadSchedule() {
+      setIsLoadingSchedule(true);
+      const integrationId = currentIntegration.integrationId;
+      const params = new URLSearchParams({
+        integrationId,
+        entityType: selectedEntityType,
+        direction: selectedDirection,
+        page: "1",
+        pageSize: "1"
+      });
+      const fallback = { items: [] };
+      const call = await apiCall(`/api/data_sync/schedules?${params.toString()}`, void 0, { fallback });
+      if (cancelled) return;
+      if (!call.ok) {
+        setScheduleEditor(buildDefaultScheduleState(selectedEntityType));
+        setIsLoadingSchedule(false);
+        return;
+      }
+      const record = Array.isArray(call.result?.items) ? call.result?.items[0] : void 0;
+      if (!record) {
+        setScheduleEditor(buildDefaultScheduleState(selectedEntityType));
+        setIsLoadingSchedule(false);
+        return;
+      }
+      setScheduleEditor({
+        id: record.id,
+        scheduleType: record.scheduleType,
+        scheduleValue: record.scheduleValue,
+        timezone: record.timezone,
+        fullSync: record.fullSync,
+        isEnabled: record.isEnabled,
+        lastRunAt: record.lastRunAt
+      });
+      setIsLoadingSchedule(false);
+    }
+    void loadSchedule();
+    return () => {
+      cancelled = true;
+    };
+  }, [selectedDirection, selectedEntityType, selectedIntegration, scopeVersion]);
+  const updateScheduleEditor = React.useCallback((changes) => {
+    setScheduleEditor((current) => ({ ...current, ...changes }));
+  }, []);
   const handleCancel = React.useCallback(async (row) => {
     const call = await apiCall(`/api/data_sync/runs/${encodeURIComponent(row.id)}/cancel`, {
       method: "POST"
@@ -99,6 +274,140 @@ function SyncRunsDashboardPage() {
     setFilterValues({});
     setPage(1);
   }, []);
+  const handleStartSync = React.useCallback(async () => {
+    if (!selectedIntegration || !selectedEntityType) return;
+    const parsedBatchSize = Number.parseInt(batchSize, 10);
+    if (!Number.isFinite(parsedBatchSize) || parsedBatchSize < 1 || parsedBatchSize > 1e3) {
+      flash(t("data_sync.dashboard.start.invalidBatchSize", "Batch size must be between 1 and 1000."), "error");
+      return;
+    }
+    try {
+      const call = await runMutation({
+        operation: () => apiCall("/api/data_sync/run", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            integrationId: selectedIntegration.integrationId,
+            entityType: selectedEntityType,
+            direction: selectedDirection,
+            batchSize: parsedBatchSize,
+            fullSync
+          })
+        }, { fallback: null }),
+        mutationPayload: {
+          integrationId: selectedIntegration.integrationId,
+          entityType: selectedEntityType,
+          direction: selectedDirection,
+          batchSize: parsedBatchSize,
+          fullSync
+        },
+        context: {
+          operation: "create",
+          actionId: "start-sync-run",
+          integrationId: selectedIntegration.integrationId
+        }
+      });
+      if (!call.ok || !call.result?.id) {
+        flash(call.result?.error ?? t("data_sync.dashboard.start.error", "Failed to start sync run"), "error");
+        return;
+      }
+      flash(t("data_sync.dashboard.start.success", "Sync run started"), "success");
+      setReloadToken((token) => token + 1);
+      router.push(`/backend/data-sync/runs/${encodeURIComponent(call.result.id)}`);
+    } catch (error) {
+      const message = error instanceof Error ? error.message : t("data_sync.dashboard.start.error", "Failed to start sync run");
+      flash(message, "error");
+    }
+  }, [batchSize, fullSync, router, runMutation, selectedDirection, selectedEntityType, selectedIntegration, t]);
+  const handleSaveSchedule = React.useCallback(async () => {
+    if (!selectedIntegration || !selectedEntityType) return;
+    if (scheduleEditor.scheduleValue.trim().length === 0) {
+      flash(t("data_sync.dashboard.schedule.invalidValue", "Provide a schedule value before saving."), "error");
+      return;
+    }
+    setIsSavingSchedule(true);
+    try {
+      const call = await runMutation({
+        operation: () => apiCall("/api/data_sync/schedules", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            integrationId: selectedIntegration.integrationId,
+            entityType: selectedEntityType,
+            direction: selectedDirection,
+            scheduleType: scheduleEditor.scheduleType,
+            scheduleValue: scheduleEditor.scheduleValue.trim(),
+            timezone: scheduleEditor.timezone.trim() || DEFAULT_TIMEZONE,
+            fullSync: scheduleEditor.fullSync,
+            isEnabled: scheduleEditor.isEnabled
+          })
+        }, { fallback: null }),
+        mutationPayload: {
+          integrationId: selectedIntegration.integrationId,
+          entityType: selectedEntityType,
+          direction: selectedDirection,
+          scheduleType: scheduleEditor.scheduleType,
+          scheduleValue: scheduleEditor.scheduleValue.trim(),
+          timezone: scheduleEditor.timezone.trim() || DEFAULT_TIMEZONE,
+          fullSync: scheduleEditor.fullSync,
+          isEnabled: scheduleEditor.isEnabled
+        },
+        context: {
+          operation: "update",
+          actionId: "save-sync-schedule",
+          integrationId: selectedIntegration.integrationId
+        }
+      });
+      if (!call.ok || !call.result) {
+        flash(call.result?.error ?? t("data_sync.dashboard.schedule.error", "Failed to save recurring schedule"), "error");
+        return;
+      }
+      setScheduleEditor({
+        id: call.result.id,
+        scheduleType: call.result.scheduleType,
+        scheduleValue: call.result.scheduleValue,
+        timezone: call.result.timezone,
+        fullSync: call.result.fullSync,
+        isEnabled: call.result.isEnabled,
+        lastRunAt: call.result.lastRunAt
+      });
+      flash(t("data_sync.dashboard.schedule.success", "Recurring schedule saved"), "success");
+    } catch (error) {
+      const message = error instanceof Error ? error.message : t("data_sync.dashboard.schedule.error", "Failed to save recurring schedule");
+      flash(message, "error");
+    } finally {
+      setIsSavingSchedule(false);
+    }
+  }, [runMutation, scheduleEditor, selectedDirection, selectedEntityType, selectedIntegration, t]);
+  const handleDeleteSchedule = React.useCallback(async () => {
+    if (!scheduleEditor.id) return;
+    setIsDeletingSchedule(true);
+    try {
+      const call = await runMutation({
+        operation: () => apiCall(`/api/data_sync/schedules/${encodeURIComponent(scheduleEditor.id)}`, {
+          method: "DELETE"
+        }, { fallback: null }),
+        mutationPayload: {
+          scheduleId: scheduleEditor.id
+        },
+        context: {
+          operation: "delete",
+          actionId: "delete-sync-schedule"
+        }
+      });
+      if (!call.ok) {
+        flash(call.result?.error ?? t("data_sync.dashboard.schedule.deleteError", "Failed to remove recurring schedule"), "error");
+        return;
+      }
+      setScheduleEditor(buildDefaultScheduleState(selectedEntityType));
+      flash(t("data_sync.dashboard.schedule.deleteSuccess", "Recurring schedule removed"), "success");
+    } catch (error) {
+      const message = error instanceof Error ? error.message : t("data_sync.dashboard.schedule.deleteError", "Failed to remove recurring schedule");
+      flash(message, "error");
+    } finally {
+      setIsDeletingSchedule(false);
+    }
+  }, [runMutation, scheduleEditor.id, selectedEntityType, t]);
   const filters = [
     {
       id: "status",
@@ -162,53 +471,353 @@ function SyncRunsDashboardPage() {
       cell: ({ row }) => new Date(row.original.createdAt).toLocaleString()
     }
   ], [t]);
-  return /* @__PURE__ */ jsx(Page, { children: /* @__PURE__ */ jsx(PageBody, { children: /* @__PURE__ */ jsx(
-    DataTable,
-    {
-      title: t("data_sync.dashboard.title"),
-      columns,
-      data: rows,
-      filters,
-      filterValues,
-      onFiltersApply: handleFiltersApply,
-      onFiltersClear: handleFiltersClear,
-      searchValue: search,
-      onSearchChange: (value) => {
-        setSearch(value);
-        setPage(1);
-      },
-      perspective: { tableId: "data_sync.runs" },
-      onRowClick: (row) => {
-        router.push(`/backend/data-sync/runs/${encodeURIComponent(row.id)}`);
-      },
-      rowActions: (row) => /* @__PURE__ */ jsx(RowActions, { items: [
-        {
-          id: "view",
-          label: t("data_sync.dashboard.actions.view"),
-          onSelect: () => {
-            router.push(`/backend/data-sync/runs/${encodeURIComponent(row.id)}`);
-          }
-        },
-        ...row.status === "running" ? [{
-          id: "cancel",
-          label: t("data_sync.runs.detail.cancel"),
-          destructive: true,
-          onSelect: () => {
-            void handleCancel(row);
-          }
-        }] : [],
-        ...row.status === "failed" ? [{
-          id: "retry",
-          label: t("data_sync.runs.detail.retry"),
-          onSelect: () => {
-            void handleRetry(row);
-          }
-        }] : []
+  const canStartSelectedIntegration = Boolean(
+    selectedIntegration && selectedEntityType && selectedIntegration.isEnabled && selectedIntegration.hasCredentials
+  );
+  const hasSavedSchedule = Boolean(scheduleEditor.id);
+  const selectedEntityLabel = selectedEntityType ? formatEntityTypeLabel(selectedEntityType) : t("data_sync.dashboard.columns.entityType");
+  const integrationStateBadge = getSummaryBadgeStyle(selectedIntegration?.isEnabled ? "enabled" : "disabled");
+  const credentialsBadge = getSummaryBadgeStyle(selectedIntegration?.hasCredentials ? "ready" : "missing");
+  const scheduleBadge = getSummaryBadgeStyle(
+    hasSavedSchedule ? scheduleEditor.isEnabled ? "scheduled" : "paused" : "none"
+  );
+  return /* @__PURE__ */ jsx(Page, { children: /* @__PURE__ */ jsxs(PageBody, { className: "space-y-6", children: [
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { className: "space-y-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs font-medium uppercase tracking-[0.14em] text-muted-foreground", children: [
+              /* @__PURE__ */ jsx(Repeat, { className: "size-4" }),
+              /* @__PURE__ */ jsx("span", { children: t("data_sync.dashboard.start.eyebrow", "Run once or keep it recurring") })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+              /* @__PURE__ */ jsx(CardTitle, { children: t("data_sync.dashboard.start.title", "Start or schedule a sync") }),
+              /* @__PURE__ */ jsx("p", { className: "max-w-3xl text-sm text-muted-foreground", children: t("data_sync.dashboard.start.description", "Pick a sync target, launch an ad-hoc run, or save a recurring schedule for the same entity and direction from this page.") })
+            ] })
+          ] }),
+          selectedIntegration ? /* @__PURE__ */ jsx(Button, { asChild: true, variant: "outline", children: /* @__PURE__ */ jsxs(Link, { href: selectedIntegration.settingsPath, children: [
+            /* @__PURE__ */ jsx(Settings2, { className: "mr-2 size-4" }),
+            t("integrations.marketplace.configure")
+          ] }) }) : null
+        ] }),
+        selectedIntegration ? /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
+          /* @__PURE__ */ jsxs(Badge, { variant: "outline", className: "gap-1.5", children: [
+            /* @__PURE__ */ jsx(PlugZap, { className: "size-3.5" }),
+            selectedIntegration.title
+          ] }),
+          /* @__PURE__ */ jsxs(Badge, { variant: "outline", className: "gap-1.5", children: [
+            /* @__PURE__ */ jsx(ArrowRightLeft, { className: "size-3.5" }),
+            t(`data_sync.dashboard.direction.${selectedDirection}`)
+          ] }),
+          /* @__PURE__ */ jsxs(Badge, { variant: integrationStateBadge.variant, className: `gap-1.5 ${integrationStateBadge.className ?? ""}`, children: [
+            /* @__PURE__ */ jsx(ShieldCheck, { className: "size-3.5" }),
+            selectedIntegration.isEnabled ? t("data_sync.dashboard.start.status.enabled", "Integration enabled") : t("data_sync.dashboard.start.status.disabled", "Integration disabled")
+          ] }),
+          /* @__PURE__ */ jsxs(Badge, { variant: credentialsBadge.variant, className: `gap-1.5 ${credentialsBadge.className ?? ""}`, children: [
+            /* @__PURE__ */ jsx(PlugZap, { className: "size-3.5" }),
+            selectedIntegration.hasCredentials ? t("data_sync.dashboard.start.status.credentialsReady", "Credentials ready") : t("data_sync.dashboard.start.status.credentialsMissing", "Credentials missing")
+          ] }),
+          /* @__PURE__ */ jsxs(Badge, { variant: scheduleBadge.variant, className: `gap-1.5 ${scheduleBadge.className ?? ""}`, children: [
+            /* @__PURE__ */ jsx(CalendarClock, { className: "size-3.5" }),
+            hasSavedSchedule ? scheduleEditor.isEnabled ? t("data_sync.dashboard.schedule.status.enabled", "Recurring schedule active") : t("data_sync.dashboard.schedule.status.disabled", "Recurring schedule paused") : t("data_sync.dashboard.schedule.status.none", "No recurring schedule")
+          ] })
+        ] }) : null
       ] }),
-      pagination: { page, pageSize: 20, total, totalPages, onPageChange: setPage },
-      isLoading
-    }
-  ) }) });
+      /* @__PURE__ */ jsxs(CardContent, { className: "space-y-6", children: [
+        /* @__PURE__ */ jsxs("div", { className: "grid gap-4 xl:grid-cols-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2 xl:col-span-1", children: [
+            /* @__PURE__ */ jsxs(Label, { className: "flex items-center gap-2 text-sm font-medium", children: [
+              /* @__PURE__ */ jsx(PlugZap, { className: "size-4 text-muted-foreground" }),
+              /* @__PURE__ */ jsx("span", { children: t("data_sync.dashboard.columns.integration") })
+            ] }),
+            /* @__PURE__ */ jsxs(
+              "select",
+              {
+                className: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
+                value: selectedIntegrationId,
+                onChange: (event) => setSelectedIntegrationId(event.target.value),
+                disabled: isLoadingOptions || options.length === 0,
+                children: [
+                  options.length === 0 ? /* @__PURE__ */ jsx("option", { value: "", children: t("integrations.marketplace.noResults", "No integrations found") }) : null,
+                  options.map((item) => /* @__PURE__ */ jsx("option", { value: item.integrationId, children: item.title }, item.integrationId))
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsxs(Label, { className: "flex items-center gap-2 text-sm font-medium", children: [
+              /* @__PURE__ */ jsx(Boxes, { className: "size-4 text-muted-foreground" }),
+              /* @__PURE__ */ jsx("span", { children: t("data_sync.dashboard.columns.entityType") })
+            ] }),
+            /* @__PURE__ */ jsx(
+              "select",
+              {
+                className: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
+                value: selectedEntityType,
+                onChange: (event) => setSelectedEntityType(event.target.value),
+                disabled: entityOptions.length === 0,
+                children: entityOptions.map((entityType) => /* @__PURE__ */ jsx("option", { value: entityType, children: formatEntityTypeLabel(entityType) }, entityType))
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsxs(Label, { className: "flex items-center gap-2 text-sm font-medium", children: [
+              /* @__PURE__ */ jsx(ArrowRightLeft, { className: "size-4 text-muted-foreground" }),
+              /* @__PURE__ */ jsx("span", { children: t("data_sync.dashboard.columns.direction") })
+            ] }),
+            /* @__PURE__ */ jsxs(
+              "select",
+              {
+                className: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
+                value: selectedDirection,
+                onChange: (event) => setSelectedDirection(event.target.value === "export" ? "export" : "import"),
+                disabled: selectedIntegration?.direction !== "bidirectional",
+                children: [
+                  /* @__PURE__ */ jsx("option", { value: "import", children: t("data_sync.dashboard.direction.import") }),
+                  selectedIntegration?.direction === "bidirectional" || selectedIntegration?.direction === "export" ? /* @__PURE__ */ jsx("option", { value: "export", children: t("data_sync.dashboard.direction.export") }) : null
+                ]
+              }
+            )
+          ] })
+        ] }),
+        selectedIntegration?.description ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: selectedIntegration.description }) : null,
+        /* @__PURE__ */ jsxs("div", { className: "grid gap-4 xl:grid-cols-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "rounded-xl border bg-muted/20 p-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+              /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(Play, { className: "size-4 text-primary" }),
+                  /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: t("data_sync.dashboard.start.runNowTitle", "Run once now") })
+                ] }),
+                /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("data_sync.dashboard.start.runNowDescription", "Use this for the next immediate sync. Batch size and full-sync mode apply only to this manual run.") })
+              ] }),
+              /* @__PURE__ */ jsx(Badge, { variant: "outline", children: selectedEntityLabel })
+            ] }),
+            /* @__PURE__ */ jsx(Separator, { className: "my-4" }),
+            /* @__PURE__ */ jsxs("div", { className: "grid gap-4 sm:grid-cols-[minmax(0,180px)_1fr]", children: [
+              /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsxs(Label, { className: "flex items-center gap-2 text-sm font-medium", children: [
+                  /* @__PURE__ */ jsx(Gauge, { className: "size-4 text-muted-foreground" }),
+                  /* @__PURE__ */ jsx("span", { children: t("data_sync.dashboard.start.batchSize", "Batch size") })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    value: batchSize,
+                    onChange: (event) => setBatchSize(event.target.value),
+                    inputMode: "numeric"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "rounded-lg border bg-background p-3", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+                /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                  /* @__PURE__ */ jsx(Label, { className: "text-sm font-medium", children: t("data_sync.dashboard.start.fullSync", "Run as full sync") }),
+                  /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: t("data_sync.dashboard.start.fullSyncHelp", "Ignore the saved cursor and process the entire source again for this run.") })
+                ] }),
+                /* @__PURE__ */ jsx(Switch, { checked: fullSync, onCheckedChange: setFullSync })
+              ] }) })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "mt-4 flex flex-wrap items-center justify-between gap-3", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: t("data_sync.dashboard.start.runNowFootnote", "Manual runs show progress immediately and land on the run detail page after launch.") }),
+              /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  type: "button",
+                  onClick: () => void handleStartSync(),
+                  disabled: !canStartSelectedIntegration,
+                  children: [
+                    /* @__PURE__ */ jsx(Play, { className: "mr-2 size-4" }),
+                    t("data_sync.dashboard.start.submit", "Start sync")
+                  ]
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "rounded-xl border bg-muted/20 p-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+              /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(CalendarClock, { className: "size-4 text-primary" }),
+                  /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: t("data_sync.dashboard.schedule.title", "Recurring schedule") })
+                ] }),
+                /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("data_sync.dashboard.schedule.description", "Save a repeating schedule for the selected integration, entity, and direction without leaving this dashboard.") })
+              ] }),
+              /* @__PURE__ */ jsx(Badge, { variant: "outline", children: hasSavedSchedule ? scheduleEditor.isEnabled ? t("data_sync.dashboard.schedule.status.shortEnabled", "Scheduled") : t("data_sync.dashboard.schedule.status.shortDisabled", "Paused") : t("data_sync.dashboard.schedule.status.shortNone", "One-time only") })
+            ] }),
+            /* @__PURE__ */ jsx(Separator, { className: "my-4" }),
+            /* @__PURE__ */ jsxs("div", { className: "grid gap-4 sm:grid-cols-2", children: [
+              /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsxs(Label, { className: "flex items-center gap-2 text-sm font-medium", children: [
+                  /* @__PURE__ */ jsx(Clock3, { className: "size-4 text-muted-foreground" }),
+                  /* @__PURE__ */ jsx("span", { children: t("data_sync.dashboard.schedule.type", "Schedule type") })
+                ] }),
+                /* @__PURE__ */ jsxs(
+                  "select",
+                  {
+                    className: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
+                    value: scheduleEditor.scheduleType,
+                    onChange: (event) => updateScheduleEditor({
+                      scheduleType: event.target.value === "cron" ? "cron" : "interval"
+                    }),
+                    disabled: isLoadingSchedule || isSavingSchedule || isDeletingSchedule || !selectedIntegration || !selectedEntityType,
+                    children: [
+                      /* @__PURE__ */ jsx("option", { value: "interval", children: t("data_sync.dashboard.schedule.interval", "Interval") }),
+                      /* @__PURE__ */ jsx("option", { value: "cron", children: t("data_sync.dashboard.schedule.cron", "Cron") })
+                    ]
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsxs(Label, { className: "flex items-center gap-2 text-sm font-medium", children: [
+                  /* @__PURE__ */ jsx(CalendarClock, { className: "size-4 text-muted-foreground" }),
+                  /* @__PURE__ */ jsx("span", { children: scheduleEditor.scheduleType === "cron" ? t("data_sync.dashboard.schedule.cronValue", "Cron expression") : t("data_sync.dashboard.schedule.intervalValue", "Interval") })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    value: scheduleEditor.scheduleValue,
+                    onChange: (event) => updateScheduleEditor({ scheduleValue: event.target.value }),
+                    disabled: isLoadingSchedule || isSavingSchedule || isDeletingSchedule || !selectedIntegration || !selectedEntityType,
+                    placeholder: scheduleEditor.scheduleType === "cron" ? "0 * * * *" : "1h"
+                  }
+                ),
+                /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: scheduleEditor.scheduleType === "cron" ? t("data_sync.dashboard.schedule.cronHelp", "Example: `0 * * * *` runs at the start of every hour.") : t("data_sync.dashboard.schedule.intervalHelp", "Example: `1h`, `6h`, or `24h` for repeating intervals.") })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "space-y-2 sm:col-span-2", children: [
+                /* @__PURE__ */ jsxs(Label, { className: "flex items-center gap-2 text-sm font-medium", children: [
+                  /* @__PURE__ */ jsx(Clock3, { className: "size-4 text-muted-foreground" }),
+                  /* @__PURE__ */ jsx("span", { children: t("data_sync.dashboard.schedule.timezone", "Timezone") })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    value: scheduleEditor.timezone,
+                    onChange: (event) => updateScheduleEditor({ timezone: event.target.value }),
+                    disabled: isLoadingSchedule || isSavingSchedule || isDeletingSchedule || !selectedIntegration || !selectedEntityType
+                  }
+                )
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "mt-4 grid gap-3", children: [
+              /* @__PURE__ */ jsx("div", { className: "rounded-lg border bg-background p-3", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+                /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                  /* @__PURE__ */ jsx(Label, { className: "text-sm font-medium", children: t("data_sync.dashboard.schedule.fullSync", "Run scheduled jobs as full sync") }),
+                  /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: t("data_sync.dashboard.schedule.fullSyncHelp", "When enabled, every recurring run starts from the beginning instead of the saved cursor.") })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Switch,
+                  {
+                    checked: scheduleEditor.fullSync,
+                    onCheckedChange: (checked) => updateScheduleEditor({ fullSync: checked }),
+                    disabled: isLoadingSchedule || isSavingSchedule || isDeletingSchedule || !selectedIntegration || !selectedEntityType
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ jsx("div", { className: "rounded-lg border bg-background p-3", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+                /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                  /* @__PURE__ */ jsx(Label, { className: "text-sm font-medium", children: t("data_sync.dashboard.schedule.enabled", "Schedule enabled") }),
+                  /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: t("data_sync.dashboard.schedule.enabledHelp", "Pause the recurring job without deleting the schedule definition.") })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Switch,
+                  {
+                    checked: scheduleEditor.isEnabled,
+                    onCheckedChange: (checked) => updateScheduleEditor({ isEnabled: checked }),
+                    disabled: isLoadingSchedule || isSavingSchedule || isDeletingSchedule || !selectedIntegration || !selectedEntityType
+                  }
+                )
+              ] }) })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "mt-4 flex flex-wrap items-center justify-between gap-3", children: [
+              /* @__PURE__ */ jsx("div", { className: "space-y-1 text-xs text-muted-foreground", children: /* @__PURE__ */ jsx("div", { children: hasSavedSchedule ? scheduleEditor.lastRunAt ? t("data_sync.dashboard.schedule.lastRun", "Last scheduled run: {value}", {
+                value: new Date(scheduleEditor.lastRunAt).toLocaleString()
+              }) : t("data_sync.dashboard.schedule.neverRun", "Saved, but no scheduled execution has completed yet.") : t("data_sync.dashboard.schedule.none", "No recurring schedule saved for this target yet.") }) }),
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    type: "button",
+                    variant: "outline",
+                    onClick: () => void handleDeleteSchedule(),
+                    disabled: !hasSavedSchedule || isDeletingSchedule,
+                    children: isDeletingSchedule ? t("data_sync.dashboard.schedule.deleting", "Removing...") : t("data_sync.dashboard.schedule.delete", "Remove schedule")
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  Button,
+                  {
+                    type: "button",
+                    variant: "outline",
+                    onClick: () => void handleSaveSchedule(),
+                    disabled: isSavingSchedule || !selectedIntegration || !selectedEntityType,
+                    children: [
+                      /* @__PURE__ */ jsx(CalendarClock, { className: "mr-2 size-4" }),
+                      isSavingSchedule ? t("data_sync.dashboard.schedule.saving", "Saving...") : t("data_sync.dashboard.schedule.save", "Save recurring schedule")
+                    ]
+                  }
+                )
+              ] })
+            ] })
+          ] })
+        ] }),
+        selectedIntegration && !selectedIntegration.isEnabled ? /* @__PURE__ */ jsx(Notice, { compact: true, variant: "warning", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(CircleAlert, { className: "size-4" }),
+          /* @__PURE__ */ jsx("span", { children: t("integrations.detail.state.disabled", "This integration is disabled. Enable it on the integration settings page before starting a sync.") })
+        ] }) }) : null,
+        selectedIntegration && !selectedIntegration.hasCredentials ? /* @__PURE__ */ jsx(Notice, { compact: true, variant: "warning", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(CircleAlert, { className: "size-4" }),
+          /* @__PURE__ */ jsx("span", { children: t("integrations.detail.credentials.notConfigured", "Credentials are not configured yet. Save the integration credentials before starting a sync.") })
+        ] }) }) : null
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(
+      DataTable,
+      {
+        title: t("data_sync.dashboard.title"),
+        columns,
+        data: rows,
+        filters,
+        filterValues,
+        onFiltersApply: handleFiltersApply,
+        onFiltersClear: handleFiltersClear,
+        searchValue: search,
+        onSearchChange: (value) => {
+          setSearch(value);
+          setPage(1);
+        },
+        perspective: { tableId: "data_sync.runs" },
+        onRowClick: (row) => {
+          router.push(`/backend/data-sync/runs/${encodeURIComponent(row.id)}`);
+        },
+        rowActions: (row) => /* @__PURE__ */ jsx(RowActions, { items: [
+          {
+            id: "view",
+            label: t("data_sync.dashboard.actions.view"),
+            onSelect: () => {
+              router.push(`/backend/data-sync/runs/${encodeURIComponent(row.id)}`);
+            }
+          },
+          ...row.status === "running" ? [{
+            id: "cancel",
+            label: t("data_sync.runs.detail.cancel"),
+            destructive: true,
+            onSelect: () => {
+              void handleCancel(row);
+            }
+          }] : [],
+          ...row.status === "failed" ? [{
+            id: "retry",
+            label: t("data_sync.runs.detail.retry"),
+            onSelect: () => {
+              void handleRetry(row);
+            }
+          }] : []
+        ] }),
+        pagination: { page, pageSize: 20, total, totalPages, onPageChange: setPage },
+        isLoading
+      }
+    )
+  ] }) });
 }
 export {
   SyncRunsDashboardPage as default