@mastra/playground-ui 5.1.2-alpha.0 → 5.1.2-alpha.1

package/dist/index.es.js

@@ -5373,11 +5373,10 @@ function EvalTable({ evals, isCIMode = false }) {
 const TraceContext = createContext({});
 function TraceProvider({
   children,
-  initialTraces
+  initialTraces: traces = []
 }) {
   const [open, setOpen] = useState(false);
   const [trace, setTrace] = useState(null);
-  const [traces, setTraces] = useState(initialTraces || []);
   const [currentTraceIndex, setCurrentTraceIndex] = useState(0);
   const [span, setSpan] = useState(null);
   const nextTrace = () => {
@@ -5414,7 +5413,6 @@ function TraceProvider({
         trace,
         setTrace,
         traces,
-        setTraces,
         currentTraceIndex,
         setCurrentTraceIndex,
         nextTrace,
@@ -5539,9 +5537,6 @@ const toSigFigs = (num, sigFigs) => {
   return Number(num.toPrecision(sigFigs));
 };
 
-const TracesTableSkeleton = ({ colsCount }) => {
-  return /* @__PURE__ */ jsx(Tbody, { children: /* @__PURE__ */ jsx(Row, { children: Array.from({ length: colsCount }).map((_, index) => /* @__PURE__ */ jsx(Cell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "w-1/2" }) }, index)) }) });
-};
 const TracesTableEmpty = ({ colsCount }) => {
   return /* @__PURE__ */ jsx(Tbody, { children: /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx(Cell, { colSpan: colsCount, className: "text-center py-4", children: /* @__PURE__ */ jsx(Txt, { children: "No traces found" }) }) }) });
 };
@@ -5562,7 +5557,7 @@ const TraceRow = ({ trace, index, isActive }) => {
     /* @__PURE__ */ jsx(Cell, { children: hasFailure ? /* @__PURE__ */ jsx(Badge$1, { variant: "error", icon: /* @__PURE__ */ jsx(X, {}), children: "Failed" }) : /* @__PURE__ */ jsx(Badge$1, { icon: /* @__PURE__ */ jsx(Check, {}), variant: "success", children: "Success" }) })
   ] });
 };
-const TracesTable = ({ traces, isLoading, error }) => {
+const TracesTable = ({ traces, error }) => {
   const hasNoTraces = !traces || traces.length === 0;
   const { currentTraceIndex } = useContext(TraceContext);
   const colsCount = 4;
@@ -5574,7 +5569,7 @@ const TracesTable = ({ traces, isLoading, error }) => {
       /* @__PURE__ */ jsx(Th, { width: 120, children: "Spans" }),
       /* @__PURE__ */ jsx(Th, { width: 120, children: "Status" })
     ] }),
-    isLoading ? /* @__PURE__ */ jsx(TracesTableSkeleton, { colsCount }) : error ? /* @__PURE__ */ jsx(TracesTableError, { error, colsCount }) : hasNoTraces ? /* @__PURE__ */ jsx(TracesTableEmpty, { colsCount }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Tbody, { children: traces.map((trace, index) => /* @__PURE__ */ jsx(TraceRow, { trace, index, isActive: index === currentTraceIndex }, trace.traceId)) }) })
+    error ? /* @__PURE__ */ jsx(TracesTableError, { error, colsCount }) : hasNoTraces ? /* @__PURE__ */ jsx(TracesTableEmpty, { colsCount }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Tbody, { children: traces.map((trace, index) => /* @__PURE__ */ jsx(TraceRow, { trace, index, isActive: index === currentTraceIndex }, trace.traceId)) }) })
   ] });
 };
 
@@ -6182,14 +6177,14 @@ const TracesSidebar = ({ onResize }) => {
   );
 };
 
