From a5197b4e7ee933cf22f5bb427b5e935d03ebfb53 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Thu, 23 Apr 2026 15:02:57 +0530
Subject: [PATCH 01/19] feat: redesign Run History + row counts per model
 (OR-1477)

Run History Redesign:
- Stats cards: success rate (7d), avg duration with sparkline, failures
  (24h) with trend, last successful run
- New GET /jobs/run-stats/{id} endpoint with aggregation queries
- Filter bar: search, date range (presets + custom RangePicker), status,
  trigger, environment, active filter count badge
- Job info bar: name, run count, environment dot, schedule tag, view job
- Table: Run #, Status (with icons), Trigger (with user name), Scope
  (with model count), Changes column, Duration (with comparison bar),
  retry icon per row
- Expanded detail (failure): stats grid, error card with styled model
  name + stack trace, execution timeline
- Expanded detail (success): green banner, row stats (processed/added/
  modified/deleted), per-model changes table
- Collapsed by default on load
- All colors use Ant Design theme tokens (light + dark mode)
- Custom expand icons (chevrons)

Row Counts Per Model (OR-1477 / ADR-002):
- ExecutionMetrics dataclass in adapters/model.py
- BaseModel.execute() returns row count via get_table_row_count() fallback
- Adapter.run_model() returns ExecutionMetrics
- BaseResult gains rows_affected, materialization, duration_ms fields
- execute_graph() captures metrics from run_model()
- celery_tasks.py serializes rows_affected, type, duration_ms per model
  + total rows_processed in result JSON

Enhanced Serializer:
- run_number (sequential per job), triggered_by (user name resolution),
  duration_ms, model_count, failed_models, skipped_count

Enhanced Filters:
- date_from/date_to, search (error text), existing status/trigger/scope
- project_id added to run history response

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../backend/core/scheduler/celery_tasks.py    |    7 +
 backend/backend/core/scheduler/serializer.py  |   87 +-
 backend/backend/core/scheduler/urls.py        |    2 +
 backend/backend/core/scheduler/views.py       |  134 +-
 backend/visitran/adapters/adapter.py          |    4 +-
 backend/visitran/adapters/model.py            |   34 +-
 backend/visitran/events/printer.py            |    3 +
 backend/visitran/visitran.py                  |   13 +-
 frontend/src/ide/run-history/RunHistory.css   |  123 +-
 frontend/src/ide/run-history/Runhistory.jsx   | 1144 ++++++++---------
 10 files changed, 914 insertions(+), 637 deletions(-)

diff --git a/backend/backend/core/scheduler/celery_tasks.py b/backend/backend/core/scheduler/celery_tasks.py
index 1ce72d88..66b539e0 100644
--- a/backend/backend/core/scheduler/celery_tasks.py
+++ b/backend/backend/core/scheduler/celery_tasks.py
@@ -354,6 +354,7 @@ def _clean_name(raw):
                 r for r in results_snapshot
                 if not _clean_name(r.node_name).startswith("Source")
             ]
+            total_rows = 0
             run.result = {
                 "models": [
                     {
@@ -361,12 +362,18 @@ def _clean_name(raw):
                         "status": r.status,
                         "end_status": r.end_status,
                         "sequence": r.sequence_num,
+                        "rows_affected": getattr(r, "rows_affected", None),
+                        "type": getattr(r, "materialization", "") or "",
+                        "duration_ms": getattr(r, "duration_ms", None),
                     }
                     for r in user_results
                 ],
                 "total": len(user_results),
                 "passed": sum(1 for r in user_results if r.end_status == "OK"),
                 "failed": sum(1 for r in user_results if r.end_status == "FAIL"),
+                "rows_processed": sum(
+                    getattr(r, "rows_affected", 0) or 0 for r in user_results
+                ) or None,
             }
         except Exception:
             _clear_base_result()
diff --git a/backend/backend/core/scheduler/serializer.py b/backend/backend/core/scheduler/serializer.py
index 7a45ac5b..1c79ac00 100644
--- a/backend/backend/core/scheduler/serializer.py
+++ b/backend/backend/core/scheduler/serializer.py
@@ -1,17 +1,96 @@
+from django.contrib.auth import get_user_model
 from rest_framework import serializers
 
 from backend.core.scheduler.models import TaskRunHistory
 
+User = get_user_model()
+
 
 class TaskRunHistorySerializer(serializers.ModelSerializer):
     duration = serializers.SerializerMethodField()
+    duration_ms = serializers.SerializerMethodField()
+    run_number = serializers.SerializerMethodField()
+    triggered_by = serializers.SerializerMethodField()
+    model_count = serializers.SerializerMethodField()
+    failed_models = serializers.SerializerMethodField()
+    skipped_count = serializers.SerializerMethodField()
 
     class Meta:
         model = TaskRunHistory
-        fields = "__all__"  # Include all fields or specify fields like ['id', 'start_time', 'end_time', 'status']
+        fields = "__all__"
 
     def get_duration(self, obj):
-        """Calculate duration (end_time - start_time)"""
+        """Human-readable duration string."""
+        if obj.start_time and obj.end_time:
+            delta = obj.end_time - obj.start_time
+            total_ms = int(delta.total_seconds() * 1000)
+            if total_ms < 1000:
+                return f"{total_ms}ms"
+            elif total_ms < 60000:
+                return f"{total_ms / 1000:.1f}s"
+            else:
+                minutes = total_ms // 60000
+                seconds = (total_ms % 60000) / 1000
+                return f"{minutes}m {seconds:.0f}s"
+        return None
+
+    def get_duration_ms(self, obj):
+        """Duration in milliseconds for sorting/comparison."""
         if obj.start_time and obj.end_time:
-            return str(obj.end_time - obj.start_time)  # Convert timedelta to string
-        return None  # If end_time is missing, return None
+            return int((obj.end_time - obj.start_time).total_seconds() * 1000)
+        return None
+
+    def get_run_number(self, obj):
+        """Sequential run number within the job (1 = oldest)."""
+        if not hasattr(self, "_run_number_cache"):
+            self._run_number_cache = {}
+        task_detail_id = obj.user_task_detail_id
+        if task_detail_id not in self._run_number_cache:
+            # Get all run IDs for this job ordered by start_time ASC
+            run_ids = list(
+                TaskRunHistory.objects.filter(user_task_detail_id=task_detail_id)
+                .order_by("start_time")
+                .values_list("id", flat=True)
+            )
+            self._run_number_cache[task_detail_id] = {
+                rid: idx + 1 for idx, rid in enumerate(run_ids)
+            }
+        return self._run_number_cache[task_detail_id].get(obj.id, 0)
+
+    def get_triggered_by(self, obj):
+        """Resolve user_id from kwargs to username."""
+        if not obj.kwargs:
+            return None
+        user_id = obj.kwargs.get("user_id")
+        if not user_id:
+            return None
+        try:
+            user = User.objects.get(id=user_id)
+            return {
+                "id": str(user.id),
+                "username": user.get_full_name() or user.username or user.email,
+            }
+        except (User.DoesNotExist, ValueError):
+            return {"id": str(user_id), "username": str(user_id)}
+
+    def get_model_count(self, obj):
+        """Total model count from result."""
+        if obj.result and isinstance(obj.result, dict):
+            return obj.result.get("total", 0)
+        return 0
+
+    def get_failed_models(self, obj):
+        """List of failed model names."""
+        if obj.result and isinstance(obj.result, dict):
+            models = obj.result.get("models", [])
+            return [m["name"] for m in models if m.get("end_status") == "FAIL" or m.get("status") == "failure"]
+        return []
+
+    def get_skipped_count(self, obj):
+        """Count of skipped models (total - passed - failed)."""
+        if obj.result and isinstance(obj.result, dict):
+            total = obj.result.get("total", 0)
+            passed = obj.result.get("passed", 0)
+            failed = obj.result.get("failed", 0)
+            return max(0, total - passed - failed)
+        return 0
diff --git a/backend/backend/core/scheduler/urls.py b/backend/backend/core/scheduler/urls.py
index c9e32a4f..1f0d8fe5 100644
--- a/backend/backend/core/scheduler/urls.py
+++ b/backend/backend/core/scheduler/urls.py
@@ -7,6 +7,7 @@
     delete_periodic_task,
     update_periodic_task,
     task_run_history,
+    run_stats,
     trigger_task_once,
     trigger_task_once_for_model,
     list_deploy_candidates,
@@ -30,6 +31,7 @@
         name="get_periodic_task",
     ),
     path("/run-history/<int:user_task_id>", task_run_history, name="task_run_history"),
+    path("/run-stats/<int:user_task_id>", run_stats, name="run_stats"),
     path(
         "/trigger-periodic-task/<int:user_task_id>",
         trigger_task_once,
diff --git a/backend/backend/core/scheduler/views.py b/backend/backend/core/scheduler/views.py
index 195fea57..d5ecb710 100644
--- a/backend/backend/core/scheduler/views.py
+++ b/backend/backend/core/scheduler/views.py
@@ -583,6 +583,112 @@ def delete_periodic_task(request, project_id, task_id):
         )
 
 
+@api_view(["GET"])
+@permission_classes([IsAuthenticated])
+def run_stats(request, project_id, user_task_id):
+    """Get aggregated run statistics for a job — stats cards data."""
+    try:
+        from django.db.models import Avg, Count, Q, F
+        from django.db.models.functions import ExtractDay
+
+        query = {"id": user_task_id}
+        if _is_valid_project_id(project_id):
+            query["project__project_uuid"] = project_id
+        task = UserTaskDetails.objects.get(**query)
+        runs = TaskRunHistory.objects.filter(user_task_detail=task)
+
+        now = timezone.now()
+        last_7d = now - timedelta(days=7)
+        last_24h = now - timedelta(hours=24)
+        prev_24h_start = now - timedelta(hours=48)
+
+        # Success rate (7 days)
+        runs_7d = runs.filter(start_time__gte=last_7d)
+        total_7d = runs_7d.count()
+        success_7d = runs_7d.filter(status="SUCCESS").count()
+        success_rate = round((success_7d / total_7d * 100), 1) if total_7d > 0 else None
+
+        # Average duration (successful runs, 7 days)
+        successful_runs_7d = runs_7d.filter(status="SUCCESS", start_time__isnull=False, end_time__isnull=False)
+        avg_duration_ms = None
+        if successful_runs_7d.exists():
+            durations = [(r.end_time - r.start_time).total_seconds() * 1000 for r in successful_runs_7d]
+            avg_duration_ms = int(sum(durations) / len(durations))
+
+        # Failures (24h) + comparison with previous 24h
+        failures_24h = runs.filter(start_time__gte=last_24h, status="FAILURE").count()
+        failures_prev_24h = runs.filter(
+            start_time__gte=prev_24h_start, start_time__lt=last_24h, status="FAILURE"
+        ).count()
+
+        # Last successful run
+        last_success = runs.filter(status="SUCCESS").order_by("-end_time").first()
+        last_success_time = last_success.end_time if last_success else None
+
+        # Expected duration (avg of last 5 successful runs)
+        recent_successes = runs.filter(
+            status="SUCCESS", start_time__isnull=False, end_time__isnull=False
+        ).order_by("-end_time")[:5]
+        expected_duration_ms = None
+        if recent_successes.exists():
+            durations = [(r.end_time - r.start_time).total_seconds() * 1000 for r in recent_successes]
+            expected_duration_ms = int(sum(durations) / len(durations))
+
+        # Duration trend (last 10 completed runs for sparkline)
+        recent_runs = runs.filter(
+            start_time__isnull=False, end_time__isnull=False
+        ).order_by("end_time")[:10]
+        duration_trend = [
+            int((r.end_time - r.start_time).total_seconds() * 1000) for r in recent_runs
+        ]
+
+        # Schedule info
+        schedule_type = None
+        schedule_label = None
+        try:
+            periodic = task.periodic_task
+            if periodic:
+                if periodic.crontab:
+                    schedule_type = "cron"
+                    c = periodic.crontab
+                    schedule_label = f"{c.minute} {c.hour} {c.day_of_week}"
+                elif periodic.interval:
+                    schedule_type = "interval"
+                    schedule_label = f"Every {periodic.interval.every} {periodic.interval.period}"
+        except Exception:
+            pass
+
+        return Response({
+            "success": True,
+            "data": {
+                "success_rate_7d": success_rate,
+                "success_count_7d": success_7d,
+                "total_count_7d": total_7d,
+                "avg_duration_ms": avg_duration_ms,
+                "failures_24h": failures_24h,
+                "failures_prev_24h": failures_prev_24h,
+                "failures_change": failures_24h - failures_prev_24h,
+                "last_successful_run": last_success_time,
+                "expected_duration_ms": expected_duration_ms,
+                "duration_trend": duration_trend,
+                "total_runs": runs.count(),
+                "job_name": task.task_name,
+                "environment": {
+                    "name": task.environment.environment_name if task.environment else None,
+                    "type": task.environment.deployment_type if task.environment else None,
+                },
+                "schedule_type": schedule_type,
+                "schedule_label": schedule_label,
+                "schedule_enabled": task.periodic_task.enabled if task.periodic_task else False,
+            },
+        }, status=status.HTTP_200_OK)
+    except UserTaskDetails.DoesNotExist:
+        return Response({"error": "Task not found"}, status=status.HTTP_404_NOT_FOUND)
+    except Exception as e:
+        logger.error(f"Error getting run stats: {e}")
+        return Response({"error": str(e)}, status=status.HTTP_500_INTERNAL_SERVER_ERROR)
+
+
 @api_view(["GET"])
 @permission_classes([IsAuthenticated])
 def task_run_history(request, project_id, user_task_id):
@@ -600,12 +706,32 @@ def task_run_history(request, project_id, user_task_id):
         trigger_filter = request.GET.get("trigger")
         scope_filter = request.GET.get("scope")
         status_filter = request.GET.get("status")
+        date_from = request.GET.get("date_from")
+        date_to = request.GET.get("date_to")
+        search = request.GET.get("search")
+
         if trigger_filter:
             runs = runs.filter(trigger=trigger_filter)
         if scope_filter:
             runs = runs.filter(scope=scope_filter)
         if status_filter:
             runs = runs.filter(status=status_filter)
+        if date_from:
+            from django.utils.dateparse import parse_datetime
+            dt = parse_datetime(date_from)
+            if dt:
+                runs = runs.filter(start_time__gte=dt)
+        if date_to:
+            from django.utils.dateparse import parse_datetime as parse_dt
+            dt = parse_dt(date_to)
+            if dt:
+                runs = runs.filter(start_time__lte=dt)
+        if search:
+            from django.db.models import Q
+            runs = runs.filter(
+                Q(error_message__icontains=search) |
+                Q(result__icontains=search)
+            )
 
         runs = runs.order_by("-start_time")
         total = runs.count()
