@elevasis/ui 2.68.0 → 2.69.0

package/dist/{chunk-FK3K2VK2.js → chunk-YGCMMOY4.js}

@@ -1,24 +1,16 @@
 import { ZodFormRenderer } from './chunk-3MEXPLWT.js';
-import { ResourceHealthChart } from './chunk-LGKLC5MG.js';
 import { Graph_module_css_default, useDirectedChainHighlighting, useNodeSelection, useFitViewTrigger } from './chunk-HENXLGVD.js';
-import { AppShellCenteredContainer, AppShellLoader } from './chunk-GBXTRSAU.js';
-import { useCyberColors, GlowDot, JsonViewer, useExecuteResource, EmptyState, useDashboardMetrics, useResources, useTimeRangeDates, useUnresolvedErrors, useRecentExecutionsByResource, PageTitleCaption, HeroStatsRow, useCommandQueue, useScheduledTasks, TabCountBadge, useResourcesHealth } from './chunk-ZGCWTWBD.js';
-import { glassBase } from './chunk-R6NMRXNO.js';
-import { CardHeader } from './chunk-62GVNH5U.js';
-import { useInitialization } from './chunk-P45GQ3ZW.js';
+import { JsonViewer, useExecuteResource, useCyberColors, GlowDot } from './chunk-WXHAHKKI.js';
+import { glassBase } from './chunk-FLECOYUS.js';
 import { STATUS_COLORS, getStatusIcon, formatDuration, getStatusColors, AGENT_CONSTANTS, shouldAnimateEdge, TIMELINE_CONSTANTS, calculateBarPosition, CONTAINER_CONSTANTS, useExecutionPath, useUnifiedWorkflowLayout, WORKFLOW_CONSTANTS, useReactFlowAgent } from './chunk-BLXJEIQS.js';
-import { formatTimeAgo, formatRelativeTime } from './chunk-L3HFJFYF.js';
-import { getTimeRangeDates } from './chunk-Y6I3IC45.js';
-import { ResourceStatusColors } from './chunk-6SSQGWK7.js';
 import { memo, useMemo, useEffect, useState, useCallback, Fragment } from 'react';
-import { Paper, Stack, Text, Group, Badge, Box, useComputedColorScheme, Card, ActionIcon, Loader, SegmentedControl, Collapse, Button, Modal, Center, SimpleGrid, Title, Tabs, Grid, ThemeIcon } from '@mantine/core';
+import { Paper, Stack, Text, Group, Badge, Box, useComputedColorScheme, Card, ActionIcon, Loader, SegmentedControl, Collapse, Button, Modal } from '@mantine/core';
 import { jsxs, jsx, Fragment as Fragment$1 } from 'react/jsx-runtime';
 import { Position, Handle, getSmoothStepPath, BaseEdge as BaseEdge$1, EdgeLabelRenderer, Panel, useReactFlow, Controls, ReactFlowProvider, ReactFlow } from '@xyflow/react';
-import { IconPlayerPlay, IconPlayerStop, IconArrowsSplit, IconSquare, IconFocus2, IconChevronRight, IconArrowUpRight, IconLayoutDashboard, IconActivity, IconAlertTriangle, IconHandStop, IconCalendarEvent, IconCircleCheck, IconBrain, IconGitBranch, IconTool, IconWand, IconCheck, IconAlertCircle } from '@tabler/icons-react';
+import { IconPlayerPlay, IconPlayerStop, IconArrowsSplit, IconSquare, IconFocus2, IconChevronRight, IconTool, IconWand, IconBrain, IconCheck, IconAlertCircle } from '@tabler/icons-react';
 import '@xyflow/react/dist/style.css';
 import { z } from 'zod';
 import { notifications } from '@mantine/notifications';
-import '@mantine/charts/styles.css';
 
 var DOMAIN_COLORS = {
   primary: "var(--color-primary)",
@@ -375,82 +367,6 @@ function ExecutionStatusBadge({
     }
   );
 }