-function AgentTraces({ className, traces, isLoading, error }) {
-  return /* @__PURE__ */ jsx(AgentTracesInner, { className, traces, isLoading, error });
+function AgentTraces({ className, traces, error }) {
+  return /* @__PURE__ */ jsx(TraceProvider, { initialTraces: traces || [], children: /* @__PURE__ */ jsx(AgentTracesInner, { className, traces, error }) });
 }
-function AgentTracesInner({ className, traces, isLoading, error }) {
+function AgentTracesInner({ className, traces, error }) {
   const [sidebarWidth, setSidebarWidth] = useState(100);
   const { isOpen: open } = useContext(TraceContext);
   return /* @__PURE__ */ jsxs("div", { className: clsx("h-full relative overflow-hidden flex", className), children: [
-    /* @__PURE__ */ jsx("div", { className: "h-full overflow-y-scroll w-full", children: /* @__PURE__ */ jsx(TracesTable, { traces, isLoading, error }) }),
+    /* @__PURE__ */ jsx("div", { className: "h-full overflow-y-scroll w-full", children: /* @__PURE__ */ jsx(TracesTable, { traces, error }) }),
     open && /* @__PURE__ */ jsx(TracesSidebar, { width: sidebarWidth, onResize: setSidebarWidth })
   ] });
 }
@@ -6641,10 +6636,10 @@ const NetworkChat = ({ agentId, memory }) => {
   return /* @__PURE__ */ jsx(MastraNetworkRuntimeProvider, { agentId, memory, modelSettings, children: /* @__PURE__ */ jsx("div", { className: "h-full pb-4", children: /* @__PURE__ */ jsx(Thread, { ToolFallback }) }) });
 };
 
-function WorkflowTraces({ traces, isLoading, error, runId, stepName }) {
-  return /* @__PURE__ */ jsx(WorkflowTracesInner, { traces, isLoading, error, runId, stepName });
+function WorkflowTraces({ traces, error, runId, stepName }) {
+  return /* @__PURE__ */ jsx(TraceProvider, { initialTraces: traces || [], children: /* @__PURE__ */ jsx(WorkflowTracesInner, { traces, error, runId, stepName }) });
 }
-function WorkflowTracesInner({ traces, isLoading, error, runId, stepName }) {
+function WorkflowTracesInner({ traces, error, runId, stepName }) {
   const hasRunRef = useRef(false);
   const [sidebarWidth, setSidebarWidth] = useState(100);
   const { isOpen: open, setTrace, setIsOpen, setSpan } = useContext(TraceContext);
@@ -6661,7 +6656,7 @@ function WorkflowTracesInner({ traces, isLoading, error, runId, stepName }) {
     hasRunRef.current = true;
   }, [runId, traces, setTrace]);
   return /* @__PURE__ */ jsxs("main", { className: "h-full relative overflow-hidden flex", children: [
-    /* @__PURE__ */ jsx("div", { className: "h-full overflow-y-scroll w-full", children: /* @__PURE__ */ jsx(TracesTable, { traces, isLoading, error }) }),
+    /* @__PURE__ */ jsx("div", { className: "h-full overflow-y-scroll w-full", children: /* @__PURE__ */ jsx(TracesTable, { traces, error }) }),
     open && /* @__PURE__ */ jsx(TracesSidebar, { width: sidebarWidth, onResize: setSidebarWidth })
   ] });
 }
@@ -10099,7 +10094,6 @@ function usePolling({
 
 const useTraces = (componentName, baseUrl, isWorkflow = false) => {
   const [traces, setTraces] = useState([]);
-  const { setTraces: setTraceContextTraces } = useContext(TraceContext);
   const client = useMemo(() => createMastraClient(baseUrl), [baseUrl]);
   const fetchFn = useCallback(async () => {
     try {
@@ -10117,15 +10111,11 @@ const useTraces = (componentName, baseUrl, isWorkflow = false) => {
       throw error2;
     }
   }, [client, componentName, isWorkflow]);
-  const onSuccess = useCallback(
-    (newTraces) => {
-      if (newTraces.length > 0) {
-        setTraces(() => newTraces);
-        setTraceContextTraces(() => newTraces);
-      }
-    },
-    [setTraceContextTraces]
-  );
+  const onSuccess = useCallback((newTraces) => {
+    if (newTraces.length > 0) {
+      setTraces(() => newTraces);
+    }
+  }, []);
   const onError = useCallback((error2) => {
     console.log(`error, onError`, error2);
     toast.error(error2.message);
@@ -10144,5 +10134,5 @@ const useTraces = (componentName, baseUrl, isWorkflow = false) => {
   return { traces, firstCallLoading, error };
 };
 
-export { AgentChat, AgentCoinIcon, AgentContext, AgentEvals, AgentIcon, AgentNetworkCoinIcon, AgentProvider, AgentTraces, AiIcon, ApiIcon, Badge$1 as Badge, BranchIcon, Breadcrumb, Button, Cell, CheckIcon, ChevronIcon, CommitIcon, CrossIcon, Crumb, DarkLogo, DataTable, DateTimeCell, DbIcon, DebugIcon, DeploymentIcon, DividerIcon, DocsIcon, DynamicForm, EmptyState, Entity, EntityContent, EntityDescription, EntityIcon, EntityName, EntryCell, EnvIcon, EvaluatorCoinIcon, FiltersIcon, FolderIcon, GithubCoinIcon, GithubIcon, GoogleIcon, Header, HeaderAction, HeaderGroup, HeaderTitle, HomeIcon, Icon, InfoIcon, JudgeIcon, LatencyIcon, LegacyWorkflowGraph, LegacyWorkflowTrigger, LogsIcon, MastraResizablePanel, McpCoinIcon, McpServerIcon, MemoryIcon, NetworkChat, NetworkContext, NetworkProvider, OpenAIIcon, PromptIcon, RepoIcon, Row, ScoreIcon, SettingsIcon, SlashIcon, Table, Tbody, Th, Thead, ThreadDeleteButton, ThreadItem, ThreadLink, ThreadList, Threads, ToolCoinIcon, ToolsIcon, TraceContext, TraceIcon, TraceProvider, TsIcon, Txt, TxtCell, UnitCell, VariablesIcon, WorkflowCoinIcon, WorkflowGraph, WorkflowIcon, WorkflowRunContext, WorkflowRunProvider, WorkflowTraces, WorkflowTrigger, refineTraces, useCurrentRun, usePlaygroundStore, usePolling, useSpeechRecognition, useTraces };
+export { AgentChat, AgentCoinIcon, AgentContext, AgentEvals, AgentIcon, AgentNetworkCoinIcon, AgentProvider, AgentTraces, AiIcon, ApiIcon, Badge$1 as Badge, BranchIcon, Breadcrumb, Button, Cell, CheckIcon, ChevronIcon, CommitIcon, CrossIcon, Crumb, DarkLogo, DataTable, DateTimeCell, DbIcon, DebugIcon, DeploymentIcon, DividerIcon, DocsIcon, DynamicForm, EmptyState, Entity, EntityContent, EntityDescription, EntityIcon, EntityName, EntryCell, EnvIcon, EvaluatorCoinIcon, FiltersIcon, FolderIcon, GithubCoinIcon, GithubIcon, GoogleIcon, Header, HeaderAction, HeaderGroup, HeaderTitle, HomeIcon, Icon, InfoIcon, JudgeIcon, LatencyIcon, LegacyWorkflowGraph, LegacyWorkflowTrigger, LogsIcon, MastraResizablePanel, McpCoinIcon, McpServerIcon, MemoryIcon, NetworkChat, NetworkContext, NetworkProvider, OpenAIIcon, PromptIcon, RepoIcon, Row, ScoreIcon, SettingsIcon, SlashIcon, Table, Tbody, Th, Thead, ThreadDeleteButton, ThreadItem, ThreadLink, ThreadList, Threads, ToolCoinIcon, ToolsIcon, TraceIcon, TsIcon, Txt, TxtCell, UnitCell, VariablesIcon, WorkflowCoinIcon, WorkflowGraph, WorkflowIcon, WorkflowRunContext, WorkflowRunProvider, WorkflowTraces, WorkflowTrigger, refineTraces, useCurrentRun, usePlaygroundStore, usePolling, useSpeechRecognition, useTraces };
 //# sourceMappingURL=index.es.js.map