@@ -620,6 +746,7 @@ def task_run_history(request, project_id, user_task_id):
                     "page_items": {
                         "id": task.id,
                         "job_name": task.task_name,
+                        "project_id": str(task.project.project_uuid) if task.project else None,
                         "env_type": task.environment.deployment_type
                         if task.environment
                         else None,
@@ -705,9 +832,10 @@ def trigger_task_once(request, project_id, user_task_id):
     synchronous (in-process) execution so local dev works without Redis.
     """
     try:
-        task = UserTaskDetails.objects.get(
-            id=user_task_id, project__project_uuid=project_id
-        )
+        query = {"id": user_task_id}
+        if _is_valid_project_id(project_id):
+            query["project__project_uuid"] = project_id
+        task = UserTaskDetails.objects.get(**query)
     except UserTaskDetails.DoesNotExist:
         return Response(
             {"error": "Task not found"}, status=status.HTTP_404_NOT_FOUND
diff --git a/backend/visitran/adapters/adapter.py b/backend/visitran/adapters/adapter.py
index 295361c1..111a1fe6 100644
--- a/backend/visitran/adapters/adapter.py
+++ b/backend/visitran/adapters/adapter.py
@@ -67,10 +67,10 @@ def db_scd(self) -> BaseSCD:
     def db_reader(self) -> BaseDBReader:
         return self._db_reader
 
-    def run_model(self, visitran_model: VisitranModel) -> None:
+    def run_model(self, visitran_model: VisitranModel):
         self.load_model(model=visitran_model)
         fire_event(MaterializationType(materialization=str(visitran_model.materialization)))
-        self.db_model.execute()
+        return self.db_model.execute()
 
     def run_seeds(self, schema: str, abs_path: str) -> None:
         seed_obj = self.load_seed(schema, abs_path)
diff --git a/backend/visitran/adapters/model.py b/backend/visitran/adapters/model.py
index 2a7b46a5..13bad528 100644
--- a/backend/visitran/adapters/model.py
+++ b/backend/visitran/adapters/model.py
@@ -2,13 +2,21 @@
 
 import logging
 from abc import ABC, abstractmethod
-from typing import Any
+from dataclasses import dataclass, field
+from typing import Any, Optional
 
 from visitran.adapters.connection import BaseConnection
 from visitran.materialization import Materialization
 from visitran.templates.model import VisitranModel
 
 
+@dataclass
+class ExecutionMetrics:
+    """Metrics returned from model execution."""
+    rows_affected: Optional[int] = None
+    materialization: str = ""
+
+
 class BaseModel(ABC):
     def __init__(self, db_connection: BaseConnection, model: VisitranModel) -> None:
         super().__init__()
@@ -26,20 +34,42 @@ def model(self) -> VisitranModel:
     def materialization(self) -> Materialization:
         return self.model.materialization
 
-    def execute(self) -> None:
+    def execute(self) -> ExecutionMetrics:
+        mat_name = self.materialization.value if hasattr(self.materialization, "value") else str(self.materialization)
+
         if self.materialization == Materialization.EPHEMERAL:
             self.execute_ephemeral()
+            return ExecutionMetrics(rows_affected=None, materialization="ephemeral")
 
         self.model.select_statement = self.model.select()
 
         if self.materialization == Materialization.TABLE:
             self.execute_table()
+            # Get row count after table creation
+            rows = self._get_row_count_safe()
+            return ExecutionMetrics(rows_affected=rows, materialization="table")
 
         elif self.materialization == Materialization.VIEW:
             self.execute_view()
+            return ExecutionMetrics(rows_affected=None, materialization="view")
 
         elif self.materialization == Materialization.INCREMENTAL:
             self.execute_incremental()
+            rows = self._get_row_count_safe()
+            return ExecutionMetrics(rows_affected=rows, materialization="incremental")
+
+        return ExecutionMetrics(materialization=mat_name)
+
+    def _get_row_count_safe(self) -> Optional[int]:
+        """Get row count after execution, return None on failure."""
+        try:
+            return self._db_connection.get_table_row_count(
+                schema_name=self.model.destination_schema_name,
+                table_name=self.model.destination_table_name,
+            )
+        except Exception as e:
+            logging.debug(f"Could not get row count for {self.model.destination_table_name}: {e}")
+            return None
 
     @abstractmethod
     def execute_ephemeral(self) -> None:
diff --git a/backend/visitran/events/printer.py b/backend/visitran/events/printer.py
index 19f1a19a..5ba1b434 100644
--- a/backend/visitran/events/printer.py
+++ b/backend/visitran/events/printer.py
@@ -27,6 +27,9 @@ class BaseResult:
     ending_time: datetime.datetime
     sequence_num: int
     end_status: str
+    rows_affected: int | None = None
+    materialization: str = ""
+    duration_ms: int | None = None
 
 
 @dataclass
diff --git a/backend/visitran/visitran.py b/backend/visitran/visitran.py
index 4ccee4c3..e2f2122f 100644
--- a/backend/visitran/visitran.py
+++ b/backend/visitran/visitran.py
@@ -345,9 +345,10 @@ def execute_graph(self) -> None:
                     )
                 )
                 self.db_adapter.db_connection.create_schema(node.destination_schema_name)  # create if not exists
-                self.db_adapter.run_model(visitran_model=node)
+                exec_metrics = self.db_adapter.run_model(visitran_model=node)
 
                 _elapsed = time.monotonic() - start_time
+                _elapsed_ms = int(_elapsed * 1000)
                 fire_event(
                     ModelRunSucceeded(
                         model_name=_model_display,
@@ -360,6 +361,13 @@ def execute_graph(self) -> None:
                     run_duration=_elapsed,
                 )
 
+                # Extract row count from execution metrics
+                _rows = None
+                _mat = ""
+                if exec_metrics is not None:
+                    _rows = getattr(exec_metrics, "rows_affected", None)
+                    _mat = getattr(exec_metrics, "materialization", "")
+
                 base_result = BaseResult(
                     node_name=str(node_name),
                     sequence_num=sequence_number,
@@ -368,6 +376,9 @@ def execute_graph(self) -> None:
                     info_message=f"Running {node_name}",
                     status=ExecStatus.Success.value,
                     end_status=ExecStatus.OK.value,
+                    rows_affected=_rows,
+                    materialization=_mat,
+                    duration_ms=_elapsed_ms,
                 )
                 sequence_number += 1
                 BASE_RESULT.append(base_result)
diff --git a/frontend/src/ide/run-history/RunHistory.css b/frontend/src/ide/run-history/RunHistory.css
index 7e7e8956..8d1267fa 100644
--- a/frontend/src/ide/run-history/RunHistory.css
+++ b/frontend/src/ide/run-history/RunHistory.css
@@ -1,56 +1,119 @@
-/* RunHistory.css */
+/* RunHistory.css — Matches design HTML exactly */
 
 .runhistory-container {
   height: 100%;
   display: flex;
   flex-direction: column;
+  overflow: auto;
 }
 
-.runhistory-title {
-  font-weight: bold;
-  padding: 12px 20px 0;
-}
-
-.runhistory-filters {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 10px 20px;
-}
-
-.runhistory-job-select {
-  width: 240px;
-}
-
-.runhistory-status-select {
-  width: 160px;
-}
-
-.runhistory-job-info {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 0 20px 10px;
+/* ── Header ── */
+.runhistory-header {
+  padding: 20px 24px 8px;
 }
 
+/* ── Table ── */
 .runhistory-table-container {
   flex: 1;
-  padding: 0 20px 20px;
+  padding: 0 24px 24px;
   overflow: auto;
 }
 
-/* Visually bind an expanded error row to its parent run row so the
- * error panel reads as a continuation of that row, not a sibling. */
 .runhistory-table-container .runhistory-row-expanded > td {
   border-bottom-color: transparent !important;
 }
 
 .runhistory-table-container .ant-table-expanded-row > td {
   border-top: 0 !important;
-  padding: 0 !important;
+  padding: 0 8px !important;
   background: transparent !important;
 }
 
 .runhistory-table-container .ant-table-expanded-row:hover > td {
   background: transparent !important;
 }
+
+/* ── Trigger icon circle ── */
+.rh-trigger-icon {
+  width: 22px;
+  height: 22px;
+  border-radius: 50%;
+  background: var(--bg-color-3, rgba(0, 0, 0, 0.05));
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--font-color-3, #8c8c8c);
+}
+
+/* ── Duration bar ── */
+.rh-dur-bar {
+  width: 60px;
+  height: 3px;
+  background: var(--border-color-1, rgba(0, 0, 0, 0.08));
+  border-radius: 2px;
+  overflow: hidden;
+  margin-top: 3px;
+}
+
+.rh-dur-bar-fill {
+  height: 100%;
+  border-radius: 2px;
+}
+
+.rh-dur-bar-fill.fail {
+  background: var(--error-color, #ff4d4f);
+}
+
+.rh-dur-bar-fill.ok {
+  background: var(--success-color, #52c41a);
+}
+
+/* ── Error box (expanded detail) ── */
+.rh-error-box {
+  border-left: 3px solid var(--error-color, #ff4d4f);
+  padding: 12px 14px;
+  background: var(--error-bg, rgba(255, 77, 79, 0.06));
+  border-radius: 6px;
+  margin-bottom: 14px;
+}
+
+.rh-error-box-title {
+  font-weight: 600;
+  color: var(--error-color, #ff4d4f);
+  font-size: 13px;
+  margin-bottom: 8px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.rh-error-msg {
+  font-family: var(--font-family-code, "SF Mono", Consolas, monospace);
+  font-size: 12px;
+  background: var(--bg-color-3, rgba(0, 0, 0, 0.04));
+  padding: 8px 10px;
+  border-radius: 4px;
+  margin-bottom: 8px;
+}
+
+.rh-error-stack {
+  font-family: var(--font-family-code, "SF Mono", Consolas, monospace);
+  font-size: 11px;
+  padding: 8px 10px;
+  background: var(--bg-color-3, rgba(0, 0, 0, 0.04));
+  border-radius: 4px;
+  color: var(--font-color-3, #8c8c8c);
+  line-height: 1.6;
+  max-height: 100px;
+  overflow: auto;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+/* ── Responsive ── */
+@media (max-width: 1000px) {
+  .runhistory-container .ant-row > .ant-col[class*="ant-col-6"] {
+    flex: 0 0 50%;
+    max-width: 50%;
+  }
+}
diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index 2d4cf0a6..5a787397 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -1,6 +1,5 @@
 import { useEffect, useState, useMemo, useCallback, useRef } from "react";
 import {
-  Alert,
   Select,
   Table,
   Tag,
@@ -10,55 +9,105 @@ import {
   Button,
   Space,
   Tooltip,
+  Input,
+  Card,
+  Badge,
+  Row,
+  Col,
+  Timeline,
+  DatePicker,
 } from "antd";
 import {
   ReloadOutlined,
   CalendarOutlined,
-  DatabaseOutlined,
   CheckCircleFilled,
   CloseCircleFilled,
   ClockCircleOutlined,
   SyncOutlined,
+  SearchOutlined,
+  CopyOutlined,
+  EyeOutlined,
+  RedoOutlined,
+  ArrowUpOutlined,
+  ArrowDownOutlined,
+  UserOutlined,
+  EditOutlined,
+  UpOutlined,
+  DownOutlined,
+  MinusOutlined,
 } from "@ant-design/icons";
-import { useSearchParams } from "react-router-dom";
+import { useSearchParams, useNavigate } from "react-router-dom";
 
 import { useAxiosPrivate } from "../../service/axios-service";
 import { orgStore } from "../../store/org-store";
 import { useNotificationService } from "../../service/notification-service";
 import { runHistoryTagColor } from "../../common/constants";
 import { usePagination } from "../../widgets/hooks/usePagination";
-import {
-  getTooltipText,
-  getRelativeTime,
-  formatDateTime,
-} from "../../common/helpers";
+import { getTooltipText, getRelativeTime, formatDateTime } from "../../common/helpers";
 import "./RunHistory.css";
 
-/* ─── Parse duration string to milliseconds for sorting ─── */
-const parseDurationMs = (duration) => {
-  if (!duration) return 0;
-  const parts = duration.split(":");
-  if (parts.length !== 3) return 0;
-  const hours = parseInt(parts[0], 10);
-  const mins = parseInt(parts[1], 10);
-  const secs = parseFloat(parts[2]);
-  const h = hours * 3600;
-  const m = mins * 60;
-  return (h + m + secs) * 1000;
+const { Text, Title } = Typography;
+const { RangePicker } = DatePicker;
+
+/* ── Duration helpers ── */
+const formatDurationMs = (ms) => {
+  if (!ms && ms !== 0) return "—";
+  if (ms < 1000) return `${ms}ms`;
+  if (ms < 60000) return `${(ms / 1000).toFixed(1)}s`;
+  const m = Math.floor(ms / 60000);
+  const s = ((ms % 60000) / 1000).toFixed(0);
+  return `${m}m ${s}s`;
+};
+
+const parseDurationMs = (d) => {
+  if (!d) return 0;
+  if (typeof d === "number") return d;
+  const p = d.split(":");
+  if (p.length !== 3) return 0;
+  return (parseInt(p[0], 10) * 3600 + parseInt(p[1], 10) * 60 + parseFloat(p[2])) * 1000;
+};
+
+/* ── Sparkline SVG — plots real duration data points ── */
+const Sparkline = ({ color = "#3b82f6", data = [] }) => {
+  if (!data || data.length < 2) {
+    // Fallback — flat line
+    return (
+      <svg style={{ width: "100%", height: 28, display: "block" }} viewBox="0 0 100 28" preserveAspectRatio="none">
+        <line x1="0" y1="14" x2="100" y2="14" stroke={color} strokeWidth="1.5" opacity="0.3" />
+      </svg>
+    );
+  }
+  const max = Math.max(...data);
+  const min = Math.min(...data);
+  const range = max - min || 1;
+  const points = data.map((v, i) => {
+    const x = (i / (data.length - 1)) * 100;
+    const y = 26 - ((v - min) / range) * 24; // 2px top padding, 26px range
+    return `${x},${y}`;
+  }).join(" ");
+  return (
+    <svg style={{ width: "100%", height: 28, display: "block" }} viewBox="0 0 100 28" preserveAspectRatio="none">
+      <polyline fill="none" stroke={color} strokeWidth="1.5" points={points} />
+    </svg>
+  );
 };
 
-/* ─── Duration formatter: "HH:MM:SS.sss" → human-readable ─── */
-const formatDuration = (duration) => {
-  if (!duration) return "—";
-  const parts = duration.split(":");
-  if (parts.length !== 3) return duration;
-  const hours = parseInt(parts[0], 10);
-  const mins = parseInt(parts[1], 10);
-  const secs = parseFloat(parts[2]);
-  if (hours > 0) return `${hours}h ${mins}m ${Math.round(secs)}s`;
-  if (mins > 0) return `${mins}m ${secs.toFixed(1)}s`;
-  if (secs >= 1) return `${secs.toFixed(1)}s`;
-  return `${Math.round(secs * 1000)}ms`;
+/* ── StatCard ── */
+const StatCard = ({ label, icon, value, valueColor, subtext, spark }) => {
+  return (
+    <Card size="small" styles={{ body: { padding: 14 } }}>
+      <Space size={4} direction="vertical" style={{ width: "100%" }}>
+        <Text type="secondary" style={{ fontSize: 11, fontWeight: 600, letterSpacing: 0.4, textTransform: "uppercase" }}>
+          {icon}{icon ? " " : ""}{label}
+        </Text>
+        <div style={{ fontSize: 22, fontWeight: 700, lineHeight: 1, color: valueColor, fontVariantNumeric: "tabular-nums" }}>
+          {value}
+        </div>
+        {spark}
+        {subtext && <Text style={{ fontSize: 11, display: "block" }}>{subtext}</Text>}
+      </Space>
+    </Card>
+  );
 };
 
 const STATUS_OPTIONS = [
@@ -69,621 +118,526 @@ const STATUS_OPTIONS = [
   { label: "Revoked", value: "REVOKED" },
 ];
 
-const getRunTriggerScope = (row) => {
-  const kw = row?.kwargs || {};
-  const legacyQuick = kw.source === "quick_deploy";
-  const models = kw.models_override || [];
-  const trigger =
-    row?.trigger || kw.trigger || (legacyQuick ? "manual" : "scheduled");
-  const scope =
-    row?.scope ||
-    kw.scope ||
-    (models.length > 0 || legacyQuick ? "model" : "job");
-  return { trigger, scope, models };
-};
-
 const Runhistory = () => {
   const axios = useAxiosPrivate();
-  const {
-    currentPage,
-    pageSize,
-    totalCount,
-    setTotalCount,
-    setCurrentPage,
-    setPageSize,
-  } = usePagination();
+  const navigate = useNavigate();
+  const { token } = theme.useToken();
+  const { notify } = useNotificationService();
+  const { selectedOrgId } = orgStore();
+  const [searchParams, setSearchParams] = useSearchParams();
+  const { currentPage, pageSize, totalCount, setTotalCount, setCurrentPage, setPageSize } = usePagination();
+
   const [jobListItems, setJobListItems] = useState([]);
-  const [backUpData, setBackUpData] = useState([]);
-  const [JobHistoryData, setJobHistoryData] = useState([]);
+  const [jobHistoryData, setJobHistoryData] = useState([]);
   const [jobSchedule, setJobSchedule] = useState({});
   const [expandedRowKeys, setExpandedRowKeys] = useState([]);
-  const [filterQueries, setFilterQuery] = useState({
-    status: "",
-    job: "",
-    trigger: "",
-    scope: "",
-  });
-
-  const [envInfo, setEnvInfo] = useState({
-    env_type: "",
-    job_name: "",
-    id: "",
-  });
   const [loading, setLoading] = useState(false);
-  const { selectedOrgId } = orgStore();
-  const { token } = theme.useToken();
-  const { notify } = useNotificationService();
-  const [searchParams, setSearchParams] = useSearchParams();
+  const [stats, setStats] = useState(null);
+  const [statsLoading, setStatsLoading] = useState(false);
+  const [filters, setFilters] = useState({ job: "", status: "", trigger: "", search: "" });
+  const [datePreset, setDatePreset] = useState("24h");
+  const [customDateRange, setCustomDateRange] = useState(null);
+  const [showCustomDate, setShowCustomDate] = useState(false);
+  const [envInfo, setEnvInfo] = useState({ env_type: "", job_name: "", id: "", project_id: "" });
+  const deepLinkConsumed = useRef(false);
+  const orgId = selectedOrgId || "default_org";
 
-  /* ─── API calls ─── */
-  const getRunHistoryList = useCallback(
-    async (Id, page = currentPage, limit = pageSize, filters = {}) => {
-      setLoading(true);
-      try {
-        const params = { page, limit };
-        if (filters.status) params.status = filters.status;
-        if (filters.trigger) params.trigger = filters.trigger;
-        if (filters.scope) params.scope = filters.scope;
-        const res = await axios({
-          method: "GET",
-          url: `/api/v1/visitran/${
-            selectedOrgId || "default_org"
-          }/project/_all/jobs/run-history/${Id}`,
-          params,
-        });
-        const { page_items, total_items, current_page } = res.data.data;
-        setTotalCount(total_items);
-        setCurrentPage(current_page);
-        const { env_type, job_name, run_history, id } = page_items;
-        setEnvInfo({ env_type, job_name, id });
-        setJobHistoryData(run_history);
-        setBackUpData(run_history);
-      } catch (error) {
-        notify({ error });
-      } finally {
-        setLoading(false);
-      }
-    },
-    [axios, selectedOrgId, notify]
-  );
+  /* ── APIs ── */
+  const fetchStats = useCallback(async (taskId) => {
+    setStatsLoading(true);
+    try { const res = await axios.get(`/api/v1/visitran/${orgId}/project/_all/jobs/run-stats/${taskId}`); setStats(res.data.data); }
+    catch { setStats(null); }
+    finally { setStatsLoading(false); }
+  }, [axios, orgId]);
 
-  const getJobList = async () => {
+  const fetchHistory = useCallback(async (taskId, page = 1, limit = pageSize, f = filters) => {
     setLoading(true);
     try {
-      const res = await axios({
-        method: "GET",
-        url: `/api/v1/visitran/${
-          selectedOrgId || "default_org"
-        }/project/_all/jobs/list-periodic-tasks`,
-      });
+      const params = { page, limit };
+      if (f.status) params.status = f.status;
+      if (f.trigger) params.trigger = f.trigger;
+      if (f.search) params.search = f.search;
+      // Date filter — preset or custom range
+      if (datePreset === "custom" && customDateRange?.[0]) {
+        params.date_from = customDateRange[0].toISOString();
+        if (customDateRange[1]) params.date_to = customDateRange[1].toISOString();
+      } else if (datePreset && datePreset !== "all") {
+        const now = new Date();
+        const presetMs = { "24h": 86400000, "7d": 604800000, "30d": 2592000000 };
+        if (presetMs[datePreset]) params.date_from = new Date(now - presetMs[datePreset]).toISOString();
+      }
+      const res = await axios.get(`/api/v1/visitran/${orgId}/project/_all/jobs/run-history/${taskId}`, { params });
+      const { page_items, total_items, current_page } = res.data.data;
+      setTotalCount(total_items);
+      setCurrentPage(current_page);
+      setEnvInfo({ env_type: page_items.env_type, job_name: page_items.job_name, id: page_items.id, project_id: page_items.project_id });
+      setJobHistoryData(page_items.run_history || []);
+    } catch (error) { notify({ error }); }
+    finally { setLoading(false); }
+  }, [axios, orgId, pageSize, notify, datePreset, customDateRange]);
+
+  const fetchJobs = async () => {
+    try {
+      const res = await axios.get(`/api/v1/visitran/${orgId}/project/_all/jobs/list-periodic-tasks`);
       const { page_items } = res.data.data;
-      const scheduledObj = {};
-      const jobIds = page_items.map((el) => {
-        const taskDetails = el.periodic_task_details?.[el.task_type];
-        if (taskDetails) {
-          scheduledObj[el.user_task_id] = getTooltipText(
-            taskDetails,
-            el.task_type
-          );
-        }
+      const schedObj = {};
+      const jobs = page_items.map((el) => {
+        const td = el.periodic_task_details?.[el.task_type];
+        if (td) schedObj[el.user_task_id] = getTooltipText(td, el.task_type);
         return { label: el.task_name, value: el.user_task_id };
       });
-      setJobSchedule(scheduledObj);
-      setJobListItems(jobIds);
-      if (jobIds.length) {
-        const taskFromUrl = searchParams.get("task");
-        const taskFromUrlNum = taskFromUrl ? Number(taskFromUrl) : NaN;
-        const matchedFromUrl = !Number.isNaN(taskFromUrlNum)
-          ? jobIds.find((j) => j.value === taskFromUrlNum)
-          : null;
-        const initial = matchedFromUrl?.value ?? jobIds[0].value;
-        setFilterQuery((prev) => ({ ...prev, job: initial }));
+      setJobSchedule(schedObj);
+      setJobListItems(jobs);
+      if (jobs.length) {
+        const fromUrl = searchParams.get("task");
+        const matched = fromUrl ? jobs.find((j) => j.value === Number(fromUrl)) : null;
+        setFilters((p) => ({ ...p, job: matched?.value ?? jobs[0].value }));
       }
-    } catch (error) {
-      console.error("Failed to load jobs", error);
-    } finally {
-      setLoading(false);
-    }
+    } catch (error) { console.error("Failed to load jobs", error); }
   };
 
-  useEffect(() => {
-    getJobList();
-  }, []);
-
-  const deepLinkConsumed = useRef(false);
-
-  /* ─── server-side filtering: refetch when filters change ─── */
-  useEffect(() => {
-    if (!filterQueries.job) return;
-    getRunHistoryList(filterQueries.job, 1, pageSize, {
-      status: filterQueries.status,
-      trigger: filterQueries.trigger,
-      scope: filterQueries.scope,
-    });
-  }, [
-    filterQueries.status,
-    filterQueries.trigger,
-    filterQueries.scope,
-    filterQueries.job,
-  ]);
-
-  /* ─── auto-expand on fresh data load ─── */
-  useEffect(() => {
-    const ids = [];
-    if (
-      !deepLinkConsumed.current &&
-      searchParams.has("task") &&
-      backUpData.length > 0
-    ) {
-      ids.push(backUpData[0].id);
-      deepLinkConsumed.current = true;
-    }
-    (backUpData || [])
-      .filter((r) => r.status === "FAILURE" && r.error_message)
-      .forEach((r) => {
-        if (!ids.includes(r.id)) ids.push(r.id);
-      });
-    setExpandedRowKeys(ids);
-  }, [backUpData]);
-
-  /* ─── handlers ─── */
-  const handleJobChange = useCallback(
-    (value) => {
-      setFilterQuery({ status: "", job: value, trigger: "", scope: "" });
-      setSearchParams(
-        (prev) => {
-          const next = new URLSearchParams(prev);
-          if (value) next.set("task", String(value));
-          else next.delete("task");
-          return next;
-        },
-        { replace: true }
-      );
-    },
-    [setSearchParams]
-  );
+  useEffect(() => { fetchJobs(); }, []);
+  useEffect(() => { if (!filters.job) return; fetchHistory(filters.job, 1, pageSize, filters); fetchStats(filters.job); }, [filters.job, filters.status, filters.trigger, filters.search, datePreset, customDateRange]);
 
-  const handleTriggerChange = useCallback((value) => {
-    setFilterQuery((prev) => ({ ...prev, trigger: value || "" }));
-  }, []);
+  // Don't auto-expand — keep collapsed on load
+  useEffect(() => { setExpandedRowKeys([]); }, [jobHistoryData]);
 
-  const handleScopeChange = useCallback((value) => {
-    setFilterQuery((prev) => ({ ...prev, scope: value || "" }));
-  }, []);
+  const handleFilterChange = (key, value) => {
+    setFilters((p) => ({ ...p, [key]: value || "" }));
+    if (key === "job") setSearchParams((prev) => { const next = new URLSearchParams(prev); if (value) next.set("task", String(value)); else next.delete("task"); return next; }, { replace: true });
+  };
+  const handleRefresh = () => { if (filters.job) { fetchHistory(filters.job, currentPage, pageSize, filters); fetchStats(filters.job); } };
+  const handleRetry = async (taskId) => {
+    try { await axios.post(`/api/v1/visitran/${orgId}/project/_all/jobs/trigger-periodic-task/${taskId}`, {}, { headers: { "X-CSRFToken": document.cookie.match(/csrftoken=([^;]+)/)?.[1] } }); notify({ type: "success", message: "Job submitted" }); setTimeout(handleRefresh, 2000); }
+    catch (error) { notify({ error }); }
+  };
+  const handleCopyError = (text) => { navigator.clipboard.writeText(text); notify({ type: "success", message: "Copied to clipboard" }); };
 
-  const handleStatusChange = useCallback((value) => {
-    setFilterQuery((prev) => ({ ...prev, status: value || "" }));
-  }, []);
+  const activeFilterCount = [filters.status, filters.trigger, filters.search, datePreset !== "24h" ? datePreset : null].filter(Boolean).length;
 
-  const handleRefresh = useCallback(() => {
-    if (filterQueries.job) {
-      getRunHistoryList(filterQueries.job, currentPage, pageSize, {
-        status: filterQueries.status,
-        trigger: filterQueries.trigger,
-        scope: filterQueries.scope,
-      });
-    }
-  }, [filterQueries, currentPage, pageSize, getRunHistoryList]);
-
-  const handlePagination = useCallback(
-    (newPage, newPageSize) => {
-      if (currentPage !== newPage || pageSize !== newPageSize) {
-        setCurrentPage(newPage);
-        setPageSize(newPageSize);
-        getRunHistoryList(filterQueries.job, newPage, newPageSize, {
-          status: filterQueries.status,
-          trigger: filterQueries.trigger,
-          scope: filterQueries.scope,
-        });
-      }
+  /* ── Table columns ── */
+  const columns = useMemo(() => [
+    {
+      title: "Run", dataIndex: "run_number", key: "run_number", width: 70,
+      render: (n) => <Text strong style={{ fontFamily: token.fontFamilyCode || "monospace" }}>#{n || "—"}</Text>,
     },
-    [currentPage, pageSize, filterQueries, getRunHistoryList]
-  );
-
-  const handleExpand = useCallback((expanded, record) => {
-    setExpandedRowKeys((prev) =>
-      expanded ? [...prev, record.id] : prev.filter((k) => k !== record.id)
-    );
-  }, []);
-
-  /* ─── table columns ─── */
-  const columns = useMemo(
-    () => [
-      {
-        title: "Status",
-        dataIndex: "status",
-        key: "status",
-        width: 120,
-        render: (status) => (
-          <Tag color={runHistoryTagColor[status]}>
-            {status === "FAILURE" ? "FAILED" : status}
-          </Tag>
-        ),
+    {
+      title: "Status", dataIndex: "status", key: "status", width: 110,
+      render: (s) => {
+        if (s === "FAILURE") return <Tag icon={<CloseCircleFilled />} color="error">Failed</Tag>;
+        if (s === "SUCCESS") return <Tag icon={<CheckCircleFilled />} color="success">Success</Tag>;
+        if (s === "STARTED" || s === "RUNNING") return <Tag icon={<SyncOutlined spin />} color="processing">Running</Tag>;
+        return <Tag>{s}</Tag>;
       },
-      {
-        title: "Trigger",
-        key: "trigger",
-        width: 120,
-        render: (_, record) => {
-          const { trigger } = getRunTriggerScope(record);
-          return trigger === "manual" ? (
-            <Tag color="blue">Manual</Tag>
-          ) : (
-            <Tag>Scheduled</Tag>
-          );
-        },
+    },
+    {
+      title: "Trigger", key: "trigger", width: 170,
+      render: (_, r) => {
+        const trigger = r.trigger || r.kwargs?.trigger || "scheduled";
+        const user = r.triggered_by;
+        return (
+          <Space size={6}>
+            <span className="rh-trigger-icon"><UserOutlined style={{ fontSize: 11 }} /></span>
+            <Text style={{ fontSize: 13 }}>{trigger === "manual" ? "Manual" : "Scheduled"}{user ? ` · ${user.username}` : ""}</Text>
+          </Space>
+        );
       },
-      {
-        title: "Scope",
-        key: "scope",
-        width: 220,
-        render: (_, record) => {
-          const { scope, models } = getRunTriggerScope(record);
-          if (scope === "model") {
-            return (
-              <Space size={4} wrap>
-                <Tag color="purple">Single model</Tag>
-                {models.length > 0 && (
-                  <Typography.Text type="secondary">
-                    {models.join(", ")}
-                  </Typography.Text>
-                )}
-              </Space>
-            );
-          }
-          return <Typography.Text type="secondary">Full job</Typography.Text>;
-        },
+    },
+    {
+      title: "Scope", key: "scope", width: 150,
+      render: (_, r) => {
+        const scope = r.scope || "job";
+        const count = r.model_count || r.result?.total || 0;
+        const models = r.kwargs?.models_override || [];
+        return (
+          <Space direction="vertical" size={0}>
+            <Text style={{ fontSize: 13 }}>{scope === "model" ? models.join(", ") : "Full job"}</Text>
+            <Text type="secondary" style={{ fontSize: 11, fontFamily: token.fontFamilyCode || "monospace" }}>{count} models</Text>
+          </Space>
+        );
       },
-      {
-        title: "Triggered",
-        dataIndex: "start_time",
-        key: "start_time",
-        sorter: (a, b) => {
-          if (!a.start_time) return -1;
-          if (!b.start_time) return 1;
-          return new Date(a.start_time) - new Date(b.start_time);
-        },
-        defaultSortOrder: "descend",
-        render: (text) => {
-          if (!text) {
-            return (
-              <Typography.Text type="secondary">
-                Not started yet
-              </Typography.Text>
-            );
-          }
-          return (
-            <Tooltip title={new Date(text).toISOString()}>
-              <Space direction="vertical" size={0}>
-                <Typography.Text>{formatDateTime(text)}</Typography.Text>
-                <Typography.Text type="secondary" style={{ fontSize: 11 }}>
-                  {getRelativeTime(text)}
-                </Typography.Text>
-              </Space>
-            </Tooltip>
-          );
-        },
+    },
+    {
+      title: "Changes", key: "changes", width: 200,
+      render: (_, r) => {
+        if (r.status !== "SUCCESS" || !r.result) return <Text type="secondary">—</Text>;
+        const added = r.result?.rows_added ?? null;
+        const modified = r.result?.rows_modified ?? null;
+        const deleted = r.result?.rows_deleted ?? null;
+        if (added === null && modified === null && deleted === null) return <Text type="secondary">—</Text>;
+        return (
+          <Space size={8}>
+            {added !== null && <Text style={{ color: token.colorSuccess, fontSize: 12, fontFamily: token.fontFamilyCode || "monospace" }}>+ +{added.toLocaleString()}</Text>}
+            {modified !== null && <Text style={{ color: token.colorPrimary, fontSize: 12, fontFamily: token.fontFamilyCode || "monospace" }}>✎ ~{modified.toLocaleString()}</Text>}
+            {deleted !== null && <Text style={{ color: token.colorError, fontSize: 12, fontFamily: token.fontFamilyCode || "monospace" }}>⊟ −{deleted.toLocaleString()}</Text>}
+          </Space>
+        );
+      },
+    },
+    {
+      title: "Triggered", dataIndex: "start_time", key: "start_time",
+      sorter: (a, b) => new Date(a.start_time || 0) - new Date(b.start_time || 0),
+      defaultSortOrder: "descend",
+      render: (t) => t ? (
+        <Space direction="vertical" size={0}>
+          <Text style={{ fontSize: 13, fontWeight: 500 }}>{formatDateTime(t)}</Text>
+          <Text type="secondary" style={{ fontSize: 11 }}>{getRelativeTime(t)}</Text>
+        </Space>
+      ) : <Text type="secondary">Not started</Text>,
+    },
+    {
+      title: "Duration", key: "duration", width: 130,
+      sorter: (a, b) => (a.duration_ms || 0) - (b.duration_ms || 0),
+      render: (_, r) => {
+        const ms = r.duration_ms || parseDurationMs(r.duration);
+        const isFail = r.status === "FAILURE";
+        const pct = stats?.expected_duration_ms ? Math.min((ms / stats.expected_duration_ms) * 100, 100) : (isFail ? 70 : 35);
+        return (
+          <div>
+            <Text style={{ fontSize: 13, fontFamily: token.fontFamilyCode || "monospace" }}>{r.duration || formatDurationMs(ms)}</Text>
+            <div className="rh-dur-bar">
+              <div className={`rh-dur-bar-fill ${isFail ? "fail" : "ok"}`} style={{ width: `${pct}%` }} />
+            </div>
+          </div>
+        );
       },
+    },
+    {
+      title: "", key: "actions", width: 50,
+      render: () => <Tooltip title="Retry run"><Button type="text" size="small" icon={<RedoOutlined />} onClick={(e) => { e.stopPropagation(); handleRetry(envInfo.id); }} /></Tooltip>,
+    },
+  ], [stats, envInfo.id]);
+
+  /* ── RunDetail (expanded row) ── */
+  const RunDetail = ({ run }) => {
+    const isFailure = run.status === "FAILURE";
+    const isSuccess = run.status === "SUCCESS";
+    const passed = run.result?.passed || 0;
+    const failed = run.result?.failed || 0;
+    const total = run.result?.total || 0;
+    const skipped = run.skipped_count || Math.max(0, total - passed - failed);
+    const failedModels = run.failed_models || [];
+    const dur = run.duration || formatDurationMs(run.duration_ms);
+    const expected = stats?.expected_duration_ms ? `~${formatDurationMs(stats.expected_duration_ms)}` : null;
+    const errorModelName = failedModels.length > 0 ? failedModels[0] : null;
+    const models = run.result?.models || [];
+
+    // Aggregate row-level changes (from result when available, otherwise —)
+    const totalRowsProcessed = run.result?.rows_processed ?? null;
+    const totalAdded = run.result?.rows_added ?? null;
+    const totalModified = run.result?.rows_modified ?? null;
+    const totalDeleted = run.result?.rows_deleted ?? null;
+
+    // Parse error into message + stack
+    const errorLines = (run.error_message || "").split("\n");
+    const errorMsg = errorLines[0] || "";
+    const errorStack = errorLines.slice(1).join("\n");
+
+    // Per-model table columns for success view
+    const modelColumns = [
       {
-        title: "Duration",
-        dataIndex: "duration",
-        key: "duration",
-        width: 140,
-        sorter: (a, b) => {
-          if (!a.duration) return -1;
-          if (!b.duration) return 1;
-          return parseDurationMs(a.duration) - parseDurationMs(b.duration);
-        },
-        render: (duration) => (
-          <Typography.Text>{formatDuration(duration)}</Typography.Text>
+        title: "Model", dataIndex: "name", key: "name",
+        render: (name, m) => (
+          <Space size={6}>
+            {(m.end_status === "OK" || m.status === "success") ? <CheckCircleFilled style={{ color: token.colorSuccess, fontSize: 13 }} /> : <CloseCircleFilled style={{ color: token.colorError, fontSize: 13 }} />}
+            <Text>{name}</Text>
+            {m.type && <Tag style={{ fontSize: 10, lineHeight: "16px", padding: "0 4px" }}>{m.type}</Tag>}
+          </Space>
         ),
       },
-    ],
-    []
-  );
+      { title: "Rows in", dataIndex: "rows_in", key: "rows_in", width: 90, align: "right", render: (v) => <Text style={{ fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>{v != null ? v.toLocaleString() : "—"}</Text> },
+      { title: "Rows out", dataIndex: "rows_out", key: "rows_out", width: 90, align: "right", render: (v) => <Text style={{ fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>{v != null ? v.toLocaleString() : "—"}</Text> },
+      { title: "Added", dataIndex: "rows_added", key: "rows_added", width: 90, align: "right", render: (v) => v != null ? <Text style={{ color: token.colorSuccess, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>+ +{v.toLocaleString()}</Text> : <Text type="secondary">—</Text> },
+      { title: "Modified", dataIndex: "rows_modified", key: "rows_modified", width: 90, align: "right", render: (v) => v != null ? <Text style={{ color: token.colorPrimary, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>✎ ~{v.toLocaleString()}</Text> : <Text type="secondary">—</Text> },
+      { title: "Deleted", dataIndex: "rows_deleted", key: "rows_deleted", width: 90, align: "right", render: (v) => v != null ? <Text style={{ color: token.colorError, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>⊟ −{v.toLocaleString()}</Text> : <Text type="secondary">—</Text> },
+      { title: "Duration", dataIndex: "duration_ms", key: "duration_ms", width: 90, align: "right", render: (v) => <Text style={{ fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>{v != null ? formatDurationMs(v) : "—"}</Text> },
+    ];
 
-  const STATUS_META = useMemo(
-    () => ({
-      SUCCESS: {
-        icon: <CheckCircleFilled />,
-        label: "Succeeded",
-        color: token.colorSuccess,
-        bg: token.colorSuccessBg,
-      },
-      FAILURE: {
-        icon: <CloseCircleFilled />,
-        label: "Failed",
-        color: token.colorError,
-        bg: token.colorErrorBg,
-      },
-      STARTED: {
-        icon: <SyncOutlined spin />,
-        label: "Running",
-        color: token.colorInfo,
-        bg: token.colorInfoBg,
-      },
-      RUNNING: {
-        icon: <SyncOutlined spin />,
-        label: "Running",
-        color: token.colorInfo,
-        bg: token.colorInfoBg,
-      },
-      RETRY: {
-        icon: <SyncOutlined spin />,
-        label: "Retrying",
-        color: token.colorWarning,
-        bg: token.colorWarningBg,
-      },
-      REVOKED: {
-        icon: <ClockCircleOutlined />,
-        label: "Revoked",
-        color: token.colorTextSecondary,
-        bg: token.colorFillQuaternary,
-      },
-      PENDING: {
-        icon: <ClockCircleOutlined />,
-        label: "Pending",
-        color: token.colorTextSecondary,
-        bg: token.colorFillQuaternary,
-      },
-    }),
-    [token]
-  );
+    return (
+      <Card size="small" styles={{ body: { padding: 16 } }}>
+        {/* Header */}
+        <Row justify="space-between" align="middle" style={{ marginBottom: 14 }}>
+          <Col>
+            <Space>
+              <Text strong>Run #{run.run_number} details</Text>
+              <Text type="secondary" style={{ fontSize: 12 }}>
+                {isFailure ? `failed after ${passed} of ${total} models` : `${total} models built successfully`}
+                {dur !== "—" && ` · ${dur} total runtime`}
+              </Text>
+            </Space>
+          </Col>
+          <Col>
+            <Space>
+              {isSuccess && envInfo.project_id && (
+                <Button size="small" icon={<EyeOutlined />} onClick={() => navigate(`/ide/project/${envInfo.project_id}`)}>View lineage</Button>
+              )}
+              <Button type="primary" icon={<RedoOutlined />} size="small" onClick={() => handleRetry(envInfo.id)}>Re-run</Button>
+            </Space>
+          </Col>
+        </Row>
 
-  /* ─── empty text ─── */
-  const emptyDescription = useMemo(() => {
-    if (!jobListItems.length) return "No jobs created yet";
-    if (!filterQueries.job) return "Select a job to view run history";
-    if (filterQueries.status || filterQueries.trigger || filterQueries.scope)
-      return "No matching runs found";
-    return "No run history available";
-  }, [
-    jobListItems.length,
-    filterQueries.job,
-    filterQueries.status,
-    filterQueries.trigger,
-    filterQueries.scope,
-  ]);
+        {/* Success banner */}
+        {isSuccess && (
+          <div style={{ padding: "10px 14px", background: token.colorSuccessBg, borderRadius: 6, marginBottom: 14, display: "flex", justifyContent: "space-between", alignItems: "center" }}>
+            <Space>
+              <CheckCircleFilled style={{ color: token.colorSuccess, fontSize: 16 }} />
+              <div>
+                <Text strong style={{ color: token.colorSuccess }}>All {total} models built successfully</Text>
+                <br />
+                <Text type="secondary" style={{ fontSize: 12 }}>
+                  {totalRowsProcessed != null ? `${totalRowsProcessed.toLocaleString()} rows processed · ` : ""}{dur} total runtime
+                </Text>
+              </div>
+            </Space>
+            {(totalAdded != null || totalModified != null || totalDeleted != null) && (
+              <Space size={12}>
+                {totalAdded != null && <Text style={{ color: token.colorSuccess, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>+ +{totalAdded.toLocaleString()}</Text>}
+                {totalModified != null && <Text style={{ color: token.colorPrimary, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>✎ ~{totalModified.toLocaleString()}</Text>}
+                {totalDeleted != null && <Text style={{ color: token.colorError, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>⊟ −{totalDeleted.toLocaleString()}</Text>}
+              </Space>
+            )}
+          </div>
+        )}
+
+        {/* Stats grid — different for success vs failure */}
+        {isSuccess ? (
+          <>
+            {/* Row stats cards for success */}
+            <Row gutter={8} style={{ marginBottom: 14 }}>
+              <Col span={6}>
+                <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
+                  <div style={{ fontSize: 11, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.3, color: token.colorTextSecondary, marginBottom: 4 }}>ROWS PROCESSED</div>
+                  <div style={{ fontSize: 18, fontWeight: 700 }}>{totalRowsProcessed != null ? totalRowsProcessed.toLocaleString() : "—"}</div>
+                </Card>
+              </Col>
+              <Col span={6}>
+                <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
+                  <div style={{ fontSize: 11, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.3, color: token.colorTextSecondary, marginBottom: 4 }}>+ ADDED</div>
+                  <div style={{ fontSize: 18, fontWeight: 700, color: token.colorSuccess }}>{totalAdded != null ? `+${totalAdded.toLocaleString()}` : "—"}</div>
+                </Card>
+              </Col>
+              <Col span={6}>
+                <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
+                  <div style={{ fontSize: 11, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.3, color: token.colorTextSecondary, marginBottom: 4 }}>✎ MODIFIED</div>
+                  <div style={{ fontSize: 18, fontWeight: 700, color: token.colorPrimary }}>{totalModified != null ? `~${totalModified.toLocaleString()}` : "—"}</div>
+                </Card>
+              </Col>
+              <Col span={6}>
+                <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
+                  <div style={{ fontSize: 11, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.3, color: token.colorTextSecondary, marginBottom: 4 }}>⊟ DELETED</div>
+                  <div style={{ fontSize: 18, fontWeight: 700, color: token.colorError }}>{totalDeleted != null ? `−${totalDeleted.toLocaleString()}` : "—"}</div>
+                </Card>
+              </Col>
+            </Row>
 
+            {/* Per-model changes table */}
+            {models.length > 0 && (
+              <>
+                <Text strong style={{ fontSize: 11, textTransform: "uppercase", letterSpacing: 0.4, display: "block", marginBottom: 8 }}>Per-model changes</Text>
+                <Table
+                  size="small"
+                  dataSource={models.map((m, i) => ({ ...m, key: i }))}
+                  columns={modelColumns}
+                  pagination={false}
+                  showHeader
+                />
+              </>
+            )}
+          </>
+        ) : (
+          <>
+            {/* Failure stats grid */}
+            <Row gutter={8} style={{ marginBottom: 14 }}>
+              <Col span={6}>
+                <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
+                  <Space><div style={{ fontSize: 18, fontWeight: 700, color: token.colorSuccess }}>{passed}</div><div><div style={{ fontSize: 12, fontWeight: 500 }}>Succeeded</div><Text type="secondary" style={{ fontSize: 11 }}>of {total} total</Text></div></Space>
+                </Card>
+              </Col>
+              <Col span={6}>
+                <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
+                  <Space><div style={{ fontSize: 18, fontWeight: 700, color: failed > 0 ? token.colorError : undefined }}>{failed}</div><div><div style={{ fontSize: 12, fontWeight: 500 }}>Failed</div>{failedModels.length > 0 && <Text type="secondary" style={{ fontSize: 11 }}>{failedModels.join(", ")}</Text>}</div></Space>
+                </Card>
+              </Col>
+              <Col span={6}>
+                <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
+                  <Space><div style={{ fontSize: 18, fontWeight: 700, color: token.colorTextSecondary }}>{skipped}</div><div><div style={{ fontSize: 12, fontWeight: 500 }}>Skipped</div>{skipped > 0 && <Text type="secondary" style={{ fontSize: 11 }}>downstream of fail</Text>}</div></Space>
+                </Card>
+              </Col>
+              <Col span={6}>
+                <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
+                  <Space><div style={{ fontSize: 18, fontWeight: 700 }}>{dur}</div><div><div style={{ fontSize: 12, fontWeight: 500 }}>Runtime</div>{expected && <Text type="secondary" style={{ fontSize: 11 }}>expected {expected}</Text>}</div></Space>
+                </Card>
+              </Col>
+            </Row>
+
+            {/* Error box */}
+            {run.error_message && (
+              <div className="rh-error-box">
+                <div className="rh-error-box-title">
+                  <span><CloseCircleFilled style={{ color: token.colorError, marginRight: 6 }} />Error in {errorModelName || "execution"}</span>
+                  <Space size={4}>
+                    <Button size="small" type="text" icon={<CopyOutlined />} onClick={() => handleCopyError(run.error_message)}>Copy</Button>
+                    <Button size="small" type="text" icon={<EyeOutlined />} onClick={() => envInfo.project_id && navigate(`/ide/project/${envInfo.project_id}`)} disabled={!envInfo.project_id}>View model</Button>
+                  </Space>
+                </div>
+                <div className="rh-error-msg">
+                  {errorModelName && <><strong style={{ color: token.colorError }}>{errorModelName}</strong>{" · "}</>}
+                  {errorMsg.replace(errorModelName ? `${errorModelName} · ` : "", "")}
+                </div>
+                {errorStack && <div className="rh-error-stack">{errorStack}</div>}
+              </div>
+            )}
+
+            {/* Execution Timeline for failures */}
+            <Text strong style={{ fontSize: 11, textTransform: "uppercase", letterSpacing: 0.4 }}>Execution timeline</Text>
+            <Timeline style={{ marginTop: 12 }} items={[
+              { dot: <CheckCircleFilled style={{ color: token.colorSuccess, fontSize: 14 }} />, children: (<Row justify="space-between"><Col><Text>Setup</Text></Col><Col><Text type="secondary" style={{ fontFamily: token.fontFamilyCode || "monospace" }}>—</Text></Col></Row>) },
+              ...models.map((m, i) => {
+                const isOk = m.end_status === "OK" || m.status === "success";
+                const isFail = m.end_status === "FAIL" || m.status === "failure";
+                return {
+                  key: i,
+                  dot: isOk ? <CheckCircleFilled style={{ color: token.colorSuccess, fontSize: 14 }} /> : isFail ? <CloseCircleFilled style={{ color: token.colorError, fontSize: 14 }} /> : <MinusOutlined />,
+                  color: isFail ? "red" : isOk ? "green" : "gray",
+                  children: (<Row justify="space-between"><Col><Text style={{ color: isFail ? token.colorError : undefined, fontWeight: isFail ? 600 : undefined }}>{m.name}</Text></Col><Col><Text type="secondary" style={{ fontFamily: token.fontFamilyCode || "monospace" }}>{m.duration_ms ? formatDurationMs(m.duration_ms) : "—"}</Text></Col></Row>),
+                };
+              }),
+              ...(skipped > 0 ? [{ dot: <MinusOutlined />, color: "gray", children: (<Row justify="space-between"><Col><Text type="secondary">{skipped} downstream models</Text></Col><Col><Text type="secondary" style={{ fontFamily: token.fontFamilyCode || "monospace" }}>skipped</Text></Col></Row>) }] : []),
+            ]} />
+          </>
+        )}
+      </Card>
+    );
+  };
+
+  /* ═══════════════ RENDER ═══════════════ */
   return (
     <div className="runhistory-container">
-      {/* ─── Page Title ─── */}
-      <Typography.Text className="font-size-16 runhistory-title">
-        Run History
-      </Typography.Text>
-
-      {/* ─── Filters ─── */}
-      <div className="runhistory-filters">
-        <Space>
-          <Select
-            showSearch
-            placeholder="Select job"
-            optionFilterProp="label"
-            className="runhistory-job-select"
-            onChange={handleJobChange}
-            options={jobListItems}
-            value={filterQueries.job || undefined}
-          />
-          <Select
-            allowClear
-            placeholder="Status"
-            className="runhistory-status-select"
-            onChange={handleStatusChange}
-            options={STATUS_OPTIONS}
-            value={filterQueries.status || undefined}
-          />
-          <Select
-            allowClear
-            placeholder="Trigger"
-            className="runhistory-status-select"
-            onChange={handleTriggerChange}
-            options={[
-              { label: "Manual", value: "manual" },
-              { label: "Scheduled", value: "scheduled" },
-            ]}
-            value={filterQueries.trigger || undefined}
-          />
-          <Select
-            allowClear
-            placeholder="Scope"
-            className="runhistory-status-select"
-            onChange={handleScopeChange}
-            options={[
-              { label: "Full job", value: "job" },
-              { label: "Single model", value: "model" },
-            ]}
-            value={filterQueries.scope || undefined}
-          />
-        </Space>
-        <Button
-          icon={<ReloadOutlined spin={loading} />}
-          onClick={handleRefresh}
-          disabled={loading}
-        />
+      {/* Header */}
+      <div className="runhistory-header">
+        <Title level={3} style={{ margin: 0 }}>Run History</Title>
+        {filters.job && envInfo.job_name && (
+          <Text type="secondary">All runs for job <strong>{envInfo.job_name}</strong>. Sorted by most recent.</Text>
+        )}
       </div>
 
-      {/* ─── Job Info Banner ─── */}
-      {filterQueries.job && envInfo.job_name && (
-        <div className="runhistory-job-info">
-          <Typography.Text strong>
-            {envInfo.job_name} #{envInfo.id}
-          </Typography.Text>
-          <Space>
-            {envInfo.env_type && (
-              <Tag color="geekblue" icon={<DatabaseOutlined />}>
-                {envInfo.env_type}
-              </Tag>
-            )}
-            {jobSchedule[envInfo.id] && (
-              <Tooltip title={jobSchedule[envInfo.id]}>
-                <Tag color="purple" icon={<CalendarOutlined />}>
-                  SCHEDULED
-                </Tag>
-              </Tooltip>
+      {/* Stats Cards */}
+      {filters.job && (
+        <Row gutter={12} style={{ padding: "12px 24px" }}>
+          <Col span={6}>
+            <StatCard label="Success rate (7d)" icon={<CheckCircleFilled style={{ color: token.colorSuccess }} />}
+              value={statsLoading ? "..." : stats?.success_rate_7d != null ? `${stats.success_rate_7d}%` : "— %"}
+              subtext={!statsLoading && <Text style={{ color: token.colorError, fontSize: 11 }}>{stats?.success_count_7d || 0} of {stats?.total_count_7d || 0} succeeded</Text>}
+            />
+          </Col>
+          <Col span={6}>
+            <StatCard label="Avg duration"
+              value={statsLoading ? "..." : stats?.avg_duration_ms != null ? formatDurationMs(stats.avg_duration_ms) : "—"}
+              spark={<Sparkline color={token.colorPrimary} data={stats?.duration_trend} />}
+            />
+          </Col>
+          <Col span={6}>
+            <StatCard label="Failures (24h)"
+              value={statsLoading ? "..." : stats?.failures_24h ?? 0}
+              valueColor={stats?.failures_24h > 0 ? token.colorError : undefined}
+              subtext={!statsLoading && <Text style={{ color: token.colorError, fontSize: 11 }}>
+                {stats?.failures_change > 0 ? `↑ from ${stats.failures_24h - stats.failures_change} yesterday` : "↑ from 0 yesterday"}
+              </Text>}
+            />
+          </Col>
+          <Col span={6}>
+            <StatCard label="Last successful run"
+              value={statsLoading ? "..." : stats?.last_successful_run ? <span style={{ fontSize: 14, fontWeight: 600 }}>{getRelativeTime(stats.last_successful_run)}</span> : <span style={{ fontSize: 14, fontWeight: 600 }}>Never</span>}
+              subtext={!stats?.last_successful_run && !statsLoading && <Text type="secondary" style={{ fontSize: 11 }}>Since job created</Text>}
+            />
+          </Col>
+        </Row>
+      )}
+
+      {/* Filter bar */}
+      <div style={{ padding: "0 24px 12px" }}>
+        <Card size="small" styles={{ body: { padding: 10 } }}>
+          <Row gutter={[8, 8]} align="middle" wrap>
+            <Col flex="200px"><Input size="small" placeholder="Search runs..." prefix={<SearchOutlined />} value={filters.search} onChange={(e) => handleFilterChange("search", e.target.value)} allowClear /></Col>
+            <Col>
+              <Select size="small" style={{ width: 140 }} value={datePreset}
+                onChange={(v) => { setDatePreset(v); setShowCustomDate(v === "custom"); if (v !== "custom") setCustomDateRange(null); }}
+                options={[
+                  { label: "Last 24 hours", value: "24h" },
+                  { label: "Last 7 days", value: "7d" },
+                  { label: "Last 30 days", value: "30d" },
+                  { label: "All time", value: "all" },
+                  { label: "Custom range", value: "custom" },
+                ]}
+                suffixIcon={<CalendarOutlined />}
+              />
+            </Col>
+            {showCustomDate && (
+              <Col><RangePicker size="small" value={customDateRange} onChange={(dates) => setCustomDateRange(dates)} /></Col>
             )}
-          </Space>
-        </div>
+            <Col><Select size="small" placeholder="Status" style={{ width: 120 }} allowClear value={filters.status || undefined} onChange={(v) => handleFilterChange("status", v)} options={STATUS_OPTIONS} /></Col>
+            <Col><Select size="small" placeholder="Trigger" style={{ width: 120 }} allowClear value={filters.trigger || undefined} onChange={(v) => handleFilterChange("trigger", v)} options={[{ label: "Manual", value: "manual" }, { label: "Scheduled", value: "scheduled" }]} /></Col>
+            <Col><Select size="small" placeholder="Environment" style={{ width: 140 }} allowClear
+              value={envInfo.env_type || undefined}
+              options={envInfo.env_type ? [{ label: envInfo.env_type, value: envInfo.env_type }] : []}
+            /></Col>
+            <Col flex="auto" style={{ textAlign: "right" }}>
+              <Space size={8}>
+                {activeFilterCount > 0 && (
+                  <>
+                    <Badge count={`${activeFilterCount} filter${activeFilterCount > 1 ? "s" : ""}`} style={{ backgroundColor: token.colorPrimary }} />
+                    <Button type="link" size="small" onClick={() => { setFilters((p) => ({ ...p, status: "", trigger: "", search: "" })); setDatePreset("24h"); setCustomDateRange(null); setShowCustomDate(false); }}>Clear</Button>
+                  </>
+                )}
+                <Tooltip title="Refresh"><Button icon={<ReloadOutlined spin={loading} />} size="small" onClick={handleRefresh} /></Tooltip>
+              </Space>
+            </Col>
+          </Row>
+        </Card>
+      </div>
+
+      {/* Job header bar */}
+      {filters.job && envInfo.job_name && (
+        <Row justify="space-between" align="middle" style={{ padding: "4px 24px 12px" }}>
+          <Col><Space><Text strong style={{ fontSize: 14 }}>{envInfo.job_name}</Text><Text type="secondary" style={{ fontSize: 13 }}>· {totalCount} runs</Text></Space></Col>
+          <Col>
+            <Space>
+              {envInfo.env_type && <Tag color="red" style={{ fontWeight: 600 }}>● {envInfo.env_type?.toUpperCase()}</Tag>}
+              {stats?.schedule_enabled && <Tag color="purple" icon={<ClockCircleOutlined />} style={{ fontWeight: 600 }}>SCHEDULED {stats.schedule_label?.toUpperCase() || "DAILY"}</Tag>}
+              <Button type="link" size="small" onClick={() => navigate(`/project/job/list?task=${envInfo.id}`)}>View job →</Button>
+            </Space>
+          </Col>
+        </Row>
       )}
 
-      {/* ─── History Table ─── */}
+      {/* Table */}
       <div className="runhistory-table-container">
         <Table
-          columns={columns}
-          dataSource={JobHistoryData}
           rowKey="id"
+          columns={columns}
+          dataSource={jobHistoryData}
           loading={loading}
-          size="small"
-          bordered
-          rowClassName={(record) =>
-            expandedRowKeys.includes(record.id) ? "runhistory-row-expanded" : ""
-          }
-          onRow={(record) =>
-            expandedRowKeys.includes(record.id)
-              ? {
-                  style: {
-                    boxShadow: `inset 3px 0 0 0 ${token.colorError}`,
-                  },
-                }
-              : {}
-          }
+          size="middle"
           expandable={{
-            expandedRowRender: (record) => {
-              const meta = STATUS_META[record.status] || STATUS_META.PENDING;
-              const { scope, models } = getRunTriggerScope(record);
-              const isFailure = record.status === "FAILURE";
-              return (
-                <div
-                  style={{
-                    borderLeft: `3px solid ${meta.color}`,
-                    padding: "10px 12px",
-                    background: meta.bg,
-                  }}
-                >
-                  <div
-                    style={{
-                      display: "flex",
-                      alignItems: "center",
-                      gap: 8,
-                      marginBottom: 8,
-                    }}
-                  >
-                    <span style={{ color: meta.color }}>{meta.icon}</span>
-                    <Typography.Text strong style={{ color: meta.color }}>
-                      {meta.label}
-                    </Typography.Text>
-                    {record.start_time && (
-                      <Tooltip
-                        title={new Date(record.start_time).toISOString()}
-                      >
-                        <Typography.Text
-                          type="secondary"
-                          style={{ fontSize: 12 }}
-                        >
-                          · {formatDateTime(record.start_time)} (
-                          {getRelativeTime(record.start_time)})
-                        </Typography.Text>
-                      </Tooltip>
-                    )}
-                    {record.duration && (
-                      <Typography.Text
-                        type="secondary"
-                        style={{ fontSize: 12 }}
-                      >
-                        · {formatDuration(record.duration)}
-                      </Typography.Text>
-                    )}
-                  </div>
-                  <Space
-                    size={8}
-                    wrap
-                    style={{ marginBottom: isFailure ? 8 : 0 }}
-                  >
-                    <Tag color={scope === "model" ? "purple" : "default"}>
-                      {scope === "model" ? "Single model" : "Full job"}
-                    </Tag>
-                    <Typography.Text type="secondary" style={{ fontSize: 12 }}>
-                      {models.length > 0
-                        ? `Models attempted: ${models.join(", ")}`
-                        : "No model configuration recorded for this run."}
-                    </Typography.Text>
-                  </Space>
-                  {record.result?.total > 0 && (
-                    <div
-                      style={{
-                        display: "flex",
-                        gap: 16,
-                        margin: "8px 0",
-                        padding: "8px 12px",
-                        background: token.colorFillQuaternary,
-                        borderRadius: token.borderRadiusLG,
-                        fontSize: 12,
-                      }}
-                    >
-                      <span>
-                        <strong>{record.result.total || 0}</strong> models
-                        attempted
-                      </span>
-                      <span style={{ color: token.colorSuccess }}>
-                        <strong>{record.result.passed || 0}</strong> passed
-                      </span>
-                      <span style={{ color: token.colorError }}>
-                        <strong>{record.result.failed || 0}</strong> failed
-                      </span>
-                      {record.result.models?.length > 0 && (
-                        <span style={{ color: token.colorTextSecondary }}>
-                          {record.result.models
-                            .map((m) => `${m.name} (${m.end_status})`)
-                            .join(", ")}
-                        </span>
-                      )}
-                    </div>
-                  )}
-                  {isFailure && record.error_message && (
-                    <Alert
-                      type="error"
-                      showIcon={false}
-                      message={
-                        <pre
-                          style={{
-                            margin: 0,
-                            maxHeight: 240,
-                            overflow: "auto",
-                            whiteSpace: "pre-wrap",
-                            wordBreak: "break-word",
-                            fontFamily: token.fontFamilyCode,
-                            fontSize: 12,
-                          }}
-                        >
-                          {record.error_message}
-                        </pre>
-                      }
-                    />
-                  )}
-                </div>
-              );
-            },
-            rowExpandable: (record) =>
-              ["SUCCESS", "FAILURE", "RETRY", "REVOKED"].includes(
-                record.status
-              ),
             expandedRowKeys,
-            onExpand: handleExpand,
-          }}
-          locale={{
-            emptyText: (
-              <Empty
-                image={Empty.PRESENTED_IMAGE_SIMPLE}
-                description={emptyDescription}
-              />
+            onExpandedRowsChange: (keys) => setExpandedRowKeys([...keys]),
+            expandedRowRender: (record) => <RunDetail run={record} />,
+            expandRowByClick: false,
+            expandIcon: ({ expanded, onExpand, record }) => (
+              ["SUCCESS", "FAILURE", "RETRY", "REVOKED"].includes(record.status) ? (
+                <Button type="text" size="small" icon={expanded ? <UpOutlined /> : <DownOutlined />} onClick={(e) => onExpand(record, e)} />
+              ) : null
             ),
           }}
+          locale={{ emptyText: <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description={!jobListItems.length ? "No jobs created yet" : !filters.job ? "Select a job" : "No matching runs"} /> }}
           pagination={{
             current: currentPage,
             pageSize,
             total: Math.min(totalCount, 1000),
-            showTotal: (total, range) => `${range[0]}-${range[1]} of ${total}`,
+            showTotal: (t, r) => `Showing ${r[0]}–${r[1]} of ${t} runs`,
             showSizeChanger: true,
-            onChange: handlePagination,
+            pageSizeOptions: ["10", "20", "50"],
+            onChange: (p, s) => { setCurrentPage(p); setPageSize(s); fetchHistory(filters.job, p, s, filters); },
           }}
         />
       </div>

From 599c6a416912f89f063a5bf67ed836afea365c11 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Thu, 23 Apr 2026 16:03:05 +0530
Subject: [PATCH 02/19] feat: per-adapter row count capture with
 insert/update/delete breakdown

ExecutionMetrics now includes rows_inserted, rows_updated, rows_deleted
in addition to rows_affected. Each adapter's upsert method captures
cursor.rowcount and returns it to the pipeline.

Adapter changes:
- Postgres: cursor.rowcount from INSERT...ON CONFLICT
- Snowflake: cursor.rowcount from MERGE INTO
- BigQuery: fallback to get_table_row_count (bulk_execute no cursor)
- Databricks: cursor.rowcount from Delta MERGE INTO
- Trino: separate counts from DELETE + INSERT cursors
- DuckDB: no upsert, generic fallback
- TABLE materialization: all rows = inserted, 0 updated, 0 deleted

Pipeline:
- BaseResult gains rows_inserted, rows_updated, rows_deleted fields
- execute_graph() extracts breakdown from ExecutionMetrics
- celery_tasks.py serializes per-model + aggregate totals
---
 .../backend/core/scheduler/celery_tasks.py    | 13 ++++++++-
 .../visitran/adapters/bigquery/connection.py  | 12 ++------
 backend/visitran/adapters/bigquery/model.py   |  4 ++-
 .../adapters/databricks/connection.py         | 17 +++--------
 backend/visitran/adapters/databricks/model.py |  4 ++-
 backend/visitran/adapters/model.py            | 24 +++++++++++++--
 .../visitran/adapters/postgres/connection.py  | 14 +++++++--
 backend/visitran/adapters/postgres/model.py   |  4 ++-
 .../visitran/adapters/snowflake/connection.py | 16 +++++-----
 backend/visitran/adapters/snowflake/model.py  |  4 ++-
 backend/visitran/adapters/trino/connection.py | 29 ++++++++++++-------
 backend/visitran/adapters/trino/model.py      |  4 ++-
 backend/visitran/events/printer.py            |  3 ++
 backend/visitran/visitran.py                  |  8 ++++-
 14 files changed, 104 insertions(+), 52 deletions(-)

diff --git a/backend/backend/core/scheduler/celery_tasks.py b/backend/backend/core/scheduler/celery_tasks.py
index 66b539e0..e7afbd28 100644
--- a/backend/backend/core/scheduler/celery_tasks.py
+++ b/backend/backend/core/scheduler/celery_tasks.py
@@ -354,7 +354,6 @@ def _clean_name(raw):
                 r for r in results_snapshot
                 if not _clean_name(r.node_name).startswith("Source")
             ]
-            total_rows = 0
             run.result = {
                 "models": [
                     {
@@ -363,6 +362,9 @@ def _clean_name(raw):
                         "end_status": r.end_status,
                         "sequence": r.sequence_num,
                         "rows_affected": getattr(r, "rows_affected", None),
+                        "rows_inserted": getattr(r, "rows_inserted", None),
+                        "rows_updated": getattr(r, "rows_updated", None),
+                        "rows_deleted": getattr(r, "rows_deleted", None),
                         "type": getattr(r, "materialization", "") or "",
                         "duration_ms": getattr(r, "duration_ms", None),
                     }
@@ -374,6 +376,15 @@ def _clean_name(raw):
                 "rows_processed": sum(
                     getattr(r, "rows_affected", 0) or 0 for r in user_results
                 ) or None,
+                "rows_added": sum(
+                    getattr(r, "rows_inserted", 0) or 0 for r in user_results
+                ) or None,
+                "rows_modified": sum(
+                    getattr(r, "rows_updated", 0) or 0 for r in user_results
+                ) or None,
+                "rows_deleted": sum(
+                    getattr(r, "rows_deleted", 0) or 0 for r in user_results
+                ) or None,
             }
         except Exception:
             _clear_base_result()
diff --git a/backend/visitran/adapters/bigquery/connection.py b/backend/visitran/adapters/bigquery/connection.py
index 6b45997f..ac903afd 100644
--- a/backend/visitran/adapters/bigquery/connection.py
+++ b/backend/visitran/adapters/bigquery/connection.py
@@ -269,16 +269,9 @@ def merge_into_table(
         target_table_name: str,
         select_statement: Table,
         primary_key: Union[str, list[str]] = None,
-    ) -> None:
+    ) -> dict:
         """Efficient upsert using DELETE + INSERT for BigQuery.
-
-        This approach is more efficient than MERGE for BigQuery because:
-        1. BigQuery is optimized for bulk operations
-        2. DELETE + INSERT performs better than UPDATE operations
-        3. Works better with BigQuery's partitioning strategy
-
-        Args:
-            primary_key: Can be a single column name (str) or list of column names for composite keys
+        Returns dict with rows_affected.
         """
         try:
             fire_event(
@@ -378,6 +371,7 @@ def merge_into_table(
             raise Exception(
                 f"BigQuery incremental upsert failed for {schema_name}.{target_table_name}: {str(e)}"
             ) from e
+        return {"rows_affected": None}  # BigQuery: fallback to get_table_row_count in BaseModel
 
 
 
diff --git a/backend/visitran/adapters/bigquery/model.py b/backend/visitran/adapters/bigquery/model.py
index c9d3f4e7..471fba21 100644
--- a/backend/visitran/adapters/bigquery/model.py
+++ b/backend/visitran/adapters/bigquery/model.py
@@ -92,12 +92,14 @@ def execute_incremental(self) -> None:
                 # Get primary key from model if available
                 primary_key = getattr(self.model, 'primary_key', None)
 
-                self.db_connection.merge_into_table(
+                result = self.db_connection.merge_into_table(
                     schema_name=self.model.destination_schema_name,
                     target_table_name=self.model.destination_table_name,
                     select_statement=self.model.select_statement,
                     primary_key=primary_key,
                 )
+                if result and isinstance(result, dict):
+                    self._upsert_metrics = result
         else:
             fire_event(
                 ExecuteIncrementalCreate(
diff --git a/backend/visitran/adapters/databricks/connection.py b/backend/visitran/adapters/databricks/connection.py
index 3ca70f8a..07bea9f0 100644
--- a/backend/visitran/adapters/databricks/connection.py
+++ b/backend/visitran/adapters/databricks/connection.py
@@ -224,20 +224,9 @@ def upsert_into_table(
         table_name: str,
         select_statement: "Table",
         primary_key: Union[str, list[str]],
-    ) -> None:
+    ) -> dict:
         """Efficient upsert using Databricks Delta Lake's MERGE INTO statement.
-
-        This approach is optimal for Databricks because:
-        1. Delta Lake natively supports MERGE INTO with ACID guarantees
-        2. Atomic operation with automatic conflict resolution
-        3. Handles both single and composite keys efficiently
-        4. Leverages Delta Lake's optimized merge implementation
-
-        Args:
-            schema_name: Target schema/database name
-            table_name: Target table name
-            select_statement: Ibis table expression with incremental data
-            primary_key: Column(s) to match for upsert (single string or list)
+        Returns dict with rows_affected from cursor.rowcount.
         """
         # Handle both single column and composite keys
         if isinstance(primary_key, str):
@@ -287,6 +276,7 @@ def upsert_into_table(
             """
 
             cursor = self.connection.raw_sql(merge_query)
+            rowcount = cursor.rowcount if hasattr(cursor, "rowcount") else None
             cursor.close()
             logging.info("Databricks MERGE completed for %s.%s", schema_name, table_name)
 
@@ -302,3 +292,4 @@ def upsert_into_table(
                 cursor.close()
             except Exception:
                 pass
+        return {"rows_affected": rowcount if 'rowcount' in dir() else None}
diff --git a/backend/visitran/adapters/databricks/model.py b/backend/visitran/adapters/databricks/model.py
index 24e7371e..bc3ba41a 100644
--- a/backend/visitran/adapters/databricks/model.py
+++ b/backend/visitran/adapters/databricks/model.py
@@ -96,12 +96,14 @@ def execute_incremental(self) -> None:
             if primary_key:
                 # MERGE mode: Upsert with primary key (updates existing, inserts new)
                 logging.info(f"Incremental MERGE mode: upserting with primary_key={primary_key}")
-                self.db_connection.upsert_into_table(
+                result = self.db_connection.upsert_into_table(
                     schema_name=self.model.destination_schema_name,
                     table_name=self.model.destination_table_name,
                     select_statement=self.model.select_statement,
                     primary_key=primary_key,
                 )
+                if result and isinstance(result, dict):
+                    self._upsert_metrics = result
             else:
                 # APPEND mode: Insert-only, no deduplication (for event logs, time-series)
                 logging.info("Incremental APPEND mode: inserting without deduplication")
diff --git a/backend/visitran/adapters/model.py b/backend/visitran/adapters/model.py
index 13bad528..79595b18 100644
--- a/backend/visitran/adapters/model.py
+++ b/backend/visitran/adapters/model.py
@@ -14,6 +14,9 @@
 class ExecutionMetrics:
     """Metrics returned from model execution."""
     rows_affected: Optional[int] = None
+    rows_inserted: Optional[int] = None
+    rows_updated: Optional[int] = None
+    rows_deleted: Optional[int] = None
     materialization: str = ""
 
 
@@ -25,6 +28,7 @@ def __init__(self, db_connection: BaseConnection, model: VisitranModel) -> None:
         self._model: VisitranModel = model
 
         self._statements: list[Any] = []
+        self._upsert_metrics: Optional[dict] = None  # Populated by adapter's execute_incremental
 
     @property
     def model(self) -> VisitranModel:
@@ -45,9 +49,15 @@ def execute(self) -> ExecutionMetrics:
 
         if self.materialization == Materialization.TABLE:
             self.execute_table()
-            # Get row count after table creation
+            # Get row count after table creation — all rows are "inserted" (DROP + CREATE)
             rows = self._get_row_count_safe()
-            return ExecutionMetrics(rows_affected=rows, materialization="table")
+            return ExecutionMetrics(
+                rows_affected=rows,
+                rows_inserted=rows,
+                rows_updated=0,
+                rows_deleted=0,
+                materialization="table",
+            )
 
         elif self.materialization == Materialization.VIEW:
             self.execute_view()
@@ -56,7 +66,15 @@ def execute(self) -> ExecutionMetrics:
         elif self.materialization == Materialization.INCREMENTAL:
             self.execute_incremental()
             rows = self._get_row_count_safe()
-            return ExecutionMetrics(rows_affected=rows, materialization="incremental")
+            # Use upsert metrics if available (adapter captured cursor.rowcount)
+            upsert = self._upsert_metrics or {}
+            return ExecutionMetrics(
+                rows_affected=rows,
+                rows_inserted=upsert.get("rows_inserted"),
+                rows_updated=upsert.get("rows_updated"),
+                rows_deleted=upsert.get("rows_deleted"),
+                materialization="incremental",
+            )
 
         return ExecutionMetrics(materialization=mat_name)
 
diff --git a/backend/visitran/adapters/postgres/connection.py b/backend/visitran/adapters/postgres/connection.py
index beebff60..17dffded 100644
--- a/backend/visitran/adapters/postgres/connection.py
+++ b/backend/visitran/adapters/postgres/connection.py
@@ -204,7 +204,7 @@ def upsert_into_table(
         table_name: str,
         select_statement: "Table",
         primary_key: Union[str, list[str]],
-    ) -> None:
+    ) -> dict:
         """Efficient upsert using PostgreSQL's INSERT ... ON CONFLICT.
 
         This approach is optimal for PostgreSQL because:
@@ -212,6 +212,8 @@ def upsert_into_table(
         2. No temporary tables needed
         3. Atomic operation
         4. Better performance than MERGE for PostgreSQL
+
+        Returns dict with rows_affected from cursor.rowcount.
         """
 
         # Handle both single column and composite keys
@@ -255,8 +257,14 @@ def upsert_into_table(
             DO UPDATE SET {update_set_clause}
         """
 
-        # Execute the upsert
-        self.connection.raw_sql(upsert_query)
+        # Execute the upsert and capture rowcount
+        cursor = self.connection.raw_sql(upsert_query)
+        rowcount = cursor.rowcount if hasattr(cursor, "rowcount") else None
+        try:
+            cursor.close()
+        except Exception:
+            pass
+        return {"rows_affected": rowcount}
 
 
 
diff --git a/backend/visitran/adapters/postgres/model.py b/backend/visitran/adapters/postgres/model.py
index d0abc944..ab681907 100644
--- a/backend/visitran/adapters/postgres/model.py
+++ b/backend/visitran/adapters/postgres/model.py
@@ -85,12 +85,14 @@ def execute_incremental(self) -> None:
                 if primary_key:
                     # MERGE mode: Upsert with primary key (updates existing, inserts new)
                     logging.info(f"Incremental MERGE mode: upserting with primary_key={primary_key}")
-                    self.db_connection.upsert_into_table(
+                    result = self.db_connection.upsert_into_table(
                         schema_name=self.model.destination_schema_name,
                         table_name=self.model.destination_table_name,
                         select_statement=self.model.select_statement,
                         primary_key=primary_key,
                     )
+                    if result and isinstance(result, dict):
+                        self._upsert_metrics = result
                 else:
                     # APPEND mode: Insert-only, no deduplication (for event logs, time-series)
                     logging.info("Incremental APPEND mode: inserting without deduplication")
diff --git a/backend/visitran/adapters/snowflake/connection.py b/backend/visitran/adapters/snowflake/connection.py
index d9df64bc..a0d02076 100644
--- a/backend/visitran/adapters/snowflake/connection.py
+++ b/backend/visitran/adapters/snowflake/connection.py
@@ -279,14 +279,10 @@ def upsert_into_table(
         table_name: str,
         select_statement: "Table",
         primary_key: Union[str, list[str]],
-    ) -> None:
+    ) -> dict:
         """Efficient upsert using Snowflake's MERGE INTO statement.
 
-        This approach is optimal for Snowflake because:
-        1. MERGE INTO is natively supported and optimized
-        2. Atomic operation with ACID properties
-        3. Handles both single and composite keys efficiently
-        4. Better performance than separate DELETE + INSERT
+        Returns dict with rows_affected from cursor.rowcount.
         """
         # Handle both single column and composite keys
         if isinstance(primary_key, str):
@@ -330,7 +326,12 @@ def upsert_into_table(
                     VALUES ({insert_values})
             """
 
-            self.connection.raw_sql(merge_query)
+            cursor = self.connection.raw_sql(merge_query)
+            rowcount = cursor.rowcount if hasattr(cursor, "rowcount") else None
+            try:
+                cursor.close()
+            except Exception:
+                pass
 
         except Exception as e:
             logging.error(f"Snowflake upsert failed for {schema_name}.{table_name}: {str(e)}")
@@ -341,3 +342,4 @@ def upsert_into_table(
                 self.connection.raw_sql(f"DROP TABLE IF EXISTS {qi(schema_name)}.{qi(temp_table_name)}")
             except Exception:
                 pass  # Ignore cleanup errors
+        return {"rows_affected": rowcount if 'rowcount' in dir() else None}
diff --git a/backend/visitran/adapters/snowflake/model.py b/backend/visitran/adapters/snowflake/model.py
index 3018f145..f98c51a4 100644
--- a/backend/visitran/adapters/snowflake/model.py
+++ b/backend/visitran/adapters/snowflake/model.py
@@ -88,12 +88,14 @@ def execute_incremental(self) -> None:
             if primary_key:
                 # MERGE mode: Upsert with primary key (updates existing, inserts new)
                 logging.info(f"Incremental MERGE mode: upserting with primary_key={primary_key}")
-                self.db_connection.upsert_into_table(
+                result = self.db_connection.upsert_into_table(
                     schema_name=self.model.destination_schema_name,
                     table_name=self.model.destination_table_name,
                     select_statement=self.model.select_statement,
                     primary_key=primary_key,
                 )
+                if result and isinstance(result, dict):
+                    self._upsert_metrics = result
             else:
                 # APPEND mode: Insert-only, no deduplication (for event logs, time-series)
                 logging.info("Incremental APPEND mode: inserting without deduplication")
diff --git a/backend/visitran/adapters/trino/connection.py b/backend/visitran/adapters/trino/connection.py
index 0ad9f9eb..94412a8a 100644
--- a/backend/visitran/adapters/trino/connection.py
+++ b/backend/visitran/adapters/trino/connection.py
@@ -147,15 +147,9 @@ def upsert_into_table(
         table_name: str,
         select_statement: "Table",
         primary_key: Union[str, list[str]],
-    ) -> None:
+    ) -> dict:
         """Efficient upsert using DELETE + INSERT strategy for Trino.
-
-        Notes:
-        - MERGE can be expensive in Trino due to full joins. We avoid it.
-        - When a primary_key is provided (single or composite), we perform:
-          1) DELETE matching rows in target
-          2) INSERT all rows from the temp incremental table
-        - Without a primary_key we fall back to simple INSERT (may create duplicates).
+        Returns dict with rows_deleted and rows_inserted from cursors.
         """
         # Normalize primary key(s)
         if isinstance(primary_key, str):
@@ -187,7 +181,12 @@ def upsert_into_table(
                         WHERE {where_clause}
                     )
                 """
-                self.connection.raw_sql(delete_sql)
+                del_cursor = self.connection.raw_sql(delete_sql)
+                deleted = del_cursor.rowcount if hasattr(del_cursor, "rowcount") else None
+                try:
+                    del_cursor.close()
+                except Exception:
+                    pass
 
             # 2b. INSERT all rows from temp (includes new/updated)
             insert_cols = ", ".join([qi(c) for c in target_columns])
@@ -196,7 +195,12 @@ def upsert_into_table(
                 SELECT {insert_cols}
                 FROM {qi(schema_name)}.{qi(temp_table_name)}
             """
-            self.connection.raw_sql(insert_sql)
+            ins_cursor = self.connection.raw_sql(insert_sql)
+            inserted = ins_cursor.rowcount if hasattr(ins_cursor, "rowcount") else None
+            try:
+                ins_cursor.close()
+            except Exception:
+                pass
 
         except Exception as e:
             logging.error(f"Trino upsert (DELETE+INSERT) failed for {schema_name}.{table_name}: {str(e)}")
@@ -209,3 +213,8 @@ def upsert_into_table(
                 self.connection.raw_sql(f"DROP TABLE IF EXISTS {qi(schema_name)}.{qi(temp_table_name)}")
             except Exception:
                 pass
+        return {
+            "rows_affected": (inserted or 0) + (deleted or 0) if 'inserted' in dir() else None,
+            "rows_inserted": inserted if 'inserted' in dir() else None,
+            "rows_deleted": deleted if 'deleted' in dir() else None,
+        }
diff --git a/backend/visitran/adapters/trino/model.py b/backend/visitran/adapters/trino/model.py
index c7b045e9..ffb55edf 100644
--- a/backend/visitran/adapters/trino/model.py
+++ b/backend/visitran/adapters/trino/model.py
@@ -84,12 +84,14 @@ def execute_incremental(self) -> None:
                 if primary_key:
                     # MERGE mode: Upsert with primary key (updates existing, inserts new)
                     logging.info(f"Incremental MERGE mode: upserting with primary_key={primary_key}")
-                    self.db_connection.upsert_into_table(
+                    result = self.db_connection.upsert_into_table(
                         schema_name=self.model.destination_schema_name,
                         table_name=self.model.destination_table_name,
                         select_statement=self.model.select_statement,
                         primary_key=primary_key,
                     )
+                    if result and isinstance(result, dict):
+                        self._upsert_metrics = result
                 else:
                     # APPEND mode: Insert-only, no deduplication (for event logs, time-series)
                     logging.info("Incremental APPEND mode: inserting without deduplication")
diff --git a/backend/visitran/events/printer.py b/backend/visitran/events/printer.py
index 5ba1b434..79000fad 100644
--- a/backend/visitran/events/printer.py
+++ b/backend/visitran/events/printer.py
@@ -28,6 +28,9 @@ class BaseResult:
     sequence_num: int
     end_status: str
     rows_affected: int | None = None
+    rows_inserted: int | None = None
+    rows_updated: int | None = None
+    rows_deleted: int | None = None
     materialization: str = ""
     duration_ms: int | None = None
 
diff --git a/backend/visitran/visitran.py b/backend/visitran/visitran.py
index e2f2122f..57908b45 100644
--- a/backend/visitran/visitran.py
+++ b/backend/visitran/visitran.py
@@ -362,10 +362,13 @@ def execute_graph(self) -> None:
                 )
 
                 # Extract row count from execution metrics
-                _rows = None
+                _rows = _rows_ins = _rows_upd = _rows_del = None
                 _mat = ""
                 if exec_metrics is not None:
                     _rows = getattr(exec_metrics, "rows_affected", None)
+                    _rows_ins = getattr(exec_metrics, "rows_inserted", None)
+                    _rows_upd = getattr(exec_metrics, "rows_updated", None)
+                    _rows_del = getattr(exec_metrics, "rows_deleted", None)
                     _mat = getattr(exec_metrics, "materialization", "")
 
                 base_result = BaseResult(
@@ -377,6 +380,9 @@ def execute_graph(self) -> None:
                     status=ExecStatus.Success.value,
                     end_status=ExecStatus.OK.value,
                     rows_affected=_rows,
+                    rows_inserted=_rows_ins,
+                    rows_updated=_rows_upd,
+                    rows_deleted=_rows_del,
                     materialization=_mat,
                     duration_ms=_elapsed_ms,
                 )

From 8dff116669ef277cbc7ecd985a846cf12efcf737 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Thu, 23 Apr 2026 17:07:49 +0530
Subject: [PATCH 03/19] fix: exclude ephemeral models from counts, avatar
 trigger, color fixes

- Filter ephemeral models from: total count, passed/failed/skipped,
  rows processed/added/modified/deleted, scope model count, changes column,
  per-model table, execution timeline
- Success rate subtext: green (100%), warning (partial), red (0%)
- Failures subtext: green "No failures" when 0, red only when failures exist
- StatCard equal height (height: 100%)
- Trigger column: 2-letter Avatar instead of user icon
---
 frontend/src/ide/run-history/Runhistory.jsx | 53 ++++++++++++---------
 1 file changed, 30 insertions(+), 23 deletions(-)

diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index 5a787397..5d84e2e0 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -12,6 +12,7 @@ import {
   Input,
   Card,
   Badge,
+  Avatar,
   Row,
   Col,
   Timeline,
@@ -95,7 +96,7 @@ const Sparkline = ({ color = "#3b82f6", data = [] }) => {
 /* ── StatCard ── */
 const StatCard = ({ label, icon, value, valueColor, subtext, spark }) => {
   return (
-    <Card size="small" styles={{ body: { padding: 14 } }}>
+    <Card size="small" style={{ height: "100%" }} styles={{ body: { padding: 14, height: "100%" } }}>
       <Space size={4} direction="vertical" style={{ width: "100%" }}>
         <Text type="secondary" style={{ fontSize: 11, fontWeight: 600, letterSpacing: 0.4, textTransform: "uppercase" }}>
           {icon}{icon ? " " : ""}{label}
@@ -235,10 +236,11 @@ const Runhistory = () => {
       render: (_, r) => {
         const trigger = r.trigger || r.kwargs?.trigger || "scheduled";
         const user = r.triggered_by;
+        const initials = user?.username ? user.username.slice(0, 2).toUpperCase() : trigger === "manual" ? "M" : "S";
         return (
           <Space size={6}>
-            <span className="rh-trigger-icon"><UserOutlined style={{ fontSize: 11 }} /></span>
-            <Text style={{ fontSize: 13 }}>{trigger === "manual" ? "Manual" : "Scheduled"}{user ? ` · ${user.username}` : ""}</Text>
+            <Avatar size={22} style={{ fontSize: 10, backgroundColor: token.colorPrimary }}>{initials}</Avatar>
+            <Text style={{ fontSize: 13 }}>{trigger === "manual" ? "Manual" : "Schedule"}{user ? ` · ${user.username}` : ""}</Text>
           </Space>
         );
       },
@@ -247,7 +249,7 @@ const Runhistory = () => {
       title: "Scope", key: "scope", width: 150,
       render: (_, r) => {
         const scope = r.scope || "job";
-        const count = r.model_count || r.result?.total || 0;
+        const count = (r.result?.models || []).filter((m) => m.type !== "ephemeral").length || r.model_count || 0;
         const models = r.kwargs?.models_override || [];
         return (
           <Space direction="vertical" size={0}>
@@ -261,9 +263,10 @@ const Runhistory = () => {
       title: "Changes", key: "changes", width: 200,
       render: (_, r) => {
         if (r.status !== "SUCCESS" || !r.result) return <Text type="secondary">—</Text>;
-        const added = r.result?.rows_added ?? null;
-        const modified = r.result?.rows_modified ?? null;
-        const deleted = r.result?.rows_deleted ?? null;
+        const nonEph = (r.result?.models || []).filter((m) => m.type !== "ephemeral");
+        const added = nonEph.reduce((s, m) => s + (m.rows_inserted || 0), 0) || null;
+        const modified = nonEph.reduce((s, m) => s + (m.rows_updated || 0), 0) || null;
+        const deleted = nonEph.reduce((s, m) => s + (m.rows_deleted || 0), 0) || null;
         if (added === null && modified === null && deleted === null) return <Text type="secondary">—</Text>;
         return (
           <Space size={8}>
@@ -312,21 +315,25 @@ const Runhistory = () => {
   const RunDetail = ({ run }) => {
     const isFailure = run.status === "FAILURE";
     const isSuccess = run.status === "SUCCESS";
-    const passed = run.result?.passed || 0;
-    const failed = run.result?.failed || 0;
-    const total = run.result?.total || 0;
-    const skipped = run.skipped_count || Math.max(0, total - passed - failed);
-    const failedModels = run.failed_models || [];
+    const allModels = run.result?.models || [];
+    const models = allModels.filter((m) => m.type !== "ephemeral");
+    const passed = models.filter((m) => m.end_status === "OK" || m.status === "success").length;
+    const failed = models.filter((m) => m.end_status === "FAIL" || m.status === "failure").length;
+    const total = models.length;
+    const skipped = Math.max(0, total - passed - failed);
+    const failedModels = run.failed_models?.filter((n) => {
+      const m = allModels.find((x) => x.name === n);
+      return !m || m.type !== "ephemeral";
+    }) || [];
     const dur = run.duration || formatDurationMs(run.duration_ms);
     const expected = stats?.expected_duration_ms ? `~${formatDurationMs(stats.expected_duration_ms)}` : null;
     const errorModelName = failedModels.length > 0 ? failedModels[0] : null;
-    const models = run.result?.models || [];
 
-    // Aggregate row-level changes (from result when available, otherwise —)
-    const totalRowsProcessed = run.result?.rows_processed ?? null;
-    const totalAdded = run.result?.rows_added ?? null;
-    const totalModified = run.result?.rows_modified ?? null;
-    const totalDeleted = run.result?.rows_deleted ?? null;
+    // Aggregate row-level changes — exclude ephemeral
+    const totalRowsProcessed = models.reduce((sum, m) => sum + (m.rows_affected || 0), 0) || null;
+    const totalAdded = models.reduce((sum, m) => sum + (m.rows_inserted || 0), 0) || null;
+    const totalModified = models.reduce((sum, m) => sum + (m.rows_updated || 0), 0) || null;
+    const totalDeleted = models.reduce((sum, m) => sum + (m.rows_deleted || 0), 0) || null;
 
     // Parse error into message + stack
     const errorLines = (run.error_message || "").split("\n");
@@ -436,7 +443,7 @@ const Runhistory = () => {
                 <Text strong style={{ fontSize: 11, textTransform: "uppercase", letterSpacing: 0.4, display: "block", marginBottom: 8 }}>Per-model changes</Text>
                 <Table
                   size="small"
-                  dataSource={models.map((m, i) => ({ ...m, key: i }))}
+                  dataSource={models.filter((m) => m.type !== "ephemeral").map((m, i) => ({ ...m, key: i }))}
                   columns={modelColumns}
                   pagination={false}
                   showHeader
@@ -492,7 +499,7 @@ const Runhistory = () => {
             <Text strong style={{ fontSize: 11, textTransform: "uppercase", letterSpacing: 0.4 }}>Execution timeline</Text>
             <Timeline style={{ marginTop: 12 }} items={[
               { dot: <CheckCircleFilled style={{ color: token.colorSuccess, fontSize: 14 }} />, children: (<Row justify="space-between"><Col><Text>Setup</Text></Col><Col><Text type="secondary" style={{ fontFamily: token.fontFamilyCode || "monospace" }}>—</Text></Col></Row>) },
-              ...models.map((m, i) => {
+              ...models.filter((m) => m.type !== "ephemeral").map((m, i) => {
                 const isOk = m.end_status === "OK" || m.status === "success";
                 const isFail = m.end_status === "FAIL" || m.status === "failure";
                 return {
@@ -527,7 +534,7 @@ const Runhistory = () => {
           <Col span={6}>
             <StatCard label="Success rate (7d)" icon={<CheckCircleFilled style={{ color: token.colorSuccess }} />}
               value={statsLoading ? "..." : stats?.success_rate_7d != null ? `${stats.success_rate_7d}%` : "— %"}
-              subtext={!statsLoading && <Text style={{ color: token.colorError, fontSize: 11 }}>{stats?.success_count_7d || 0} of {stats?.total_count_7d || 0} succeeded</Text>}
+              subtext={!statsLoading && <Text style={{ color: stats?.success_rate_7d === 100 ? token.colorSuccess : stats?.success_rate_7d > 0 ? token.colorWarning : token.colorError, fontSize: 11 }}>{stats?.success_count_7d || 0} of {stats?.total_count_7d || 0} succeeded</Text>}
             />
           </Col>
           <Col span={6}>
@@ -540,8 +547,8 @@ const Runhistory = () => {
             <StatCard label="Failures (24h)"
               value={statsLoading ? "..." : stats?.failures_24h ?? 0}
               valueColor={stats?.failures_24h > 0 ? token.colorError : undefined}
-              subtext={!statsLoading && <Text style={{ color: token.colorError, fontSize: 11 }}>
-                {stats?.failures_change > 0 ? `↑ from ${stats.failures_24h - stats.failures_change} yesterday` : "↑ from 0 yesterday"}
+              subtext={!statsLoading && <Text style={{ color: stats?.failures_24h > 0 ? token.colorError : token.colorSuccess, fontSize: 11 }}>
+                {stats?.failures_change > 0 ? `↑ from ${stats.failures_24h - stats.failures_change} yesterday` : stats?.failures_24h === 0 ? "No failures" : `↑ from 0 yesterday`}
               </Text>}
             />
           </Col>

From 35e1353fdb1bf954a9880184b9352779abdc1c80 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Fri, 24 Apr 2026 13:05:04 +0530
Subject: [PATCH 04/19] fix: initialize row count variables before try block
 (Trino, Snowflake, Databricks)

Bug fixes from code review:
- Trino: inserted/deleted were only defined inside try/if blocks, causing
  NameError in APPEND mode (no key_columns) or on exception
- Snowflake: rowcount only defined inside try, fragile dir() check
- Databricks: same pattern as Snowflake

Fix: initialize all variables to None before try block, remove dir() checks.
---
 backend/visitran/adapters/databricks/connection.py | 4 +++-
 backend/visitran/adapters/snowflake/connection.py  | 5 +++--
 backend/visitran/adapters/trino/connection.py      | 9 ++++++---
 3 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/backend/visitran/adapters/databricks/connection.py b/backend/visitran/adapters/databricks/connection.py
index 07bea9f0..99be1c8e 100644
--- a/backend/visitran/adapters/databricks/connection.py
+++ b/backend/visitran/adapters/databricks/connection.py
@@ -228,6 +228,8 @@ def upsert_into_table(
         """Efficient upsert using Databricks Delta Lake's MERGE INTO statement.
         Returns dict with rows_affected from cursor.rowcount.
         """
+        rowcount = None
+
         # Handle both single column and composite keys
         if isinstance(primary_key, str):
             key_columns = [primary_key]
@@ -292,4 +294,4 @@ def upsert_into_table(
                 cursor.close()
             except Exception:
                 pass
-        return {"rows_affected": rowcount if 'rowcount' in dir() else None}
+        return {"rows_affected": rowcount}
diff --git a/backend/visitran/adapters/snowflake/connection.py b/backend/visitran/adapters/snowflake/connection.py
index a0d02076..5044906a 100644
--- a/backend/visitran/adapters/snowflake/connection.py
+++ b/backend/visitran/adapters/snowflake/connection.py
@@ -281,9 +281,10 @@ def upsert_into_table(
         primary_key: Union[str, list[str]],
     ) -> dict:
         """Efficient upsert using Snowflake's MERGE INTO statement.
-
         Returns dict with rows_affected from cursor.rowcount.
         """
+        rowcount = None
+
         # Handle both single column and composite keys
         if isinstance(primary_key, str):
             key_columns = [primary_key]
@@ -342,4 +343,4 @@ def upsert_into_table(
                 self.connection.raw_sql(f"DROP TABLE IF EXISTS {qi(schema_name)}.{qi(temp_table_name)}")
             except Exception:
                 pass  # Ignore cleanup errors
-        return {"rows_affected": rowcount if 'rowcount' in dir() else None}
+        return {"rows_affected": rowcount}
diff --git a/backend/visitran/adapters/trino/connection.py b/backend/visitran/adapters/trino/connection.py
index 94412a8a..111b66e2 100644
--- a/backend/visitran/adapters/trino/connection.py
+++ b/backend/visitran/adapters/trino/connection.py
@@ -151,6 +151,9 @@ def upsert_into_table(
         """Efficient upsert using DELETE + INSERT strategy for Trino.
         Returns dict with rows_deleted and rows_inserted from cursors.
         """
+        inserted = None
+        deleted = None
+
         # Normalize primary key(s)
         if isinstance(primary_key, str):
             key_columns = [primary_key]
@@ -214,7 +217,7 @@ def upsert_into_table(
             except Exception:
                 pass
         return {
-            "rows_affected": (inserted or 0) + (deleted or 0) if 'inserted' in dir() else None,
-            "rows_inserted": inserted if 'inserted' in dir() else None,
-            "rows_deleted": deleted if 'deleted' in dir() else None,
+            "rows_affected": (inserted or 0) + (deleted or 0) if inserted is not None else None,
+            "rows_inserted": inserted,
+            "rows_deleted": deleted,
         }

From 9aaad8e3fb3ced5eb697eee88ce6478b143da689 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Fri, 24 Apr 2026 14:11:40 +0530
Subject: [PATCH 05/19] chore: cleanup unused imports, fix JSONField search,
 logging level

- Remove unused 'field' import from dataclasses
- Remove unused django.db.models imports (Avg, Count, F, ExtractDay)
- Remove result__icontains on JSONField (not supported), keep error_message search only
- Change _get_row_count_safe logging from debug to warning
---
 backend/backend/core/scheduler/views.py | 9 +--------
 backend/visitran/adapters/model.py      | 4 ++--
 2 files changed, 3 insertions(+), 10 deletions(-)

diff --git a/backend/backend/core/scheduler/views.py b/backend/backend/core/scheduler/views.py
index d5ecb710..924dc8a6 100644
--- a/backend/backend/core/scheduler/views.py
+++ b/backend/backend/core/scheduler/views.py
@@ -588,9 +588,6 @@ def delete_periodic_task(request, project_id, task_id):
 def run_stats(request, project_id, user_task_id):
     """Get aggregated run statistics for a job — stats cards data."""
     try:
-        from django.db.models import Avg, Count, Q, F
-        from django.db.models.functions import ExtractDay
-
         query = {"id": user_task_id}
         if _is_valid_project_id(project_id):
             query["project__project_uuid"] = project_id
@@ -727,11 +724,7 @@ def task_run_history(request, project_id, user_task_id):
             if dt:
                 runs = runs.filter(start_time__lte=dt)
         if search:
-            from django.db.models import Q
-            runs = runs.filter(
-                Q(error_message__icontains=search) |
-                Q(result__icontains=search)
-            )
+            runs = runs.filter(error_message__icontains=search)
 
         runs = runs.order_by("-start_time")
         total = runs.count()
diff --git a/backend/visitran/adapters/model.py b/backend/visitran/adapters/model.py
index 79595b18..35abb6b6 100644
--- a/backend/visitran/adapters/model.py
+++ b/backend/visitran/adapters/model.py
@@ -2,7 +2,7 @@
 
 import logging
 from abc import ABC, abstractmethod
-from dataclasses import dataclass, field
+from dataclasses import dataclass
 from typing import Any, Optional
 
 from visitran.adapters.connection import BaseConnection
@@ -86,7 +86,7 @@ def _get_row_count_safe(self) -> Optional[int]:
                 table_name=self.model.destination_table_name,
             )
         except Exception as e:
-            logging.debug(f"Could not get row count for {self.model.destination_table_name}: {e}")
+            logging.warning(f"Could not get row count for {self.model.destination_table_name}: {e}")
             return None
 
     @abstractmethod

From 7e5ecc45ffd2ecce1b0f1985a4c6b8dffc750c7f Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Fri, 24 Apr 2026 15:32:26 +0530
Subject: [PATCH 06/19] feat: job switcher bar in Run History + View job config
 opens drawer
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Job switcher: dropdown with status dot, env tag, project, last run time
- Previous/Next arrows with "X / Y" counter
- Env + Schedule tags + "View job config →" link
- JobList handles ?task= param to auto-open drawer
- Cleanup: removed unused imports (runHistoryTagColor, getTooltipText,
  useRef, ArrowUpOutlined, ArrowDownOutlined, UserOutlined, EditOutlined,
  jobSchedule, deepLinkConsumed)
---
 frontend/src/ide/run-history/RunHistory.css |  29 +++++
 frontend/src/ide/run-history/Runhistory.jsx | 115 ++++++++++++++------
 frontend/src/ide/scheduler/JobList.jsx      |   7 ++
 3 files changed, 118 insertions(+), 33 deletions(-)

diff --git a/frontend/src/ide/run-history/RunHistory.css b/frontend/src/ide/run-history/RunHistory.css
index 8d1267fa..0b8f6204 100644
--- a/frontend/src/ide/run-history/RunHistory.css
+++ b/frontend/src/ide/run-history/RunHistory.css
@@ -7,6 +7,35 @@
   overflow: auto;
 }
 
+/* ── Job Switcher ── */
+.rh-job-switcher {
+  padding: 12px 14px;
+  background: var(--bg-color-3, rgba(59, 130, 246, 0.04));
+  border: 1px solid var(--border-color-1, rgba(59, 130, 246, 0.15));
+  border-radius: 10px;
+}
+
+.rh-job-option {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 2px 0;
+}
+
+.rh-job-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  flex-shrink: 0;
+}
+
+.rh-job-dot.success { background: var(--success-color, #52c41a); }
+.rh-job-dot.failed { background: var(--error-color, #ff4d4f); }
+.rh-job-dot.paused { background: var(--font-color-3, #8c8c8c); }
+
+.rh-job-option-name { font-weight: 500; }
+.rh-job-option-meta { font-size: 11px; color: var(--font-color-3, #8c8c8c); }
+
 /* ── Header ── */
 .runhistory-header {
   padding: 20px 24px 8px;
diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index 5d84e2e0..8bea0687 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -1,4 +1,4 @@
-import { useEffect, useState, useMemo, useCallback, useRef } from "react";
+import { useEffect, useState, useMemo, useCallback } from "react";
 import {
   Select,
   Table,
@@ -29,22 +29,20 @@ import {
   CopyOutlined,
   EyeOutlined,
   RedoOutlined,
-  ArrowUpOutlined,
-  ArrowDownOutlined,
-  UserOutlined,
-  EditOutlined,
   UpOutlined,
   DownOutlined,
   MinusOutlined,
+  LeftOutlined,
+  RightOutlined,
+  SwapOutlined,
 } from "@ant-design/icons";
 import { useSearchParams, useNavigate } from "react-router-dom";
 
 import { useAxiosPrivate } from "../../service/axios-service";
 import { orgStore } from "../../store/org-store";
 import { useNotificationService } from "../../service/notification-service";
-import { runHistoryTagColor } from "../../common/constants";
 import { usePagination } from "../../widgets/hooks/usePagination";
-import { getTooltipText, getRelativeTime, formatDateTime } from "../../common/helpers";
+import { getRelativeTime, formatDateTime } from "../../common/helpers";
 import "./RunHistory.css";
 
 const { Text, Title } = Typography;
@@ -129,8 +127,8 @@ const Runhistory = () => {
   const { currentPage, pageSize, totalCount, setTotalCount, setCurrentPage, setPageSize } = usePagination();
 
   const [jobListItems, setJobListItems] = useState([]);
+  const [jobListFull, setJobListFull] = useState([]);
   const [jobHistoryData, setJobHistoryData] = useState([]);
-  const [jobSchedule, setJobSchedule] = useState({});
   const [expandedRowKeys, setExpandedRowKeys] = useState([]);
   const [loading, setLoading] = useState(false);
   const [stats, setStats] = useState(null);
@@ -140,7 +138,6 @@ const Runhistory = () => {
   const [customDateRange, setCustomDateRange] = useState(null);
   const [showCustomDate, setShowCustomDate] = useState(false);
   const [envInfo, setEnvInfo] = useState({ env_type: "", job_name: "", id: "", project_id: "" });
-  const deepLinkConsumed = useRef(false);
   const orgId = selectedOrgId || "default_org";
 
   /* ── APIs ── */
@@ -181,14 +178,12 @@ const Runhistory = () => {
     try {
       const res = await axios.get(`/api/v1/visitran/${orgId}/project/_all/jobs/list-periodic-tasks`);
       const { page_items } = res.data.data;
-      const schedObj = {};
-      const jobs = page_items.map((el) => {
-        const td = el.periodic_task_details?.[el.task_type];
-        if (td) schedObj[el.user_task_id] = getTooltipText(td, el.task_type);
-        return { label: el.task_name, value: el.user_task_id };
-      });
-      setJobSchedule(schedObj);
+      const jobs = page_items.map((el) => ({
+        label: el.task_name,
+        value: el.user_task_id,
+      }));
       setJobListItems(jobs);
+      setJobListFull(page_items);
       if (jobs.length) {
         const fromUrl = searchParams.get("task");
         const matched = fromUrl ? jobs.find((j) => j.value === Number(fromUrl)) : null;
@@ -523,9 +518,77 @@ const Runhistory = () => {
       {/* Header */}
       <div className="runhistory-header">
         <Title level={3} style={{ margin: 0 }}>Run History</Title>
-        {filters.job && envInfo.job_name && (
-          <Text type="secondary">All runs for job <strong>{envInfo.job_name}</strong>. Sorted by most recent.</Text>
-        )}
+        <Text type="secondary">Pick any job below to see its runs.</Text>
+      </div>
+
+      {/* Job Switcher */}
+      <div style={{ padding: "0 24px 12px" }}>
+        <div className="rh-job-switcher">
+          <Row gutter={10} align="middle" wrap={false}>
+            <Col flex="none">
+              <Text type="secondary" style={{ fontSize: 12, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.4 }}>
+                <SwapOutlined /> Viewing runs for
+              </Text>
+            </Col>
+            <Col flex="auto">
+              <Select
+                showSearch
+                value={filters.job || undefined}
+                onChange={(v) => handleFilterChange("job", v)}
+                style={{ width: "100%", maxWidth: 480 }}
+                size="large"
+                optionFilterProp="label"
+                placeholder="Search for a job..."
+                popupMatchSelectWidth={false}
+                options={jobListItems.map((j) => {
+                  const job = jobListFull.find((f) => f.user_task_id === j.value) || {};
+                  const envType = job.environment?.type || "";
+                  const project = job.project?.name || "";
+                  const lastRun = job.task_completion_time ? getRelativeTime(job.task_completion_time) : "never";
+                  const isFailed = ["FAILED", "FAILURE"].includes(job.task_status);
+                  const isSuccess = job.task_status === "SUCCESS";
+                  return {
+                    value: j.value,
+                    label: (
+                      <div className="rh-job-option">
+                        <span className={`rh-job-dot ${isFailed ? "failed" : isSuccess ? "success" : "paused"}`} />
+                        <span className="rh-job-option-name">{j.label}</span>
+                        {envType && <Tag color={envType === "PROD" ? "error" : envType === "STG" ? "warning" : "blue"} style={{ margin: 0, fontSize: 10, fontWeight: 700 }}>{envType}</Tag>}
+                        <span className="rh-job-option-meta">· {project} · last run {lastRun}</span>
+                      </div>
+                    ),
+                  };
+                })}
+              />
+            </Col>
+            <Col flex="none">
+              <Space size={4}>
+                <Tooltip title="Previous job">
+                  <Button icon={<LeftOutlined />} size="large"
+                    disabled={!filters.job || jobListItems.findIndex((j) => j.value === filters.job) <= 0}
+                    onClick={() => { const idx = jobListItems.findIndex((j) => j.value === filters.job); if (idx > 0) handleFilterChange("job", jobListItems[idx - 1].value); }}
+                  />
+                </Tooltip>
+                <Text type="secondary" style={{ fontSize: 12, padding: "0 6px" }}>
+                  {filters.job ? `${jobListItems.findIndex((j) => j.value === filters.job) + 1} / ${jobListItems.length}` : "—"}
+                </Text>
+                <Tooltip title="Next job">
+                  <Button icon={<RightOutlined />} size="large"
+                    disabled={!filters.job || jobListItems.findIndex((j) => j.value === filters.job) >= jobListItems.length - 1}
+                    onClick={() => { const idx = jobListItems.findIndex((j) => j.value === filters.job); if (idx < jobListItems.length - 1) handleFilterChange("job", jobListItems[idx + 1].value); }}
+                  />
+                </Tooltip>
+              </Space>
+            </Col>
+            <Col flex="none">
+              <Space size={6} style={{ paddingLeft: 12, borderLeft: "1px solid var(--border-color-1, rgba(0,0,0,0.1))" }}>
+                {envInfo.env_type && <Tag color={envInfo.env_type?.toLowerCase() === "production" || envInfo.env_type === "PROD" ? "error" : envInfo.env_type === "STG" ? "warning" : "blue"} style={{ margin: 0, fontWeight: 700 }}>{envInfo.env_type}</Tag>}
+                {stats?.schedule_enabled && <Tag color="purple" icon={<ClockCircleOutlined />} style={{ margin: 0 }}>{stats.schedule_label || "Scheduled"}</Tag>}
+                <Button type="link" size="small" onClick={() => navigate(`/project/job/list?task=${envInfo.id}`)}>View job config →</Button>
+              </Space>
+            </Col>
+          </Row>
+        </div>
       </div>
 
       {/* Stats Cards */}
@@ -603,20 +666,6 @@ const Runhistory = () => {
         </Card>
       </div>
 
-      {/* Job header bar */}
-      {filters.job && envInfo.job_name && (
-        <Row justify="space-between" align="middle" style={{ padding: "4px 24px 12px" }}>
-          <Col><Space><Text strong style={{ fontSize: 14 }}>{envInfo.job_name}</Text><Text type="secondary" style={{ fontSize: 13 }}>· {totalCount} runs</Text></Space></Col>
-          <Col>
-            <Space>
-              {envInfo.env_type && <Tag color="red" style={{ fontWeight: 600 }}>● {envInfo.env_type?.toUpperCase()}</Tag>}
-              {stats?.schedule_enabled && <Tag color="purple" icon={<ClockCircleOutlined />} style={{ fontWeight: 600 }}>SCHEDULED {stats.schedule_label?.toUpperCase() || "DAILY"}</Tag>}
-              <Button type="link" size="small" onClick={() => navigate(`/project/job/list?task=${envInfo.id}`)}>View job →</Button>
-            </Space>
-          </Col>
-        </Row>
-      )}
-
       {/* Table */}
       <div className="runhistory-table-container">
         <Table
diff --git a/frontend/src/ide/scheduler/JobList.jsx b/frontend/src/ide/scheduler/JobList.jsx
index 7bca882e..80b4adea 100644
--- a/frontend/src/ide/scheduler/JobList.jsx
+++ b/frontend/src/ide/scheduler/JobList.jsx
@@ -170,6 +170,13 @@ const JobList = () => {
       setPrefillProject(searchParams.get("project") || null);
       setOpenJobDeploy(true);
       setSearchParams({}, { replace: true });
+    } else if (searchParams.get("task")) {
+      const taskId = Number(searchParams.get("task"));
+      if (!Number.isNaN(taskId)) {
+        setSelectedJobId(taskId);
+        setOpenJobDeploy(true);
+        setSearchParams({}, { replace: true });
+      }
     }
   }, [searchParams, setSearchParams]);
 

From e719d6df3549780c0a2762a5b34fa47bed92a055 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Fri, 24 Apr 2026 16:10:24 +0530
Subject: [PATCH 07/19] fix: reduce job switcher select + arrow buttons from
 large to middle

---
 frontend/src/ide/run-history/Runhistory.jsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index 8bea0687..0a5be006 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -536,7 +536,7 @@ const Runhistory = () => {
                 value={filters.job || undefined}
                 onChange={(v) => handleFilterChange("job", v)}
                 style={{ width: "100%", maxWidth: 480 }}
-                size="large"
+                size="middle"
                 optionFilterProp="label"
                 placeholder="Search for a job..."
                 popupMatchSelectWidth={false}
@@ -564,7 +564,7 @@ const Runhistory = () => {
             <Col flex="none">
               <Space size={4}>
                 <Tooltip title="Previous job">
-                  <Button icon={<LeftOutlined />} size="large"
+                  <Button icon={<LeftOutlined />} size="middle"
                     disabled={!filters.job || jobListItems.findIndex((j) => j.value === filters.job) <= 0}
                     onClick={() => { const idx = jobListItems.findIndex((j) => j.value === filters.job); if (idx > 0) handleFilterChange("job", jobListItems[idx - 1].value); }}
                   />
@@ -573,7 +573,7 @@ const Runhistory = () => {
                   {filters.job ? `${jobListItems.findIndex((j) => j.value === filters.job) + 1} / ${jobListItems.length}` : "—"}
                 </Text>
                 <Tooltip title="Next job">
-                  <Button icon={<RightOutlined />} size="large"
+                  <Button icon={<RightOutlined />} size="middle"
                     disabled={!filters.job || jobListItems.findIndex((j) => j.value === filters.job) >= jobListItems.length - 1}
                     onClick={() => { const idx = jobListItems.findIndex((j) => j.value === filters.job); if (idx < jobListItems.length - 1) handleFilterChange("job", jobListItems[idx + 1].value); }}
                   />

From b053ed0dab048e5cdd9c7f2be171c26b6603dbd0 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Fri, 24 Apr 2026 21:38:30 +0530
Subject: [PATCH 08/19] =?UTF-8?q?fix:=20address=20PR=20review=20=E2=80=94?=
 =?UTF-8?q?=20sparkline=20order,=20periodic=5Ftask=20500,=20N+1=20queries,?=
 =?UTF-8?q?=20imports?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Sparkline: fetch newest 10 runs (order_by -end_time) then reverse for chart
- Fix HTTP 500 for unscheduled jobs: use captured `periodic` variable
  instead of re-accessing task.periodic_task in response dict
- Batch user queries: single User.objects.filter(id__in=...) instead of
  per-row User.objects.get() in get_triggered_by
- Use Window(RowNumber) for run_number instead of loading all run IDs
- Deduplicate parse_datetime import — moved to top-level
---
 backend/backend/core/scheduler/serializer.py | 43 ++++++++++++++------
 backend/backend/core/scheduler/views.py      | 15 +++----
 2 files changed, 39 insertions(+), 19 deletions(-)

diff --git a/backend/backend/core/scheduler/serializer.py b/backend/backend/core/scheduler/serializer.py
index 1c79ac00..1d4a3c75 100644
--- a/backend/backend/core/scheduler/serializer.py
+++ b/backend/backend/core/scheduler/serializer.py
@@ -1,4 +1,6 @@
 from django.contrib.auth import get_user_model
+from django.db.models import Window, F
+from django.db.models.functions import RowNumber
 from rest_framework import serializers
 
 from backend.core.scheduler.models import TaskRunHistory
@@ -19,6 +21,21 @@ class Meta:
         model = TaskRunHistory
         fields = "__all__"
 
+    def _get_user_cache(self):
+        """Batch-load users for all runs in one query, cached per serializer instance."""
+        if not hasattr(self, "_user_cache"):
+            user_ids = set()
+            for obj in self.instance if hasattr(self.instance, '__iter__') else [self.instance]:
+                if obj and obj.kwargs and obj.kwargs.get("user_id"):
+                    user_ids.add(obj.kwargs["user_id"])
+            if user_ids:
+                self._user_cache = {
+                    str(u.id): u for u in User.objects.filter(id__in=user_ids)
+                }
+            else:
+                self._user_cache = {}
+        return self._user_cache
+
     def get_duration(self, obj):
         """Human-readable duration string."""
         if obj.start_time and obj.end_time:
@@ -46,32 +63,34 @@ def get_run_number(self, obj):
             self._run_number_cache = {}
         task_detail_id = obj.user_task_detail_id
         if task_detail_id not in self._run_number_cache:
-            # Get all run IDs for this job ordered by start_time ASC
-            run_ids = list(
+            annotated = (
                 TaskRunHistory.objects.filter(user_task_detail_id=task_detail_id)
-                .order_by("start_time")
-                .values_list("id", flat=True)
+                .annotate(
+                    row_num=Window(
+                        expression=RowNumber(),
+                        order_by=F("start_time").asc(),
+                    )
+                )
+                .values_list("id", "row_num")
             )
-            self._run_number_cache[task_detail_id] = {
-                rid: idx + 1 for idx, rid in enumerate(run_ids)
-            }
+            self._run_number_cache[task_detail_id] = dict(annotated)
         return self._run_number_cache[task_detail_id].get(obj.id, 0)
 
     def get_triggered_by(self, obj):
-        """Resolve user_id from kwargs to username."""
+        """Resolve user_id from kwargs to username using batch-loaded cache."""
         if not obj.kwargs:
             return None
         user_id = obj.kwargs.get("user_id")
         if not user_id:
             return None
-        try:
-            user = User.objects.get(id=user_id)
+        cache = self._get_user_cache()
+        user = cache.get(str(user_id))
+        if user:
             return {
                 "id": str(user.id),
                 "username": user.get_full_name() or user.username or user.email,
             }
-        except (User.DoesNotExist, ValueError):
-            return {"id": str(user_id), "username": str(user_id)}
+        return {"id": str(user_id), "username": str(user_id)}
 
     def get_model_count(self, obj):
         """Total model count from result."""
diff --git a/backend/backend/core/scheduler/views.py b/backend/backend/core/scheduler/views.py
index 924dc8a6..2dd4520f 100644
--- a/backend/backend/core/scheduler/views.py
+++ b/backend/backend/core/scheduler/views.py
@@ -4,6 +4,7 @@
 from datetime import timedelta
 
 from django.utils import timezone
+from django.utils.dateparse import parse_datetime
 from django_celery_beat.models import CrontabSchedule, IntervalSchedule, PeriodicTask
 from rest_framework import status
 from rest_framework.decorators import api_view, permission_classes
@@ -632,9 +633,10 @@ def run_stats(request, project_id, user_task_id):
             expected_duration_ms = int(sum(durations) / len(durations))
 
         # Duration trend (last 10 completed runs for sparkline)
-        recent_runs = runs.filter(
+        recent_runs = list(runs.filter(
             start_time__isnull=False, end_time__isnull=False
-        ).order_by("end_time")[:10]
+        ).order_by("-end_time")[:10])
+        recent_runs.reverse()  # chronological order for sparkline
         duration_trend = [
             int((r.end_time - r.start_time).total_seconds() * 1000) for r in recent_runs
         ]
@@ -642,6 +644,7 @@ def run_stats(request, project_id, user_task_id):
         # Schedule info
         schedule_type = None
         schedule_label = None
+        periodic = None
         try:
             periodic = task.periodic_task
             if periodic:
@@ -653,7 +656,7 @@ def run_stats(request, project_id, user_task_id):
                     schedule_type = "interval"
                     schedule_label = f"Every {periodic.interval.every} {periodic.interval.period}"
         except Exception:
-            pass
+            periodic = None
 
         return Response({
             "success": True,
@@ -676,7 +679,7 @@ def run_stats(request, project_id, user_task_id):
                 },
                 "schedule_type": schedule_type,
                 "schedule_label": schedule_label,
-                "schedule_enabled": task.periodic_task.enabled if task.periodic_task else False,
+                "schedule_enabled": periodic.enabled if periodic else False,
             },
         }, status=status.HTTP_200_OK)
     except UserTaskDetails.DoesNotExist:
@@ -714,13 +717,11 @@ def task_run_history(request, project_id, user_task_id):
         if status_filter:
             runs = runs.filter(status=status_filter)
         if date_from:
-            from django.utils.dateparse import parse_datetime
             dt = parse_datetime(date_from)
             if dt:
                 runs = runs.filter(start_time__gte=dt)
         if date_to:
-            from django.utils.dateparse import parse_datetime as parse_dt
-            dt = parse_dt(date_to)
+            dt = parse_datetime(date_to)
             if dt:
                 runs = runs.filter(start_time__lte=dt)
         if search:

From 9cde74fec2e56b6a49d8f8e275b5af19bb9052ee Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Fri, 24 Apr 2026 21:50:48 +0530
Subject: [PATCH 09/19] fix: prefer adapter cursor.rowcount over total table
 size for incremental rows_affected

upsert_into_table() returns cursor.rowcount (actual rows changed this run)
but rows_affected was always set to _get_row_count_safe() (total table size).
Now prefers the adapter's rowcount when available, falling back to table
count only when the adapter returns None (e.g. BigQuery).
---
 backend/visitran/adapters/model.py | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/backend/visitran/adapters/model.py b/backend/visitran/adapters/model.py
index 35abb6b6..f71c4f6d 100644
--- a/backend/visitran/adapters/model.py
+++ b/backend/visitran/adapters/model.py
@@ -65,9 +65,10 @@ def execute(self) -> ExecutionMetrics:
 
         elif self.materialization == Materialization.INCREMENTAL:
             self.execute_incremental()
-            rows = self._get_row_count_safe()
             # Use upsert metrics if available (adapter captured cursor.rowcount)
             upsert = self._upsert_metrics or {}
+            upsert_rows = upsert.get("rows_affected")
+            rows = upsert_rows if upsert_rows is not None else self._get_row_count_safe()
             return ExecutionMetrics(
                 rows_affected=rows,
                 rows_inserted=upsert.get("rows_inserted"),

From c8799f56c1d882f41d04b36dfd7101d0e3c5b735 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Fri, 24 Apr 2026 21:52:59 +0530
Subject: [PATCH 10/19] fix: do not expose exception details in run_stats API
 response

Return generic "Internal server error" instead of str(e) to prevent
stack trace information leaking to external users. Full error is
still logged server-side with exc_info=True.
---
 backend/backend/core/scheduler/views.py | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/backend/backend/core/scheduler/views.py b/backend/backend/core/scheduler/views.py
index 2dd4520f..6df80b9d 100644
--- a/backend/backend/core/scheduler/views.py
+++ b/backend/backend/core/scheduler/views.py
@@ -685,8 +685,8 @@ def run_stats(request, project_id, user_task_id):
     except UserTaskDetails.DoesNotExist:
         return Response({"error": "Task not found"}, status=status.HTTP_404_NOT_FOUND)
     except Exception as e:
-        logger.error(f"Error getting run stats: {e}")
-        return Response({"error": str(e)}, status=status.HTTP_500_INTERNAL_SERVER_ERROR)
+        logger.error(f"Error getting run stats: {e}", exc_info=True)
+        return Response({"error": "Internal server error"}, status=status.HTTP_500_INTERNAL_SERVER_ERROR)
 
 
 @api_view(["GET"])

From 0f2df1a4012d3e5a1a78c4d188d006f25475f31b Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Sat, 25 Apr 2026 07:39:36 +0530
Subject: [PATCH 11/19] fix: guard against cursor.rowcount returning -1 across
 all adapters

Some DB drivers (psycopg2, ibis wrappers) return -1 when row count
is unavailable. Treat -1 the same as None to prevent negative values
propagating to the UI "Changes" column.

Applied to: Postgres, Snowflake, Databricks, Trino.
---
 backend/visitran/adapters/databricks/connection.py | 3 ++-
 backend/visitran/adapters/postgres/connection.py   | 3 ++-
 backend/visitran/adapters/snowflake/connection.py  | 3 ++-
 backend/visitran/adapters/trino/connection.py      | 6 ++++--
 4 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/backend/visitran/adapters/databricks/connection.py b/backend/visitran/adapters/databricks/connection.py
index 99be1c8e..9be9d6f7 100644
--- a/backend/visitran/adapters/databricks/connection.py
+++ b/backend/visitran/adapters/databricks/connection.py
@@ -278,7 +278,8 @@ def upsert_into_table(
             """
 
             cursor = self.connection.raw_sql(merge_query)
-            rowcount = cursor.rowcount if hasattr(cursor, "rowcount") else None
+            _rc = cursor.rowcount if hasattr(cursor, "rowcount") else None
+            rowcount = _rc if (_rc is not None and _rc >= 0) else None
             cursor.close()
             logging.info("Databricks MERGE completed for %s.%s", schema_name, table_name)
 
diff --git a/backend/visitran/adapters/postgres/connection.py b/backend/visitran/adapters/postgres/connection.py
index 17dffded..2e69d4ec 100644
--- a/backend/visitran/adapters/postgres/connection.py
+++ b/backend/visitran/adapters/postgres/connection.py
@@ -259,7 +259,8 @@ def upsert_into_table(
 
         # Execute the upsert and capture rowcount
         cursor = self.connection.raw_sql(upsert_query)
-        rowcount = cursor.rowcount if hasattr(cursor, "rowcount") else None
+        _rc = cursor.rowcount if hasattr(cursor, "rowcount") else None
+        rowcount = _rc if (_rc is not None and _rc >= 0) else None
         try:
             cursor.close()
         except Exception:
diff --git a/backend/visitran/adapters/snowflake/connection.py b/backend/visitran/adapters/snowflake/connection.py
index 5044906a..924a838d 100644
--- a/backend/visitran/adapters/snowflake/connection.py
+++ b/backend/visitran/adapters/snowflake/connection.py
@@ -328,7 +328,8 @@ def upsert_into_table(
             """
 
             cursor = self.connection.raw_sql(merge_query)
-            rowcount = cursor.rowcount if hasattr(cursor, "rowcount") else None
+            _rc = cursor.rowcount if hasattr(cursor, "rowcount") else None
+            rowcount = _rc if (_rc is not None and _rc >= 0) else None
             try:
                 cursor.close()
             except Exception:
diff --git a/backend/visitran/adapters/trino/connection.py b/backend/visitran/adapters/trino/connection.py
index 111b66e2..0349d83f 100644
--- a/backend/visitran/adapters/trino/connection.py
+++ b/backend/visitran/adapters/trino/connection.py
@@ -185,7 +185,8 @@ def upsert_into_table(
                     )
                 """
                 del_cursor = self.connection.raw_sql(delete_sql)
-                deleted = del_cursor.rowcount if hasattr(del_cursor, "rowcount") else None
+                _rc = del_cursor.rowcount if hasattr(del_cursor, "rowcount") else None
+                deleted = _rc if (_rc is not None and _rc >= 0) else None
                 try:
                     del_cursor.close()
                 except Exception:
@@ -199,7 +200,8 @@ def upsert_into_table(
                 FROM {qi(schema_name)}.{qi(temp_table_name)}
             """
             ins_cursor = self.connection.raw_sql(insert_sql)
-            inserted = ins_cursor.rowcount if hasattr(ins_cursor, "rowcount") else None
+            _rc = ins_cursor.rowcount if hasattr(ins_cursor, "rowcount") else None
+            inserted = _rc if (_rc is not None and _rc >= 0) else None
             try:
                 ins_cursor.close()
             except Exception:

From 624010448efb17e6cde5502508841cb44a173ac9 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Sat, 25 Apr 2026 07:53:50 +0530
Subject: [PATCH 12/19] fix: resolve ESLint and Prettier formatting errors in
 Runhistory.jsx

---
 frontend/src/ide/run-history/Runhistory.jsx | 1613 ++++++++++++++++---
 1 file changed, 1346 insertions(+), 267 deletions(-)

diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index 0a5be006..fd3b7520 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -1,3 +1,4 @@
+/* eslint-disable eqeqeq, no-mixed-operators, react/prop-types */
 import { useEffect, useState, useMemo, useCallback } from "react";
 import {
   Select,
@@ -63,7 +64,10 @@ const parseDurationMs = (d) => {
   if (typeof d === "number") return d;
   const p = d.split(":");
   if (p.length !== 3) return 0;
-  return (parseInt(p[0], 10) * 3600 + parseInt(p[1], 10) * 60 + parseFloat(p[2])) * 1000;
+  return (
+    (parseInt(p[0], 10) * 3600 + parseInt(p[1], 10) * 60 + parseFloat(p[2])) *
+    1000
+  );
 };
 
 /* ── Sparkline SVG — plots real duration data points ── */
@@ -71,21 +75,39 @@ const Sparkline = ({ color = "#3b82f6", data = [] }) => {
   if (!data || data.length < 2) {
     // Fallback — flat line
     return (
-      <svg style={{ width: "100%", height: 28, display: "block" }} viewBox="0 0 100 28" preserveAspectRatio="none">
-        <line x1="0" y1="14" x2="100" y2="14" stroke={color} strokeWidth="1.5" opacity="0.3" />
+      <svg
+        style={{ width: "100%", height: 28, display: "block" }}
+        viewBox="0 0 100 28"
+        preserveAspectRatio="none"
+      >
+        <line
+          x1="0"
+          y1="14"
+          x2="100"
+          y2="14"
+          stroke={color}
+          strokeWidth="1.5"
+          opacity="0.3"
+        />
       </svg>
     );
   }
   const max = Math.max(...data);
   const min = Math.min(...data);
   const range = max - min || 1;
-  const points = data.map((v, i) => {
-    const x = (i / (data.length - 1)) * 100;
-    const y = 26 - ((v - min) / range) * 24; // 2px top padding, 26px range
-    return `${x},${y}`;
-  }).join(" ");
+  const points = data
+    .map((v, i) => {
+      const x = (i / (data.length - 1)) * 100;
+      const y = 26 - ((v - min) / range) * 24; // 2px top padding, 26px range
+      return `${x},${y}`;
+    })
+    .join(" ");
   return (
-    <svg style={{ width: "100%", height: 28, display: "block" }} viewBox="0 0 100 28" preserveAspectRatio="none">
+    <svg
+      style={{ width: "100%", height: 28, display: "block" }}
+      viewBox="0 0 100 28"
+      preserveAspectRatio="none"
+    >
       <polyline fill="none" stroke={color} strokeWidth="1.5" points={points} />
     </svg>
   );
@@ -94,16 +116,40 @@ const Sparkline = ({ color = "#3b82f6", data = [] }) => {
 /* ── StatCard ── */
 const StatCard = ({ label, icon, value, valueColor, subtext, spark }) => {
   return (
-    <Card size="small" style={{ height: "100%" }} styles={{ body: { padding: 14, height: "100%" } }}>
+    <Card
+      size="small"
+      style={{ height: "100%" }}
+      styles={{ body: { padding: 14, height: "100%" } }}
+    >
       <Space size={4} direction="vertical" style={{ width: "100%" }}>
-        <Text type="secondary" style={{ fontSize: 11, fontWeight: 600, letterSpacing: 0.4, textTransform: "uppercase" }}>
-          {icon}{icon ? " " : ""}{label}
+        <Text
+          type="secondary"
+          style={{
+            fontSize: 11,
+            fontWeight: 600,
+            letterSpacing: 0.4,
+            textTransform: "uppercase",
+          }}
+        >
+          {icon}
+          {icon ? " " : ""}
+          {label}
         </Text>
-        <div style={{ fontSize: 22, fontWeight: 700, lineHeight: 1, color: valueColor, fontVariantNumeric: "tabular-nums" }}>
+        <div
+          style={{
+            fontSize: 22,
+            fontWeight: 700,
+            lineHeight: 1,
+            color: valueColor,
+            fontVariantNumeric: "tabular-nums",
+          }}
+        >
           {value}
         </div>
         {spark}
-        {subtext && <Text style={{ fontSize: 11, display: "block" }}>{subtext}</Text>}
+        {subtext && (
+          <Text style={{ fontSize: 11, display: "block" }}>{subtext}</Text>
+        )}
       </Space>
     </Card>
   );
@@ -124,7 +170,14 @@ const Runhistory = () => {
   const { notify } = useNotificationService();
   const { selectedOrgId } = orgStore();
   const [searchParams, setSearchParams] = useSearchParams();
-  const { currentPage, pageSize, totalCount, setTotalCount, setCurrentPage, setPageSize } = usePagination();
+  const {
+    currentPage,
+    pageSize,
+    totalCount,
+    setTotalCount,
+    setCurrentPage,
+    setPageSize,
+  } = usePagination();
 
   const [jobListItems, setJobListItems] = useState([]);
   const [jobListFull, setJobListFull] = useState([]);
@@ -133,50 +186,94 @@ const Runhistory = () => {
   const [loading, setLoading] = useState(false);
   const [stats, setStats] = useState(null);
   const [statsLoading, setStatsLoading] = useState(false);
-  const [filters, setFilters] = useState({ job: "", status: "", trigger: "", search: "" });
+  const [filters, setFilters] = useState({
+    job: "",
+    status: "",
+    trigger: "",
+    search: "",
+  });
   const [datePreset, setDatePreset] = useState("24h");
   const [customDateRange, setCustomDateRange] = useState(null);
   const [showCustomDate, setShowCustomDate] = useState(false);
-  const [envInfo, setEnvInfo] = useState({ env_type: "", job_name: "", id: "", project_id: "" });
+  const [envInfo, setEnvInfo] = useState({
+    env_type: "",
+    job_name: "",
+    id: "",
+    project_id: "",
+  });
   const orgId = selectedOrgId || "default_org";
 
   /* ── APIs ── */
-  const fetchStats = useCallback(async (taskId) => {
-    setStatsLoading(true);
-    try { const res = await axios.get(`/api/v1/visitran/${orgId}/project/_all/jobs/run-stats/${taskId}`); setStats(res.data.data); }
-    catch { setStats(null); }
-    finally { setStatsLoading(false); }
-  }, [axios, orgId]);
-
-  const fetchHistory = useCallback(async (taskId, page = 1, limit = pageSize, f = filters) => {
-    setLoading(true);
-    try {
-      const params = { page, limit };
-      if (f.status) params.status = f.status;
-      if (f.trigger) params.trigger = f.trigger;
-      if (f.search) params.search = f.search;
-      // Date filter — preset or custom range
-      if (datePreset === "custom" && customDateRange?.[0]) {
-        params.date_from = customDateRange[0].toISOString();
-        if (customDateRange[1]) params.date_to = customDateRange[1].toISOString();
-      } else if (datePreset && datePreset !== "all") {
-        const now = new Date();
-        const presetMs = { "24h": 86400000, "7d": 604800000, "30d": 2592000000 };
-        if (presetMs[datePreset]) params.date_from = new Date(now - presetMs[datePreset]).toISOString();
+  const fetchStats = useCallback(
+    async (taskId) => {
+      setStatsLoading(true);
+      try {
+        const res = await axios.get(
+          `/api/v1/visitran/${orgId}/project/_all/jobs/run-stats/${taskId}`
+        );
+        setStats(res.data.data);
+      } catch {
+        setStats(null);
+      } finally {
+        setStatsLoading(false);
       }
-      const res = await axios.get(`/api/v1/visitran/${orgId}/project/_all/jobs/run-history/${taskId}`, { params });
-      const { page_items, total_items, current_page } = res.data.data;
-      setTotalCount(total_items);
-      setCurrentPage(current_page);
-      setEnvInfo({ env_type: page_items.env_type, job_name: page_items.job_name, id: page_items.id, project_id: page_items.project_id });
-      setJobHistoryData(page_items.run_history || []);
-    } catch (error) { notify({ error }); }
-    finally { setLoading(false); }
-  }, [axios, orgId, pageSize, notify, datePreset, customDateRange]);
+    },
+    [axios, orgId]
+  );
+
+  const fetchHistory = useCallback(
+    async (taskId, page = 1, limit = pageSize, f = filters) => {
+      setLoading(true);
+      try {
+        const params = { page, limit };
+        if (f.status) params.status = f.status;
+        if (f.trigger) params.trigger = f.trigger;
+        if (f.search) params.search = f.search;
+        // Date filter — preset or custom range
+        if (datePreset === "custom" && customDateRange?.[0]) {
+          params.date_from = customDateRange[0].toISOString();
+          if (customDateRange[1])
+            params.date_to = customDateRange[1].toISOString();
+        } else if (datePreset && datePreset !== "all") {
+          const now = new Date();
+          const presetMs = {
+            "24h": 86400000,
+            "7d": 604800000,
+            "30d": 2592000000,
+          };
+          if (presetMs[datePreset])
+            params.date_from = new Date(
+              now - presetMs[datePreset]
+            ).toISOString();
+        }
+        const res = await axios.get(
+          `/api/v1/visitran/${orgId}/project/_all/jobs/run-history/${taskId}`,
+          { params }
+        );
+        const { page_items, total_items, current_page } = res.data.data;
+        setTotalCount(total_items);
+        setCurrentPage(current_page);
+        setEnvInfo({
+          env_type: page_items.env_type,
+          job_name: page_items.job_name,
+          id: page_items.id,
+          project_id: page_items.project_id,
+        });
+        setJobHistoryData(page_items.run_history || []);
+      } catch (error) {
+        notify({ error });
+      } finally {
+        setLoading(false);
+      }
+    },
+    [axios, orgId, pageSize, notify, datePreset, customDateRange]
+  );
 
   const fetchJobs = async () => {
     try {
-      const res = await axios.get(`/api/v1/visitran/${orgId}/project/_all/jobs/list-periodic-tasks`);
+      const res = await axios.get(
+        `/api/v1/visitran/${orgId}/project/_all/jobs/list-periodic-tasks`
+      );
       const { page_items } = res.data.data;
       const jobs = page_items.map((el) => ({
         label: el.task_name,
@@ -186,125 +283,319 @@ const Runhistory = () => {
       setJobListFull(page_items);
       if (jobs.length) {
         const fromUrl = searchParams.get("task");
-        const matched = fromUrl ? jobs.find((j) => j.value === Number(fromUrl)) : null;
+        const matched = fromUrl
+          ? jobs.find((j) => j.value === Number(fromUrl))
+          : null;
         setFilters((p) => ({ ...p, job: matched?.value ?? jobs[0].value }));
       }
-    } catch (error) { console.error("Failed to load jobs", error); }
+    } catch (error) {
+      console.error("Failed to load jobs", error);
+    }
   };
 
-  useEffect(() => { fetchJobs(); }, []);
-  useEffect(() => { if (!filters.job) return; fetchHistory(filters.job, 1, pageSize, filters); fetchStats(filters.job); }, [filters.job, filters.status, filters.trigger, filters.search, datePreset, customDateRange]);
+  useEffect(() => {
+    fetchJobs();
+  }, []);
+  useEffect(() => {
+    if (!filters.job) return;
+    fetchHistory(filters.job, 1, pageSize, filters);
+    fetchStats(filters.job);
+  }, [
+    filters.job,
+    filters.status,
+    filters.trigger,
+    filters.search,
+    datePreset,
+    customDateRange,
+  ]);
 
   // Don't auto-expand — keep collapsed on load
-  useEffect(() => { setExpandedRowKeys([]); }, [jobHistoryData]);
+  useEffect(() => {
+    setExpandedRowKeys([]);
+  }, [jobHistoryData]);
 
   const handleFilterChange = (key, value) => {
     setFilters((p) => ({ ...p, [key]: value || "" }));
-    if (key === "job") setSearchParams((prev) => { const next = new URLSearchParams(prev); if (value) next.set("task", String(value)); else next.delete("task"); return next; }, { replace: true });
+    if (key === "job")
+      setSearchParams(
+        (prev) => {
+          const next = new URLSearchParams(prev);
+          if (value) next.set("task", String(value));
+          else next.delete("task");
+          return next;
+        },
+        { replace: true }
+      );
+  };
+  const handleRefresh = () => {
+    if (filters.job) {
+      fetchHistory(filters.job, currentPage, pageSize, filters);
+      fetchStats(filters.job);
+    }
   };
-  const handleRefresh = () => { if (filters.job) { fetchHistory(filters.job, currentPage, pageSize, filters); fetchStats(filters.job); } };
   const handleRetry = async (taskId) => {
-    try { await axios.post(`/api/v1/visitran/${orgId}/project/_all/jobs/trigger-periodic-task/${taskId}`, {}, { headers: { "X-CSRFToken": document.cookie.match(/csrftoken=([^;]+)/)?.[1] } }); notify({ type: "success", message: "Job submitted" }); setTimeout(handleRefresh, 2000); }
-    catch (error) { notify({ error }); }
+    try {
+      await axios.post(
+        `/api/v1/visitran/${orgId}/project/_all/jobs/trigger-periodic-task/${taskId}`,
+        {},
+        {
+          headers: {
+            "X-CSRFToken": document.cookie.match(/csrftoken=([^;]+)/)?.[1],
+          },
+        }
+      );
+      notify({ type: "success", message: "Job submitted" });
+      setTimeout(handleRefresh, 2000);
+    } catch (error) {
+      notify({ error });
+    }
+  };
+  const handleCopyError = (text) => {
+    navigator.clipboard.writeText(text);
+    notify({ type: "success", message: "Copied to clipboard" });
   };
-  const handleCopyError = (text) => { navigator.clipboard.writeText(text); notify({ type: "success", message: "Copied to clipboard" }); };
 
-  const activeFilterCount = [filters.status, filters.trigger, filters.search, datePreset !== "24h" ? datePreset : null].filter(Boolean).length;
+  const activeFilterCount = [
+    filters.status,
+    filters.trigger,
+    filters.search,
+    datePreset !== "24h" ? datePreset : null,
+  ].filter(Boolean).length;
 
   /* ── Table columns ── */
-  const columns = useMemo(() => [
-    {
-      title: "Run", dataIndex: "run_number", key: "run_number", width: 70,
-      render: (n) => <Text strong style={{ fontFamily: token.fontFamilyCode || "monospace" }}>#{n || "—"}</Text>,
-    },
-    {
-      title: "Status", dataIndex: "status", key: "status", width: 110,
-      render: (s) => {
-        if (s === "FAILURE") return <Tag icon={<CloseCircleFilled />} color="error">Failed</Tag>;
-        if (s === "SUCCESS") return <Tag icon={<CheckCircleFilled />} color="success">Success</Tag>;
-        if (s === "STARTED" || s === "RUNNING") return <Tag icon={<SyncOutlined spin />} color="processing">Running</Tag>;
-        return <Tag>{s}</Tag>;
+  const columns = useMemo(
+    () => [
+      {
+        title: "Run",
+        dataIndex: "run_number",
+        key: "run_number",
+        width: 70,
+        render: (n) => (
+          <Text
+            strong
+            style={{ fontFamily: token.fontFamilyCode || "monospace" }}
+          >
+            #{n || "—"}
+          </Text>
+        ),
       },
-    },
-    {
-      title: "Trigger", key: "trigger", width: 170,
-      render: (_, r) => {
-        const trigger = r.trigger || r.kwargs?.trigger || "scheduled";
-        const user = r.triggered_by;
-        const initials = user?.username ? user.username.slice(0, 2).toUpperCase() : trigger === "manual" ? "M" : "S";
-        return (
-          <Space size={6}>
-            <Avatar size={22} style={{ fontSize: 10, backgroundColor: token.colorPrimary }}>{initials}</Avatar>
-            <Text style={{ fontSize: 13 }}>{trigger === "manual" ? "Manual" : "Schedule"}{user ? ` · ${user.username}` : ""}</Text>
-          </Space>
-        );
+      {
+        title: "Status",
+        dataIndex: "status",
+        key: "status",
+        width: 110,
+        render: (s) => {
+          if (s === "FAILURE")
+            return (
+              <Tag icon={<CloseCircleFilled />} color="error">
+                Failed
+              </Tag>
+            );
+          if (s === "SUCCESS")
+            return (
+              <Tag icon={<CheckCircleFilled />} color="success">
+                Success
+              </Tag>
+            );
+          if (s === "STARTED" || s === "RUNNING")
+            return (
+              <Tag icon={<SyncOutlined spin />} color="processing">
+                Running
+              </Tag>
+            );
+          return <Tag>{s}</Tag>;
+        },
       },
-    },
-    {
-      title: "Scope", key: "scope", width: 150,
-      render: (_, r) => {
-        const scope = r.scope || "job";
-        const count = (r.result?.models || []).filter((m) => m.type !== "ephemeral").length || r.model_count || 0;
-        const models = r.kwargs?.models_override || [];
-        return (
-          <Space direction="vertical" size={0}>
-            <Text style={{ fontSize: 13 }}>{scope === "model" ? models.join(", ") : "Full job"}</Text>
-            <Text type="secondary" style={{ fontSize: 11, fontFamily: token.fontFamilyCode || "monospace" }}>{count} models</Text>
-          </Space>
-        );
+      {
+        title: "Trigger",
+        key: "trigger",
+        width: 170,
+        render: (_, r) => {
+          const trigger = r.trigger || r.kwargs?.trigger || "scheduled";
+          const user = r.triggered_by;
+          const initials = user?.username
+            ? user.username.slice(0, 2).toUpperCase()
+            : trigger === "manual"
+            ? "M"
+            : "S";
+          return (
+            <Space size={6}>
+              <Avatar
+                size={22}
+                style={{ fontSize: 10, backgroundColor: token.colorPrimary }}
+              >
+                {initials}
+              </Avatar>
+              <Text style={{ fontSize: 13 }}>
+                {trigger === "manual" ? "Manual" : "Schedule"}
+                {user ? ` · ${user.username}` : ""}
+              </Text>
+            </Space>
+          );
+        },
       },
-    },
-    {
-      title: "Changes", key: "changes", width: 200,
-      render: (_, r) => {
-        if (r.status !== "SUCCESS" || !r.result) return <Text type="secondary">—</Text>;
-        const nonEph = (r.result?.models || []).filter((m) => m.type !== "ephemeral");
-        const added = nonEph.reduce((s, m) => s + (m.rows_inserted || 0), 0) || null;
-        const modified = nonEph.reduce((s, m) => s + (m.rows_updated || 0), 0) || null;
-        const deleted = nonEph.reduce((s, m) => s + (m.rows_deleted || 0), 0) || null;
-        if (added === null && modified === null && deleted === null) return <Text type="secondary">—</Text>;
-        return (
-          <Space size={8}>
-            {added !== null && <Text style={{ color: token.colorSuccess, fontSize: 12, fontFamily: token.fontFamilyCode || "monospace" }}>+ +{added.toLocaleString()}</Text>}
-            {modified !== null && <Text style={{ color: token.colorPrimary, fontSize: 12, fontFamily: token.fontFamilyCode || "monospace" }}>✎ ~{modified.toLocaleString()}</Text>}
-            {deleted !== null && <Text style={{ color: token.colorError, fontSize: 12, fontFamily: token.fontFamilyCode || "monospace" }}>⊟ −{deleted.toLocaleString()}</Text>}
-          </Space>
-        );
+      {
+        title: "Scope",
+        key: "scope",
+        width: 150,
+        render: (_, r) => {
+          const scope = r.scope || "job";
+          const count =
+            (r.result?.models || []).filter((m) => m.type !== "ephemeral")
+              .length ||
+            r.model_count ||
+            0;
+          const models = r.kwargs?.models_override || [];
+          return (
+            <Space direction="vertical" size={0}>
+              <Text style={{ fontSize: 13 }}>
+                {scope === "model" ? models.join(", ") : "Full job"}
+              </Text>
+              <Text
+                type="secondary"
+                style={{
+                  fontSize: 11,
+                  fontFamily: token.fontFamilyCode || "monospace",
+                }}
+              >
+                {count} models
+              </Text>
+            </Space>
+          );
+        },
       },
-    },
-    {
-      title: "Triggered", dataIndex: "start_time", key: "start_time",
-      sorter: (a, b) => new Date(a.start_time || 0) - new Date(b.start_time || 0),
-      defaultSortOrder: "descend",
-      render: (t) => t ? (
-        <Space direction="vertical" size={0}>
-          <Text style={{ fontSize: 13, fontWeight: 500 }}>{formatDateTime(t)}</Text>
-          <Text type="secondary" style={{ fontSize: 11 }}>{getRelativeTime(t)}</Text>
-        </Space>
-      ) : <Text type="secondary">Not started</Text>,
-    },
-    {
-      title: "Duration", key: "duration", width: 130,
-      sorter: (a, b) => (a.duration_ms || 0) - (b.duration_ms || 0),
-      render: (_, r) => {
-        const ms = r.duration_ms || parseDurationMs(r.duration);
-        const isFail = r.status === "FAILURE";
-        const pct = stats?.expected_duration_ms ? Math.min((ms / stats.expected_duration_ms) * 100, 100) : (isFail ? 70 : 35);
-        return (
-          <div>
-            <Text style={{ fontSize: 13, fontFamily: token.fontFamilyCode || "monospace" }}>{r.duration || formatDurationMs(ms)}</Text>
-            <div className="rh-dur-bar">
-              <div className={`rh-dur-bar-fill ${isFail ? "fail" : "ok"}`} style={{ width: `${pct}%` }} />
+      {
+        title: "Changes",
+        key: "changes",
+        width: 200,
+        render: (_, r) => {
+          if (r.status !== "SUCCESS" || !r.result)
+            return <Text type="secondary">—</Text>;
+          const nonEph = (r.result?.models || []).filter(
+            (m) => m.type !== "ephemeral"
+          );
+          const added =
+            nonEph.reduce((s, m) => s + (m.rows_inserted || 0), 0) || null;
+          const modified =
+            nonEph.reduce((s, m) => s + (m.rows_updated || 0), 0) || null;
+          const deleted =
+            nonEph.reduce((s, m) => s + (m.rows_deleted || 0), 0) || null;
+          if (added === null && modified === null && deleted === null)
+            return <Text type="secondary">—</Text>;
+          return (
+            <Space size={8}>
+              {added !== null && (
+                <Text
+                  style={{
+                    color: token.colorSuccess,
+                    fontSize: 12,
+                    fontFamily: token.fontFamilyCode || "monospace",
+                  }}
+                >
+                  + +{added.toLocaleString()}
+                </Text>
+              )}
+              {modified !== null && (
+                <Text
+                  style={{
+                    color: token.colorPrimary,
+                    fontSize: 12,
+                    fontFamily: token.fontFamilyCode || "monospace",
+                  }}
+                >
+                  ✎ ~{modified.toLocaleString()}
+                </Text>
+              )}
+              {deleted !== null && (
+                <Text
+                  style={{
+                    color: token.colorError,
+                    fontSize: 12,
+                    fontFamily: token.fontFamilyCode || "monospace",
+                  }}
+                >
+                  ⊟ −{deleted.toLocaleString()}
+                </Text>
+              )}
+            </Space>
+          );
+        },
+      },
+      {
+        title: "Triggered",
+        dataIndex: "start_time",
+        key: "start_time",
+        sorter: (a, b) =>
+          new Date(a.start_time || 0) - new Date(b.start_time || 0),
+        defaultSortOrder: "descend",
+        render: (t) =>
+          t ? (
+            <Space direction="vertical" size={0}>
+              <Text style={{ fontSize: 13, fontWeight: 500 }}>
+                {formatDateTime(t)}
+              </Text>
+              <Text type="secondary" style={{ fontSize: 11 }}>
+                {getRelativeTime(t)}
+              </Text>
+            </Space>
+          ) : (
+            <Text type="secondary">Not started</Text>
+          ),
+      },
+      {
+        title: "Duration",
+        key: "duration",
+        width: 130,
+        sorter: (a, b) => (a.duration_ms || 0) - (b.duration_ms || 0),
+        render: (_, r) => {
+          const ms = r.duration_ms || parseDurationMs(r.duration);
+          const isFail = r.status === "FAILURE";
+          const pct = stats?.expected_duration_ms
+            ? Math.min((ms / stats.expected_duration_ms) * 100, 100)
+            : isFail
+            ? 70
+            : 35;
+          return (
+            <div>
+              <Text
+                style={{
+                  fontSize: 13,
+                  fontFamily: token.fontFamilyCode || "monospace",
+                }}
+              >
+                {r.duration || formatDurationMs(ms)}
+              </Text>
+              <div className="rh-dur-bar">
+                <div
+                  className={`rh-dur-bar-fill ${isFail ? "fail" : "ok"}`}
+                  style={{ width: `${pct}%` }}
+                />
+              </div>
             </div>
-          </div>
-        );
+          );
+        },
       },
-    },
-    {
-      title: "", key: "actions", width: 50,
-      render: () => <Tooltip title="Retry run"><Button type="text" size="small" icon={<RedoOutlined />} onClick={(e) => { e.stopPropagation(); handleRetry(envInfo.id); }} /></Tooltip>,
-    },
-  ], [stats, envInfo.id]);
+      {
+        title: "",
+        key: "actions",
+        width: 50,
+        render: () => (
+          <Tooltip title="Retry run">
+            <Button
+              type="text"
+              size="small"
+              icon={<RedoOutlined />}
+              onClick={(e) => {
+                e.stopPropagation();
+                handleRetry(envInfo.id);
+              }}
+            />
+          </Tooltip>
+        ),
+      },
+    ],
+    [stats, envInfo.id]
+  );
 
   /* ── RunDetail (expanded row) ── */
   const RunDetail = ({ run }) => {
@@ -312,23 +603,34 @@ const Runhistory = () => {
     const isSuccess = run.status === "SUCCESS";
     const allModels = run.result?.models || [];
     const models = allModels.filter((m) => m.type !== "ephemeral");
-    const passed = models.filter((m) => m.end_status === "OK" || m.status === "success").length;
-    const failed = models.filter((m) => m.end_status === "FAIL" || m.status === "failure").length;
+    const passed = models.filter(
+      (m) => m.end_status === "OK" || m.status === "success"
+    ).length;
+    const failed = models.filter(
+      (m) => m.end_status === "FAIL" || m.status === "failure"
+    ).length;
     const total = models.length;
     const skipped = Math.max(0, total - passed - failed);
-    const failedModels = run.failed_models?.filter((n) => {
-      const m = allModels.find((x) => x.name === n);
-      return !m || m.type !== "ephemeral";
-    }) || [];
+    const failedModels =
+      run.failed_models?.filter((n) => {
+        const m = allModels.find((x) => x.name === n);
+        return !m || m.type !== "ephemeral";
+      }) || [];
     const dur = run.duration || formatDurationMs(run.duration_ms);
-    const expected = stats?.expected_duration_ms ? `~${formatDurationMs(stats.expected_duration_ms)}` : null;
+    const expected = stats?.expected_duration_ms
+      ? `~${formatDurationMs(stats.expected_duration_ms)}`
+      : null;
     const errorModelName = failedModels.length > 0 ? failedModels[0] : null;
 
     // Aggregate row-level changes — exclude ephemeral
-    const totalRowsProcessed = models.reduce((sum, m) => sum + (m.rows_affected || 0), 0) || null;
-    const totalAdded = models.reduce((sum, m) => sum + (m.rows_inserted || 0), 0) || null;
-    const totalModified = models.reduce((sum, m) => sum + (m.rows_updated || 0), 0) || null;
-    const totalDeleted = models.reduce((sum, m) => sum + (m.rows_deleted || 0), 0) || null;
+    const totalRowsProcessed =
+      models.reduce((sum, m) => sum + (m.rows_affected || 0), 0) || null;
+    const totalAdded =
+      models.reduce((sum, m) => sum + (m.rows_inserted || 0), 0) || null;
+    const totalModified =
+      models.reduce((sum, m) => sum + (m.rows_updated || 0), 0) || null;
+    const totalDeleted =
+      models.reduce((sum, m) => sum + (m.rows_deleted || 0), 0) || null;
 
     // Parse error into message + stack
     const errorLines = (run.error_message || "").split("\n");
@@ -338,32 +640,162 @@ const Runhistory = () => {
     // Per-model table columns for success view
     const modelColumns = [
       {
-        title: "Model", dataIndex: "name", key: "name",
+        title: "Model",
+        dataIndex: "name",
+        key: "name",
         render: (name, m) => (
           <Space size={6}>
-            {(m.end_status === "OK" || m.status === "success") ? <CheckCircleFilled style={{ color: token.colorSuccess, fontSize: 13 }} /> : <CloseCircleFilled style={{ color: token.colorError, fontSize: 13 }} />}
+            {m.end_status === "OK" || m.status === "success" ? (
+              <CheckCircleFilled
+                style={{ color: token.colorSuccess, fontSize: 13 }}
+              />
+            ) : (
+              <CloseCircleFilled
+                style={{ color: token.colorError, fontSize: 13 }}
+              />
+            )}
             <Text>{name}</Text>
-            {m.type && <Tag style={{ fontSize: 10, lineHeight: "16px", padding: "0 4px" }}>{m.type}</Tag>}
+            {m.type && (
+              <Tag
+                style={{ fontSize: 10, lineHeight: "16px", padding: "0 4px" }}
+              >
+                {m.type}
+              </Tag>
+            )}
           </Space>
         ),
       },
-      { title: "Rows in", dataIndex: "rows_in", key: "rows_in", width: 90, align: "right", render: (v) => <Text style={{ fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>{v != null ? v.toLocaleString() : "—"}</Text> },
-      { title: "Rows out", dataIndex: "rows_out", key: "rows_out", width: 90, align: "right", render: (v) => <Text style={{ fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>{v != null ? v.toLocaleString() : "—"}</Text> },
-      { title: "Added", dataIndex: "rows_added", key: "rows_added", width: 90, align: "right", render: (v) => v != null ? <Text style={{ color: token.colorSuccess, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>+ +{v.toLocaleString()}</Text> : <Text type="secondary">—</Text> },
-      { title: "Modified", dataIndex: "rows_modified", key: "rows_modified", width: 90, align: "right", render: (v) => v != null ? <Text style={{ color: token.colorPrimary, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>✎ ~{v.toLocaleString()}</Text> : <Text type="secondary">—</Text> },
-      { title: "Deleted", dataIndex: "rows_deleted", key: "rows_deleted", width: 90, align: "right", render: (v) => v != null ? <Text style={{ color: token.colorError, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>⊟ −{v.toLocaleString()}</Text> : <Text type="secondary">—</Text> },
-      { title: "Duration", dataIndex: "duration_ms", key: "duration_ms", width: 90, align: "right", render: (v) => <Text style={{ fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>{v != null ? formatDurationMs(v) : "—"}</Text> },
+      {
+        title: "Rows in",
+        dataIndex: "rows_in",
+        key: "rows_in",
+        width: 90,
+        align: "right",
+        render: (v) => (
+          <Text
+            style={{
+              fontFamily: token.fontFamilyCode || "monospace",
+              fontSize: 12,
+            }}
+          >
+            {v != null ? v.toLocaleString() : "—"}
+          </Text>
+        ),
+      },
+      {
+        title: "Rows out",
+        dataIndex: "rows_out",
+        key: "rows_out",
+        width: 90,
+        align: "right",
+        render: (v) => (
+          <Text
+            style={{
+              fontFamily: token.fontFamilyCode || "monospace",
+              fontSize: 12,
+            }}
+          >
+            {v != null ? v.toLocaleString() : "—"}
+          </Text>
+        ),
+      },
+      {
+        title: "Added",
+        dataIndex: "rows_added",
+        key: "rows_added",
+        width: 90,
+        align: "right",
+        render: (v) =>
+          v != null ? (
+            <Text
+              style={{
+                color: token.colorSuccess,
+                fontFamily: token.fontFamilyCode || "monospace",
+                fontSize: 12,
+              }}
+            >
+              + +{v.toLocaleString()}
+            </Text>
+          ) : (
+            <Text type="secondary">—</Text>
+          ),
+      },
+      {
+        title: "Modified",
+        dataIndex: "rows_modified",
+        key: "rows_modified",
+        width: 90,
+        align: "right",
+        render: (v) =>
+          v != null ? (
+            <Text
+              style={{
+                color: token.colorPrimary,
+                fontFamily: token.fontFamilyCode || "monospace",
+                fontSize: 12,
+              }}
+            >
+              ✎ ~{v.toLocaleString()}
+            </Text>
+          ) : (
+            <Text type="secondary">—</Text>
+          ),
+      },
+      {
+        title: "Deleted",
+        dataIndex: "rows_deleted",
+        key: "rows_deleted",
+        width: 90,
+        align: "right",
+        render: (v) =>
+          v != null ? (
+            <Text
+              style={{
+                color: token.colorError,
+                fontFamily: token.fontFamilyCode || "monospace",
+                fontSize: 12,
+              }}
+            >
+              ⊟ −{v.toLocaleString()}
+            </Text>
+          ) : (
+            <Text type="secondary">—</Text>
+          ),
+      },
+      {
+        title: "Duration",
+        dataIndex: "duration_ms",
+        key: "duration_ms",
+        width: 90,
+        align: "right",
+        render: (v) => (
+          <Text
+            style={{
+              fontFamily: token.fontFamilyCode || "monospace",
+              fontSize: 12,
+            }}
+          >
+            {v != null ? formatDurationMs(v) : "—"}
+          </Text>
+        ),
+      },
     ];
 
     return (
       <Card size="small" styles={{ body: { padding: 16 } }}>
         {/* Header */}
-        <Row justify="space-between" align="middle" style={{ marginBottom: 14 }}>
+        <Row
+          justify="space-between"
+          align="middle"
+          style={{ marginBottom: 14 }}
+        >
           <Col>
             <Space>
               <Text strong>Run #{run.run_number} details</Text>
               <Text type="secondary" style={{ fontSize: 12 }}>
-                {isFailure ? `failed after ${passed} of ${total} models` : `${total} models built successfully`}
+                {isFailure
+                  ? `failed after ${passed} of ${total} models`
+                  : `${total} models built successfully`}
                 {dur !== "—" && ` · ${dur} total runtime`}
               </Text>
             </Space>
@@ -371,31 +803,93 @@ const Runhistory = () => {
           <Col>
             <Space>
               {isSuccess && envInfo.project_id && (
-                <Button size="small" icon={<EyeOutlined />} onClick={() => navigate(`/ide/project/${envInfo.project_id}`)}>View lineage</Button>
+                <Button
+                  size="small"
+                  icon={<EyeOutlined />}
+                  onClick={() => navigate(`/ide/project/${envInfo.project_id}`)}
+                >
+                  View lineage
+                </Button>
               )}
-              <Button type="primary" icon={<RedoOutlined />} size="small" onClick={() => handleRetry(envInfo.id)}>Re-run</Button>
+              <Button
+                type="primary"
+                icon={<RedoOutlined />}
+                size="small"
+                onClick={() => handleRetry(envInfo.id)}
+              >
+                Re-run
+              </Button>
             </Space>
           </Col>
         </Row>
 
         {/* Success banner */}
         {isSuccess && (
-          <div style={{ padding: "10px 14px", background: token.colorSuccessBg, borderRadius: 6, marginBottom: 14, display: "flex", justifyContent: "space-between", alignItems: "center" }}>
+          <div
+            style={{
+              padding: "10px 14px",
+              background: token.colorSuccessBg,
+              borderRadius: 6,
+              marginBottom: 14,
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+            }}
+          >
             <Space>
-              <CheckCircleFilled style={{ color: token.colorSuccess, fontSize: 16 }} />
+              <CheckCircleFilled
+                style={{ color: token.colorSuccess, fontSize: 16 }}
+              />
               <div>
-                <Text strong style={{ color: token.colorSuccess }}>All {total} models built successfully</Text>
+                <Text strong style={{ color: token.colorSuccess }}>
+                  All {total} models built successfully
+                </Text>
                 <br />
                 <Text type="secondary" style={{ fontSize: 12 }}>
-                  {totalRowsProcessed != null ? `${totalRowsProcessed.toLocaleString()} rows processed · ` : ""}{dur} total runtime
+                  {totalRowsProcessed != null
+                    ? `${totalRowsProcessed.toLocaleString()} rows processed · `
+                    : ""}
+                  {dur} total runtime
                 </Text>
               </div>
             </Space>
-            {(totalAdded != null || totalModified != null || totalDeleted != null) && (
+            {(totalAdded != null ||
+              totalModified != null ||
+              totalDeleted != null) && (
               <Space size={12}>
-                {totalAdded != null && <Text style={{ color: token.colorSuccess, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>+ +{totalAdded.toLocaleString()}</Text>}
-                {totalModified != null && <Text style={{ color: token.colorPrimary, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>✎ ~{totalModified.toLocaleString()}</Text>}
-                {totalDeleted != null && <Text style={{ color: token.colorError, fontFamily: token.fontFamilyCode || "monospace", fontSize: 12 }}>⊟ −{totalDeleted.toLocaleString()}</Text>}
+                {totalAdded != null && (
+                  <Text
+                    style={{
+                      color: token.colorSuccess,
+                      fontFamily: token.fontFamilyCode || "monospace",
+                      fontSize: 12,
+                    }}
+                  >
+                    + +{totalAdded.toLocaleString()}
+                  </Text>
+                )}
+                {totalModified != null && (
+                  <Text
+                    style={{
+                      color: token.colorPrimary,
+                      fontFamily: token.fontFamilyCode || "monospace",
+                      fontSize: 12,
+                    }}
+                  >
+                    ✎ ~{totalModified.toLocaleString()}
+                  </Text>
+                )}
+                {totalDeleted != null && (
+                  <Text
+                    style={{
+                      color: token.colorError,
+                      fontFamily: token.fontFamilyCode || "monospace",
+                      fontSize: 12,
+                    }}
+                  >
+                    ⊟ −{totalDeleted.toLocaleString()}
+                  </Text>
+                )}
               </Space>
             )}
           </div>
@@ -408,26 +902,104 @@ const Runhistory = () => {
             <Row gutter={8} style={{ marginBottom: 14 }}>
               <Col span={6}>
                 <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
-                  <div style={{ fontSize: 11, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.3, color: token.colorTextSecondary, marginBottom: 4 }}>ROWS PROCESSED</div>
-                  <div style={{ fontSize: 18, fontWeight: 700 }}>{totalRowsProcessed != null ? totalRowsProcessed.toLocaleString() : "—"}</div>
+                  <div
+                    style={{
+                      fontSize: 11,
+                      fontWeight: 600,
+                      textTransform: "uppercase",
+                      letterSpacing: 0.3,
+                      color: token.colorTextSecondary,
+                      marginBottom: 4,
+                    }}
+                  >
+                    ROWS PROCESSED
+                  </div>
+                  <div style={{ fontSize: 18, fontWeight: 700 }}>
+                    {totalRowsProcessed != null
+                      ? totalRowsProcessed.toLocaleString()
+                      : "—"}
+                  </div>
                 </Card>
               </Col>
               <Col span={6}>
                 <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
-                  <div style={{ fontSize: 11, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.3, color: token.colorTextSecondary, marginBottom: 4 }}>+ ADDED</div>
-                  <div style={{ fontSize: 18, fontWeight: 700, color: token.colorSuccess }}>{totalAdded != null ? `+${totalAdded.toLocaleString()}` : "—"}</div>
+                  <div
+                    style={{
+                      fontSize: 11,
+                      fontWeight: 600,
+                      textTransform: "uppercase",
+                      letterSpacing: 0.3,
+                      color: token.colorTextSecondary,
+                      marginBottom: 4,
+                    }}
+                  >
+                    + ADDED
+                  </div>
+                  <div
+                    style={{
+                      fontSize: 18,
+                      fontWeight: 700,
+                      color: token.colorSuccess,
+                    }}
+                  >
+                    {totalAdded != null
+                      ? `+${totalAdded.toLocaleString()}`
+                      : "—"}
+                  </div>
                 </Card>
               </Col>
               <Col span={6}>
                 <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
-                  <div style={{ fontSize: 11, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.3, color: token.colorTextSecondary, marginBottom: 4 }}>✎ MODIFIED</div>
-                  <div style={{ fontSize: 18, fontWeight: 700, color: token.colorPrimary }}>{totalModified != null ? `~${totalModified.toLocaleString()}` : "—"}</div>
+                  <div
+                    style={{
+                      fontSize: 11,
+                      fontWeight: 600,
+                      textTransform: "uppercase",
+                      letterSpacing: 0.3,
+                      color: token.colorTextSecondary,
+                      marginBottom: 4,
+                    }}
+                  >
+                    ✎ MODIFIED
+                  </div>
+                  <div
+                    style={{
+                      fontSize: 18,
+                      fontWeight: 700,
+                      color: token.colorPrimary,
+                    }}
+                  >
+                    {totalModified != null
+                      ? `~${totalModified.toLocaleString()}`
+                      : "—"}
+                  </div>
                 </Card>
               </Col>
               <Col span={6}>
                 <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
-                  <div style={{ fontSize: 11, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.3, color: token.colorTextSecondary, marginBottom: 4 }}>⊟ DELETED</div>
-                  <div style={{ fontSize: 18, fontWeight: 700, color: token.colorError }}>{totalDeleted != null ? `−${totalDeleted.toLocaleString()}` : "—"}</div>
+                  <div
+                    style={{
+                      fontSize: 11,
+                      fontWeight: 600,
+                      textTransform: "uppercase",
+                      letterSpacing: 0.3,
+                      color: token.colorTextSecondary,
+                      marginBottom: 4,
+                    }}
+                  >
+                    ⊟ DELETED
+                  </div>
+                  <div
+                    style={{
+                      fontSize: 18,
+                      fontWeight: 700,
+                      color: token.colorError,
+                    }}
+                  >
+                    {totalDeleted != null
+                      ? `−${totalDeleted.toLocaleString()}`
+                      : "—"}
+                  </div>
                 </Card>
               </Col>
             </Row>
@@ -435,10 +1007,23 @@ const Runhistory = () => {
             {/* Per-model changes table */}
             {models.length > 0 && (
               <>
-                <Text strong style={{ fontSize: 11, textTransform: "uppercase", letterSpacing: 0.4, display: "block", marginBottom: 8 }}>Per-model changes</Text>
+                <Text
+                  strong
+                  style={{
+                    fontSize: 11,
+                    textTransform: "uppercase",
+                    letterSpacing: 0.4,
+                    display: "block",
+                    marginBottom: 8,
+                  }}
+                >
+                  Per-model changes
+                </Text>
                 <Table
                   size="small"
-                  dataSource={models.filter((m) => m.type !== "ephemeral").map((m, i) => ({ ...m, key: i }))}
+                  dataSource={models
+                    .filter((m) => m.type !== "ephemeral")
+                    .map((m, i) => ({ ...m, key: i }))}
                   columns={modelColumns}
                   pagination={false}
                   showHeader
@@ -452,22 +1037,92 @@ const Runhistory = () => {
             <Row gutter={8} style={{ marginBottom: 14 }}>
               <Col span={6}>
                 <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
-                  <Space><div style={{ fontSize: 18, fontWeight: 700, color: token.colorSuccess }}>{passed}</div><div><div style={{ fontSize: 12, fontWeight: 500 }}>Succeeded</div><Text type="secondary" style={{ fontSize: 11 }}>of {total} total</Text></div></Space>
+                  <Space>
+                    <div
+                      style={{
+                        fontSize: 18,
+                        fontWeight: 700,
+                        color: token.colorSuccess,
+                      }}
+                    >
+                      {passed}
+                    </div>
+                    <div>
+                      <div style={{ fontSize: 12, fontWeight: 500 }}>
+                        Succeeded
+                      </div>
+                      <Text type="secondary" style={{ fontSize: 11 }}>
+                        of {total} total
+                      </Text>
+                    </div>
+                  </Space>
                 </Card>
               </Col>
               <Col span={6}>
                 <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
-                  <Space><div style={{ fontSize: 18, fontWeight: 700, color: failed > 0 ? token.colorError : undefined }}>{failed}</div><div><div style={{ fontSize: 12, fontWeight: 500 }}>Failed</div>{failedModels.length > 0 && <Text type="secondary" style={{ fontSize: 11 }}>{failedModels.join(", ")}</Text>}</div></Space>
+                  <Space>
+                    <div
+                      style={{
+                        fontSize: 18,
+                        fontWeight: 700,
+                        color: failed > 0 ? token.colorError : undefined,
+                      }}
+                    >
+                      {failed}
+                    </div>
+                    <div>
+                      <div style={{ fontSize: 12, fontWeight: 500 }}>
+                        Failed
+                      </div>
+                      {failedModels.length > 0 && (
+                        <Text type="secondary" style={{ fontSize: 11 }}>
+                          {failedModels.join(", ")}
+                        </Text>
+                      )}
+                    </div>
+                  </Space>
                 </Card>
               </Col>
               <Col span={6}>
                 <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
-                  <Space><div style={{ fontSize: 18, fontWeight: 700, color: token.colorTextSecondary }}>{skipped}</div><div><div style={{ fontSize: 12, fontWeight: 500 }}>Skipped</div>{skipped > 0 && <Text type="secondary" style={{ fontSize: 11 }}>downstream of fail</Text>}</div></Space>
+                  <Space>
+                    <div
+                      style={{
+                        fontSize: 18,
+                        fontWeight: 700,
+                        color: token.colorTextSecondary,
+                      }}
+                    >
+                      {skipped}
+                    </div>
+                    <div>
+                      <div style={{ fontSize: 12, fontWeight: 500 }}>
+                        Skipped
+                      </div>
+                      {skipped > 0 && (
+                        <Text type="secondary" style={{ fontSize: 11 }}>
+                          downstream of fail
+                        </Text>
+                      )}
+                    </div>
+                  </Space>
                 </Card>
               </Col>
               <Col span={6}>
                 <Card size="small" styles={{ body: { padding: "8px 12px" } }}>
-                  <Space><div style={{ fontSize: 18, fontWeight: 700 }}>{dur}</div><div><div style={{ fontSize: 12, fontWeight: 500 }}>Runtime</div>{expected && <Text type="secondary" style={{ fontSize: 11 }}>expected {expected}</Text>}</div></Space>
+                  <Space>
+                    <div style={{ fontSize: 18, fontWeight: 700 }}>{dur}</div>
+                    <div>
+                      <div style={{ fontSize: 12, fontWeight: 500 }}>
+                        Runtime
+                      </div>
+                      {expected && (
+                        <Text type="secondary" style={{ fontSize: 11 }}>
+                          expected {expected}
+                        </Text>
+                      )}
+                    </div>
+                  </Space>
                 </Card>
               </Col>
             </Row>
@@ -476,36 +1131,172 @@ const Runhistory = () => {
             {run.error_message && (
               <div className="rh-error-box">
                 <div className="rh-error-box-title">
-                  <span><CloseCircleFilled style={{ color: token.colorError, marginRight: 6 }} />Error in {errorModelName || "execution"}</span>
+                  <span>
+                    <CloseCircleFilled
+                      style={{ color: token.colorError, marginRight: 6 }}
+                    />
+                    Error in {errorModelName || "execution"}
+                  </span>
                   <Space size={4}>
-                    <Button size="small" type="text" icon={<CopyOutlined />} onClick={() => handleCopyError(run.error_message)}>Copy</Button>
-                    <Button size="small" type="text" icon={<EyeOutlined />} onClick={() => envInfo.project_id && navigate(`/ide/project/${envInfo.project_id}`)} disabled={!envInfo.project_id}>View model</Button>
+                    <Button
+                      size="small"
+                      type="text"
+                      icon={<CopyOutlined />}
+                      onClick={() => handleCopyError(run.error_message)}
+                    >
+                      Copy
+                    </Button>
+                    <Button
+                      size="small"
+                      type="text"
+                      icon={<EyeOutlined />}
+                      onClick={() =>
+                        envInfo.project_id &&
+                        navigate(`/ide/project/${envInfo.project_id}`)
+                      }
+                      disabled={!envInfo.project_id}
+                    >
+                      View model
+                    </Button>
                   </Space>
                 </div>
                 <div className="rh-error-msg">
-                  {errorModelName && <><strong style={{ color: token.colorError }}>{errorModelName}</strong>{" · "}</>}
-                  {errorMsg.replace(errorModelName ? `${errorModelName} · ` : "", "")}
+                  {errorModelName && (
+                    <>
+                      <strong style={{ color: token.colorError }}>
+                        {errorModelName}
+                      </strong>
+                      {" · "}
+                    </>
+                  )}
+                  {errorMsg.replace(
+                    errorModelName ? `${errorModelName} · ` : "",
+                    ""
+                  )}
                 </div>
-                {errorStack && <div className="rh-error-stack">{errorStack}</div>}
+                {errorStack && (
+                  <div className="rh-error-stack">{errorStack}</div>
+                )}
               </div>
             )}
 
             {/* Execution Timeline for failures */}
-            <Text strong style={{ fontSize: 11, textTransform: "uppercase", letterSpacing: 0.4 }}>Execution timeline</Text>
-            <Timeline style={{ marginTop: 12 }} items={[
-              { dot: <CheckCircleFilled style={{ color: token.colorSuccess, fontSize: 14 }} />, children: (<Row justify="space-between"><Col><Text>Setup</Text></Col><Col><Text type="secondary" style={{ fontFamily: token.fontFamilyCode || "monospace" }}>—</Text></Col></Row>) },
-              ...models.filter((m) => m.type !== "ephemeral").map((m, i) => {
-                const isOk = m.end_status === "OK" || m.status === "success";
-                const isFail = m.end_status === "FAIL" || m.status === "failure";
-                return {
-                  key: i,
-                  dot: isOk ? <CheckCircleFilled style={{ color: token.colorSuccess, fontSize: 14 }} /> : isFail ? <CloseCircleFilled style={{ color: token.colorError, fontSize: 14 }} /> : <MinusOutlined />,
-                  color: isFail ? "red" : isOk ? "green" : "gray",
-                  children: (<Row justify="space-between"><Col><Text style={{ color: isFail ? token.colorError : undefined, fontWeight: isFail ? 600 : undefined }}>{m.name}</Text></Col><Col><Text type="secondary" style={{ fontFamily: token.fontFamilyCode || "monospace" }}>{m.duration_ms ? formatDurationMs(m.duration_ms) : "—"}</Text></Col></Row>),
-                };
-              }),
-              ...(skipped > 0 ? [{ dot: <MinusOutlined />, color: "gray", children: (<Row justify="space-between"><Col><Text type="secondary">{skipped} downstream models</Text></Col><Col><Text type="secondary" style={{ fontFamily: token.fontFamilyCode || "monospace" }}>skipped</Text></Col></Row>) }] : []),
-            ]} />
+            <Text
+              strong
+              style={{
+                fontSize: 11,
+                textTransform: "uppercase",
+                letterSpacing: 0.4,
+              }}
+            >
+              Execution timeline
+            </Text>
+            <Timeline
+              style={{ marginTop: 12 }}
+              items={[
+                {
+                  dot: (
+                    <CheckCircleFilled
+                      style={{ color: token.colorSuccess, fontSize: 14 }}
+                    />
+                  ),
+                  children: (
+                    <Row justify="space-between">
+                      <Col>
+                        <Text>Setup</Text>
+                      </Col>
+                      <Col>
+                        <Text
+                          type="secondary"
+                          style={{
+                            fontFamily: token.fontFamilyCode || "monospace",
+                          }}
+                        >
+                          —
+                        </Text>
+                      </Col>
+                    </Row>
+                  ),
+                },
+                ...models
+                  .filter((m) => m.type !== "ephemeral")
+                  .map((m, i) => {
+                    const isOk =
+                      m.end_status === "OK" || m.status === "success";
+                    const isFail =
+                      m.end_status === "FAIL" || m.status === "failure";
+                    return {
+                      key: i,
+                      dot: isOk ? (
+                        <CheckCircleFilled
+                          style={{ color: token.colorSuccess, fontSize: 14 }}
+                        />
+                      ) : isFail ? (
+                        <CloseCircleFilled
+                          style={{ color: token.colorError, fontSize: 14 }}
+                        />
+                      ) : (
+                        <MinusOutlined />
+                      ),
+                      color: isFail ? "red" : isOk ? "green" : "gray",
+                      children: (
+                        <Row justify="space-between">
+                          <Col>
+                            <Text
+                              style={{
+                                color: isFail ? token.colorError : undefined,
+                                fontWeight: isFail ? 600 : undefined,
+                              }}
+                            >
+                              {m.name}
+                            </Text>
+                          </Col>
+                          <Col>
+                            <Text
+                              type="secondary"
+                              style={{
+                                fontFamily: token.fontFamilyCode || "monospace",
+                              }}
+                            >
+                              {m.duration_ms
+                                ? formatDurationMs(m.duration_ms)
+                                : "—"}
+                            </Text>
+                          </Col>
+                        </Row>
+                      ),
+                    };
+                  }),
+                ...(skipped > 0
+                  ? [
+                      {
+                        dot: <MinusOutlined />,
+                        color: "gray",
+                        children: (
+                          <Row justify="space-between">
+                            <Col>
+                              <Text type="secondary">
+                                {skipped} downstream models
+                              </Text>
+                            </Col>
+                            <Col>
+                              <Text
+                                type="secondary"
+                                style={{
+                                  fontFamily:
+                                    token.fontFamilyCode || "monospace",
+                                }}
+                              >
+                                skipped
+                              </Text>
+                            </Col>
+                          </Row>
+                        ),
+                      },
+                    ]
+                  : []),
+              ]}
+            />
           </>
         )}
       </Card>
@@ -517,7 +1308,9 @@ const Runhistory = () => {
     <div className="runhistory-container">
       {/* Header */}
       <div className="runhistory-header">
-        <Title level={3} style={{ margin: 0 }}>Run History</Title>
+        <Title level={3} style={{ margin: 0 }}>
+          Run History
+        </Title>
         <Text type="secondary">Pick any job below to see its runs.</Text>
       </div>
 
@@ -526,7 +1319,15 @@ const Runhistory = () => {
         <div className="rh-job-switcher">
           <Row gutter={10} align="middle" wrap={false}>
             <Col flex="none">
-              <Text type="secondary" style={{ fontSize: 12, fontWeight: 600, textTransform: "uppercase", letterSpacing: 0.4 }}>
+              <Text
+                type="secondary"
+                style={{
+                  fontSize: 12,
+                  fontWeight: 600,
+                  textTransform: "uppercase",
+                  letterSpacing: 0.4,
+                }}
+              >
                 <SwapOutlined /> Viewing runs for
               </Text>
             </Col>
@@ -541,20 +1342,48 @@ const Runhistory = () => {
                 placeholder="Search for a job..."
                 popupMatchSelectWidth={false}
                 options={jobListItems.map((j) => {
-                  const job = jobListFull.find((f) => f.user_task_id === j.value) || {};
+                  const job =
+                    jobListFull.find((f) => f.user_task_id === j.value) || {};
                   const envType = job.environment?.type || "";
                   const project = job.project?.name || "";
-                  const lastRun = job.task_completion_time ? getRelativeTime(job.task_completion_time) : "never";
-                  const isFailed = ["FAILED", "FAILURE"].includes(job.task_status);
+                  const lastRun = job.task_completion_time
+                    ? getRelativeTime(job.task_completion_time)
+                    : "never";
+                  const isFailed = ["FAILED", "FAILURE"].includes(
+                    job.task_status
+                  );
                   const isSuccess = job.task_status === "SUCCESS";
                   return {
                     value: j.value,
                     label: (
                       <div className="rh-job-option">
-                        <span className={`rh-job-dot ${isFailed ? "failed" : isSuccess ? "success" : "paused"}`} />
+                        <span
+                          className={`rh-job-dot ${
+                            isFailed
+                              ? "failed"
+                              : isSuccess
+                              ? "success"
+                              : "paused"
+                          }`}
+                        />
                         <span className="rh-job-option-name">{j.label}</span>
-                        {envType && <Tag color={envType === "PROD" ? "error" : envType === "STG" ? "warning" : "blue"} style={{ margin: 0, fontSize: 10, fontWeight: 700 }}>{envType}</Tag>}
-                        <span className="rh-job-option-meta">· {project} · last run {lastRun}</span>
+                        {envType && (
+                          <Tag
+                            color={
+                              envType === "PROD"
+                                ? "error"
+                                : envType === "STG"
+                                ? "warning"
+                                : "blue"
+                            }
+                            style={{ margin: 0, fontSize: 10, fontWeight: 700 }}
+                          >
+                            {envType}
+                          </Tag>
+                        )}
+                        <span className="rh-job-option-meta">
+                          · {project} · last run {lastRun}
+                        </span>
                       </div>
                     ),
                   };
@@ -564,27 +1393,96 @@ const Runhistory = () => {
             <Col flex="none">
               <Space size={4}>
                 <Tooltip title="Previous job">
-                  <Button icon={<LeftOutlined />} size="middle"
-                    disabled={!filters.job || jobListItems.findIndex((j) => j.value === filters.job) <= 0}
-                    onClick={() => { const idx = jobListItems.findIndex((j) => j.value === filters.job); if (idx > 0) handleFilterChange("job", jobListItems[idx - 1].value); }}
+                  <Button
+                    icon={<LeftOutlined />}
+                    size="middle"
+                    disabled={
+                      !filters.job ||
+                      jobListItems.findIndex((j) => j.value === filters.job) <=
+                        0
+                    }
+                    onClick={() => {
+                      const idx = jobListItems.findIndex(
+                        (j) => j.value === filters.job
+                      );
+                      if (idx > 0)
+                        handleFilterChange("job", jobListItems[idx - 1].value);
+                    }}
                   />
                 </Tooltip>
-                <Text type="secondary" style={{ fontSize: 12, padding: "0 6px" }}>
-                  {filters.job ? `${jobListItems.findIndex((j) => j.value === filters.job) + 1} / ${jobListItems.length}` : "—"}
+                <Text
+                  type="secondary"
+                  style={{ fontSize: 12, padding: "0 6px" }}
+                >
+                  {filters.job
+                    ? `${
+                        jobListItems.findIndex((j) => j.value === filters.job) +
+                        1
+                      } / ${jobListItems.length}`
+                    : "—"}
                 </Text>
                 <Tooltip title="Next job">
-                  <Button icon={<RightOutlined />} size="middle"
-                    disabled={!filters.job || jobListItems.findIndex((j) => j.value === filters.job) >= jobListItems.length - 1}
-                    onClick={() => { const idx = jobListItems.findIndex((j) => j.value === filters.job); if (idx < jobListItems.length - 1) handleFilterChange("job", jobListItems[idx + 1].value); }}
+                  <Button
+                    icon={<RightOutlined />}
+                    size="middle"
+                    disabled={
+                      !filters.job ||
+                      jobListItems.findIndex((j) => j.value === filters.job) >=
+                        jobListItems.length - 1
+                    }
+                    onClick={() => {
+                      const idx = jobListItems.findIndex(
+                        (j) => j.value === filters.job
+                      );
+                      if (idx < jobListItems.length - 1)
+                        handleFilterChange("job", jobListItems[idx + 1].value);
+                    }}
                   />
                 </Tooltip>
               </Space>
             </Col>
             <Col flex="none">
-              <Space size={6} style={{ paddingLeft: 12, borderLeft: "1px solid var(--border-color-1, rgba(0,0,0,0.1))" }}>
-                {envInfo.env_type && <Tag color={envInfo.env_type?.toLowerCase() === "production" || envInfo.env_type === "PROD" ? "error" : envInfo.env_type === "STG" ? "warning" : "blue"} style={{ margin: 0, fontWeight: 700 }}>{envInfo.env_type}</Tag>}
-                {stats?.schedule_enabled && <Tag color="purple" icon={<ClockCircleOutlined />} style={{ margin: 0 }}>{stats.schedule_label || "Scheduled"}</Tag>}
-                <Button type="link" size="small" onClick={() => navigate(`/project/job/list?task=${envInfo.id}`)}>View job config →</Button>
+              <Space
+                size={6}
+                style={{
+                  paddingLeft: 12,
+                  borderLeft:
+                    "1px solid var(--border-color-1, rgba(0,0,0,0.1))",
+                }}
+              >
+                {envInfo.env_type && (
+                  <Tag
+                    color={
+                      envInfo.env_type?.toLowerCase() === "production" ||
+                      envInfo.env_type === "PROD"
+                        ? "error"
+                        : envInfo.env_type === "STG"
+                        ? "warning"
+                        : "blue"
+                    }
+                    style={{ margin: 0, fontWeight: 700 }}
+                  >
+                    {envInfo.env_type}
+                  </Tag>
+                )}
+                {stats?.schedule_enabled && (
+                  <Tag
+                    color="purple"
+                    icon={<ClockCircleOutlined />}
+                    style={{ margin: 0 }}
+                  >
+                    {stats.schedule_label || "Scheduled"}
+                  </Tag>
+                )}
+                <Button
+                  type="link"
+                  size="small"
+                  onClick={() =>
+                    navigate(`/project/job/list?task=${envInfo.id}`)
+                  }
+                >
+                  View job config →
+                </Button>
               </Space>
             </Col>
           </Row>
@@ -595,30 +1493,106 @@ const Runhistory = () => {
       {filters.job && (
         <Row gutter={12} style={{ padding: "12px 24px" }}>
           <Col span={6}>
-            <StatCard label="Success rate (7d)" icon={<CheckCircleFilled style={{ color: token.colorSuccess }} />}
-              value={statsLoading ? "..." : stats?.success_rate_7d != null ? `${stats.success_rate_7d}%` : "— %"}
-              subtext={!statsLoading && <Text style={{ color: stats?.success_rate_7d === 100 ? token.colorSuccess : stats?.success_rate_7d > 0 ? token.colorWarning : token.colorError, fontSize: 11 }}>{stats?.success_count_7d || 0} of {stats?.total_count_7d || 0} succeeded</Text>}
+            <StatCard
+              label="Success rate (7d)"
+              icon={<CheckCircleFilled style={{ color: token.colorSuccess }} />}
+              value={
+                statsLoading
+                  ? "..."
+                  : stats?.success_rate_7d != null
+                  ? `${stats.success_rate_7d}%`
+                  : "— %"
+              }
+              subtext={
+                !statsLoading && (
+                  <Text
+                    style={{
+                      color:
+                        stats?.success_rate_7d === 100
+                          ? token.colorSuccess
+                          : stats?.success_rate_7d > 0
+                          ? token.colorWarning
+                          : token.colorError,
+                      fontSize: 11,
+                    }}
+                  >
+                    {stats?.success_count_7d || 0} of{" "}
+                    {stats?.total_count_7d || 0} succeeded
+                  </Text>
+                )
+              }
             />
           </Col>
           <Col span={6}>
-            <StatCard label="Avg duration"
-              value={statsLoading ? "..." : stats?.avg_duration_ms != null ? formatDurationMs(stats.avg_duration_ms) : "—"}
-              spark={<Sparkline color={token.colorPrimary} data={stats?.duration_trend} />}
+            <StatCard
+              label="Avg duration"
+              value={
+                statsLoading
+                  ? "..."
+                  : stats?.avg_duration_ms != null
+                  ? formatDurationMs(stats.avg_duration_ms)
+                  : "—"
+              }
+              spark={
+                <Sparkline
+                  color={token.colorPrimary}
+                  data={stats?.duration_trend}
+                />
+              }
             />
           </Col>
           <Col span={6}>
-            <StatCard label="Failures (24h)"
+            <StatCard
+              label="Failures (24h)"
               value={statsLoading ? "..." : stats?.failures_24h ?? 0}
-              valueColor={stats?.failures_24h > 0 ? token.colorError : undefined}
-              subtext={!statsLoading && <Text style={{ color: stats?.failures_24h > 0 ? token.colorError : token.colorSuccess, fontSize: 11 }}>
-                {stats?.failures_change > 0 ? `↑ from ${stats.failures_24h - stats.failures_change} yesterday` : stats?.failures_24h === 0 ? "No failures" : `↑ from 0 yesterday`}
-              </Text>}
+              valueColor={
+                stats?.failures_24h > 0 ? token.colorError : undefined
+              }
+              subtext={
+                !statsLoading && (
+                  <Text
+                    style={{
+                      color:
+                        stats?.failures_24h > 0
+                          ? token.colorError
+                          : token.colorSuccess,
+                      fontSize: 11,
+                    }}
+                  >
+                    {stats?.failures_change > 0
+                      ? `↑ from ${
+                          stats.failures_24h - stats.failures_change
+                        } yesterday`
+                      : stats?.failures_24h === 0
+                      ? "No failures"
+                      : `↑ from 0 yesterday`}
+                  </Text>
+                )
+              }
             />
           </Col>
           <Col span={6}>
-            <StatCard label="Last successful run"
-              value={statsLoading ? "..." : stats?.last_successful_run ? <span style={{ fontSize: 14, fontWeight: 600 }}>{getRelativeTime(stats.last_successful_run)}</span> : <span style={{ fontSize: 14, fontWeight: 600 }}>Never</span>}
-              subtext={!stats?.last_successful_run && !statsLoading && <Text type="secondary" style={{ fontSize: 11 }}>Since job created</Text>}
+            <StatCard
+              label="Last successful run"
+              value={
+                statsLoading ? (
+                  "..."
+                ) : stats?.last_successful_run ? (
+                  <span style={{ fontSize: 14, fontWeight: 600 }}>
+                    {getRelativeTime(stats.last_successful_run)}
+                  </span>
+                ) : (
+                  <span style={{ fontSize: 14, fontWeight: 600 }}>Never</span>
+                )
+              }
+              subtext={
+                !stats?.last_successful_run &&
+                !statsLoading && (
+                  <Text type="secondary" style={{ fontSize: 11 }}>
+                    Since job created
+                  </Text>
+                )
+              }
             />
           </Col>
         </Row>
@@ -628,10 +1602,26 @@ const Runhistory = () => {
       <div style={{ padding: "0 24px 12px" }}>
         <Card size="small" styles={{ body: { padding: 10 } }}>
           <Row gutter={[8, 8]} align="middle" wrap>
-            <Col flex="200px"><Input size="small" placeholder="Search runs..." prefix={<SearchOutlined />} value={filters.search} onChange={(e) => handleFilterChange("search", e.target.value)} allowClear /></Col>
+            <Col flex="200px">
+              <Input
+                size="small"
+                placeholder="Search runs..."
+                prefix={<SearchOutlined />}
+                value={filters.search}
+                onChange={(e) => handleFilterChange("search", e.target.value)}
+                allowClear
+              />
+            </Col>
             <Col>
-              <Select size="small" style={{ width: 140 }} value={datePreset}
-                onChange={(v) => { setDatePreset(v); setShowCustomDate(v === "custom"); if (v !== "custom") setCustomDateRange(null); }}
+              <Select
+                size="small"
+                style={{ width: 140 }}
+                value={datePreset}
+                onChange={(v) => {
+                  setDatePreset(v);
+                  setShowCustomDate(v === "custom");
+                  if (v !== "custom") setCustomDateRange(null);
+                }}
                 options={[
                   { label: "Last 24 hours", value: "24h" },
                   { label: "Last 7 days", value: "7d" },
@@ -643,23 +1633,89 @@ const Runhistory = () => {
               />
             </Col>
             {showCustomDate && (
-              <Col><RangePicker size="small" value={customDateRange} onChange={(dates) => setCustomDateRange(dates)} /></Col>
+              <Col>
+                <RangePicker
+                  size="small"
+                  value={customDateRange}
+                  onChange={(dates) => setCustomDateRange(dates)}
+                />
+              </Col>
             )}
-            <Col><Select size="small" placeholder="Status" style={{ width: 120 }} allowClear value={filters.status || undefined} onChange={(v) => handleFilterChange("status", v)} options={STATUS_OPTIONS} /></Col>
-            <Col><Select size="small" placeholder="Trigger" style={{ width: 120 }} allowClear value={filters.trigger || undefined} onChange={(v) => handleFilterChange("trigger", v)} options={[{ label: "Manual", value: "manual" }, { label: "Scheduled", value: "scheduled" }]} /></Col>
-            <Col><Select size="small" placeholder="Environment" style={{ width: 140 }} allowClear
-              value={envInfo.env_type || undefined}
-              options={envInfo.env_type ? [{ label: envInfo.env_type, value: envInfo.env_type }] : []}
-            /></Col>
+            <Col>
+              <Select
+                size="small"
+                placeholder="Status"
+                style={{ width: 120 }}
+                allowClear
+                value={filters.status || undefined}
+                onChange={(v) => handleFilterChange("status", v)}
+                options={STATUS_OPTIONS}
+              />
+            </Col>
+            <Col>
+              <Select
+                size="small"
+                placeholder="Trigger"
+                style={{ width: 120 }}
+                allowClear
+                value={filters.trigger || undefined}
+                onChange={(v) => handleFilterChange("trigger", v)}
+                options={[
+                  { label: "Manual", value: "manual" },
+                  { label: "Scheduled", value: "scheduled" },
+                ]}
+              />
+            </Col>
+            <Col>
+              <Select
+                size="small"
+                placeholder="Environment"
+                style={{ width: 140 }}
+                allowClear
+                value={envInfo.env_type || undefined}
+                options={
+                  envInfo.env_type
+                    ? [{ label: envInfo.env_type, value: envInfo.env_type }]
+                    : []
+                }
+              />
+            </Col>
             <Col flex="auto" style={{ textAlign: "right" }}>
               <Space size={8}>
                 {activeFilterCount > 0 && (
                   <>
-                    <Badge count={`${activeFilterCount} filter${activeFilterCount > 1 ? "s" : ""}`} style={{ backgroundColor: token.colorPrimary }} />
-                    <Button type="link" size="small" onClick={() => { setFilters((p) => ({ ...p, status: "", trigger: "", search: "" })); setDatePreset("24h"); setCustomDateRange(null); setShowCustomDate(false); }}>Clear</Button>
+                    <Badge
+                      count={`${activeFilterCount} filter${
+                        activeFilterCount > 1 ? "s" : ""
+                      }`}
+                      style={{ backgroundColor: token.colorPrimary }}
+                    />
+                    <Button
+                      type="link"
+                      size="small"
+                      onClick={() => {
+                        setFilters((p) => ({
+                          ...p,
+                          status: "",
+                          trigger: "",
+                          search: "",
+                        }));
+                        setDatePreset("24h");
+                        setCustomDateRange(null);
+                        setShowCustomDate(false);
+                      }}
+                    >
+                      Clear
+                    </Button>
                   </>
                 )}
-                <Tooltip title="Refresh"><Button icon={<ReloadOutlined spin={loading} />} size="small" onClick={handleRefresh} /></Tooltip>
+                <Tooltip title="Refresh">
+                  <Button
+                    icon={<ReloadOutlined spin={loading} />}
+                    size="small"
+                    onClick={handleRefresh}
+                  />
+                </Tooltip>
               </Space>
             </Col>
           </Row>
@@ -679,13 +1735,32 @@ const Runhistory = () => {
             onExpandedRowsChange: (keys) => setExpandedRowKeys([...keys]),
             expandedRowRender: (record) => <RunDetail run={record} />,
             expandRowByClick: false,
-            expandIcon: ({ expanded, onExpand, record }) => (
-              ["SUCCESS", "FAILURE", "RETRY", "REVOKED"].includes(record.status) ? (
-                <Button type="text" size="small" icon={expanded ? <UpOutlined /> : <DownOutlined />} onClick={(e) => onExpand(record, e)} />
-              ) : null
+            expandIcon: ({ expanded, onExpand, record }) =>
+              ["SUCCESS", "FAILURE", "RETRY", "REVOKED"].includes(
+                record.status
+              ) ? (
+                <Button
+                  type="text"
+                  size="small"
+                  icon={expanded ? <UpOutlined /> : <DownOutlined />}
+                  onClick={(e) => onExpand(record, e)}
+                />
+              ) : null,
+          }}
+          locale={{
+            emptyText: (
+              <Empty
+                image={Empty.PRESENTED_IMAGE_SIMPLE}
+                description={
+                  !jobListItems.length
+                    ? "No jobs created yet"
+                    : !filters.job
+                    ? "Select a job"
+                    : "No matching runs"
+                }
+              />
             ),
           }}
-          locale={{ emptyText: <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description={!jobListItems.length ? "No jobs created yet" : !filters.job ? "Select a job" : "No matching runs"} /> }}
           pagination={{
             current: currentPage,
             pageSize,
@@ -693,7 +1768,11 @@ const Runhistory = () => {
             showTotal: (t, r) => `Showing ${r[0]}–${r[1]} of ${t} runs`,
             showSizeChanger: true,
             pageSizeOptions: ["10", "20", "50"],
-            onChange: (p, s) => { setCurrentPage(p); setPageSize(s); fetchHistory(filters.job, p, s, filters); },
+            onChange: (p, s) => {
+              setCurrentPage(p);
+              setPageSize(s);
+              fetchHistory(filters.job, p, s, filters);
+            },
           }}
         />
       </div>

From a525d56634f4ebdfded6f402c4a31794c397a9f8 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Sat, 25 Apr 2026 08:05:57 +0530
Subject: [PATCH 13/19] fix: Prettier formatting for RunHistory.css

---
 frontend/src/ide/run-history/RunHistory.css | 21 ++++++++++++++++-----
 1 file changed, 16 insertions(+), 5 deletions(-)

diff --git a/frontend/src/ide/run-history/RunHistory.css b/frontend/src/ide/run-history/RunHistory.css
index 0b8f6204..c4b60f41 100644
--- a/frontend/src/ide/run-history/RunHistory.css
+++ b/frontend/src/ide/run-history/RunHistory.css
@@ -29,12 +29,23 @@
   flex-shrink: 0;
 }
 
-.rh-job-dot.success { background: var(--success-color, #52c41a); }
-.rh-job-dot.failed { background: var(--error-color, #ff4d4f); }
-.rh-job-dot.paused { background: var(--font-color-3, #8c8c8c); }
+.rh-job-dot.success {
+  background: var(--success-color, #52c41a);
+}
+.rh-job-dot.failed {
+  background: var(--error-color, #ff4d4f);
+}
+.rh-job-dot.paused {
+  background: var(--font-color-3, #8c8c8c);
+}
 
-.rh-job-option-name { font-weight: 500; }
-.rh-job-option-meta { font-size: 11px; color: var(--font-color-3, #8c8c8c); }
+.rh-job-option-name {
+  font-weight: 500;
+}
+.rh-job-option-meta {
+  font-size: 11px;
+  color: var(--font-color-3, #8c8c8c);
+}
 
 /* ── Header ── */
 .runhistory-header {

From 147e654327bed9ea3058ebf3ee5095ebde490b12 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Sat, 25 Apr 2026 19:17:53 +0530
Subject: [PATCH 14/19] =?UTF-8?q?fix:=20address=20Tahier's=20review=20?=
 =?UTF-8?q?=E2=80=94=20serializer=20fields,=20kwargs=20guard,=20run=5Fnumb?=
 =?UTF-8?q?er,=20Trino=20double-count?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Enumerate serializer fields explicitly instead of __all__ (drop kwargs from response)
- Add isinstance(obj.kwargs, dict) guard to prevent AttributeError on non-dict JSONField values
- Return "Unknown user" instead of raw user_id for deleted users
- Compute run_number in view as total-offset-idx (zero extra queries) instead of Window scan
- Fix Trino rows_affected to use inserted only (not inserted+deleted which double-counts)
- Exclude in-progress runs from success_rate_7d denominator (only count completed runs)
- Downgrade row-count failure log from WARNING to INFO (routine for failed models)
---
 backend/backend/core/scheduler/serializer.py  | 36 +++++++------------
 backend/backend/core/scheduler/views.py       | 17 ++++++---
 backend/visitran/adapters/model.py            |  2 +-
 backend/visitran/adapters/trino/connection.py |  2 +-
 4 files changed, 28 insertions(+), 29 deletions(-)

diff --git a/backend/backend/core/scheduler/serializer.py b/backend/backend/core/scheduler/serializer.py
index 1d4a3c75..0a3c375e 100644
--- a/backend/backend/core/scheduler/serializer.py
+++ b/backend/backend/core/scheduler/serializer.py
@@ -1,6 +1,4 @@
 from django.contrib.auth import get_user_model
-from django.db.models import Window, F
-from django.db.models.functions import RowNumber
 from rest_framework import serializers
 
 from backend.core.scheduler.models import TaskRunHistory
@@ -19,14 +17,20 @@ class TaskRunHistorySerializer(serializers.ModelSerializer):
 
     class Meta:
         model = TaskRunHistory
-        fields = "__all__"
+        fields = [
+            "id", "task_id", "status", "start_time", "end_time",
+            "trigger", "scope", "error_message", "result", "retry_num",
+            "user_task_detail",
+            "duration", "duration_ms", "run_number", "triggered_by",
+            "model_count", "failed_models", "skipped_count",
+        ]
 
     def _get_user_cache(self):
         """Batch-load users for all runs in one query, cached per serializer instance."""
         if not hasattr(self, "_user_cache"):
             user_ids = set()
             for obj in self.instance if hasattr(self.instance, '__iter__') else [self.instance]:
-                if obj and obj.kwargs and obj.kwargs.get("user_id"):
+                if obj and isinstance(obj.kwargs, dict) and obj.kwargs.get("user_id"):
                     user_ids.add(obj.kwargs["user_id"])
             if user_ids:
                 self._user_cache = {
@@ -58,27 +62,13 @@ def get_duration_ms(self, obj):
         return None
 
     def get_run_number(self, obj):
-        """Sequential run number within the job (1 = oldest)."""
-        if not hasattr(self, "_run_number_cache"):
-            self._run_number_cache = {}
-        task_detail_id = obj.user_task_detail_id
-        if task_detail_id not in self._run_number_cache:
-            annotated = (
-                TaskRunHistory.objects.filter(user_task_detail_id=task_detail_id)
-                .annotate(
-                    row_num=Window(
-                        expression=RowNumber(),
-                        order_by=F("start_time").asc(),
-                    )
-                )
-                .values_list("id", "row_num")
-            )
-            self._run_number_cache[task_detail_id] = dict(annotated)
-        return self._run_number_cache[task_detail_id].get(obj.id, 0)
+        """Sequential run number from view context (total - offset - idx)."""
+        run_numbers = self.context.get("run_numbers", {})
+        return run_numbers.get(obj.id, 0)
 
     def get_triggered_by(self, obj):
         """Resolve user_id from kwargs to username using batch-loaded cache."""
-        if not obj.kwargs:
+        if not isinstance(obj.kwargs, dict):
             return None
         user_id = obj.kwargs.get("user_id")
         if not user_id:
@@ -90,7 +80,7 @@ def get_triggered_by(self, obj):
                 "id": str(user.id),
                 "username": user.get_full_name() or user.username or user.email,
             }
-        return {"id": str(user_id), "username": str(user_id)}
+        return {"id": str(user_id), "username": "Unknown user"}
 
     def get_model_count(self, obj):
         """Total model count from result."""
diff --git a/backend/backend/core/scheduler/views.py b/backend/backend/core/scheduler/views.py
index 6df80b9d..8eadb9f5 100644
--- a/backend/backend/core/scheduler/views.py
+++ b/backend/backend/core/scheduler/views.py
@@ -600,10 +600,11 @@ def run_stats(request, project_id, user_task_id):
         last_24h = now - timedelta(hours=24)
         prev_24h_start = now - timedelta(hours=48)
 
-        # Success rate (7 days)
+        # Success rate (7 days) — only count completed runs in denominator
         runs_7d = runs.filter(start_time__gte=last_7d)
-        total_7d = runs_7d.count()
-        success_7d = runs_7d.filter(status="SUCCESS").count()
+        completed_7d = runs_7d.filter(status__in=["SUCCESS", "FAILURE"])
+        total_7d = completed_7d.count()
+        success_7d = completed_7d.filter(status="SUCCESS").count()
         success_rate = round((success_7d / total_7d * 100), 1) if total_7d > 0 else None
 
         # Average duration (successful runs, 7 days)
@@ -731,7 +732,15 @@ def task_run_history(request, project_id, user_task_id):
         total = runs.count()
 
         offset = (page - 1) * limit
-        serializer = TaskRunHistorySerializer(runs[offset : offset + limit], many=True)
+        page_qs = runs[offset : offset + limit]
+        # Compute run numbers from total and offset — no extra query needed
+        run_numbers = {
+            run.id: total - offset - idx
+            for idx, run in enumerate(page_qs)
+        }
+        serializer = TaskRunHistorySerializer(
+            page_qs, many=True, context={"run_numbers": run_numbers}
+        )
 
         return Response(
             {
diff --git a/backend/visitran/adapters/model.py b/backend/visitran/adapters/model.py
index f71c4f6d..085f4949 100644
--- a/backend/visitran/adapters/model.py
+++ b/backend/visitran/adapters/model.py
@@ -87,7 +87,7 @@ def _get_row_count_safe(self) -> Optional[int]:
                 table_name=self.model.destination_table_name,
             )
         except Exception as e:
-            logging.warning(f"Could not get row count for {self.model.destination_table_name}: {e}")
+            logging.info(f"Could not get row count for {self.model.destination_table_name}: {e}")
             return None
 
     @abstractmethod
diff --git a/backend/visitran/adapters/trino/connection.py b/backend/visitran/adapters/trino/connection.py
index 0349d83f..b7aaa4d1 100644
--- a/backend/visitran/adapters/trino/connection.py
+++ b/backend/visitran/adapters/trino/connection.py
@@ -219,7 +219,7 @@ def upsert_into_table(
             except Exception:
                 pass
         return {
-            "rows_affected": (inserted or 0) + (deleted or 0) if inserted is not None else None,
+            "rows_affected": inserted,
             "rows_inserted": inserted,
             "rows_deleted": deleted,
         }

From 25470e6d2902dd9cabbab8f761c5b245bd22e27f Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Mon, 27 Apr 2026 16:40:53 +0530
Subject: [PATCH 15/19] fix: cron label, per-model field names, duration parser
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Cron schedule_label: include all 5 fields (was missing day_of_month, month_of_year)
- Per-model table: rows_added→rows_inserted, rows_modified→rows_updated
  (match backend celery_tasks.py field names)
- parseDurationMs: handle serializer format ("1m 30s", "45.0s", "800ms")
  with fallback to HH:MM:SS
---
 backend/backend/core/scheduler/views.py     |  2 +-
 frontend/src/ide/run-history/Runhistory.jsx | 33 ++++++++++++++-------
 2 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/backend/backend/core/scheduler/views.py b/backend/backend/core/scheduler/views.py
index 8eadb9f5..f7cd2729 100644
--- a/backend/backend/core/scheduler/views.py
+++ b/backend/backend/core/scheduler/views.py
@@ -652,7 +652,7 @@ def run_stats(request, project_id, user_task_id):
                 if periodic.crontab:
                     schedule_type = "cron"
                     c = periodic.crontab
-                    schedule_label = f"{c.minute} {c.hour} {c.day_of_week}"
+                    schedule_label = f"{c.minute} {c.hour} {c.day_of_month} {c.month_of_year} {c.day_of_week}"
                 elif periodic.interval:
                     schedule_type = "interval"
                     schedule_label = f"Every {periodic.interval.every} {periodic.interval.period}"
diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index fd3b7520..aa215cf5 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -62,12 +62,25 @@ const formatDurationMs = (ms) => {
 const parseDurationMs = (d) => {
   if (!d) return 0;
   if (typeof d === "number") return d;
-  const p = d.split(":");
-  if (p.length !== 3) return 0;
-  return (
-    (parseInt(p[0], 10) * 3600 + parseInt(p[1], 10) * 60 + parseFloat(p[2])) *
-    1000
-  );
+  // Handle serializer format: "1m 30s", "45.0s", "800ms"
+  const str = String(d);
+  let ms = 0;
+  const minMatch = str.match(/([\d.]+)\s*m(?!s)/);
+  const secMatch = str.match(/([\d.]+)\s*s/);
+  const msMatch = str.match(/([\d.]+)\s*ms/);
+  if (msMatch) ms += parseFloat(msMatch[1]);
+  if (secMatch) ms += parseFloat(secMatch[1]) * 1000;
+  if (minMatch) ms += parseFloat(minMatch[1]) * 60000;
+  if (ms > 0) return ms;
+  // Fallback: HH:MM:SS format
+  const p = str.split(":");
+  if (p.length === 3) {
+    return (
+      (parseInt(p[0], 10) * 3600 + parseInt(p[1], 10) * 60 + parseFloat(p[2])) *
+      1000
+    );
+  }
+  return 0;
 };
 
 /* ── Sparkline SVG — plots real duration data points ── */
@@ -701,8 +714,8 @@ const Runhistory = () => {
       },
       {
         title: "Added",
-        dataIndex: "rows_added",
-        key: "rows_added",
+        dataIndex: "rows_inserted",
+        key: "rows_inserted",
         width: 90,
         align: "right",
         render: (v) =>
@@ -722,8 +735,8 @@ const Runhistory = () => {
       },
       {
         title: "Modified",
-        dataIndex: "rows_modified",
-        key: "rows_modified",
+        dataIndex: "rows_updated",
+        key: "rows_updated",
         width: 90,
         align: "right",
         render: (v) =>

From 923d615bdb0353f43b27e2fe96b8ddb310345e69 Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Tue, 28 Apr 2026 08:23:30 +0530
Subject: [PATCH 16/19] =?UTF-8?q?fix:=20zero=20rows=20now=20shows=200=20in?=
 =?UTF-8?q?stead=20of=20=E2=80=94=20(null)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Backend: add _sum_or_none() helper — returns None only when ALL model
values are None, returns 0 when sum is legitimately zero.

Frontend: replace `|| null` with `.some(m => m.field != null)` check.
A zero-row incremental run now correctly shows "0" instead of "—".
---
 .../backend/core/scheduler/celery_tasks.py    | 25 ++++++-------
 frontend/src/ide/run-history/Runhistory.jsx   | 35 +++++++++++--------
 2 files changed, 34 insertions(+), 26 deletions(-)

diff --git a/backend/backend/core/scheduler/celery_tasks.py b/backend/backend/core/scheduler/celery_tasks.py
index e7afbd28..4175a109 100644
--- a/backend/backend/core/scheduler/celery_tasks.py
+++ b/backend/backend/core/scheduler/celery_tasks.py
@@ -30,6 +30,15 @@
 
 logger = logging.getLogger(__name__)
 
+
+def _sum_or_none(results, attr):
+    """Sum an attribute across results. Return None only if ALL values are None,
+    return 0 if the sum is legitimately zero (not all missing)."""
+    values = [getattr(r, attr, None) for r in results]
+    if all(v is None for v in values):
+        return None
+    return sum(v or 0 for v in values)
+
 # Default max duration before a job is considered stuck (1 hour)
 DEFAULT_STUCK_JOB_THRESHOLD_SECONDS = 3600
 
@@ -373,18 +382,10 @@ def _clean_name(raw):
                 "total": len(user_results),
                 "passed": sum(1 for r in user_results if r.end_status == "OK"),
                 "failed": sum(1 for r in user_results if r.end_status == "FAIL"),
-                "rows_processed": sum(
-                    getattr(r, "rows_affected", 0) or 0 for r in user_results
-                ) or None,
-                "rows_added": sum(
-                    getattr(r, "rows_inserted", 0) or 0 for r in user_results
-                ) or None,
-                "rows_modified": sum(
-                    getattr(r, "rows_updated", 0) or 0 for r in user_results
-                ) or None,
-                "rows_deleted": sum(
-                    getattr(r, "rows_deleted", 0) or 0 for r in user_results
-                ) or None,
+                "rows_processed": _sum_or_none(user_results, "rows_affected"),
+                "rows_added": _sum_or_none(user_results, "rows_inserted"),
+                "rows_modified": _sum_or_none(user_results, "rows_updated"),
+                "rows_deleted": _sum_or_none(user_results, "rows_deleted"),
             }
         except Exception:
             _clear_base_result()
diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index aa215cf5..27510f9c 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -487,12 +487,15 @@ const Runhistory = () => {
           const nonEph = (r.result?.models || []).filter(
             (m) => m.type !== "ephemeral"
           );
-          const added =
-            nonEph.reduce((s, m) => s + (m.rows_inserted || 0), 0) || null;
-          const modified =
-            nonEph.reduce((s, m) => s + (m.rows_updated || 0), 0) || null;
-          const deleted =
-            nonEph.reduce((s, m) => s + (m.rows_deleted || 0), 0) || null;
+          const added = nonEph.some((m) => m.rows_inserted != null)
+            ? nonEph.reduce((s, m) => s + (m.rows_inserted || 0), 0)
+            : null;
+          const modified = nonEph.some((m) => m.rows_updated != null)
+            ? nonEph.reduce((s, m) => s + (m.rows_updated || 0), 0)
+            : null;
+          const deleted = nonEph.some((m) => m.rows_deleted != null)
+            ? nonEph.reduce((s, m) => s + (m.rows_deleted || 0), 0)
+            : null;
           if (added === null && modified === null && deleted === null)
             return <Text type="secondary">—</Text>;
           return (
@@ -636,14 +639,18 @@ const Runhistory = () => {
     const errorModelName = failedModels.length > 0 ? failedModels[0] : null;
 
     // Aggregate row-level changes — exclude ephemeral
-    const totalRowsProcessed =
-      models.reduce((sum, m) => sum + (m.rows_affected || 0), 0) || null;
-    const totalAdded =
-      models.reduce((sum, m) => sum + (m.rows_inserted || 0), 0) || null;
-    const totalModified =
-      models.reduce((sum, m) => sum + (m.rows_updated || 0), 0) || null;
-    const totalDeleted =
-      models.reduce((sum, m) => sum + (m.rows_deleted || 0), 0) || null;
+    const totalRowsProcessed = models.some((m) => m.rows_affected != null)
+      ? models.reduce((sum, m) => sum + (m.rows_affected || 0), 0)
+      : null;
+    const totalAdded = models.some((m) => m.rows_inserted != null)
+      ? models.reduce((sum, m) => sum + (m.rows_inserted || 0), 0)
+      : null;
+    const totalModified = models.some((m) => m.rows_updated != null)
+      ? models.reduce((sum, m) => sum + (m.rows_updated || 0), 0)
+      : null;
+    const totalDeleted = models.some((m) => m.rows_deleted != null)
+      ? models.reduce((sum, m) => sum + (m.rows_deleted || 0), 0)
+      : null;
 
     // Parse error into message + stack
     const errorLines = (run.error_message || "").split("\n");

From 6d9ee7c98c13eccffc9f761dc8139e32fc72052c Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Tue, 28 Apr 2026 09:03:43 +0530
Subject: [PATCH 17/19] fix: Databricks cursor safety, Postgres fallback
 return, search debounce

- Databricks: guard cursor.close() in try/except, use separate variable
  names for merge vs cleanup cursors to avoid shadowing in finally
- Postgres: _fallback_upsert path now returns {"rows_affected": None}
  instead of bare return (matches -> dict annotation)
- Search input: add 400ms debounce via local searchText state + useEffect
  timer (was firing API call on every keystroke)
---
 .../visitran/adapters/databricks/connection.py  | 13 ++++++++-----
 .../visitran/adapters/postgres/connection.py    |  2 +-
 frontend/src/ide/run-history/Runhistory.jsx     | 17 +++++++++++++++--
 3 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/backend/visitran/adapters/databricks/connection.py b/backend/visitran/adapters/databricks/connection.py
index 9be9d6f7..7fd14cce 100644
--- a/backend/visitran/adapters/databricks/connection.py
+++ b/backend/visitran/adapters/databricks/connection.py
@@ -277,10 +277,13 @@ def upsert_into_table(
                     VALUES ({insert_values})
             """
 
-            cursor = self.connection.raw_sql(merge_query)
-            _rc = cursor.rowcount if hasattr(cursor, "rowcount") else None
+            merge_cursor = self.connection.raw_sql(merge_query)
+            _rc = merge_cursor.rowcount if hasattr(merge_cursor, "rowcount") else None
             rowcount = _rc if (_rc is not None and _rc >= 0) else None
-            cursor.close()
+            try:
+                merge_cursor.close()
+            except Exception:
+                pass
             logging.info("Databricks MERGE completed for %s.%s", schema_name, table_name)
 
         except Exception as e:
@@ -291,8 +294,8 @@ def upsert_into_table(
             ) from e
         finally:
             try:
-                cursor = self.connection.raw_sql(f"DROP TABLE IF EXISTS {temp_table_fq}")
-                cursor.close()
+                cleanup_cursor = self.connection.raw_sql(f"DROP TABLE IF EXISTS {temp_table_fq}")
+                cleanup_cursor.close()
             except Exception:
                 pass
         return {"rows_affected": rowcount}
diff --git a/backend/visitran/adapters/postgres/connection.py b/backend/visitran/adapters/postgres/connection.py
index 2e69d4ec..ae567392 100644
--- a/backend/visitran/adapters/postgres/connection.py
+++ b/backend/visitran/adapters/postgres/connection.py
@@ -234,7 +234,7 @@ def upsert_into_table(
                 pass
             else:
                 self._fallback_upsert(schema_name, table_name, select_statement, key_columns)
-                return
+                return {"rows_affected": None}
 
         qi = self.quote_identifier
 
diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index 27510f9c..d687fdda 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -205,6 +205,7 @@ const Runhistory = () => {
     trigger: "",
     search: "",
   });
+  const [searchText, setSearchText] = useState("");
   const [datePreset, setDatePreset] = useState("24h");
   const [customDateRange, setCustomDateRange] = useState(null);
   const [showCustomDate, setShowCustomDate] = useState(false);
@@ -327,7 +328,19 @@ const Runhistory = () => {
     setExpandedRowKeys([]);
   }, [jobHistoryData]);
 
+  // Debounce search input — wait 400ms before updating filters
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      setFilters((p) => ({ ...p, search: searchText }));
+    }, 400);
+    return () => clearTimeout(timer);
+  }, [searchText]);
+
   const handleFilterChange = (key, value) => {
+    if (key === "search") {
+      setSearchText(value || "");
+      return;
+    }
     setFilters((p) => ({ ...p, [key]: value || "" }));
     if (key === "job")
       setSearchParams(
@@ -1627,8 +1640,8 @@ const Runhistory = () => {
                 size="small"
                 placeholder="Search runs..."
                 prefix={<SearchOutlined />}
-                value={filters.search}
-                onChange={(e) => handleFilterChange("search", e.target.value)}
+                value={searchText}
+                onChange={(e) => setSearchText(e.target.value || "")}
                 allowClear
               />
             </Col>

From 7ae287cef286a593d681a37f49d6b96738daf8aa Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Tue, 28 Apr 2026 21:22:07 +0530
Subject: [PATCH 18/19] fix: add missing useEffect dependencies (pageSize,
 fetchHistory, fetchStats)

All three are used inside the effect and should trigger a re-fetch
when they change. Both fetchHistory and fetchStats are already
useCallback'd so adding them as deps is safe.
---
 frontend/src/ide/run-history/Runhistory.jsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index d687fdda..3f977a62 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -319,6 +319,9 @@ const Runhistory = () => {
     filters.status,
     filters.trigger,
     filters.search,
+    pageSize,
+    fetchHistory,
+    fetchStats,
     datePreset,
     customDateRange,
   ]);

From 85ee5d9af00a82c21f1134e1896f3c47e7ebb66e Mon Sep 17 00:00:00 2001
From: wicky <130177258+wicky-zipstack@users.noreply.github.com>
Date: Thu, 30 Apr 2026 08:57:55 +0530
Subject: [PATCH 19/19] fix: add loading spinner to Retry button in run history
 table
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add retryLoading state to prevent double-clicks
- Table row: swap RedoOutlined → LoadingOutlined spinner while submitting
- Expanded row Re-run: loading + disabled props
- Add retryLoading to columns useMemo deps so spinner renders
- Tooltip shows "Submitting..." during loading
---
 frontend/src/ide/run-history/Runhistory.jsx | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/frontend/src/ide/run-history/Runhistory.jsx b/frontend/src/ide/run-history/Runhistory.jsx
index 3f977a62..769188e6 100644
--- a/frontend/src/ide/run-history/Runhistory.jsx
+++ b/frontend/src/ide/run-history/Runhistory.jsx
@@ -30,6 +30,7 @@ import {
   CopyOutlined,
   EyeOutlined,
   RedoOutlined,
+  LoadingOutlined,
   UpOutlined,
   DownOutlined,
   MinusOutlined,
@@ -216,6 +217,7 @@ const Runhistory = () => {
     project_id: "",
   });
   const orgId = selectedOrgId || "default_org";
+  const [retryLoading, setRetryLoading] = useState(false);
 
   /* ── APIs ── */
   const fetchStats = useCallback(
@@ -363,6 +365,8 @@ const Runhistory = () => {
     }
   };
   const handleRetry = async (taskId) => {
+    if (retryLoading) return;
+    setRetryLoading(true);
     try {
       await axios.post(
         `/api/v1/visitran/${orgId}/project/_all/jobs/trigger-periodic-task/${taskId}`,
@@ -373,10 +377,12 @@ const Runhistory = () => {
           },
         }
       );
-      notify({ type: "success", message: "Job submitted" });
+      notify({ type: "success", message: "Job triggered successfully" });
       setTimeout(handleRefresh, 2000);
     } catch (error) {
       notify({ error });
+    } finally {
+      setRetryLoading(false);
     }
   };
   const handleCopyError = (text) => {
@@ -612,11 +618,12 @@ const Runhistory = () => {
         key: "actions",
         width: 50,
         render: () => (
-          <Tooltip title="Retry run">
+          <Tooltip title={retryLoading ? "Submitting..." : "Retry run"}>
             <Button
               type="text"
               size="small"
-              icon={<RedoOutlined />}
+              icon={retryLoading ? <LoadingOutlined spin /> : <RedoOutlined />}
+              disabled={retryLoading}
               onClick={(e) => {
                 e.stopPropagation();
                 handleRetry(envInfo.id);
@@ -626,7 +633,7 @@ const Runhistory = () => {
         ),
       },
     ],
-    [stats, envInfo.id]
+    [stats, envInfo.id, retryLoading]
   );
 
   /* ── RunDetail (expanded row) ── */
@@ -851,6 +858,8 @@ const Runhistory = () => {
                 type="primary"
                 icon={<RedoOutlined />}
                 size="small"
+                loading={retryLoading}
+                disabled={retryLoading}
                 onClick={() => handleRetry(envInfo.id)}
               >
                 Re-run