-function getRateColor(rate) {
-  if (rate >= 95) return "var(--color-success)";
-  if (rate >= 80) return "var(--color-warning)";
-  return "var(--color-error)";
-}
-function getMantineRateColor(rate) {
-  if (rate >= 95) return "green";
-  if (rate >= 80) return "yellow";
-  return "red";
-}
-function ExecutionStats({
-  totalExecutions,
-  successCount,
-  failureCount,
-  warningCount,
-  successRate,
-  align = "flex-end",
-  compact = false
-}) {
-  const cyberColors = useCyberColors();
-  if (totalExecutions === 0 && !compact) {
-    return null;
-  }
-  if (compact && totalExecutions === 0) {
-    return /* @__PURE__ */ jsxs(Group, { gap: 10, wrap: "nowrap", style: { width: "100%" }, children: [
-      /* @__PURE__ */ jsx(Text, { size: "md", fw: 700, ff: "monospace", c: "dimmed", style: { minWidth: 42 }, children: "\u2014" }),
-      /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", style: { whiteSpace: "nowrap" }, children: "No recent executions" })
-    ] });
-  }
-  if (compact) {
-    return /* @__PURE__ */ jsxs(Group, { gap: 10, wrap: "nowrap", style: { width: "100%" }, children: [
-      /* @__PURE__ */ jsxs(Group, { gap: 8, wrap: "nowrap", children: [
-        /* @__PURE__ */ jsxs(Text, { size: "md", fw: 700, ff: "monospace", style: { color: getRateColor(successRate), minWidth: 42 }, children: [
-          successRate,
-          "%"
-        ] }),
-        /* @__PURE__ */ jsxs(Group, { gap: 5, wrap: "nowrap", children: [
-          /* @__PURE__ */ jsx(GlowDot, { size: "sm", color: cyberColors.green }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, c: "green", children: successCount })
-        ] }),
-        failureCount > 0 && /* @__PURE__ */ jsxs(Group, { gap: 5, wrap: "nowrap", children: [
-          /* @__PURE__ */ jsx(GlowDot, { size: "sm", color: cyberColors.red }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, c: "red", children: failureCount })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", style: { whiteSpace: "nowrap" }, children: [
-        totalExecutions,
-        " ",
-        totalExecutions === 1 ? "run" : "runs"
-      ] })
-    ] });
-  }
-  return /* @__PURE__ */ jsxs(Stack, { gap: 2, align, style: { whiteSpace: "nowrap" }, children: [
-    /* @__PURE__ */ jsxs(Text, { size: "xs", c: "blue", children: [
-      totalExecutions,
-      " ",
-      totalExecutions === 1 ? "execution" : "executions"
-    ] }),
-    /* @__PURE__ */ jsxs(Text, { size: "xs", c: "green", children: [
-      successCount,
-      " success"
-    ] }),
-    warningCount != null && warningCount > 0 && /* @__PURE__ */ jsxs(Text, { size: "xs", c: "yellow", children: [
-      warningCount,
-      " warning"
-    ] }),
-    failureCount > 0 && /* @__PURE__ */ jsxs(Text, { size: "xs", c: "red", children: [
-      failureCount,
-      " failed"
-    ] }),
-    /* @__PURE__ */ jsxs(Text, { size: "xs", fw: 600, c: getMantineRateColor(successRate), children: [
-      successRate,
-      "% Success Rate"
-    ] })
-  ] });
-}
 function TimelineAxis({ totalDuration }) {
   const markers = [
     { position: 0, time: 0 },
@@ -1428,7 +1344,10 @@ function RunResourceButton({
   resourceId,
   resourceType,
   getInput,
+  baseInput,
   label,
+  title,
+  disabled,
   icon,
   color,
   onSuccess,
@@ -1441,7 +1360,7 @@ function RunResourceButton({
   const handleExecute = useCallback(
     async (input) => {
       try {
-        const result = await execute(input);
+        const result = await execute({ ...baseInput, ...input });
         setModalState(null);
         notifications.show({
           title: "Execution started",
@@ -1459,7 +1378,7 @@ function RunResourceButton({
         onError?.(error);
       }
     },
-    [execute, onSuccess, onError]
+    [execute, baseInput, onSuccess, onError]
   );
   const handleClick = useCallback(() => {
     const result = getInput();
@@ -1472,8 +1391,8 @@ function RunResourceButton({
     }
   }, [getInput, handleExecute]);
   return /* @__PURE__ */ jsxs(Fragment$1, { children: [
-    /* @__PURE__ */ jsx(Button, { leftSection: icon, color: resolvedColor, loading: isPending, onClick: handleClick, children: resolvedLabel }),
-    /* @__PURE__ */ jsx(Modal, { opened: modalState !== null, onClose: () => setModalState(null), children: modalState !== null && /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Button, { leftSection: icon, color: resolvedColor, loading: isPending, disabled, onClick: handleClick, children: resolvedLabel }),
+    /* @__PURE__ */ jsx(Modal, { opened: modalState !== null, onClose: () => setModalState(null), title: title ?? resolvedLabel, children: modalState !== null && /* @__PURE__ */ jsx(
       ZodFormRenderer,
       {
         schema: modalState.schema,
@@ -1485,619 +1404,81 @@ function RunResourceButton({
     ) })
   ] });
 }
-var DEFAULT_LIMIT = 6;
-var typeIcons = {
-  workflow: IconGitBranch,
-  agent: IconBrain
-};
-function ResourceCard({ resource, onClick }) {
-  const [hovered, setHovered] = useState(false);
-  const Icon = typeIcons[resource.type] ?? IconActivity;
-  const cyberColors = useCyberColors();
-  return /* @__PURE__ */ jsxs(
-    Card,
-    {
-      withBorder: true,
-      style: {
-        cursor: "pointer",
-        transition: "all 150ms ease",
-        borderColor: hovered ? "var(--border-primary-strong)" : "var(--color-border)",
-        boxShadow: hovered ? "var(--card-shadow), 0 0 12px color-mix(in srgb, var(--color-primary) 25%, transparent)" : "var(--card-shadow)",
-        transform: hovered ? "translateY(-1px)" : "none"
-      },
-      onMouseEnter: () => setHovered(true),
-      onMouseLeave: () => setHovered(false),
-      onClick,
-      children: [
-        /* @__PURE__ */ jsxs(Group, { justify: "space-between", mb: "sm", wrap: "nowrap", align: "flex-start", children: [
-          /* @__PURE__ */ jsxs(Group, { gap: "sm", wrap: "nowrap", style: { minWidth: 0 }, children: [
-            /* @__PURE__ */ jsx(ThemeIcon, { size: 32, radius: "md", variant: "light", children: /* @__PURE__ */ jsx(Icon, { size: 18 }) }),
-            /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, truncate: true, children: resource.name })
-          ] }),
-          resource.active && resource.execution ? (() => {
-            const rate = resource.execution.successRate;
-            const color = rate >= 95 ? cyberColors.green : rate >= 80 ? cyberColors.yellow : cyberColors.red;
-            return /* @__PURE__ */ jsxs(Group, { gap: 8, wrap: "nowrap", style: { flexShrink: 0 }, children: [
-              /* @__PURE__ */ jsxs(Text, { size: "xs", fw: 500, style: { color, letterSpacing: "0.03em" }, children: [
-                rate.toFixed(0),
-                "%"
-              ] }),
-              /* @__PURE__ */ jsx(GlowDot, { size: "md", color })
-            ] });
-          })() : null
-        ] }),
-        /* @__PURE__ */ jsxs(Group, { justify: "space-between", wrap: "nowrap", children: [
-          /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-            /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "light", children: resource.type }),
-            /* @__PURE__ */ jsx(
-              Badge,
-              {
-                size: "xs",
-                variant: "light",
-                color: ResourceStatusColors[resource.status],
-                children: resource.status
-              }
-            )
-          ] }),
-          resource.active && resource.execution ? /* @__PURE__ */ jsxs(Group, { gap: 4, wrap: "nowrap", style: { flexShrink: 0 }, children: [
-            /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-              resource.execution.totalExecutions,
-              " runs"
-            ] }),
-            /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "\xB7" }),
-            /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-              "Last run ",
-              formatTimeAgo(resource.execution.lastExecution)
-            ] })
-          ] }) : /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No recent activity" })
-        ] })
-      ]
-    }
-  );
-}
-function ResourceOverview({
-  recentExecutions,
-  allResources,
-  isLoading,
-  limit = DEFAULT_LIMIT,
-  onResourceClick
-}) {
-  const { displayResources, totalCount } = useMemo(() => {
-    const items = [];
-    const seenIds = /* @__PURE__ */ new Set();
-    const resourceLookup = /* @__PURE__ */ new Map();
-    if (allResources) {
-      for (const r of [...allResources.workflows, ...allResources.agents]) {
-        resourceLookup.set(r.resourceId, r);
-      }
-    }
-    if (recentExecutions) {
-      for (const exec of recentExecutions) {
-        const def = resourceLookup.get(exec.resourceId);
-        items.push({
-          resourceId: exec.resourceId,
-          name: def?.name ?? exec.resourceName ?? exec.resourceId,
-          type: def?.type ?? exec.resourceType ?? "",
-          status: def?.status ?? "dev",
-          active: true,
-          execution: exec
-        });
-        seenIds.add(exec.resourceId);
-      }
-    }
-    if (allResources) {
-      for (const r of [...allResources.workflows, ...allResources.agents]) {
-        if (!seenIds.has(r.resourceId)) {
-          items.push({
-            resourceId: r.resourceId,
-            name: r.name,
-            type: r.type,
-            status: r.status,
-            active: false
-          });
-          seenIds.add(r.resourceId);
-        }
-      }
-    }
-    return { displayResources: items.slice(0, limit), totalCount: items.length };
-  }, [recentExecutions, allResources, limit]);
-  const handleClick = (resource) => {
-    onResourceClick?.(resource);
-  };
-  return /* @__PURE__ */ jsxs(Paper, { withBorder: true, children: [
-    /* @__PURE__ */ jsx(
-      CardHeader,
-      {
-        icon: /* @__PURE__ */ jsx(IconLayoutDashboard, { size: 18 }),
-        title: "Resources",
-        subtitle: totalCount > limit ? `Showing ${limit} of ${totalCount}` : void 0,
-        rightSection: /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-          totalCount > 0 && /* @__PURE__ */ jsxs(Badge, { variant: "light", size: "sm", children: [
-            totalCount,
-            " total"
-          ] }),
-          /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", onClick: () => onResourceClick?.(displayResources[0]), children: /* @__PURE__ */ jsx(IconArrowUpRight, { size: 16 }) })
-        ] })
-      }
-    ),
-    isLoading ? /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }) : displayResources.length === 0 ? /* @__PURE__ */ jsx(EmptyState, { icon: IconLayoutDashboard, title: "No resources registered" }) : /* @__PURE__ */ jsx(SimpleGrid, { cols: { base: 1, sm: 2, lg: 3 }, children: displayResources.map((resource) => /* @__PURE__ */ jsx(ResourceCard, { resource, onClick: () => handleClick(resource) }, resource.resourceId)) })
-  ] });
+function getRateColor(rate) {
+  if (rate >= 95) return "var(--color-success)";
+  if (rate >= 80) return "var(--color-warning)";
+  return "var(--color-error)";
 }
