@mastra/playground-ui 5.0.1-alpha.2 → 5.0.1-alpha.3

package/dist/domains/agents/agent/agent-traces.d.ts

@@ -1,5 +1,6 @@
 export interface AgentTracesProps {
     agentName: string;
     baseUrl: string;
+    className?: string;
 }
-export declare function AgentTraces({ agentName, baseUrl }: AgentTracesProps): import("react/jsx-runtime").JSX.Element;
+export declare function AgentTraces({ agentName, baseUrl, className }: AgentTracesProps): import("react/jsx-runtime").JSX.Element;

package/dist/domains/networks/index.d.ts

@@ -1 +1,2 @@
 export * from './network-chat';
+export * from './network-context';

package/dist/domains/networks/network-context.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from '../../../node_modules/@types/react';
+import { ModelSettings } from '../../types';
+
+type NetworkContextType = {
+    modelSettings: ModelSettings;
+    setModelSettings: React.Dispatch<React.SetStateAction<ModelSettings>>;
+    resetModelSettings: () => void;
+};
+export declare const NetworkContext: import('../../../node_modules/@types/react').Context<NetworkContextType>;
+export declare function NetworkProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/index.cjs.js

@@ -4317,7 +4317,7 @@ function MastraRuntimeProvider({
   ] });
 }
 
