@elevasis/ui 2.34.0 → 2.36.0

package/dist/chunk-LRWTWOGP.js

@@ -1,1778 +0,0 @@
-import { CyberAreaChart, CostTrendChart, ActivityTrendChart } from './chunk-LAWLB6CT.js';
-import { AppShellLoader } from './chunk-RYTEQBAO.js';
-import { FilterBar } from './chunk-PDHTXPSF.js';
-import { CustomModal } from './chunk-R66W5UDG.js';
-import { formatDuration } from './chunk-E4WQGJNS.js';
-import { useResolveError, useResolveAllErrors, usePaginationState, useErrorDetails, useMarkAsRead, useExecutionLogsFilters, useExecutionLogs, useExecutionHealth, useErrorAnalysis, useTimeRangeDates, useErrorDetail, useResolveErrorsByExecution, useResources, useCostTrends, useCostSummary, useCostByModel, useCostBreakdown, useActivityFilters, useActivityTrend, useActivities, useNotifications, useMarkAllAsRead } from './chunk-IGDYWFNE.js';
-import { CenteredErrorState, CardHeader, StatsCardSkeleton, TrendIndicator, DetailCardSkeleton, EmptyState, PageTitleCaption, JsonViewer } from './chunk-HRWLKKWM.js';
-import { useRouterContext } from './chunk-Q7DJKLEN.js';
-import { formatBucketTime, PAGE_SIZE_DEFAULT, getTimeRangeDates } from './chunk-2RJMVWFJ.js';
-import { useState, useMemo, useCallback } from 'react';
-import { Table, Text, Badge, Tooltip, Card, Group, Select, SegmentedControl, Button, TextInput, Stack, Paper, Center, Loader, ActionIcon, NumberFormatter, Box, Alert, Switch, Pagination, UnstyledButton, Title, Divider, Code, CopyButton, Accordion } from '@mantine/core';
-import { IconActivity, IconFilterOff, IconCircleCheck, IconThumbDown, IconThumbUp, IconClock, IconCircleX, IconSearch, IconArrowUpRight, IconAlertTriangle, IconAlertCircle, IconExternalLink, IconChartPie, IconHeartbeat, IconDownload, IconCpu, IconTrendingUp, IconChartBar, IconCash, IconInfoCircle, IconExclamationCircle, IconBug, IconChecks, IconCircle, IconCircleFilled, IconCheck, IconCopy, IconCircleDashed, IconArrowUp, IconArrowDown, IconFileOff, IconRobot, IconKey, IconUser } from '@tabler/icons-react';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { formatDistanceToNow } from 'date-fns';
-
-function formatStartTime(timestamp) {
-  return new Date(timestamp).toLocaleString("en-US", {
-    month: "short",
-    day: "numeric",
-    hour: "numeric",
-    minute: "2-digit"
-  });
-}
-function getStatusConfig(status) {
-  switch (status) {
-    case "running":
-      return {
-        icon: /* @__PURE__ */ jsx(IconCircle, { size: 14, color: "var(--color-primary)" }),
-        label: "Running",
-        color: "blue"
-      };
-    case "completed":
-      return {
-        icon: /* @__PURE__ */ jsx(IconCircleCheck, { size: 14, color: "var(--color-success)" }),
-        label: "Completed",
-        color: "green"
-      };
-    case "failed":
-      return {
-        icon: /* @__PURE__ */ jsx(IconCircleX, { size: 14, color: "var(--color-error)" }),
-        label: "Failed",
-        color: "red"
-      };
-    case "warning":
-      return {
-        icon: /* @__PURE__ */ jsx(IconAlertTriangle, { size: 14, color: "var(--color-warning)" }),
-        label: "Warning",
-        color: "yellow"
-      };
-    case "pending":
-    default:
-      return {
-        icon: /* @__PURE__ */ jsx(IconCircle, { size: 14, color: "var(--mantine-color-gray-6)" }),
-        label: "Pending",
-        color: "gray"
-      };
-  }
-}
-function LoadingState() {
-  return /* @__PURE__ */ jsx(Center, { py: "xl", children: /* @__PURE__ */ jsx(Loader, { size: "md" }) });
-}
-function EmptyState2() {
-  return /* @__PURE__ */ jsx(Center, { py: "xl", children: /* @__PURE__ */ jsxs(Stack, { align: "center", gap: "xs", children: [
-    /* @__PURE__ */ jsx(IconFileOff, { size: 48, color: "var(--color-text-subtle)" }),
-    /* @__PURE__ */ jsx(Text, { size: "lg", fw: 500, c: "dimmed", children: "No executions found" }),
-    /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Executions will appear here when workflows or agents are run" })
-  ] }) });
-}
-function ExecutionLogsTable({ executions, isLoading, onRowClick }) {
-  const handleRowClick = (execution) => {
-    onRowClick?.({
-      resourceType: execution.resourceType,
-      resourceId: execution.resourceId,
-      executionId: execution.id
-    });
-  };
-  return /* @__PURE__ */ jsxs(Table, { highlightOnHover: true, children: [
-    /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-      /* @__PURE__ */ jsx(Table.Th, { children: "Resource" }),
-      /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
-      /* @__PURE__ */ jsx(Table.Th, { children: "Started" }),
-      /* @__PURE__ */ jsx(Table.Th, { ta: "right", children: "Duration" }),
-      /* @__PURE__ */ jsx(Table.Th, { ta: "center", children: "Env" }),
-      /* @__PURE__ */ jsx(Table.Th, { ta: "center", children: "Version" })
-    ] }) }),
-    /* @__PURE__ */ jsx(Table.Tbody, { children: isLoading ? /* @__PURE__ */ jsx(Table.Tr, { children: /* @__PURE__ */ jsx(Table.Td, { colSpan: 6, children: /* @__PURE__ */ jsx(LoadingState, {}) }) }) : executions.length === 0 ? /* @__PURE__ */ jsx(Table.Tr, { children: /* @__PURE__ */ jsx(Table.Td, { colSpan: 6, children: /* @__PURE__ */ jsx(EmptyState2, {}) }) }) : executions.map((execution) => {
-      const statusConfig3 = getStatusConfig(execution.status);
-      return /* @__PURE__ */ jsxs(
-        Table.Tr,
-        {
-          style: { cursor: onRowClick ? "pointer" : void 0 },
-          onClick: () => handleRowClick(execution),
-          children: [
-            /* @__PURE__ */ jsx(Table.Td, { style: { maxWidth: 200 }, children: /* @__PURE__ */ jsx(Text, { size: "sm", lineClamp: 1, title: execution.resourceName, children: execution.resourceName }) }),
-            /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { color: statusConfig3.color, variant: "light", size: "sm", leftSection: statusConfig3.icon, children: statusConfig3.label }) }),
-            /* @__PURE__ */ jsx(Table.Td, { style: { whiteSpace: "nowrap" }, children: /* @__PURE__ */ jsx(Text, { size: "sm", children: formatStartTime(execution.startTime) }) }),
-            /* @__PURE__ */ jsx(Table.Td, { ta: "right", children: /* @__PURE__ */ jsx(Text, { size: "sm", c: execution.status === "running" ? "dimmed" : void 0, children: formatDuration(execution.duration) }) }),
-            /* @__PURE__ */ jsx(Table.Td, { ta: "center", children: /* @__PURE__ */ jsx(Badge, { color: execution.resourceStatus === "prod" ? "green" : "gray", variant: "light", size: "sm", children: execution.resourceStatus.toUpperCase() }) }),
-            /* @__PURE__ */ jsx(Table.Td, { ta: "center", children: /* @__PURE__ */ jsx(
-              Tooltip,
-              {
-                label: `Resource: ${execution.resourceVersion ?? "-"}
-API: ${execution.apiVersion ?? "-"}
-SDK: ${execution.sdkVersion ?? "-"}`,
-                multiline: true,
-                position: "left",
-                children: /* @__PURE__ */ jsx(Text, { size: "sm", ff: "monospace", c: "dimmed", style: { cursor: "help" }, children: execution.resourceVersion ?? "-" })
-              }
-            ) })
-          ]
-        },
-        execution.id
-      );
-    }) })
-  ] });
-}
-var resourceOptions = [{ value: "", label: "All Resources" }];
-var statusOptions = [
-  { value: "all", label: "All" },
-  { value: "running", label: "Running" },
-  { value: "completed", label: "Completed" },
-  { value: "warning", label: "Warning" },
-  { value: "failed", label: "Failed" }
-];
-var environmentOptions = [
-  { value: "all", label: "All" },
-  { value: "dev", label: "Dev" },
-  { value: "prod", label: "Prod" }
-];
-function ExecutionLogsFilters({ filters, onFilterChange, onReset }) {
-  const hasActiveFilters = filters.resourceId !== void 0 || filters.status !== "all" || filters.resourceStatus !== "all";
-  return /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(Group, { gap: "md", wrap: "wrap", children: [
-    /* @__PURE__ */ jsx(
-      Select,
-      {
-        placeholder: "Resource",
-        data: resourceOptions,
-        value: filters.resourceId ?? "",
-        onChange: (value) => onFilterChange("resourceId", value === "" || value === null ? void 0 : value),
-        style: { minWidth: 180 }
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      SegmentedControl,
-      {
-        data: statusOptions,
-        value: filters.status,
-        onChange: (value) => onFilterChange("status", value)
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      SegmentedControl,
-      {
-        data: environmentOptions,
-        value: filters.resourceStatus,
-        onChange: (value) => onFilterChange("resourceStatus", value)
-      }
-    ),
-    hasActiveFilters && /* @__PURE__ */ jsx(Button, { variant: "subtle", color: "gray", leftSection: /* @__PURE__ */ jsx(IconFilterOff, { size: 16 }), onClick: onReset, children: "Reset" })
-  ] }) });
-}
-var statusConfig = {
-  success: { color: "green", icon: IconCircleCheck },
-  failure: { color: "red", icon: IconCircleX },
-  pending: { color: "yellow", icon: IconClock },
-  approved: { color: "green", icon: IconThumbUp },
-  rejected: { color: "red", icon: IconThumbDown },
-  completed: { color: "blue", icon: IconCircleCheck }
-};
-var activityTypeLabels = {
-  workflow_execution: "Workflow",
-  agent_run: "Agent",
-  hitl_action: "HITL Action",
-  webhook_received: "Webhook In",
-  webhook_executed: "Webhook Out",
-  webhook_failed: "Webhook Fail",
-  credential_change: "Credential",
-  credential_read: "Credential Read",
-  api_key_change: "API Key",
-  deployment_change: "Deployment",
-  membership_change: "Membership"
-};
-function getActorDisplay(actorType) {
-  switch (actorType) {
-    case "user":
-      return { label: "User", color: "blue", icon: IconUser };
-    case "api_key":
-      return { label: "API Key", color: "violet", icon: IconKey };
-    default:
-      return { label: "System", color: "gray", icon: IconRobot };
-  }
-}
-var COLUMN_COUNT = 6;
-function LoadingState2() {
-  return /* @__PURE__ */ jsx(Center, { py: "xl", children: /* @__PURE__ */ jsx(Loader, { size: "md" }) });
-}
-function EmptyState3() {
-  return /* @__PURE__ */ jsx(Center, { py: "xl", children: /* @__PURE__ */ jsxs(Stack, { align: "center", gap: "xs", children: [
-    /* @__PURE__ */ jsx(IconFileOff, { size: 48, color: "var(--color-text-subtle)" }),
-    /* @__PURE__ */ jsx(Text, { size: "lg", fw: 500, c: "dimmed", children: "No activities found" }),
-    /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Activities will appear here as workflows and agents run" })
-  ] }) });
-}
-function ActivityTable({ activities, isLoading, onRowClick }) {
-  return /* @__PURE__ */ jsxs(Table, { children: [
-    /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-      /* @__PURE__ */ jsx(Table.Th, { children: "Title" }),
-      /* @__PURE__ */ jsx(Table.Th, { children: "Type" }),
-      /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
-      /* @__PURE__ */ jsx(Table.Th, { children: "Actor" }),
-      /* @__PURE__ */ jsx(Table.Th, { children: "Entity" }),
-      /* @__PURE__ */ jsx(Table.Th, { ta: "right", children: "Time" })
-    ] }) }),
-    /* @__PURE__ */ jsx(Table.Tbody, { children: isLoading ? /* @__PURE__ */ jsx(Table.Tr, { children: /* @__PURE__ */ jsx(Table.Td, { colSpan: COLUMN_COUNT, children: /* @__PURE__ */ jsx(LoadingState2, {}) }) }) : activities.length === 0 ? /* @__PURE__ */ jsx(Table.Tr, { children: /* @__PURE__ */ jsx(Table.Td, { colSpan: COLUMN_COUNT, children: /* @__PURE__ */ jsx(EmptyState3, {}) }) }) : activities.map((activity) => {
-      const config = statusConfig[activity.status];
-      const StatusIcon = config.icon;
-      const actor = getActorDisplay(activity.actorType);
-      const ActorIcon = actor.icon;
-      return /* @__PURE__ */ jsxs(
-        Table.Tr,
-        {
-          style: { cursor: onRowClick ? "pointer" : void 0 },
-          onClick: () => onRowClick?.(activity),
-          children: [
-            /* @__PURE__ */ jsx(Table.Td, { style: { maxWidth: 250 }, children: /* @__PURE__ */ jsx(Text, { size: "sm", lineClamp: 1, title: activity.title, children: activity.title }) }),
-            /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { variant: "light", size: "sm", color: "gray", children: activityTypeLabels[activity.activityType] }) }),
-            /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { color: config.color, variant: "light", size: "sm", leftSection: /* @__PURE__ */ jsx(StatusIcon, { size: 14 }), children: activity.status }) }),
-            /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { color: actor.color, variant: "light", size: "sm", leftSection: /* @__PURE__ */ jsx(ActorIcon, { size: 14 }), children: actor.label }) }),
-            /* @__PURE__ */ jsx(Table.Td, { style: { maxWidth: 200 }, children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", lineClamp: 1, title: activity.entityName || activity.entityId, children: activity.entityName || activity.entityId }) }),
-            /* @__PURE__ */ jsx(Table.Td, { ta: "right", style: { whiteSpace: "nowrap" }, children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: formatDistanceToNow(activity.occurredAt, { addSuffix: true }) }) })
-          ]
-        },
-        activity.id
-      );
-    }) })
-  ] });
-}
-var activityTypeOptions = [
-  { value: "all", label: "All Types" },
-  { value: "workflow_execution", label: "Workflow Executions" },
-  { value: "agent_run", label: "Agent Runs" },
-  { value: "hitl_action", label: "HITL Actions" },
-  { value: "webhook_received", label: "Webhook Received" },
-  { value: "webhook_executed", label: "Webhook Executed" },
-  { value: "webhook_failed", label: "Webhook Failed" },
-  { value: "credential_change", label: "Credential Changes" },
-  { value: "credential_read", label: "Credential Reads" },
-  { value: "api_key_change", label: "API Key Changes" },
-  { value: "deployment_change", label: "Deployment Changes" },
-  { value: "membership_change", label: "Membership Changes" }
-];
-var statusOptions2 = [
-  { value: "all", label: "All Statuses" },
-  { value: "success", label: "Success" },
-  { value: "failure", label: "Failure" },
-  { value: "pending", label: "Pending" },
-  { value: "approved", label: "Approved" },
-  { value: "rejected", label: "Rejected" },
-  { value: "completed", label: "Completed" }
-];
-function ActivityFilters({ filters, onFilterChange, onReset }) {
-  return /* @__PURE__ */ jsxs(
-    FilterBar,
-    {
-      actions: /* @__PURE__ */ jsx(Button, { variant: "subtle", color: "gray", leftSection: /* @__PURE__ */ jsx(IconFilterOff, { size: 16 }), onClick: onReset, children: "Reset" }),
-      children: [
-        /* @__PURE__ */ jsx(
-          Select,
-          {
-            placeholder: "Activity Type",
-            data: activityTypeOptions,
-            value: filters.activityType || "all",
-            onChange: (value) => onFilterChange("activityType", value),
-            style: { flex: 1, minWidth: 200 }
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Select,
-          {
-            placeholder: "Status",
-            data: statusOptions2,
-            value: filters.status || "all",
-            onChange: (value) => onFilterChange("status", value),
-            style: { flex: 1, minWidth: 150 }
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          TextInput,
-          {
-            placeholder: "Search by name...",
-            leftSection: /* @__PURE__ */ jsx(IconSearch, { size: 16 }),
-            value: filters.search || "",
-            onChange: (event) => onFilterChange("search", event.currentTarget.value),
-            style: { flex: 1, minWidth: 200 }
-          }
-        )
-      ]
-    }
-  );
-}
-var statusConfig2 = {
-  success: { color: "green", icon: IconCircleCheck },
-  failure: { color: "red", icon: IconCircleX },
-  pending: { color: "yellow", icon: IconClock },
-  approved: { color: "green", icon: IconThumbUp },
-  rejected: { color: "red", icon: IconThumbDown },
-  completed: { color: "blue", icon: IconCircleCheck }
-};
-function getActorDisplay2(actorType) {
-  switch (actorType) {
-    case "user":
-      return { label: "User", color: "blue", icon: IconUser };
-    case "api_key":
-      return { label: "API Key", color: "violet", icon: IconKey };
-    default:
-      return { label: "System", color: "gray", icon: IconRobot };
-  }
-}
-function getNavigationPath(activity) {
-  switch (activity.activityType) {
-    case "workflow_execution":
-      return `/operations/resources/workflow/${activity.entityId}`;
-    case "agent_run":
-      return `/operations/resources/agent/${activity.entityId}`;
-    case "hitl_action":
-      return "/command-queue";
-    case "credential_change":
-    case "credential_read":
-      return "/settings/credentials";
-    case "api_key_change":
-      return "/settings/api-keys";
-    case "deployment_change":
-      return "/settings/deployments";
-    case "membership_change":
-      return "/settings/organization";
-    default:
-      return null;
-  }
-}
-function ActivityCard({ activity }) {
-  const config = statusConfig2[activity.status];
-  const StatusIcon = config.icon;
-  const { navigate } = useRouterContext();
-  const navigationPath = getNavigationPath(activity);
-  const isClickable = navigationPath !== null;
-  const actor = getActorDisplay2(activity.actorType);
-  const ActorIcon = actor.icon;
-  const handleClick = () => {
-    if (navigationPath) {
-      navigate(navigationPath);
-    }
-  };
-  return /* @__PURE__ */ jsx(
-    Card,
-    {
-      withBorder: true,
-      style: {
-        cursor: isClickable ? "pointer" : "default",
-        transition: "box-shadow var(--duration-fast) var(--easing)"
-      },
-      onClick: handleClick,
-      children: /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
-        /* @__PURE__ */ jsxs(Group, { justify: "space-between", wrap: "nowrap", children: [
-          /* @__PURE__ */ jsxs(Group, { gap: "xs", style: { flex: 1, minWidth: 0 }, children: [
-            /* @__PURE__ */ jsx(StatusIcon, { size: 16, color: `var(--mantine-color-${config.color}-6)` }),
-            /* @__PURE__ */ jsx(Text, { size: "sm", fw: 500, style: { flex: 1, fontFamily: "var(--elevasis-font-family-subtitle)" }, truncate: true, children: activity.title })
-          ] }),
-          /* @__PURE__ */ jsx(Badge, { size: "sm", color: config.color, variant: "light", children: activity.status })
-        ] }),
-        activity.description && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", lineClamp: 2, children: activity.description }),
-        /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", children: [
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", truncate: true, style: { flex: 1 }, children: activity.entityName || activity.entityId }),
-          /* @__PURE__ */ jsx(Badge, { size: "xs", color: actor.color, variant: "dot", leftSection: /* @__PURE__ */ jsx(ActorIcon, { size: 10 }), children: actor.label }),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", style: { whiteSpace: "nowrap" }, children: formatDistanceToNow(activity.occurredAt, { addSuffix: true }) })
-        ] })
-      ] })
-    }
-  );
-}
-function ErrorAnalysisCard({ data, isLoading, error }) {
-  const topFailures = data?.topFailingResources.map((res) => ({
-    id: res.resourceId,
-    name: res.name,
-    errorCount: res.errorCount,
-    failureRate: res.failureRate
-  })) ?? [];
-  if (error) {
-    return /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load error analysis metrics" }) });
-  }
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }) });
-  }
-  return /* @__PURE__ */ jsxs(Paper, { withBorder: true, children: [
-    /* @__PURE__ */ jsx(
-      CardHeader,
-      {
-        icon: /* @__PURE__ */ jsx(IconAlertTriangle, { size: 18 }),
-        title: "Error Analysis",
-        rightSection: /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", children: /* @__PURE__ */ jsx(IconArrowUpRight, { size: 16 }) })
-      }
-    ),
-    /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, mb: "sm", style: { fontFamily: "var(--mantine-font-family-headings)" }, children: "Top Failing Resources" }),
-    /* @__PURE__ */ jsxs(Table, { children: [
-      /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-        /* @__PURE__ */ jsx(Table.Th, { children: "Resource" }),
-        /* @__PURE__ */ jsx(Table.Th, { ta: "right", children: "Errors" }),
-        /* @__PURE__ */ jsx(Table.Th, { ta: "right", children: "% Failed" }),
-        /* @__PURE__ */ jsx(Table.Th, {})
-      ] }) }),
-      /* @__PURE__ */ jsx(Table.Tbody, { children: topFailures.map((resource) => /* @__PURE__ */ jsxs(Table.Tr, { children: [
-        /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-          /* @__PURE__ */ jsx(IconAlertCircle, { size: 16, color: "var(--color-error)" }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", children: resource.name })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Td, { ta: "right", children: /* @__PURE__ */ jsx(Badge, { color: "red", variant: "light", children: resource.errorCount }) }),
-        /* @__PURE__ */ jsx(Table.Td, { ta: "right", children: /* @__PURE__ */ jsxs(Text, { size: "sm", c: resource.failureRate > 10 ? "red" : "dimmed", children: [
-          resource.failureRate,
-          "%"
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Td, { ta: "right", children: /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", children: /* @__PURE__ */ jsx(IconExternalLink, { size: 14 }) }) })
-      ] }, resource.id)) })
-    ] })
-  ] });
-}
-function ExecutionBreakdownTable({ data, isLoading, error }) {
-  if (error) {
-    return /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load execution breakdown" }) });
-  }
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }) });
-  }
-  const totalExecutions = data?.totalExecutions ?? 0;
-  const statusCounts = data?.statusCounts ?? { success: 0, failed: 0, pending: 0, warning: 0 };
-  const p95Duration = data?.p95Duration ?? 0;
-  const statusRows = [
-    {
-      status: "Completed",
-      count: statusCounts.success,
-      percentage: totalExecutions > 0 ? statusCounts.success / totalExecutions * 100 : 0,
-      avgDuration: p95Duration * 0.85,
-      // Estimate avg duration from P95
-      color: "green"
-    },
-    {
-      status: "Warning",
-      count: statusCounts.warning,
-      percentage: totalExecutions > 0 ? statusCounts.warning / totalExecutions * 100 : 0,
-      avgDuration: p95Duration * 0.85,
-      // Warning executions completed, similar to success
-      color: "yellow"
-    },
-    {
-      status: "Failed",
-      count: statusCounts.failed,
-      percentage: totalExecutions > 0 ? statusCounts.failed / totalExecutions * 100 : 0,
-      avgDuration: p95Duration * 0.6,
-      // Failed executions typically shorter
-      color: "red"
-    },
-    {
-      status: "Running",
-      count: 0,
-      // No running count in current data structure
-      percentage: 0,
-      avgDuration: 0,
-      color: "blue"
-    },
-    {
-      status: "Pending",
-      count: statusCounts.pending,
-      percentage: totalExecutions > 0 ? statusCounts.pending / totalExecutions * 100 : 0,
-      avgDuration: 0,
-      // Pending has no duration
-      color: "gray"
-    }
-  ];
-  return /* @__PURE__ */ jsxs(Paper, { withBorder: true, children: [
-    /* @__PURE__ */ jsx(CardHeader, { icon: /* @__PURE__ */ jsx(IconChartPie, { size: 18 }), title: "Execution Status Breakdown" }),
-    /* @__PURE__ */ jsxs(Table, { children: [
-      /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-        /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
-        /* @__PURE__ */ jsx(Table.Th, { ta: "right", children: "Count" }),
-        /* @__PURE__ */ jsx(Table.Th, { ta: "right", children: "Percentage" }),
-        /* @__PURE__ */ jsx(Table.Th, { ta: "right", children: "Avg Duration" })
-      ] }) }),
-      /* @__PURE__ */ jsx(Table.Tbody, { children: statusRows.map((row) => /* @__PURE__ */ jsxs(
-        Table.Tr,
-        {
-          style: { cursor: "pointer" },
-          onClick: () => {
-            console.log(`Filter to ${row.status} executions`);
-          },
-          children: [
-            /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { color: row.color, variant: "light", children: row.status }) }),
-            /* @__PURE__ */ jsx(Table.Td, { ta: "right", children: /* @__PURE__ */ jsx(Text, { size: "sm", fw: 500, children: row.count.toLocaleString() }) }),
-            /* @__PURE__ */ jsx(Table.Td, { ta: "right", children: /* @__PURE__ */ jsxs(Text, { size: "sm", children: [
-              row.percentage.toFixed(1),
-              "%"
-            ] }) }),
-            /* @__PURE__ */ jsx(Table.Td, { ta: "right", children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: row.avgDuration > 0 ? `${(row.avgDuration / 1e3).toFixed(1)}s` : "-" }) })
-          ]
-        },
-        row.status
-      )) })
-    ] })
-  ] });
-}
-function ExecutionHealthCard({ data, isLoading, error }) {
-  const successRate = data?.successRate ?? 0;
-  const p95Duration = data?.p95Duration ?? 0;
-  const totalExecutions = data?.totalExecutions ?? 0;
-  const failedCount = data?.statusCounts.failed ?? 0;
-  const warningCount = data?.statusCounts.warning ?? 0;
-  const trendData = data?.trendData.map((d) => ({
-    hour: formatBucketTime(d.time, data?.granularity ?? "hour"),
-    errors: d.errorCount,
-    warnings: d.warningCount
-  })) ?? [];
-  const hasExecutions = totalExecutions > 0;
-  const statusColor = hasExecutions ? successRate >= 98 ? "green" : successRate >= 95 ? "yellow" : "red" : "gray";
-  const statusLabel = hasExecutions ? successRate >= 98 ? "Healthy" : successRate >= 95 ? "Warning" : "Critical" : "No Data";
-  if (error) {
-    return /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load execution health metrics" }) });
-  }
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(StatsCardSkeleton, {});
-  }
-  return /* @__PURE__ */ jsxs(Paper, { withBorder: true, children: [
-    /* @__PURE__ */ jsx(
-      CardHeader,
-      {
-        icon: /* @__PURE__ */ jsx(IconHeartbeat, { size: 18 }),
-        title: "Execution Health",
-        rightSection: /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", children: /* @__PURE__ */ jsx(IconArrowUpRight, { size: 16 }) })
-      }
-    ),
-    /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "center", mb: "md", children: [
-      /* @__PURE__ */ jsxs(Group, { gap: "lg", children: [
-        /* @__PURE__ */ jsxs(Group, { gap: 6, align: "baseline", children: [
-          /* @__PURE__ */ jsx(
-            Text,
-            {
-              size: "xl",
-              fw: 700,
-              c: "var(--color-error)",
-              style: { fontFamily: "var(--mantine-font-family-headings)" },
-              children: failedCount
-            }
-          ),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "failures" })
-        ] }),
-        /* @__PURE__ */ jsxs(Group, { gap: 6, align: "baseline", children: [
-          /* @__PURE__ */ jsx(
-            Text,
-            {
-              size: "xl",
-              fw: 700,
-              c: warningCount > 0 ? "yellow" : "dimmed",
-              style: { fontFamily: "var(--mantine-font-family-headings)" },
-              children: warningCount
-            }
-          ),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "warnings" })
-        ] }),
-        /* @__PURE__ */ jsxs(Group, { gap: 6, align: "baseline", children: [
-          /* @__PURE__ */ jsxs(Text, { size: "xl", fw: 700, style: { fontFamily: "var(--mantine-font-family-headings)" }, children: [
-            (p95Duration / 1e3).toFixed(1),
-            "s"
-          ] }),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "P95" })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx(Badge, { size: "md", variant: "dot", color: statusColor, children: statusLabel })
-    ] }),
-    /* @__PURE__ */ jsx(
-      CyberAreaChart,
-      {
-        data: trendData,
-        series: [
-          { dataKey: "warnings", color: "yellow", name: "Warnings" },
-          { dataKey: "errors", color: "red", name: "Errors" }
-        ],
-        xDataKey: "hour",
-        height: 200,
-        yDomain: [0, "auto"]
-      }
-    ),
-    /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", mt: "sm", children: [
-      totalExecutions.toLocaleString(),
-      " total executions"
-    ] })
-  ] });
-}
-function CostByModelTable({ data, isLoading, error }) {
-  const [sortField, setSortField] = useState("cost");
-  const [sortDirection, setSortDirection] = useState("desc");
-  const totalCost = data?.totalCostUsd ?? 0;
-  const tableData = data?.models.map((m) => ({
-    model: m.model,
-    cost: m.totalCostUsd,
-    percentage: totalCost > 0 ? m.totalCostUsd / totalCost * 100 : 0,
-    calls: m.callCount,
-    avgCost: m.avgCostPerCall,
-    inputTokens: m.totalInputTokens,
-    outputTokens: m.totalOutputTokens
-  })) ?? [];
-  const sortedData = [...tableData].sort((a, b) => {
-    const aValue = a[sortField];
-    const bValue = b[sortField];
-    if (typeof aValue === "string" && typeof bValue === "string") {
-      return sortDirection === "asc" ? aValue.localeCompare(bValue) : bValue.localeCompare(aValue);
-    }
-    return sortDirection === "asc" ? aValue - bValue : bValue - aValue;
-  });
-  const highestCost = Math.max(...tableData.map((d) => d.cost), 0);
-  const handleSort = (field) => {
-    if (sortField === field) {
-      setSortDirection(sortDirection === "asc" ? "desc" : "asc");
-    } else {
-      setSortField(field);
-      setSortDirection("desc");
-    }
-  };
-  const handleExport = () => {
-    if (!data) return;
-    const csvContent = [
-      ["Model", "Cost ($)", "Percentage (%)", "Calls", "Avg Cost/Call ($)", "Input Tokens", "Output Tokens"],
-      ...sortedData.map((d) => [
-        d.model,
-        d.cost.toFixed(4),
-        d.percentage.toFixed(2),
-        d.calls,
-        d.avgCost.toFixed(6),
-        d.inputTokens,
-        d.outputTokens
-      ]),
-      ["Total", totalCost.toFixed(4), "100.00", data.totalCallCount, "", "", ""]
-    ].map((row) => row.join(",")).join("\n");
-    const blob = new Blob([csvContent], { type: "text/csv" });
-    const url = URL.createObjectURL(blob);
-    const link = document.createElement("a");
-    link.href = url;
-    link.download = `cost-by-model-${(/* @__PURE__ */ new Date()).toISOString().split("T")[0]}.csv`;
-    link.click();
-    URL.revokeObjectURL(url);
-  };
-  const SortIcon = ({ field }) => {
-    if (sortField !== field) return null;
-    return sortDirection === "asc" ? /* @__PURE__ */ jsx(IconArrowUp, { size: 14 }) : /* @__PURE__ */ jsx(IconArrowDown, { size: 14 });
-  };
-  const formatModelName = (model) => {
-    const parts = model.split("/");
-    const modelName = parts.length > 1 ? parts[1] : model;
-    return modelName.split("-").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
-  };
-  if (error) {
-    return /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load cost by model" }) });
-  }
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }) });
-  }
-  return /* @__PURE__ */ jsxs(Paper, { children: [
-    /* @__PURE__ */ jsx(
-      CardHeader,
-      {
-        icon: /* @__PURE__ */ jsx(IconCpu, { size: 18 }),
-        title: "Cost by Model",
-        rightSection: /* @__PURE__ */ jsx(Button, { variant: "subtle", size: "xs", leftSection: /* @__PURE__ */ jsx(IconDownload, { size: 14 }), onClick: handleExport, children: "Export CSV" })
-      }
-    ),
-    /* @__PURE__ */ jsxs(Table, { children: [
-      /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-        /* @__PURE__ */ jsx(Table.Th, { style: { cursor: "pointer" }, onClick: () => handleSort("model"), children: /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-          "Model",
-          /* @__PURE__ */ jsx(SortIcon, { field: "model" })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Th, { style: { cursor: "pointer" }, onClick: () => handleSort("cost"), children: /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-          "Cost",
-          /* @__PURE__ */ jsx(SortIcon, { field: "cost" })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Th, { style: { cursor: "pointer" }, onClick: () => handleSort("percentage"), children: /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-          "Percentage",
-          /* @__PURE__ */ jsx(SortIcon, { field: "percentage" })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Th, { style: { cursor: "pointer" }, onClick: () => handleSort("calls"), children: /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-          "Calls",
-          /* @__PURE__ */ jsx(SortIcon, { field: "calls" })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Th, { style: { cursor: "pointer" }, onClick: () => handleSort("avgCost"), children: /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-          "Avg Cost/Call",
-          /* @__PURE__ */ jsx(SortIcon, { field: "avgCost" })
-        ] }) })
-      ] }) }),
-      /* @__PURE__ */ jsxs(Table.Tbody, { children: [
-        sortedData.map((row) => /* @__PURE__ */ jsxs(Table.Tr, { children: [
-          /* @__PURE__ */ jsxs(Table.Td, { children: [
-            /* @__PURE__ */ jsx(Text, { size: "sm", fw: row.cost === highestCost ? 600 : 400, children: formatModelName(row.model) }),
-            /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: row.model })
-          ] }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsxs(Text, { size: "sm", fw: row.cost === highestCost ? 600 : 400, children: [
-            "$",
-            row.cost.toFixed(4)
-          ] }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsxs(Badge, { color: row.percentage > 30 ? "red" : row.percentage > 15 ? "yellow" : "gray", children: [
-            row.percentage.toFixed(1),
-            "%"
-          ] }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", children: row.calls.toLocaleString() }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsxs(Text, { size: "sm", children: [
-            "$",
-            row.avgCost.toFixed(6)
-          ] }) })
-        ] }, row.model)),
-        tableData.length > 0 && /* @__PURE__ */ jsxs(Table.Tr, { children: [
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, children: "Total" }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsxs(Text, { size: "sm", fw: 700, children: [
-            "$",
-            totalCost.toFixed(4)
-          ] }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { children: "100.0%" }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, children: (data?.totalCallCount ?? 0).toLocaleString() }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "-" }) })
-        ] })
-      ] })
-    ] }),
-    tableData.length === 0 && /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", ta: "center", py: "xl", children: "No cost data available for this time period" })
-  ] });
-}
-function BusinessImpactCard({
-  impactData,
-  summaryData,
-  trendsData,
-  data,
-  isLoading,
-  error,
-  laborRate = 75
-}) {
-  const businessData = impactData ?? data;
-  const laborCostSavings = businessData?.totalSavingsUsd ?? 0;
-  const platformCost = businessData?.totalCostUsd ?? 0;
-  const netSavings = businessData?.netSavingsUsd ?? 0;
-  const roi = businessData?.roi ?? 0;
-  const hoursSaved = Math.round(laborCostSavings / laborRate);
-  const previousCost = summaryData?.previous.totalCostUsd ?? platformCost;
-  const previousSavings = laborCostSavings * (previousCost > 0 ? (summaryData?.previous.totalCostUsd ?? platformCost) / platformCost : 0.8);
-  const previousHoursSaved = Math.round(previousSavings / laborRate);
-  const totalTrendCost = trendsData?.totalCostUsd ?? 0;
-  const trendData = (trendsData?.trendData ?? []).map((point) => {
-    const date = new Date(point.time);
-    const timeLabel = trendsData?.granularity === "hour" ? date.toLocaleTimeString("en-US", { hour: "2-digit", minute: "2-digit" }) : date.toLocaleDateString("en-US", { month: "short", day: "numeric" });
-    const proportion = totalTrendCost > 0 ? point.totalCostUsd / totalTrendCost : 1 / (trendsData?.trendData.length ?? 1);
-    return {
-      time: timeLabel,
-      savings: laborCostSavings * proportion
-    };
-  });
-  if (error) {
-    return /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load business impact metrics" }) });
-  }
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }) });
-  }
-  return /* @__PURE__ */ jsxs(Paper, { withBorder: true, children: [
-    /* @__PURE__ */ jsx(
-      CardHeader,
-      {
-        icon: /* @__PURE__ */ jsx(IconTrendingUp, { size: 18 }),
-        title: "Business Impact",
-        rightSection: /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", children: /* @__PURE__ */ jsx(IconArrowUpRight, { size: 16 }) })
-      }
-    ),
-    /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "center", mb: "md", children: [
-      /* @__PURE__ */ jsxs(Group, { gap: "lg", children: [
-        /* @__PURE__ */ jsxs(Group, { gap: 6, align: "baseline", children: [
-          /* @__PURE__ */ jsx(
-            Text,
-            {
-              size: "xl",
-              fw: 700,
-              c: "var(--color-primary)",
-              style: { fontFamily: "var(--mantine-font-family-headings)" },
-              children: hoursSaved
-            }
-          ),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "hrs saved" }),
-          /* @__PURE__ */ jsx(TrendIndicator, { current: hoursSaved, previous: previousHoursSaved })
-        ] }),
-        /* @__PURE__ */ jsxs(Group, { gap: 6, align: "baseline", children: [
-          /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, style: { fontFamily: "var(--mantine-font-family-headings)" }, children: /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: laborCostSavings, thousandSeparator: true }) }),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "labor saved" })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx(
-        Badge,
-        {
-          size: "lg",
-          variant: roi > 0 ? "dot" : "light",
-          color: roi > 1e3 ? "green" : roi > 500 ? "yellow" : "gray",
-          children: roi > 0 ? `${roi.toFixed(0)}x ROI` : "N/A"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsx(
-      CyberAreaChart,
-      {
-        data: trendData,
-        series: [{ dataKey: "savings", color: "blue", name: "Savings" }],
-        xDataKey: "time",
-        height: 200,
-        yTickFormatter: (v) => `$${v.toFixed(2)}`
-      }
-    ),
-    /* @__PURE__ */ jsxs(Group, { justify: "space-between", mt: "sm", children: [
-      /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-        "Platform cost: ",
-        /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: platformCost, decimalScale: 2 })
-      ] }),
-      /* @__PURE__ */ jsxs(Text, { size: "xs", fw: 500, c: netSavings < 0 ? "var(--color-error)" : "var(--color-primary)", children: [
-        "Net savings: ",
-        /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: netSavings, thousandSeparator: true, decimalScale: 2 })
-      ] })
-    ] })
-  ] });
-}
-function CostBreakdownCard({
-  breakdownData,
-  summaryData,
-  data,
-  isLoading,
-  error,
-  budget = 1500
-}) {
-  const resourceData = breakdownData ?? data;
-  const legacyTotalCost = resourceData?.resources.reduce((sum, r) => sum + r.totalCostUsd, 0) ?? 0;
-  const mtdCost = summaryData?.mtd.totalCostUsd ?? legacyTotalCost * 2;
-  const projectedMonthlyCost = summaryData?.projection.monthlyCostUsd ?? mtdCost * 1.05;
-  const workflowCosts = resourceData?.resources.slice(0, 4).map((r) => ({
-    name: r.resourceId,
-    cost: r.totalCostUsd,
-    executions: r.executionCount,
-    avgCost: r.avgCostUsd
-  })) ?? [];
-  if (error) {
-    return /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load cost breakdown" }) });
-  }
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(DetailCardSkeleton, { rows: 3 });
-  }
-  return /* @__PURE__ */ jsxs(Paper, { withBorder: true, children: [
-    /* @__PURE__ */ jsx(
-      CardHeader,
-      {
-        icon: /* @__PURE__ */ jsx(IconChartBar, { size: 18 }),
-        title: "AI Costs Breakdown",
-        rightSection: /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", children: /* @__PURE__ */ jsx(IconArrowUpRight, { size: 16 }) })
-      }
-    ),
-    /* @__PURE__ */ jsxs(Stack, { gap: "xs", mb: "md", children: [
-      /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, style: { fontFamily: "var(--mantine-font-family-headings)" }, children: "Top Spenders" }),
-      workflowCosts.length > 0 ? workflowCosts.map((workflow) => /* @__PURE__ */ jsx(
-        Box,
-        {
-          p: "sm",
-          style: {
-            borderLeft: "3px solid var(--color-primary)",
-            backgroundColor: "var(--color-surface)",
-            borderRadius: 4
-          },
-          children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", wrap: "nowrap", children: [
-            /* @__PURE__ */ jsxs(Stack, { gap: 0, style: { flex: 1 }, children: [
-              /* @__PURE__ */ jsx(Text, { size: "sm", fw: 500, children: workflow.name }),
-              /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-                workflow.executions,
-                " executions - $",
-                workflow.avgCost.toFixed(4),
-                "/exec"
-              ] })
-            ] }),
-            /* @__PURE__ */ jsx(
-              Text,
-              {
-                size: "sm",
-                fw: 600,
-                c: "var(--color-primary)",
-                style: { fontFamily: "var(--mantine-font-family-headings)" },
-                children: /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: workflow.cost, decimalScale: 4 })
-              }
-            )
-          ] })
-        },
-        workflow.name
-      )) : /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", ta: "center", py: "md", children: "No resource data available" })
-    ] }),
-    /* @__PURE__ */ jsxs(Group, { justify: "space-between", mt: "sm", children: [
-      /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-        "Projected: ",
-        /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: projectedMonthlyCost, thousandSeparator: true, decimalScale: 2 })
-      ] }),
-      /* @__PURE__ */ jsxs(
-        Text,
-        {
-          size: "xs",
-          fw: 600,
-          c: projectedMonthlyCost > budget ? "red" : "dimmed",
-          style: { fontFamily: "var(--mantine-font-family-headings)" },
-          children: [
-            "Budget: ",
-            /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: budget, thousandSeparator: true, decimalScale: 2 })
-          ]
-        }
-      )
-    ] })
-  ] });
-}
-function CostMetricsCard({
-  summaryData,
-  trendsData,
-  data,
-  isLoading,
-  error,
-  budget = 1500
-}) {
-  const legacyTotalCost = data?.resources.reduce((sum, r) => sum + r.totalCostUsd, 0) ?? 0;
-  const todayCost = summaryData?.current.totalCostUsd ?? legacyTotalCost;
-  const previousCost = summaryData?.previous.totalCostUsd ?? legacyTotalCost * 0.9;
-  const mtdCost = summaryData?.mtd.totalCostUsd ?? legacyTotalCost * 2;
-  const projectedMonthlyCost = summaryData?.projection.monthlyCostUsd ?? mtdCost * 1.05;
-  const confidence = summaryData?.projection.confidence ?? "low";
-  const budgetStatus = projectedMonthlyCost <= budget ? "green" : projectedMonthlyCost <= budget * 1.1 ? "yellow" : "red";
-  const budgetLabel = projectedMonthlyCost <= budget ? "On Budget" : projectedMonthlyCost <= budget * 1.1 ? "Warning" : "Over Budget";
-  const chartData = trendsData?.trendData.slice(-7).map((point, idx) => {
-    const days = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
-    return {
-      day: trendsData.granularity === "day" ? new Date(point.time).toLocaleDateString("en-US", { weekday: "short" }) : days[idx % 7],
-      cost: point.totalCostUsd
-    };
-  }) ?? data?.resources.slice(0, 7).map((r, idx) => ({
-    day: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"][idx] || `Day ${idx + 1}`,
-    cost: r.totalCostUsd
-  })) ?? [];
-  if (error) {
-    return /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load cost metrics" }) });
-  }
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(StatsCardSkeleton, {});
-  }
-  return /* @__PURE__ */ jsxs(Paper, { withBorder: true, children: [
-    /* @__PURE__ */ jsx(
-      CardHeader,
-      {
-        icon: /* @__PURE__ */ jsx(IconCash, { size: 18 }),
-        title: "AI Costs",
-        rightSection: /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", children: /* @__PURE__ */ jsx(IconArrowUpRight, { size: 16 }) })
-      }
-    ),
-    /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "center", mb: "md", children: [
-      /* @__PURE__ */ jsxs(Group, { gap: "lg", children: [
-        /* @__PURE__ */ jsxs(Group, { gap: 6, align: "baseline", children: [
-          /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, style: { fontFamily: "var(--mantine-font-family-headings)" }, children: /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: todayCost, decimalScale: 2 }) }),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "period" }),
-          /* @__PURE__ */ jsx(TrendIndicator, { current: todayCost, previous: previousCost, inverse: true })
-        ] }),
-        /* @__PURE__ */ jsxs(Group, { gap: 6, align: "baseline", children: [
-          /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, style: { fontFamily: "var(--mantine-font-family-headings)" }, children: /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: mtdCost, thousandSeparator: true, decimalScale: 2 }) }),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "MTD" })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx(Badge, { size: "md", variant: "dot", color: budgetStatus, children: budgetLabel })
-    ] }),
-    chartData.length > 0 ? /* @__PURE__ */ jsx(
-      CyberAreaChart,
-      {
-        data: chartData,
-        series: [{ dataKey: "cost", color: "blue", name: "Cost" }],
-        xDataKey: "day",
-        height: 120,
-        yTickFormatter: (v) => `$${v.toFixed(2)}`
-      }
-    ) : /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", ta: "center", py: "lg", children: "No trend data available" }),
-    /* @__PURE__ */ jsxs(Group, { justify: "space-between", mt: "sm", children: [
-      /* @__PURE__ */ jsxs(Group, { gap: 4, children: [
-        /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-          "Projected monthly:",
-          " ",
-          /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: projectedMonthlyCost, thousandSeparator: true, decimalScale: 2 })
-        ] }),
-        /* @__PURE__ */ jsx(Tooltip, { label: `Projection confidence: ${confidence}`, children: /* @__PURE__ */ jsx(IconInfoCircle, { size: 12, color: "var(--color-text-subtle)" }) })
-      ] }),
-      /* @__PURE__ */ jsxs(
-        Text,
-        {
-          size: "xs",
-          fw: 600,
-          c: projectedMonthlyCost > budget ? "red" : "dimmed",
-          style: { fontFamily: "var(--mantine-font-family-headings)" },
-          children: [
-            "Budget: ",
-            /* @__PURE__ */ jsx(NumberFormatter, { prefix: "$", value: budget, thousandSeparator: true, decimalScale: 2 })
-          ]
-        }
-      )
-    ] })
-  ] });
-}
-function ErrorBreakdownTable({ startDate, endDate, onErrorClick }) {
-  const [searchQuery, setSearchQuery] = useState("");
-  const [filterType, setFilterType] = useState("all");
-  const [filterSeverity, setFilterSeverity] = useState();
-  const [showResolved, setShowResolved] = useState(false);
-  const resolveError = useResolveError();
-  const resolveAll = useResolveAllErrors();
-  const { page, setPage, totalPages } = usePaginationState(PAGE_SIZE_DEFAULT, [
-    filterType,
-    filterSeverity,
-    searchQuery,
-    showResolved,
-    startDate,
-    endDate
-  ]);
-  const { data, isLoading, isError, error } = useErrorDetails({
-    errorType: filterType === "all" ? void 0 : filterType,
-    severity: filterSeverity,
-    search: searchQuery || void 0,
-    startDate,
-    endDate,
-    page,
-    limit: PAGE_SIZE_DEFAULT,
-    resolved: showResolved ? void 0 : false
-  });
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsx(Stack, { align: "center", justify: "center", mih: 200, children: /* @__PURE__ */ jsx(Loader, { size: "md" }) }) });
-  }
-  if (isError) {
-    return /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsx(Alert, { color: "red", icon: /* @__PURE__ */ jsx(IconAlertCircle, {}), title: "Error Loading Data", children: error?.message || "Failed to load error details. Please try again." }) });
-  }
-  if (!data || data.errors.length === 0) {
-    return /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsxs(Stack, { children: [
-      /* @__PURE__ */ jsx(
-        CardHeader,
-        {
-          icon: /* @__PURE__ */ jsx(IconExclamationCircle, { size: 18 }),
-          title: "Recent Errors",
-          subtitle: "0 errors found",
-          rightSection: /* @__PURE__ */ jsx(
-            Switch,
-            {
-              label: "Show resolved",
-              checked: showResolved,
-              onChange: (e) => setShowResolved(e.currentTarget.checked),
-              size: "sm"
-            }
-          )
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        EmptyState,
-        {
-          icon: IconBug,
-          title: "No errors found",
-          description: showResolved ? "No errors found for the selected time range" : "All errors have been resolved"
-        }
-      )
-    ] }) });
-  }
-  const filteredErrors = data.errors;
-  const errorTypes = Array.from(new Set(data.errors.map((e) => e.errorType)));
-  const total = data.total;
-  const getSeverityIcon = (severity) => {
-    switch (severity) {
-      case "critical":
-        return /* @__PURE__ */ jsx(IconAlertCircle, { size: 16, color: "var(--color-error)" });
-      case "warning":
-        return /* @__PURE__ */ jsx(IconAlertTriangle, { size: 16, color: "var(--mantine-color-orange-6)" });
-      default:
-        return /* @__PURE__ */ jsx(IconBug, { size: 16, color: "var(--color-primary)" });
-    }
-  };
-  const getSeverityColor = (severity) => {
-    switch (severity) {
-      case "critical":
-        return "red";
-      case "warning":
-        return "orange";
-      default:
-        return "blue";
-    }
-  };
-  return /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsxs(Stack, { children: [
-    /* @__PURE__ */ jsx(
-      CardHeader,
-      {
-        icon: /* @__PURE__ */ jsx(IconExclamationCircle, { size: 18 }),
-        title: "Recent Errors",
-        subtitle: `${filteredErrors.length} error${filteredErrors.length !== 1 ? "s" : ""} found`,
-        rightSection: /* @__PURE__ */ jsxs(Group, { children: [
-          /* @__PURE__ */ jsx(
-            Switch,
-            {
-              label: "Show resolved",
-              checked: showResolved,
-              onChange: (e) => setShowResolved(e.currentTarget.checked),
-              size: "sm"
-            }
-          ),
-          !showResolved && filteredErrors.some((e) => !e.resolved) && /* @__PURE__ */ jsx(
-            Button,
-            {
-              leftSection: /* @__PURE__ */ jsx(IconChecks, { size: 16 }),
-              variant: "light",
-              loading: resolveAll.isPending,
-              onClick: () => resolveAll.mutate(),
-              children: "Resolve All"
-            }
-          )
-        ] })
-      }
-    ),
-    /* @__PURE__ */ jsxs(FilterBar, { children: [
-      /* @__PURE__ */ jsx(
-        TextInput,
-        {
-          placeholder: "Search errors...",
-          leftSection: /* @__PURE__ */ jsx(IconSearch, { size: 16 }),
-          value: searchQuery,
-          onChange: (e) => {
-            setSearchQuery(e.currentTarget.value);
-          },
-          style: { flex: 1 }
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        Select,
-        {
-          placeholder: "Filter by type",
-          value: filterType,
-          onChange: (value) => {
-            setFilterType(value || "all");
-          },
-          data: [{ value: "all", label: "All Types" }, ...errorTypes.map((type) => ({ value: type, label: type }))],
-          style: { width: 200 },
-          clearable: true
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        Select,
-        {
-          placeholder: "Filter by severity",
-          value: filterSeverity,
-          onChange: (value) => {
-            setFilterSeverity(value);
-          },
-          data: [
-            { value: "critical", label: "Critical" },
-            { value: "warning", label: "Warning" },
-            { value: "info", label: "Info" }
-          ],
-          style: { width: 200 },
-          clearable: true
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs(Table, { children: [
-      /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-        /* @__PURE__ */ jsx(Table.Th, { children: "Timestamp" }),
-        /* @__PURE__ */ jsx(Table.Th, { children: "Type" }),
-        /* @__PURE__ */ jsx(Table.Th, { children: "Message" }),
-        /* @__PURE__ */ jsx(Table.Th, { children: "Resource" }),
-        /* @__PURE__ */ jsx(Table.Th, { ta: "center", children: "Severity" }),
-        /* @__PURE__ */ jsx(Table.Th, { ta: "right", children: "Actions" })
-      ] }) }),
-      /* @__PURE__ */ jsx(Table.Tbody, { children: filteredErrors.map((error2) => /* @__PURE__ */ jsxs(Table.Tr, { style: { cursor: "pointer" }, onClick: () => onErrorClick?.(error2.executionId), children: [
-        /* @__PURE__ */ jsx(Table.Td, { style: { whiteSpace: "nowrap" }, children: /* @__PURE__ */ jsx(Text, { size: "sm", children: new Date(error2.timestamp).toLocaleString("en-US", {
-          month: "short",
-          day: "numeric",
-          hour: "2-digit",
-          minute: "2-digit"
-        }) }) }),
-        /* @__PURE__ */ jsx(Table.Td, { style: { whiteSpace: "nowrap" }, children: /* @__PURE__ */ jsx(Badge, { variant: "light", size: "sm", children: error2.errorType }) }),
-        /* @__PURE__ */ jsx(Table.Td, { style: { maxWidth: 300 }, children: /* @__PURE__ */ jsx(Text, { size: "sm", lineClamp: 1, children: error2.message }) }),
-        /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", children: error2.resourceName }) }),
-        /* @__PURE__ */ jsx(Table.Td, { ta: "center", style: { whiteSpace: "nowrap" }, children: /* @__PURE__ */ jsx(
-          Badge,
-          {
-            color: getSeverityColor(error2.severity),
-            variant: "light",
-            size: "sm",
-            leftSection: getSeverityIcon(error2.severity),
-            children: error2.severity.toUpperCase()
-          }
-        ) }),
-        /* @__PURE__ */ jsx(Table.Td, { ta: "right", children: /* @__PURE__ */ jsxs(Group, { gap: 4, justify: "flex-end", wrap: "nowrap", children: [
-          error2.resolved ? /* @__PURE__ */ jsx(Badge, { color: "green", variant: "light", size: "sm", style: { cursor: "default" }, children: "Resolved" }) : /* @__PURE__ */ jsx(
-            Badge,
-            {
-              color: "gray",
-              variant: "light",
-              size: "sm",
-              style: {
-                cursor: resolveError.isPending && resolveError.variables === error2.id ? "wait" : "pointer",
-                opacity: resolveError.isPending && resolveError.variables === error2.id ? 0.5 : 1
-              },
-              onClick: (e) => {
-                e.stopPropagation();
-                resolveError.mutate(error2.id);
-              },
-              children: "Resolve"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            ActionIcon,
-            {
-              variant: "subtle",
-              size: "sm",
-              onClick: (e) => {
-                e.stopPropagation();
-                onErrorClick?.(error2.executionId);
-              },
-              children: /* @__PURE__ */ jsx(IconExternalLink, { size: 14 })
-            }
-          )
-        ] }) })
-      ] }, error2.id)) })
-    ] }),
-    totalPages(total) > 1 && /* @__PURE__ */ jsx(Group, { justify: "flex-start", children: /* @__PURE__ */ jsx(Pagination, { total: totalPages(total), value: page, onChange: setPage, size: "sm", boundaries: 1 }) })
-  ] }) });
-}
-var categoryColors = {
-  info: "blue",
-  queue: "cyan",
-  alert: "yellow",
-  error: "red",
-  system: "gray"
-};
-function NotificationItem({ notification, onClose, onNavigate }) {
-  const markAsRead = useMarkAsRead();
-  const handleClick = async () => {
-    if (!notification.read) {
-      await markAsRead.mutateAsync(notification.id);
-    }
-    if (notification.actionUrl) {
-      onNavigate?.(notification.actionUrl);
-    }
-    onClose?.();
-  };
-  const categoryColor = categoryColors[notification.category] || "gray";
-  return /* @__PURE__ */ jsx(
-    UnstyledButton,
-    {
-      onClick: handleClick,
-      style: {
-        width: "100%",
-        padding: "12px",
-        backgroundColor: "transparent",
-        transition: "background-color var(--duration-fast) var(--easing)"
-      },
-      styles: {
-        root: {
-          "&:hover": {
-            backgroundColor: "var(--color-surface-hover)"
-          }
-        }
-      },
-      children: /* @__PURE__ */ jsxs(Group, { gap: "sm", align: "flex-start", wrap: "nowrap", children: [
-        /* @__PURE__ */ jsx(Box, { mt: 4, children: notification.read ? /* @__PURE__ */ jsx(IconCircle, { size: 12, color: "var(--mantine-color-gray-5)" }) : /* @__PURE__ */ jsx(IconCircleFilled, { size: 12, color: `var(--mantine-color-${categoryColor}-6)` }) }),
-        /* @__PURE__ */ jsxs(Stack, { gap: 4, style: { flex: 1 }, children: [
-          /* @__PURE__ */ jsx(Text, { size: "sm", fw: notification.read ? 400 : 600, children: notification.title }),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", lineClamp: 2, children: notification.message }),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: formatDistanceToNow(new Date(notification.createdAt), { addSuffix: true }) })
-        ] })
-      ] })
-    }
-  );
-}
-function NotificationList({ notifications, isLoading, onClose, onNavigate }) {
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) });
-  }
-  if (notifications.length === 0) {
-    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No notifications" }) });
-  }
-  return /* @__PURE__ */ jsx(Stack, { gap: 0, children: notifications.map((notification) => /* @__PURE__ */ jsx(NotificationItem, { notification, onClose, onNavigate }, notification.id)) });
-}
-function ExecutionLogsPage({
-  timeRange,
-  pageSize = 20,
-  onNavigateToExecution,
-  renderTrendChart
-}) {
-  const { filters, updateFilter, resetFilters } = useExecutionLogsFilters(timeRange);
-  const startDate = useMemo(() => {
-    const { startDate: sd } = getTimeRangeDates(timeRange);
-    return new Date(sd).getTime();
-  }, [timeRange]);
-  const { page, setPage, offset, totalPages } = usePaginationState(pageSize, [
-    filters.resourceId,
-    filters.status,
-    filters.resourceStatus,
-    timeRange
-  ]);
-  const { data, isLoading } = useExecutionLogs({
-    resourceId: filters.resourceId,
-    status: filters.status !== "all" ? filters.status : void 0,
-    resourceStatus: filters.resourceStatus !== "all" ? filters.resourceStatus : void 0,
-    startDate,
-    limit: pageSize,
-    offset
-  });
-  const total = data?.total ?? 0;
-  return /* @__PURE__ */ jsxs(Stack, { children: [
-    /* @__PURE__ */ jsx(PageTitleCaption, { title: "Execution Logs", caption: "View and filter execution history across all resources" }),
-    renderTrendChart({ timeRange }),
-    /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsxs(Stack, { children: [
-      /* @__PURE__ */ jsx(ExecutionLogsFilters, { filters, onFilterChange: updateFilter, onReset: resetFilters }),
-      /* @__PURE__ */ jsx(
-        ExecutionLogsTable,
-        {
-          executions: data?.executions || [],
-          isLoading,
-          onRowClick: onNavigateToExecution
-        }
-      ),
-      totalPages(total) > 1 && /* @__PURE__ */ jsx(Group, { justify: "flex-start", children: /* @__PURE__ */ jsx(Pagination, { value: page, onChange: setPage, total: totalPages(total), size: "sm", boundaries: 1 }) })
-    ] }) })
-  ] });
-}
-function ExecutionHealth({ timeRange, onErrorClick }) {
-  const { data, isLoading, error } = useExecutionHealth({ timeRange });
-  const { data: errorData, isLoading: errorLoading, error: errorError } = useErrorAnalysis(timeRange);
-  const { startDate, endDate } = useTimeRangeDates(timeRange);
-  if (isLoading) return /* @__PURE__ */ jsx(AppShellLoader, {});
-  return /* @__PURE__ */ jsxs(Stack, { children: [
-    /* @__PURE__ */ jsx(
-      PageTitleCaption,
-      {
-        title: "Execution Health",
-        caption: "Detailed execution metrics, success rates, and performance trends"
-      }
-    ),
-    /* @__PURE__ */ jsx(ExecutionHealthCard, { data: data?.executionHealth, isLoading, error }),
-    /* @__PURE__ */ jsx(
-      ErrorBreakdownTable,
-      {
-        startDate,
-        endDate,
-        onErrorClick: (executionId) => onErrorClick(executionId)
-      }
-    ),
-    /* @__PURE__ */ jsx(ErrorAnalysisCard, { data: errorData, isLoading: errorLoading, error: errorError })
-  ] });
-}
-function ErrorDetailsModal({ executionId, opened, onClose, organizationName }) {
-  const { data: errors, isLoading, isError } = useErrorDetail(executionId);
-  const resolveErrors = useResolveErrorsByExecution();
-  const { data: resources } = useResources();
-  const resourceNameMap = useMemo(() => {
-    const map = /* @__PURE__ */ new Map();
-    if (resources) {
-      for (const r of [...resources.workflows, ...resources.agents]) {
-        map.set(r.resourceId, r.name);
-      }
-    }
-    return map;
-  }, [resources]);
-  const resourceTypeMap = useMemo(() => {
-    const map = /* @__PURE__ */ new Map();
-    if (resources) {
-      for (const r of resources.workflows) {
-        map.set(r.resourceId, "workflow");
-      }
-      for (const r of resources.agents) {
-        map.set(r.resourceId, "agent");
-      }
-    }
-    return map;
-  }, [resources]);
-  const primaryError = errors?.[0];
-  const resolvedResourceName = primaryError ? resourceNameMap.get(primaryError.resourceId) ?? primaryError.resourceId : void 0;
-  const resolvedResourceType = primaryError ? resourceTypeMap.get(primaryError.resourceId) : void 0;
-  const resourceDetailHref = primaryError && resolvedResourceType ? `/operations/resources/${resolvedResourceType}/${primaryError.resourceId}` : null;
-  const allResolved = errors?.every((e) => e.resolved) ?? false;
-  const hasRetries = errors && errors.length > 1;
-  const handleCopyDetails = () => {
-    if (!primaryError) return;
-    const detailsText = `
-Error ID: ${primaryError.id}
-Timestamp: ${primaryError.timestamp}
-Type: ${primaryError.errorType}
-Severity: ${primaryError.severity}
-Execution ID: ${primaryError.executionId}
-Resource: ${primaryError.resourceName}
-
-Message:
-${primaryError.message}
-
-Stack Trace:
-${primaryError.stackTrace || "No stack trace available"}
-
-Context:
-${primaryError.errorContext ? JSON.stringify(primaryError.errorContext, null, 2) : "No context available"}
-    `.trim();
-    navigator.clipboard.writeText(detailsText);
-  };
-  return /* @__PURE__ */ jsx(CustomModal, { opened, onClose, size: "xl", children: /* @__PURE__ */ jsxs(Stack, { children: [
-    isLoading && /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }),
-    isError && /* @__PURE__ */ jsx(Alert, { color: "red", icon: /* @__PURE__ */ jsx(IconAlertCircle, {}), title: "Error Loading Details", children: "Failed to load error details. Please try again." }),
-    !isLoading && !isError && !primaryError && /* @__PURE__ */ jsx(Alert, { color: "gray", icon: /* @__PURE__ */ jsx(IconBug, {}), children: "No error details found for this execution." }),
-    !isLoading && !isError && primaryError && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
-        /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-          /* @__PURE__ */ jsx(IconAlertCircle, { size: 24, color: "var(--color-error)" }),
-          /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx(Title, { order: 3, children: primaryError.errorType }),
-            /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: new Date(primaryError.timestamp).toLocaleString("en-US", {
-              month: "long",
-              day: "numeric",
-              year: "numeric",
-              hour: "2-digit",
-              minute: "2-digit",
-              second: "2-digit"
-            }) })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx(
-          Badge,
-          {
-            color: primaryError.severity === "critical" ? "red" : primaryError.severity === "warning" ? "orange" : "blue",
-            variant: "light",
-            children: primaryError.severity
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx(Divider, {}),
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, mb: "xs", style: { fontFamily: "var(--mantine-font-family-headings)" }, children: "Error Message" }),
-        /* @__PURE__ */ jsx(Alert, { color: "red", icon: /* @__PURE__ */ jsx(IconBug, { size: 16 }), children: primaryError.message })
-      ] }),
-      hasRetries && /* @__PURE__ */ jsxs(Alert, { color: "yellow", icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }), children: [
-        "This execution has ",
-        errors.length,
-        " errors (including retries). Showing most recent error."
-      ] }),
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, mb: "xs", style: { fontFamily: "var(--mantine-font-family-headings)" }, children: "Execution Context" }),
-        /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
-          /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
-            /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Execution ID" }),
-            /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-              /* @__PURE__ */ jsx(Code, { children: primaryError.executionId }),
-              /* @__PURE__ */ jsx(CopyButton, { value: `"${organizationName}/${primaryError.resourceId}" ${primaryError.executionId}`, children: ({ copied, copy }) => /* @__PURE__ */ jsx(Tooltip, { label: copied ? "Copied" : "Copy Execution Ref", children: /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", color: copied ? "teal" : "gray", onClick: copy, children: copied ? /* @__PURE__ */ jsx(IconCheck, { size: 14 }) : /* @__PURE__ */ jsx(IconCopy, { size: 14 }) }) }) }),
-              resourceDetailHref && /* @__PURE__ */ jsx(
-                ActionIcon,
-                {
-                  variant: "subtle",
-                  size: "sm",
-                  component: "a",
-                  href: resourceDetailHref,
-                  target: "_blank",
-                  title: "View Execution Log",
-                  children: /* @__PURE__ */ jsx(IconExternalLink, { size: 14 })
-                }
-              )
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
-            /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Resource Name" }),
-            /* @__PURE__ */ jsx(Text, { size: "sm", children: resolvedResourceName })
-          ] }),
-          /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
-            /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Resource ID" }),
-            /* @__PURE__ */ jsx(Code, { children: primaryError.resourceId })
-          ] }),
-          primaryError.retryAttempt && /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
-            /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Retry Attempt" }),
-            /* @__PURE__ */ jsx(Badge, { size: "sm", children: primaryError.retryAttempt })
-          ] }),
-          primaryError.stepName && /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
-            /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Step Name" }),
-            /* @__PURE__ */ jsx(Text, { size: "sm", children: primaryError.stepName })
-          ] })
-        ] })
-      ] }),
-      primaryError.stackTrace && /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsxs(Group, { justify: "space-between", mb: "xs", children: [
-          /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, style: { fontFamily: "var(--mantine-font-family-headings)" }, children: "Stack Trace" }),
-          /* @__PURE__ */ jsx(CopyButton, { value: primaryError.stackTrace, children: ({ copied, copy }) => /* @__PURE__ */ jsx(Tooltip, { label: copied ? "Copied" : "Copy stack trace", children: /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", onClick: copy, children: copied ? /* @__PURE__ */ jsx(IconCheck, { size: 14 }) : /* @__PURE__ */ jsx(IconCopy, { size: 14 }) }) }) })
-        ] }),
-        /* @__PURE__ */ jsx(
-          Code,
-          {
-            block: true,
-            style: {
-              maxHeight: 300,
-              overflow: "auto",
-              fontSize: "12px",
-              lineHeight: "1.5"
-            },
-            children: primaryError.stackTrace
-          }
-        )
-      ] }),
-      primaryError.errorContext && /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, mb: "xs", style: { fontFamily: "var(--mantine-font-family-headings)" }, children: "Error Context" }),
-        /* @__PURE__ */ jsx(JsonViewer, { data: primaryError.errorContext, maxHeight: 200, fontSize: "12px" })
-      ] }),
-      primaryError.executionContext && /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, mb: "xs", style: { fontFamily: "var(--mantine-font-family-headings)" }, children: "Execution Context" }),
-        /* @__PURE__ */ jsx(JsonViewer, { data: primaryError.executionContext, maxHeight: 200, fontSize: "12px" })
-      ] }),
-      hasRetries && /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, mb: "xs", style: { fontFamily: "var(--mantine-font-family-headings)" }, children: "All Errors (including retries)" }),
-        /* @__PURE__ */ jsx(Accordion, { children: errors.map((error, index) => /* @__PURE__ */ jsxs(Accordion.Item, { value: error.id, children: [
-          /* @__PURE__ */ jsx(Accordion.Control, { children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
-            /* @__PURE__ */ jsxs(Text, { size: "sm", children: [
-              "Attempt ",
-              error.retryAttempt || index + 1,
-              " - ",
-              error.errorType
-            ] }),
-            /* @__PURE__ */ jsx(
-              Badge,
-              {
-                size: "sm",
-                color: error.severity === "critical" ? "red" : error.severity === "warning" ? "orange" : "blue",
-                children: error.severity
-              }
-            )
-          ] }) }),
-          /* @__PURE__ */ jsx(Accordion.Panel, { children: /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
-            /* @__PURE__ */ jsx(Text, { size: "sm", children: error.message }),
-            /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: new Date(error.timestamp).toLocaleString() }),
-            error.stackTrace && /* @__PURE__ */ jsx(Code, { block: true, style: { fontSize: "11px", maxHeight: 150, overflow: "auto" }, children: error.stackTrace })
-          ] }) })
-        ] }, error.id)) })
-      ] }),
-      /* @__PURE__ */ jsx(Divider, {}),
-      /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
-        /* @__PURE__ */ jsxs(Group, { children: [
-          /* @__PURE__ */ jsx(Button, { variant: "light", leftSection: /* @__PURE__ */ jsx(IconCopy, { size: 16 }), onClick: handleCopyDetails, children: "Copy Error Details" }),
-          allResolved ? /* @__PURE__ */ jsx(
-            Badge,
-            {
-              size: "lg",
-              color: "green",
-              variant: "light",
-              leftSection: /* @__PURE__ */ jsx(IconCircleCheck, { size: 14 }),
-              style: { cursor: "default" },
-              children: "Resolved"
-            }
-          ) : /* @__PURE__ */ jsx(
-            Button,
-            {
-              variant: "light",
-              color: "teal",
-              leftSection: /* @__PURE__ */ jsx(IconCircleDashed, { size: 16 }),
-              loading: resolveErrors.isPending,
-              onClick: () => executionId && resolveErrors.mutate(executionId),
-              children: "Resolve"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs(Group, { children: [
-          /* @__PURE__ */ jsx(Button, { variant: "default", onClick: onClose, children: "Close" }),
-          resourceDetailHref && /* @__PURE__ */ jsx(Button, { component: "a", href: resourceDetailHref, target: "_blank", leftSection: /* @__PURE__ */ jsx(IconExternalLink, { size: 16 }), children: "View Execution Log" })
-        ] })
-      ] })
-    ] })
-  ] }) });
-}
-function CostAnalytics({ timeRange }) {
-  const { data: trendsData, isLoading: trendsLoading, error: trendsError } = useCostTrends(timeRange);
-  const { data: summaryData } = useCostSummary(timeRange);
-  const { data: modelData, isLoading: modelLoading, error: modelError } = useCostByModel(timeRange);
-  const { data: breakdownData, isLoading: breakdownLoading, error: breakdownError } = useCostBreakdown(timeRange);
-  if (trendsLoading) return /* @__PURE__ */ jsx(AppShellLoader, {});
-  return /* @__PURE__ */ jsxs(Stack, { children: [
-    /* @__PURE__ */ jsx(
-      PageTitleCaption,
-      {
-        title: "Cost Analytics",
-        caption: "Comprehensive cost tracking, budgets, ROI analysis, and labor savings"
-      }
-    ),
-    /* @__PURE__ */ jsx(CostTrendChart, { data: trendsData, summaryData, isLoading: trendsLoading, error: trendsError }),
-    /* @__PURE__ */ jsx(
-      CostBreakdownCard,
-      {
-        breakdownData,
-        summaryData,
-        isLoading: breakdownLoading,
-        error: breakdownError
-      }
-    ),
-    /* @__PURE__ */ jsx(CostByModelTable, { data: modelData, isLoading: modelLoading, error: modelError })
-  ] });
-}
-function getNavigationPath2(activity) {
-  switch (activity.activityType) {
-    case "workflow_execution":
-      return `/operations/resources/workflow/${activity.entityId}`;
-    case "agent_run":
-      return `/operations/resources/agent/${activity.entityId}`;
-    case "hitl_action":
-      return "/operations/command-queue";
-    case "credential_change":
-    case "credential_read":
-      return "/settings/credentials";
-    case "api_key_change":
-      return "/settings/api-keys";
-    case "deployment_change":
-      return "/settings/deployments";
-    case "membership_change":
-      return "/settings/organization";
-    default:
-      return null;
-  }
-}
-function ActivityLog({ timeRange, pageSize = PAGE_SIZE_DEFAULT, onNavigate }) {
-  const { filters, updateFilter, resetFilters } = useActivityFilters(timeRange);
-  const startDate = useMemo(() => {
-    const { startDate: startDate2 } = getTimeRangeDates(timeRange);
-    return startDate2;
-  }, [timeRange]);
-  const activityType = filters.activityType !== "all" ? filters.activityType : void 0;
-  const { page, setPage, offset, totalPages } = usePaginationState(pageSize, [
-    filters.activityType,
-    filters.status,
-    filters.search,
-    timeRange
-  ]);
-  const { data: chartData, isLoading: isChartLoading } = useActivityTrend({
-    activityType,
-    startDate
-  });
-  const tableParams = useMemo(() => {
-    const params = {
-      limit: pageSize,
-      offset,
-      startDate
-    };
-    if (filters.activityType && filters.activityType !== "all") {
-      params.activityType = filters.activityType;
-    }
-    if (filters.status && filters.status !== "all") {
-      params.status = filters.status;
-    }
-    if (filters.search?.trim()) {
-      params.search = filters.search.trim();
-    }
-    return params;
-  }, [offset, startDate, filters.activityType, filters.status, filters.search, pageSize]);
-  const { data: tableData, isLoading: isTableLoading } = useActivities(tableParams);
-  const total = tableData?.total ?? 0;
-  const handleRowClick = useCallback(
-    (activity) => {
-      const path = getNavigationPath2(activity);
-      if (path) {
-        onNavigate(path);
-      }
-    },
-    [onNavigate]
-  );
-  if (isChartLoading && isTableLoading) return /* @__PURE__ */ jsx(AppShellLoader, {});
-  return /* @__PURE__ */ jsxs(Stack, { children: [
-    /* @__PURE__ */ jsx(
-      PageTitleCaption,
-      {
-        title: "Activity Log",
-        caption: "Real-time activity feed with automatic updates every 30 seconds"
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      ActivityTrendChart,
-      {
-        timestamps: chartData?.timestamps ?? [],
-        total: chartData?.total ?? 0,
-        isLoading: isChartLoading,
-        timeRange
-      }
-    ),
-    /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsxs(Stack, { children: [
-      /* @__PURE__ */ jsx(ActivityFilters, { filters, onFilterChange: updateFilter, onReset: resetFilters }),
-      /* @__PURE__ */ jsx(
-        ActivityTable,
-        {
-          activities: tableData?.activities ?? [],
-          isLoading: isTableLoading,
-          onRowClick: handleRowClick
-        }
-      ),
-      totalPages(total) > 1 && /* @__PURE__ */ jsx(Group, { justify: "flex-start", children: /* @__PURE__ */ jsx(Pagination, { value: page, onChange: setPage, total: totalPages(total), size: "sm", boundaries: 1 }) })
-    ] }) })
-  ] });
-}
-function ActivityFeed({
-  limit = 50,
-  activityType,
-  entityType,
-  entityId,
-  filters,
-  clientFilters,
-  overrideData,
-  overrideLoading
-}) {
-  const [currentLimit, setCurrentLimit] = useState(limit);
-  const shouldFetch = !overrideData;
-  const fetchResult = useActivities({
-    limit: currentLimit,
-    activityType: filters?.activityType || activityType,
-    entityType,
-    entityId,
-    startDate: filters?.startDate
-  });
-  const data = overrideData ?? fetchResult.data;
-  const error = shouldFetch ? fetchResult.error : null;
-  const isLoading = overrideLoading ?? (shouldFetch ? fetchResult.isLoading : false);
-  const handleLoadMore = () => {
-    setCurrentLimit((prev) => prev + 50);
-  };
-  const filteredActivities = useMemo(() => {
-    if (!data?.activities) return [];
-    let filtered = data.activities;
-    if (clientFilters?.status) {
-      filtered = filtered.filter((activity) => activity.status === clientFilters.status);
-    }
-    if (clientFilters?.search) {
-      const searchLower = clientFilters.search.toLowerCase();
-      filtered = filtered.filter(
-        (activity) => activity.title.toLowerCase().includes(searchLower) || activity.description?.toLowerCase().includes(searchLower) || activity.entityName?.toLowerCase().includes(searchLower)
-      );
-    }
-    return filtered;
-  }, [data?.activities, clientFilters]);
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, { size: "md" }) });
-  }
-  if (error) {
-    return /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconInfoCircle, { size: 16 }), title: "Error loading activities", color: "red", children: /* @__PURE__ */ jsx(Text, { size: "sm", children: error instanceof Error ? error.message : "Failed to load activities" }) });
-  }
-  if (!filteredActivities.length) {
-    return /* @__PURE__ */ jsx(EmptyState, { icon: IconActivity, title: "No activities found" });
-  }
-  const hasMore = data ? data.total > currentLimit : false;
-  const showingCount = filteredActivities.length;
-  const totalCount = data?.total || 0;
-  return /* @__PURE__ */ jsxs(Stack, { children: [
-    /* @__PURE__ */ jsx(Group, { justify: "space-between", children: /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-      "Showing ",
-      showingCount,
-      " of ",
-      totalCount,
-      " activities"
-    ] }) }),
-    /* @__PURE__ */ jsx(Stack, { children: filteredActivities.map((activity) => /* @__PURE__ */ jsx(ActivityCard, { activity }, activity.id)) }),
-    hasMore && /* @__PURE__ */ jsx(Center, { children: /* @__PURE__ */ jsx(Button, { variant: "light", onClick: handleLoadMore, loading: isLoading, children: "Load More" }) })
-  ] });
-}
-function NotificationCenter({ pageSize = 20 }) {
-  const { page, setPage, offset, totalPages } = usePaginationState(pageSize);
-  const { data, isLoading } = useNotifications({ limit: pageSize, offset });
-  const notifications = data?.notifications ?? [];
-  const markAllAsRead = useMarkAllAsRead();
-  const hasUnread = notifications.some((n) => !n.read);
-  const handleMarkAllAsRead = async () => {
-    await markAllAsRead.mutateAsync();
-  };
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    hasUnread && /* @__PURE__ */ jsx(Group, { justify: "flex-end", children: /* @__PURE__ */ jsx(Button, { variant: "light", size: "sm", onClick: handleMarkAllAsRead, loading: markAllAsRead.isPending, children: "Mark all as read" }) }),
-    /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsx(NotificationList, { notifications, isLoading }) }),
-    totalPages(data?.total ?? 0) > 1 && /* @__PURE__ */ jsx(Group, { justify: "flex-start", children: /* @__PURE__ */ jsx(Pagination, { value: page, onChange: setPage, total: totalPages(data?.total ?? 0), size: "sm", boundaries: 1 }) })
-  ] });
-}
-var monitoringManifest = {
-  key: "monitoring",
-  routePrefixes: ["/monitoring"],
-  icon: IconActivity
-};
-
-export { ActivityCard, ActivityFeed, ActivityFilters, ActivityLog, ActivityTable, BusinessImpactCard, CostAnalytics, CostBreakdownCard, CostByModelTable, CostMetricsCard, ErrorAnalysisCard, ErrorBreakdownTable, ErrorDetailsModal, ExecutionBreakdownTable, ExecutionHealth, ExecutionHealthCard, ExecutionLogsFilters, ExecutionLogsPage, ExecutionLogsTable, NotificationCenter, NotificationItem, NotificationList, monitoringManifest };