-var severityColor = {
-  critical: "red",
-  warning: "yellow",
-  info: "blue"
-};
-function OperationsOverview({
-  timeRange,
-  onResourceClick,
-  onErrorsNavigate,
-  onCommandQueueNavigate,
-  onScheduledTasksNavigate,
-  renderTrendChart,
-  renderOperationalOverview
-}) {
-  const { organizationReady, error: initError } = useInitialization();
-  const { data: dashboardDataRaw, isLoading, error } = useDashboardMetrics(timeRange);
-  const dashboardData = dashboardDataRaw;
-  const { data: resourcesData, isLoading: resourcesLoading } = useResources();
-  const { startDate, endDate } = useTimeRangeDates(timeRange);
-  const { data: errorData, isLoading: errorsLoading } = useUnresolvedErrors({ startDate, endDate });
-  const { data: recentExecData, isLoading: recentExecLoading } = useRecentExecutionsByResource({
-    timeRange,
-    limit: 6
-  });
-  if (initError?.layer === "organization") {
-    return /* @__PURE__ */ jsx(AppShellCenteredContainer, { children: /* @__PURE__ */ jsxs(Stack, { align: "center", justify: "center", children: [
-      /* @__PURE__ */ jsx(Title, { order: 3, c: "dimmed", children: "No organization detected" }),
-      /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: initError?.message })
-    ] }) });
-  }
-  if (!organizationReady || isLoading || resourcesLoading) return /* @__PURE__ */ jsx(AppShellLoader, {});
-  return /* @__PURE__ */ jsxs(Fragment$1, { children: [
-    /* @__PURE__ */ jsx(PageTitleCaption, { title: "Overview", caption: "AI Operations Health & Performance" }),
-    /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
-      /* @__PURE__ */ jsx(
-        HeroStatsRow,
-        {
-          resourcesData,
-          resourcesLoading,
-          dashboardData,
-          dashboardLoading: isLoading,
-          unresolvedErrorCount: errorData?.total ?? null,
-          errorsLoading
-        }
-      ),
-      renderTrendChart?.(dashboardData?.executionHealth, isLoading, error ?? void 0)
-    ] }),
-    /* @__PURE__ */ jsx(
-      ResourceOverview,
-      {
-        recentExecutions: recentExecData?.resources,
-        allResources: resourcesData,
-        isLoading: resourcesLoading || recentExecLoading,
-        limit: 6,
-        onResourceClick: onResourceClick ? (resource) => onResourceClick({
-          resourceId: resource.resourceId,
-          resourceType: resource.type
-        }) : void 0
-      }
-    ),
-    renderOperationalOverview ? renderOperationalOverview({
-      timeRange,
-      onErrorsNavigate,
-      onCommandQueueNavigate,
-      onScheduledTasksNavigate
-    }) : /* @__PURE__ */ jsx(
-      DashboardOperationsOverview,
-      {
-        timeRange,
-        onErrorsNavigate,
-        onCommandQueueNavigate,
-        onScheduledTasksNavigate
-      }
-    )
-  ] });
+function getMantineRateColor(rate) {
+  if (rate >= 95) return "green";
+  if (rate >= 80) return "yellow";
+  return "red";
 }