-const defaultModelSettings = {
+const defaultModelSettings$1 = {
   maxRetries: 2,
   maxSteps: 5,
   temperature: 0.5,
@@ -4325,10 +4325,10 @@ const defaultModelSettings = {
 };
 const AgentContext = React.createContext({});
 function AgentProvider({ children }) {
-  const [modelSettings, setModelSettings] = React.useState(defaultModelSettings);
+  const [modelSettings, setModelSettings] = React.useState(defaultModelSettings$1);
   const [chatWithGenerate, setChatWithGenerate] = React.useState(false);
   const resetModelSettings = () => {
-    setModelSettings(defaultModelSettings);
+    setModelSettings(defaultModelSettings$1);
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     AgentContext.Provider,
@@ -5361,7 +5361,7 @@ const variantClasses = {
 };
 const Time = ({ durationMs, tokenCount, variant, progressPercent }) => {
   const variantClass = variant ? variantClasses[variant] : "bg-accent3";
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-[166px] shrink-0", children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-surface4 relative h-[6px] w-full rounded-full p-px overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx("absolute h-1 rounded-full", variantClass), style: { width: `${progressPercent}%` } }) }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 pt-0.5", children: [
       /* @__PURE__ */ jsxRuntime.jsxs(Txt, { variant: "ui-sm", className: "text-icon2 font-medium", children: [
@@ -5412,8 +5412,8 @@ const Span = ({ children, durationMs, variant, tokenCount, spans, isRoot, onClic
   const progressPercent = durationMs / traceDuration * 100;
   const TextEl = onClick ? "button" : "div";
   return /* @__PURE__ */ jsxRuntime.jsx(TraceDurationProvider, { durationMs, children: /* @__PURE__ */ jsxRuntime.jsxs("li", { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx("grid grid-cols-2 items-center gap-2 rounded-md pl-2", isActive && "bg-surface4"), children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-8 items-center gap-1", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx("flex justify-between items-center gap-2 rounded-md pl-2", isActive && "bg-surface4"), children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-8 items-center gap-1 min-w-0", children: [
         spans ? /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
@@ -5716,15 +5716,15 @@ const TracesSidebar = ({ onResize }) => {
   );
 };
 
-function AgentTraces({ agentName, baseUrl }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TraceProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(AgentTracesInner, { agentName, baseUrl }) });
+function AgentTraces({ agentName, baseUrl, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TraceProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(AgentTracesInner, { agentName, baseUrl, className }) });
 }
-function AgentTracesInner({ agentName, baseUrl }) {
+function AgentTracesInner({ agentName, baseUrl, className }) {
   const [sidebarWidth, setSidebarWidth] = React.useState(100);
   const { traces, firstCallLoading, error } = useTraces(agentName, baseUrl);
   const { isOpen: open } = React.useContext(TraceContext);
-  return /* @__PURE__ */ jsxRuntime.jsxs("main", { className: "h-full relative overflow-hidden flex", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx("h-full", open ? "w-auto" : "w-full"), children: /* @__PURE__ */ jsxRuntime.jsx(TracesTable, { traces, isLoading: firstCallLoading, error }) }),
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx("h-full relative overflow-hidden flex", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx("h-full overflow-y-scroll", open ? "w-auto" : "w-full"), children: /* @__PURE__ */ jsxRuntime.jsx(TracesTable, { traces, isLoading: firstCallLoading, error }) }),
     open && /* @__PURE__ */ jsxRuntime.jsx(TracesSidebar, { width: sidebarWidth, onResize: setSidebarWidth })
   ] });
 }
@@ -5739,11 +5739,13 @@ function MastraNetworkRuntimeProvider({
   memory,
   threadId,
   baseUrl,
-  refreshThreadList
+  refreshThreadList,
+  modelSettings = {}
 }) {
   const [isRunning, setIsRunning] = React.useState(false);
   const [messages, setMessages] = React.useState(initialMessages || []);
   const [currentThreadId, setCurrentThreadId] = React.useState(threadId);
+  const { frequencyPenalty, presencePenalty, maxRetries, maxSteps, maxTokens, temperature, topK, topP, instructions } = modelSettings;
   React.useEffect(() => {
     if (messages.length === 0 || currentThreadId !== threadId) {
       if (initialMessages && threadId && memory) {
@@ -5753,8 +5755,6 @@ function MastraNetworkRuntimeProvider({
     }
   }, [initialMessages, threadId, memory, messages]);
   const mastra = createMastraClient(baseUrl);
-  console.log("MastraClient initialized");
-  console.log(messages, "###");
   const network = mastra.getNetwork(agentId);
   const onNew = async (message) => {
     if (message.content[0]?.type !== "text") throw new Error("Only text messages are supported");
@@ -5783,6 +5783,15 @@ function MastraNetworkRuntimeProvider({
           }
         ],
         runId: agentId,
+        frequencyPenalty,
+        presencePenalty,
+        maxRetries,
+        maxSteps,
+        maxTokens,
+        temperature,
+        topK,
+        topP,
+        instructions,
         ...memory ? { threadId, resourceId: agentId } : {}
       });
       if (!response.body) {
@@ -6137,8 +6146,34 @@ const ToolFallback = (props) => {
   }) });
 };
 
+const defaultModelSettings = {
+  maxRetries: 2,
+  maxSteps: 5,
+  temperature: 0.5,
+  topP: 1
+};
+const NetworkContext = React.createContext({});
+function NetworkProvider({ children }) {
+  const [modelSettings, setModelSettings] = React.useState(defaultModelSettings);
+  const resetModelSettings = () => {
+    setModelSettings(defaultModelSettings);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    NetworkContext.Provider,
+    {
+      value: {
+        modelSettings,
+        setModelSettings,
+        resetModelSettings
+      },
+      children
+    }
+  );
+}
+
 const NetworkChat = ({ agentId, memory }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(MastraNetworkRuntimeProvider, { agentId, memory, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full pb-4", children: /* @__PURE__ */ jsxRuntime.jsx(Thread, { ToolFallback }) }) });
+  const { modelSettings } = React.useContext(NetworkContext);
+  return /* @__PURE__ */ jsxRuntime.jsx(MastraNetworkRuntimeProvider, { agentId, memory, modelSettings, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full pb-4", children: /* @__PURE__ */ jsxRuntime.jsx(Thread, { ToolFallback }) }) });
 };
 
 function WorkflowTraces({ workflowName, baseUrl }) {
@@ -8679,7 +8714,7 @@ function VNextWorkflowTrigger({
         ] }) }, stepId) });
       }) })
     ] }),
-    isSuspendedSteps && suspendedSteps?.map((step) => {
+    !isWatchingVNextWorkflow && isSuspendedSteps && suspendedSteps?.map((step) => {
       const stepDefinition = vNextWorkflow.steps[step.stepId];
       const stepSchema = stepDefinition?.resumeSchema ? resolveSerializedZodOutput(jsonSchemaToZod(superjson.parse(stepDefinition.resumeSchema))) : z.z.record(z.z.string(), z.z.any());
       return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col px-4", children: [
@@ -8926,6 +8961,8 @@ exports.LogsIcon = LogsIcon;
 exports.MastraResizablePanel = MastraResizablePanel;
 exports.MemoryIcon = MemoryIcon;
 exports.NetworkChat = NetworkChat;
+exports.NetworkContext = NetworkContext;
+exports.NetworkProvider = NetworkProvider;
 exports.OpenAIIcon = OpenAIIcon;
 exports.PromptIcon = PromptIcon;
 exports.RepoIcon = RepoIcon;