nitrostack 1.0.71 → 1.0.73

package/src/studio/lib/ops-store.ts

@@ -0,0 +1,427 @@
+/**
+ * Ops Store - Zustand store for Agent Operations Visualization
+ */
+
+import { create } from 'zustand';
+import type {
+  OpsNode,
+  OpsEdge,
+  OpsSession,
+  OpsSessionSummary,
+  OpsNodeType,
+  OpsNodeData,
+  OpsTurn,
+  LLMProvider,
+} from './ops-types';
+
+interface OpsState {
+  // Current session
+  currentSession: OpsSession | null;
+  
+  // Current turn being tracked
+  currentTurnId: string | null;
+  
+  // Selected turn for viewing (null = show all)
+  selectedTurnId: string | null;
+  
+  // Playback state
+  isPlaying: boolean;
+  playbackTurnIndex: number;
+  
+  // UI state
+  isOpsViewOpen: boolean;
+  selectedNodeId: string | null;
+  
+  // History (for replay/comparison)
+  sessionHistory: OpsSession[];
+  
+  // Actions
+  startSession: () => void;
+  endSession: () => void;
+  clearSession: () => void;
+  
+  startTurn: (promptPreview: string) => string;
+  endTurn: () => void;
+  
+  addNode: (type: OpsNodeType, data: OpsNodeData) => string;
+  updateNode: (nodeId: string, updates: Partial<OpsNode>) => void;
+  updateNodeData: (nodeId: string, dataUpdates: Partial<OpsNodeData>) => void;
+  
+  addEdge: (source: string, target: string, label?: string) => void;
+  
+  setOpsViewOpen: (open: boolean) => void;
+  toggleOpsView: () => void;
+  setSelectedNode: (nodeId: string | null) => void;
+  setSelectedTurn: (turnId: string | null) => void;
+  
+  // Playback controls
+  startPlayback: () => void;
+  stopPlayback: () => void;
+  nextTurn: () => void;
+  prevTurn: () => void;
+  
+  // Computed
+  getSummary: () => OpsSessionSummary;
+  getNodesForTurn: (turnId: string | null) => OpsNode[];
+  getEdgesForTurn: (turnId: string | null) => OpsEdge[];
+}
+
+// Generate unique ID
+const generateId = (): string => {
+  return `ops_${Date.now()}_${Math.random().toString(36).substring(2, 9)}`;
+};
+
+// Create empty summary
+const createEmptySummary = (): OpsSessionSummary => ({
+  totalTokens: 0,
+  inputTokens: 0,
+  outputTokens: 0,
+  estimatedCost: 0,
+  totalDuration: 0,
+  toolCalls: 0,
+  llmCalls: 0,
+  widgetRenders: 0,
+  errors: 0,
+});
+
+export const useOpsStore = create<OpsState>((set, get) => ({
+  // Initial state
+  currentSession: null,
+  currentTurnId: null,
+  selectedTurnId: null,
+  isPlaying: false,
+  playbackTurnIndex: 0,
+  isOpsViewOpen: false,
+  selectedNodeId: null,
+  sessionHistory: [],
+  
+  // Start a new session
+  startSession: () => {
+    const session: OpsSession = {
+      id: generateId(),
+      startTime: Date.now(),
+      nodes: [],
+      edges: [],
+      turns: [],
+      summary: createEmptySummary(),
+    };
+    set({ currentSession: session, currentTurnId: null, selectedTurnId: null });
+  },
+  
+  // End current session
+  endSession: () => {
+    const { currentSession, sessionHistory } = get();
+    if (currentSession) {
+      const endedSession = {
+        ...currentSession,
+        endTime: Date.now(),
+        summary: get().getSummary(),
+      };
+      set({
+        currentSession: null,
+        currentTurnId: null,
+        sessionHistory: [...sessionHistory, endedSession],
+      });
+    }
+  },
+  
+  // Clear current session
+  clearSession: () => {
+    set({ 
+      currentSession: null, 
+      currentTurnId: null,
+      selectedTurnId: null,
+      selectedNodeId: null,
+      isPlaying: false,
+      playbackTurnIndex: 0,
+    });
+  },
+  
+  // Start a new turn/cycle
+  startTurn: (promptPreview: string) => {
+    const { currentSession } = get();
+    
+    // Auto-start session if not started
+    if (!currentSession) {
+      get().startSession();
+    }
+    
+    const session = get().currentSession;
+    if (!session) return '';
+    
+    const turnId = generateId();
+    const turn: OpsTurn = {
+      id: turnId,
+      startTime: Date.now(),
+      promptPreview: promptPreview.substring(0, 40) + (promptPreview.length > 40 ? '...' : ''),
+      nodeCount: 0,
+      hasError: false,
+    };
+    
+    set({
+      currentTurnId: turnId,
+      currentSession: {
+        ...session,
+        turns: [...session.turns, turn],
+      },
+    });
+    
+    return turnId;
+  },
+  
+  // End current turn
+  endTurn: () => {
+    const { currentSession, currentTurnId } = get();
+    if (!currentSession || !currentTurnId) return;
+    
+    const turnNodes = currentSession.nodes.filter(n => n.turnId === currentTurnId);
+    const hasError = turnNodes.some(n => n.data.status === 'error');
+    
+    set({
+      currentTurnId: null,
+      currentSession: {
+        ...currentSession,
+        turns: currentSession.turns.map(t => 
+          t.id === currentTurnId 
+            ? { ...t, endTime: Date.now(), nodeCount: turnNodes.length, hasError }
+            : t
+        ),
+      },
+    });
+  },
+  
+  // Add a node
+  addNode: (type: OpsNodeType, data: OpsNodeData): string => {
+    const { currentSession, currentTurnId } = get();
+    
+    // Auto-start session if not started
+    if (!currentSession) {
+      get().startSession();
+    }
+    
+    const session = get().currentSession;
+    const turnId = get().currentTurnId;
+    if (!session) return '';
+    
+    // If no turn is active, create one
+    let effectiveTurnId = turnId;
+    if (!effectiveTurnId && type === 'user_prompt') {
+      const content = (data as { content?: string }).content || 'New conversation';
+      effectiveTurnId = get().startTurn(content);
+    } else if (!effectiveTurnId) {
+      effectiveTurnId = get().startTurn('Continuation');
+    }
+    
+    const nodeId = generateId();
+    
+    const newNode: OpsNode = {
+      id: nodeId,
+      type,
+      timestamp: Date.now(),
+      data,
+      turnId: effectiveTurnId || '',
+    };
+    
+    set({
+      currentSession: {
+        ...session,
+        nodes: [...session.nodes, newNode],
+      },
+    });
+    
+    return nodeId;
+  },
+  
+  // Update a node
+  updateNode: (nodeId: string, updates: Partial<OpsNode>) => {
+    const { currentSession } = get();
+    if (!currentSession) return;
+    
+    set({
+      currentSession: {
+        ...currentSession,
+        nodes: currentSession.nodes.map((node) =>
+          node.id === nodeId ? { ...node, ...updates } : node
+        ),
+      },
+    });
+  },
+  
+  // Update node data
+  updateNodeData: (nodeId: string, dataUpdates: Partial<OpsNodeData>) => {
+    const { currentSession } = get();
+    if (!currentSession) return;
+    
+    set({
+      currentSession: {
+        ...currentSession,
+        nodes: currentSession.nodes.map((node) =>
+          node.id === nodeId
+            ? { ...node, data: { ...node.data, ...dataUpdates } as OpsNodeData }
+            : node
+        ),
+      },
+    });
+  },
+  
+  // Add an edge
+  addEdge: (source: string, target: string, label?: string) => {
+    const { currentSession, currentTurnId } = get();
+    if (!currentSession) return;
+    
+    const edgeId = `edge_${source}_${target}`;
+    
+    // Don't add duplicate edges
+    if (currentSession.edges.some((e) => e.id === edgeId)) return;
+    
+    // Find the turn from source node
+    const sourceNode = currentSession.nodes.find(n => n.id === source);
+    const turnId = sourceNode?.turnId || currentTurnId || '';
+    
+    const newEdge: OpsEdge = {
+      id: edgeId,
+      source,
+      target,
+      label,
+      animated: false,
+      turnId,
+    };
+    
+    set({
+      currentSession: {
+        ...currentSession,
+        edges: [...currentSession.edges, newEdge],
+      },
+    });
+  },
+  
+  // Toggle ops view
+  setOpsViewOpen: (open: boolean) => set({ isOpsViewOpen: open }),
+  toggleOpsView: () => set((state) => ({ isOpsViewOpen: !state.isOpsViewOpen })),
+  
+  // Select node
+  setSelectedNode: (nodeId: string | null) => set({ selectedNodeId: nodeId }),
+  
+  // Select turn
+  setSelectedTurn: (turnId: string | null) => set({ 
+    selectedTurnId: turnId,
+    selectedNodeId: null,
+  }),
+  
+  // Playback controls
+  startPlayback: () => {
+    const { currentSession } = get();
+    if (!currentSession || currentSession.turns.length === 0) return;
+    
+    set({ 
+      isPlaying: true, 
+      playbackTurnIndex: 0,
+      selectedTurnId: currentSession.turns[0]?.id || null,
+    });
+  },
+  
+  stopPlayback: () => {
+    set({ isPlaying: false });
+  },
+  
+  nextTurn: () => {
+    const { currentSession, playbackTurnIndex } = get();
+    if (!currentSession) return;
+    
+    const nextIndex = playbackTurnIndex + 1;
+    if (nextIndex < currentSession.turns.length) {
+      set({ 
+        playbackTurnIndex: nextIndex,
+        selectedTurnId: currentSession.turns[nextIndex]?.id || null,
+      });
+    } else {
+      // End playback when we reach the end
+      set({ isPlaying: false });
+    }
+  },
+  
+  prevTurn: () => {
+    const { currentSession, playbackTurnIndex } = get();
+    if (!currentSession) return;
+    
+    const prevIndex = playbackTurnIndex - 1;
+    if (prevIndex >= 0) {
+      set({ 
+        playbackTurnIndex: prevIndex,
+        selectedTurnId: currentSession.turns[prevIndex]?.id || null,
+      });
+    }
+  },
+  
+  // Get nodes for a specific turn (or all if null)
+  getNodesForTurn: (turnId: string | null): OpsNode[] => {
+    const { currentSession } = get();
+    if (!currentSession) return [];
+    
+    if (turnId === null) {
+      return currentSession.nodes;
+    }
+    
+    return currentSession.nodes.filter(n => n.turnId === turnId);
+  },
+  
+  // Get edges for a specific turn (or all if null)
+  getEdgesForTurn: (turnId: string | null): OpsEdge[] => {
+    const { currentSession } = get();
+    if (!currentSession) return [];
+    
+    if (turnId === null) {
+      return currentSession.edges;
+    }
+    
+    return currentSession.edges.filter(e => e.turnId === turnId);
+  },
+  
+  // Calculate summary
+  getSummary: (): OpsSessionSummary => {
+    const { currentSession, selectedTurnId } = get();
+    if (!currentSession) return createEmptySummary();
+    
+    const summary = createEmptySummary();
+    const nodes = selectedTurnId 
+      ? currentSession.nodes.filter(n => n.turnId === selectedTurnId)
+      : currentSession.nodes;
+    
+    let totalDuration = 0;
+    
+    for (const node of nodes) {
+      if (node.duration) {
+        totalDuration += node.duration;
+      }
+      
+      switch (node.type) {
+        case 'llm_call':
+        case 'llm_response': {
+          summary.llmCalls++;
+          const llmData = node.data as { inputTokens?: number; outputTokens?: number; totalTokens?: number };
+          if (llmData.inputTokens) summary.inputTokens += llmData.inputTokens;
+          if (llmData.outputTokens) summary.outputTokens += llmData.outputTokens;
+          if (llmData.totalTokens) summary.totalTokens += llmData.totalTokens;
+          break;
+        }
+        case 'tool_call':
+          summary.toolCalls++;
+          break;
+        case 'tool_result': {
+          const resultData = node.data as { status?: string };
+          if (resultData.status === 'error') {
+            summary.errors++;
+          }
+          break;
+        }
+        case 'widget_render':
+          summary.widgetRenders++;
+          break;
+      }
+    }
+    
+    summary.totalDuration = totalDuration;
+    
+    return summary;
+  },
+}));