-var Dashboard = OperationsOverview;
-function DashboardOperationsOverview({
-  timeRange,
-  onErrorsNavigate,
-  onCommandQueueNavigate,
-  onScheduledTasksNavigate
+function ExecutionStats({
+  totalExecutions,
+  successCount,
+  failureCount,
+  warningCount,
+  successRate,
+  align = "flex-end",
+  compact = false
 }) {
-  const { startDate, endDate } = useTimeRangeDates(timeRange);
-  const { data: errorData, isLoading: errorsLoading } = useUnresolvedErrors({ startDate, endDate });
-  const errors = errorData?.errors ?? [];
-  const errorCount = errorData?.total ?? 0;
-  const { data: allCommands } = useCommandQueue({ status: "pending", limit: 100 });
-  const commands = allCommands?.tasks ?? [];
-  const commandCount = commands.length;
-  const { data: allTasks, isLoading: tasksLoading } = useScheduledTasks();
-  const tasks = allTasks ?? [];
-  const now = /* @__PURE__ */ new Date();
-  const today = new Date(now.getFullYear(), now.getMonth(), now.getDate());
-  const { totalScheduled, upcomingTasks } = useMemo(() => {
-    const totalScheduled2 = tasks.filter((t) => t.status === "active").length;
-    const upcomingTasks2 = tasks.filter((t) => t.status === "active" && t.nextRunAt).sort((a, b) => new Date(a.nextRunAt).getTime() - new Date(b.nextRunAt).getTime()).slice(0, 5);
-    return { totalScheduled: totalScheduled2, upcomingTasks: upcomingTasks2 };
-  }, [tasks]);
-  const defaultTab = useMemo(() => {
-    if (errorCount > 0) return "errors";
-    if (commandCount > 0) return "commands";
-    if (totalScheduled > 0) return "scheduled";
-    return "errors";
-  }, [errorCount, commandCount, totalScheduled]);
-  const [activeTab, setActiveTab] = useState(null);
-  const effectiveTab = activeTab ?? defaultTab;
-  const formatDaysUntil = (runAt) => {
-    const diffMs = runAt.getTime() - now.getTime();
-    const diffDays = Math.floor(diffMs / (1e3 * 60 * 60 * 24));
-    const diffHours = Math.floor(diffMs / (1e3 * 60 * 60));
-    if (diffHours < 0) return "Overdue";
-    if (diffHours < 1) return "Soon";
-    if (diffDays === 0) return "Today";
-    if (diffDays === 1) return "Tomorrow";
-    if (diffDays <= 7) return `In ${diffDays}d`;
-    return `In ${Math.floor(diffDays / 7)}w`;
-  };
-  return /* @__PURE__ */ jsxs(Paper, { withBorder: true, children: [
-    /* @__PURE__ */ jsx(CardHeader, { icon: /* @__PURE__ */ jsx(IconActivity, { size: 18 }), title: "Operational Overview" }),
-    /* @__PURE__ */ jsxs(Tabs, { value: effectiveTab, onChange: setActiveTab, variant: "default", children: [
-      /* @__PURE__ */ jsxs(Tabs.List, { children: [
-        /* @__PURE__ */ jsx(
-          Tabs.Tab,
-          {
-            value: "errors",
-            leftSection: /* @__PURE__ */ jsx(IconAlertTriangle, { size: 16 }),
-            rightSection: /* @__PURE__ */ jsx(TabCountBadge, { count: errorCount, isLoading: errorsLoading }),
-            children: "Unresolved Errors"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Tabs.Tab,
-          {
-            value: "commands",
-            leftSection: /* @__PURE__ */ jsx(IconHandStop, { size: 16 }),
-            rightSection: /* @__PURE__ */ jsx(TabCountBadge, { count: commandCount }),
-            children: "Command Queue"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Tabs.Tab,
-          {
-            value: "scheduled",
-            leftSection: /* @__PURE__ */ jsx(IconCalendarEvent, { size: 16 }),
-            rightSection: /* @__PURE__ */ jsx(TabCountBadge, { count: totalScheduled, isLoading: tasksLoading }),
-            children: "Scheduled Tasks"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx(Tabs.Panel, { value: "errors", pt: "sm", children: errorsLoading ? /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }) : errors.length === 0 ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No unresolved errors" }) : /* @__PURE__ */ jsxs(Stack, { gap: 4, children: [
-        errors.map((error) => /* @__PURE__ */ jsx(
-          Box,
-          {
-            px: "sm",
-            py: 6,
-            onClick: onErrorsNavigate,
-            style: {
-              borderRadius: 4,
-              cursor: onErrorsNavigate ? "pointer" : "default"
-            },
-            children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", wrap: "nowrap", children: [
-              /* @__PURE__ */ jsxs(Group, { gap: "xs", wrap: "nowrap", style: { minWidth: 200, width: 200, flexShrink: 0 }, children: [
-                /* @__PURE__ */ jsx(
-                  Box,
-                  {
-                    style: {
-                      width: 8,
-                      height: 8,
-                      borderRadius: "50%",
-                      backgroundColor: `var(--mantine-color-${severityColor[error.severity]}-6)`,
-                      flexShrink: 0
-                    }
-                  }
-                ),
-                /* @__PURE__ */ jsxs(Stack, { gap: 0, style: { minWidth: 0 }, children: [
-                  /* @__PURE__ */ jsx(Text, { size: "xs", lineClamp: 1, children: error.resourceName || error.resourceId }),
-                  /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", lineClamp: 1, children: error.errorType })
-                ] })
-              ] }),
-              /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", lineClamp: 1, style: { flex: "1 1 auto", minWidth: 0 }, children: error.message }),
-              /* @__PURE__ */ jsxs(Group, { gap: 4, wrap: "nowrap", style: { flexShrink: 0 }, children: [
-                /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "light", color: severityColor[error.severity], children: error.severity }),
-                /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: formatTimeAgo(error.timestamp) })
-              ] })
-            ] })
-          },
-          error.id
-        )),
-        errorCount > 5 && /* @__PURE__ */ jsx(
-          Group,
-          {
-            gap: 4,
-            justify: "center",
-            pt: 4,
-            onClick: onErrorsNavigate,
-            style: { cursor: onErrorsNavigate ? "pointer" : "default" },
-            children: /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "See all errors" })
-          }
-        )
-      ] }) }),
-      /* @__PURE__ */ jsx(Tabs.Panel, { value: "commands", pt: "sm", children: commands.length === 0 ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No pending decisions" }) : /* @__PURE__ */ jsx(Stack, { gap: 4, children: commands.slice(0, 5).map((task) => /* @__PURE__ */ jsx(
-        Box,
-        {
-          px: "sm",
-          py: 6,
-          onClick: onCommandQueueNavigate,
-          style: {
-            borderRadius: 4,
-            cursor: onCommandQueueNavigate ? "pointer" : "default"
-          },
-          children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", wrap: "nowrap", children: [
-            /* @__PURE__ */ jsxs(Group, { gap: "xs", wrap: "nowrap", style: { minWidth: 0 }, children: [
-              /* @__PURE__ */ jsx(
-                Box,
-                {
-                  style: {
-                    width: 8,
-                    height: 8,
-                    borderRadius: "50%",
-                    backgroundColor: `var(--mantine-color-${task.priority >= 8 ? "red" : task.priority >= 4 ? "yellow" : "blue"}-6)`,
-                    flexShrink: 0
-                  }
-                }
-              ),
-              /* @__PURE__ */ jsx(Text, { size: "xs", lineClamp: 1, children: task.description || "No description" })
-            ] }),
-            /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "light", children: task.status })
-          ] })
-        },
-        task.id
-      )) }) }),
-      /* @__PURE__ */ jsx(Tabs.Panel, { value: "scheduled", pt: "sm", children: tasksLoading ? /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }) : upcomingTasks.length === 0 ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No scheduled tasks" }) : /* @__PURE__ */ jsx(Stack, { gap: 4, children: upcomingTasks.map((task) => {
-        const runAt = new Date(task.nextRunAt);
-        const daysUntilNum = Math.floor((runAt.getTime() - today.getTime()) / (1e3 * 60 * 60 * 24));
-        return /* @__PURE__ */ jsx(
-          Box,
-          {
-            px: "sm",
-            py: 6,
-            onClick: onScheduledTasksNavigate,
-            style: {
-              borderRadius: 4,
-              cursor: onScheduledTasksNavigate ? "pointer" : "default"
-            },
-            children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", wrap: "nowrap", children: [
-              /* @__PURE__ */ jsxs(Group, { gap: "xs", wrap: "nowrap", style: { minWidth: 0 }, children: [
-                /* @__PURE__ */ jsx(
-                  Box,
-                  {
-                    style: {
-                      width: 8,
-                      height: 8,
-                      borderRadius: "50%",
-                      backgroundColor: `var(--mantine-color-${daysUntilNum < 0 ? "red" : daysUntilNum <= 1 ? "yellow" : "blue"}-6)`,
-                      flexShrink: 0
-                    }
-                  }
-                ),
-                /* @__PURE__ */ jsx(Text, { size: "xs", truncate: true, children: task.name || task.target.resourceId })
-              ] }),
-              /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "light", color: daysUntilNum <= 1 ? void 0 : "gray", children: formatDaysUntil(runAt) })
-            ] })
-          },
-          task.id
-        );
-      }) }) })
-    ] })
-  ] });
-}
-var entityTypeConfig = {
-  workflow: { icon: IconGitBranch, hasPath: true },
-  agent: { icon: IconBrain, hasPath: true }
-};
-function getEntityConfig(entityType) {
-  return entityTypeConfig[entityType] || { icon: IconActivity, hasPath: false };
-}
-function RecentExecutionsByResource({ timeRange, limit = 5, onResourceClick }) {
-  const { data, isLoading, isFetching, error } = useRecentExecutionsByResource({
-    timeRange,
-    limit
-  });
-  const showLoading = (isLoading || isFetching) && !data;
-  const { data: resourcesData } = useResources();
-  const resourceDefLookup = useMemo(() => {
-    if (!resourcesData) return /* @__PURE__ */ new Map();
-    const allResources = [...resourcesData.workflows || [], ...resourcesData.agents || []];
-    return new Map(allResources.map((r) => [r.resourceId, r]));
-  }, [resourcesData]);
-  const enrichedExecutions = useMemo(() => {
-    if (!data?.resources) return [];
-    return data.resources.map((exec) => {
-      const resourceDef = resourceDefLookup.get(exec.resourceId);
-      return {
-        ...exec,
-        resourceType: resourceDef?.type || "",
-        resourceName: resourceDef?.name || exec.resourceId
-      };
-    });
-  }, [data, resourceDefLookup]);
-  const resourceIds = useMemo(
-    () => enrichedExecutions.map((r) => ({
-      entityType: r.resourceType,
-      entityId: r.resourceId
-    })),
-    [enrichedExecutions]
-  );
-  const { startDate, endDate } = useMemo(() => getTimeRangeDates(timeRange), [timeRange]);
-  const granularity = timeRange === "1h" || timeRange === "24h" ? "hour" : "day";
-  const { data: healthData } = useResourcesHealth({
-    resources: resourceIds,
-    startDate,
-    endDate,
-    granularity
-  });
-  const healthLookup = useMemo(() => {
-    if (!healthData?.resources) return /* @__PURE__ */ new Map();
-    return new Map(healthData.resources.map((r) => [`${r.entityType}-${r.entityId}`, r]));
-  }, [healthData]);
-  const handleResourceClick = (resource) => {
-    const config = getEntityConfig(resource.resourceType);
-    if (config.hasPath) {
-      onResourceClick?.({ resourceType: resource.resourceType, resourceId: resource.resourceId });
-    }
-  };
-  if (showLoading) {
-    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) });
-  }
-  if (error) {
-    return /* @__PURE__ */ jsx(Center, { py: "md", children: /* @__PURE__ */ jsxs(Text, { size: "sm", c: "red.6", children: [
-      "Failed to load: ",
-      error.message
-    ] }) });
+  const cyberColors = useCyberColors();
+  if (totalExecutions === 0 && !compact) {
+    return null;
   }
-  if (enrichedExecutions.length === 0) {
-    return /* @__PURE__ */ jsx(EmptyState, { icon: IconPlayerPlay, title: "No executions in this time range" });
+  if (compact && totalExecutions === 0) {
+    return /* @__PURE__ */ jsxs(Group, { gap: 10, wrap: "nowrap", style: { width: "100%" }, children: [
+      /* @__PURE__ */ jsx(Text, { size: "md", fw: 700, ff: "monospace", c: "dimmed", style: { minWidth: 42 }, children: "\u2014" }),
+      /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", style: { whiteSpace: "nowrap" }, children: "No recent executions" })
+    ] });
   }
-  return /* @__PURE__ */ jsx(Stack, { gap: "sm", children: enrichedExecutions.map((resource) => {
-    const config = getEntityConfig(resource.resourceType);
-    const Icon = config.icon;
-    const resourceKey = `${resource.resourceType}-${resource.resourceId}`;
-    const resourceHealth = healthLookup.get(resourceKey);
-    const resourceDef = resourceDefLookup.get(resource.resourceId);
-    return /* @__PURE__ */ jsx(
-      Card,
-      {
-        withBorder: true,
-        style: {
-          cursor: config.hasPath ? "pointer" : "default",
-          transition: "box-shadow var(--duration-fast) var(--easing)"
-        },
-        onClick: () => handleResourceClick(resource),
-        children: /* @__PURE__ */ jsxs(Grid, { gutter: "sm", align: "center", children: [
-          /* @__PURE__ */ jsx(Grid.Col, { span: 8, children: /* @__PURE__ */ jsxs(Group, { gap: "sm", wrap: "nowrap", children: [
-            /* @__PURE__ */ jsx(Icon, { size: 24, color: "var(--color-primary)" }),
-            /* @__PURE__ */ jsxs(Stack, { gap: 4, style: { flex: 1, minWidth: 0 }, children: [
-              /* @__PURE__ */ jsx(Text, { size: "sm", fw: 500, truncate: true, children: resource.resourceName }),
-              resourceDef?.description && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", truncate: true, children: resourceDef.description }),
-              /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-                resourceDef?.version && /* @__PURE__ */ jsxs(Badge, { variant: "outline", size: "xs", children: [
-                  "v",
-                  resourceDef.version
-                ] }),
-                resourceDef?.status && /* @__PURE__ */ jsx(Badge, { color: ResourceStatusColors[resourceDef.status], variant: "outline", size: "xs", children: resourceDef.status.toUpperCase() })
-              ] }),
-              /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-                "Last run ",
-                formatRelativeTime(resource.lastExecution)
-              ] })
-            ] })
-          ] }) }),
-          /* @__PURE__ */ jsx(Grid.Col, { span: 4, children: /* @__PURE__ */ jsxs(Group, { justify: "flex-end", gap: "md", wrap: "nowrap", children: [
-            /* @__PURE__ */ jsx(
-              ExecutionStats,
-              {
-                totalExecutions: resource.totalExecutions,
-                successCount: resource.successCount,
-                failureCount: resource.failureCount,
-                warningCount: resource.warningCount,
-                successRate: resource.successRate
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              ResourceHealthChart,
-              {
-                healthData: resourceHealth,
-                hasExecutions: resource.totalExecutions > 0,
-                width: 300,
-                height: 60
-              }
-            )
-          ] }) })
+  if (compact) {
+    return /* @__PURE__ */ jsxs(Group, { gap: 10, wrap: "nowrap", style: { width: "100%" }, children: [
+      /* @__PURE__ */ jsxs(Group, { gap: 8, wrap: "nowrap", children: [
+        /* @__PURE__ */ jsxs(Text, { size: "md", fw: 700, ff: "monospace", style: { color: getRateColor(successRate), minWidth: 42 }, children: [
+          successRate,
+          "%"
+        ] }),
+        /* @__PURE__ */ jsxs(Group, { gap: 5, wrap: "nowrap", children: [
+          /* @__PURE__ */ jsx(GlowDot, { size: "sm", color: cyberColors.green }),
+          /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, c: "green", children: successCount })
+        ] }),
+        failureCount > 0 && /* @__PURE__ */ jsxs(Group, { gap: 5, wrap: "nowrap", children: [
+          /* @__PURE__ */ jsx(GlowDot, { size: "sm", color: cyberColors.red }),
+          /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, c: "red", children: failureCount })
         ] })
-      },
-      resource.resourceId
-    );
-  }) });
-}
-var severityColor2 = {
-  critical: "red",
-  warning: "yellow",
-  info: "blue"
-};
-function UnresolvedErrorsTeaser({ timeRange, onNavigateToAllErrors }) {
-  const { startDate, endDate } = useTimeRangeDates(timeRange);
-  const { data, isLoading } = useUnresolvedErrors({ startDate, endDate });
-  const errors = data?.errors ?? [];
-  const total = data?.total ?? 0;
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(
-      Paper,
-      {
-        style: {
-          background: "var(--glass-background)",
-          backdropFilter: "var(--glass-blur)",
-          border: "1px solid var(--color-border)",
-          borderRadius: 8
-        },
-        children: /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) })
-      }
-    );
+      ] }),
+      /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", style: { whiteSpace: "nowrap" }, children: [
+        totalExecutions,
+        " ",
+        totalExecutions === 1 ? "run" : "runs"
+      ] })
+    ] });
   }
-  return /* @__PURE__ */ jsxs(
-    Paper,
-    {
-      style: {
-        background: "var(--glass-background)",
-        backdropFilter: "var(--glass-blur)",
-        border: "1px solid var(--color-border)",
-        borderRadius: 8
-      },
-      children: [
-        /* @__PURE__ */ jsxs(Group, { justify: "space-between", mb: errors.length > 0 ? "sm" : 0, children: [
-          /* @__PURE__ */ jsxs(Group, { gap: "sm", children: [
-            /* @__PURE__ */ jsx(ThemeIcon, { size: 28, radius: "md", variant: "light", color: total > 0 ? "red" : "green", children: total > 0 ? /* @__PURE__ */ jsx(IconAlertTriangle, { size: 16 }) : /* @__PURE__ */ jsx(IconCircleCheck, { size: 16 }) }),
-            /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, children: "Unresolved Errors" })
-          ] }),
-          /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-            total > 0 && /* @__PURE__ */ jsxs(Badge, { size: "xs", variant: "light", color: "red", children: [
-              total,
-              " unresolved"
-            ] }),
-            /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", onClick: onNavigateToAllErrors, children: /* @__PURE__ */ jsx(IconArrowUpRight, { size: 14 }) })
-          ] })
-        ] }),
-        errors.length === 0 && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No unresolved errors" }),
-        errors.length > 0 && /* @__PURE__ */ jsx(Stack, { gap: 4, children: errors.map((error) => /* @__PURE__ */ jsx(
-          Box,
-          {
-            px: "sm",
-            py: 6,
-            onClick: onNavigateToAllErrors,
-            style: {
-              borderLeft: `2px solid var(--mantine-color-${severityColor2[error.severity]}-6)`,
-              borderRadius: 4,
-              cursor: onNavigateToAllErrors ? "pointer" : "default",
-              textDecoration: "none",
-              color: "inherit"
-            },
-            children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", wrap: "nowrap", children: [
-              /* @__PURE__ */ jsxs(Stack, { gap: 0, style: { minWidth: 0 }, children: [
-                /* @__PURE__ */ jsx(Text, { size: "xs", lineClamp: 1, children: error.resourceName || error.resourceId }),
-                /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", lineClamp: 1, children: error.errorType })
-              ] }),
-              /* @__PURE__ */ jsxs(Group, { gap: 4, wrap: "nowrap", style: { flexShrink: 0 }, children: [
-                /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "light", color: severityColor2[error.severity], children: error.severity }),
-                /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: formatTimeAgo(error.timestamp) })
-              ] })
-            ] })
-          },
-          error.id
-        )) })
-      ]
-    }
-  );
+  return /* @__PURE__ */ jsxs(Stack, { gap: 2, align, style: { whiteSpace: "nowrap" }, children: [
+    /* @__PURE__ */ jsxs(Text, { size: "xs", c: "blue", children: [
+      totalExecutions,
+      " ",
+      totalExecutions === 1 ? "execution" : "executions"
+    ] }),
+    /* @__PURE__ */ jsxs(Text, { size: "xs", c: "green", children: [
+      successCount,
+      " success"
+    ] }),
+    warningCount != null && warningCount > 0 && /* @__PURE__ */ jsxs(Text, { size: "xs", c: "yellow", children: [
+      warningCount,
+      " warning"
+    ] }),
+    failureCount > 0 && /* @__PURE__ */ jsxs(Text, { size: "xs", c: "red", children: [
+      failureCount,
+      " failed"
+    ] }),
+    /* @__PURE__ */ jsxs(Text, { size: "xs", fw: 600, c: getMantineRateColor(successRate), children: [
+      successRate,
+      "% Success Rate"
+    ] })
+  ] });
 }
 
-export { AgentExecutionTimeline, AgentExecutionVisualizer, AgentIterationDetailPanel, AgentIterationEdge, AgentIterationNode, BaseEdge, BaseNode, CollapsibleJsonSection, Dashboard, DashboardOperationsOverview, EmptyVisualizer, ExecutionStats, ExecutionStatusBadge, GraphBackground, GraphContainer, GraphFitViewButton, GraphFitViewHandler, GraphLegend, OperationsOverview, RecentExecutionsByResource, ResourceOverview, RunResourceButton, TimelineAxis, TimelineBar, TimelineContainer, TimelineRow, UnifiedWorkflowEdge, UnifiedWorkflowGraph, UnifiedWorkflowNode, UnresolvedErrorsTeaser, VisualizerContainer, WorkflowExecutionTimeline, getGraphBackgroundStyles, useGraphBackgroundStyles, useGraphTheme };
+export { AgentExecutionTimeline, AgentExecutionVisualizer, AgentIterationDetailPanel, AgentIterationEdge, AgentIterationNode, BaseEdge, BaseNode, CollapsibleJsonSection, EmptyVisualizer, ExecutionStats, ExecutionStatusBadge, GraphBackground, GraphContainer, GraphFitViewButton, GraphFitViewHandler, GraphLegend, RunResourceButton, TimelineAxis, TimelineBar, TimelineContainer, TimelineRow, UnifiedWorkflowEdge, UnifiedWorkflowGraph, UnifiedWorkflowNode, VisualizerContainer, WorkflowExecutionTimeline, getGraphBackgroundStyles, useGraphBackgroundStyles, useGraphTheme };