flock-core 0.5.0b70__py3-none-any.whl → 0.5.0b75__py3-none-any.whl

flock/frontend/src/store/moduleStore.ts

@@ -1,5 +1,5 @@
 import { create } from 'zustand';
-import { devtools } from 'zustand/middleware';
+import { devtools, persist } from 'zustand/middleware';
 import type { ModuleInstance } from '../types/modules';
 
 interface ModuleState {
@@ -15,43 +15,61 @@ interface ModuleState {
 
 export const useModuleStore = create<ModuleState>()(
   devtools(
-    (set) => ({
-      instances: new Map(),
+    persist<ModuleState>(
+      (set) => ({
+        instances: new Map(),
 
-      addModule: (module) =>
-        set((state) => {
-          const instances = new Map(state.instances);
-          instances.set(module.id, module);
-          return { instances };
-        }),
+        addModule: (module: ModuleInstance) =>
+          set((state) => {
+            const instances = new Map(state.instances);
+            instances.set(module.id, module);
+            return { instances };
+          }),
 
-      updateModule: (id, updates) =>
-        set((state) => {
-          const instances = new Map(state.instances);
-          const existing = instances.get(id);
-          if (existing) {
-            instances.set(id, { ...existing, ...updates });
-          }
-          return { instances };
-        }),
+        updateModule: (id: string, updates: Partial<Omit<ModuleInstance, 'id' | 'type'>>) =>
+          set((state) => {
+            const instances = new Map(state.instances);
+            const existing = instances.get(id);
+            if (existing) {
+              instances.set(id, { ...existing, ...updates });
+            }
+            return { instances };
+          }),
 
-      removeModule: (id) =>
-        set((state) => {
-          const instances = new Map(state.instances);
-          instances.delete(id);
-          return { instances };
-        }),
+        removeModule: (id: string) =>
+          set((state) => {
+            const instances = new Map(state.instances);
+            instances.delete(id);
+            return { instances };
+          }),
 
-      toggleVisibility: (id) =>
-        set((state) => {
-          const instances = new Map(state.instances);
-          const existing = instances.get(id);
-          if (existing) {
-            instances.set(id, { ...existing, visible: !existing.visible });
+        toggleVisibility: (id: string) =>
+          set((state) => {
+            const instances = new Map(state.instances);
+            const existing = instances.get(id);
+            if (existing) {
+              instances.set(id, { ...existing, visible: !existing.visible });
+            }
+            return { instances };
+          }),
+      }),
+      {
+        name: 'flock-module-state',
+        partialize: (state) => ({
+          instances: Array.from(state.instances.entries()),
+        }) as any,
+        merge: (persistedState: any, currentState: any) => {
+          // Convert instances array back to Map
+          if (persistedState?.instances && Array.isArray(persistedState.instances)) {
+            persistedState.instances = new Map(persistedState.instances);
           }
-          return { instances };
-        }),
-    }),
+          return {
+            ...currentState,
+            ...persistedState,
+          };
+        },
+      }
+    ),
     { name: 'moduleStore' }
   )
 );

flock/frontend/src/store/uiStore.ts

@@ -40,17 +40,17 @@ interface UIState {
 
 export const useUIStore = create<UIState>()(
   devtools(
-    persist(
+    persist<UIState>(
       (set) => ({
         mode: 'agent',
-        setMode: (mode) => set({ mode }),
+        setMode: (mode: VisualizationMode) => set({ mode }),
 
         selectedNodeIds: new Set(),
-        selectNode: (nodeId) =>
+        selectNode: (nodeId: string) =>
           set((state) => ({
             selectedNodeIds: new Set(state.selectedNodeIds).add(nodeId),
           })),
-        deselectNode: (nodeId) =>
+        deselectNode: (nodeId: string) =>
           set((state) => {
             const ids = new Set(state.selectedNodeIds);
             ids.delete(nodeId);
@@ -59,7 +59,7 @@ export const useUIStore = create<UIState>()(
         clearSelection: () => set({ selectedNodeIds: new Set() }),
 
         detailWindows: new Map(),
-        openDetailWindow: (nodeId) =>
+        openDetailWindow: (nodeId: string) =>
           set((state) => {
             const windows = new Map(state.detailWindows);
             if (!windows.has(nodeId)) {
@@ -72,13 +72,13 @@ export const useUIStore = create<UIState>()(
             }
             return { detailWindows: windows };
           }),
-        closeDetailWindow: (nodeId) =>
+        closeDetailWindow: (nodeId: string) =>
           set((state) => {
             const windows = new Map(state.detailWindows);
             windows.delete(nodeId);
             return { detailWindows: windows };
           }),
-        updateDetailWindow: (nodeId, updates) =>
+        updateDetailWindow: (nodeId: string, updates: Partial<DetailWindow>) =>
           set((state) => {
             const windows = new Map(state.detailWindows);
             const existing = windows.get(nodeId);
@@ -89,20 +89,32 @@ export const useUIStore = create<UIState>()(
           }),
 
         layoutDirection: 'TB',
-        setLayoutDirection: (direction) => set({ layoutDirection: direction }),
+        setLayoutDirection: (direction: 'TB' | 'LR') => set({ layoutDirection: direction }),
         autoLayoutEnabled: true,
-        setAutoLayoutEnabled: (enabled) => set({ autoLayoutEnabled: enabled }),
+        setAutoLayoutEnabled: (enabled: boolean) => set({ autoLayoutEnabled: enabled }),
 
         defaultTab: 'liveOutput',
-        setDefaultTab: (tab) => set({ defaultTab: tab }),
+        setDefaultTab: (tab: 'liveOutput' | 'messageHistory' | 'runStatus') => set({ defaultTab: tab }),
       }),
       {
         name: 'ui-storage',
         partialize: (state) => ({
+          mode: state.mode,
+          detailWindows: Array.from(state.detailWindows.entries()),
           defaultTab: state.defaultTab,
           layoutDirection: state.layoutDirection,
           autoLayoutEnabled: state.autoLayoutEnabled,
-        }),
+        }) as any,
+        merge: (persistedState: any, currentState: any) => {
+          // Convert detailWindows array back to Map
+          if (persistedState?.detailWindows && Array.isArray(persistedState.detailWindows)) {
+            persistedState.detailWindows = new Map(persistedState.detailWindows);
+          }
+          return {
+            ...currentState,
+            ...persistedState,
+          };
+        },
       }
     ),
     { name: 'uiStore' }

flock/frontend/src/types/graph.ts

@@ -1,20 +1,4 @@
-import { Node, Edge } from '@xyflow/react';
-
-export interface Agent {
-  id: string;
-  name: string;
-  status: 'idle' | 'running' | 'error';
-  subscriptions: string[];
-  lastActive: number;
-  sentCount: number;
-  recvCount: number;
-  position?: { x: number; y: number };
-  outputTypes?: string[]; // Artifact types this agent produces
-  receivedByType?: Record<string, number>; // Count of messages received per type
-  sentByType?: Record<string, number>; // Count of messages sent per type
-  streamingTokens?: string[]; // Last 6 streaming tokens for news ticker effect
-}
-
+// Legacy types (still used during migration for events, WebSocket handlers)
 export interface Message {
   id: string;
   type: string;
@@ -26,37 +10,86 @@ export interface Message {
   visibilityKind?: string;
   partitionKey?: string | null;
   version?: number;
-  isStreaming?: boolean; // True while streaming, false when complete
-  streamingText?: string; // Accumulated streaming text (raw)
+  isStreaming?: boolean;
+  streamingText?: string;
   consumedBy?: string[];
 }
 
-export interface AgentNodeData extends Record<string, unknown> {
-  name: string;
-  status: 'idle' | 'running' | 'error';
-  subscriptions: string[];
-  outputTypes?: string[];
-  sentCount: number;
-  recvCount: number;
-  receivedByType?: Record<string, number>;
-  sentByType?: Record<string, number>;
-  streamingTokens?: string[]; // Last 6 streaming tokens for news ticker effect
+// New backend API types (Phase 1 - Spec 002)
+export interface GraphRequest {
+  viewMode: 'agent' | 'blackboard';
+  filters: GraphFilters;
+  options?: GraphRequestOptions;
 }
 
-export interface MessageNodeData extends Record<string, unknown> {
-  artifactType: string;
-  payloadPreview: string;
-  payload: any; // Full payload for display
-  producedBy: string;
-  consumedBy: string[];
-  timestamp: number;
-  isStreaming?: boolean; // True while streaming tokens
-  streamingText?: string; // Raw streaming text
-  tags?: string[];
-  visibilityKind?: string;
+export interface GraphFilters {
+  correlation_id?: string | null;
+  time_range: TimeRangeFilter;
+  artifactTypes: string[];
+  producers: string[];
+  tags: string[];
+  visibility: string[];
+}
+
+export interface TimeRangeFilter {
+  preset: 'last10min' | 'last5min' | 'last1hour' | 'all' | 'custom';
+  start?: string | null;
+  end?: string | null;
 }
 
-export type AgentViewNode = Node<AgentNodeData, 'agent'>;
-export type MessageViewNode = Node<MessageNodeData, 'message'>;
-export type GraphNode = AgentViewNode | MessageViewNode;
-export type GraphEdge = Edge;
+export interface GraphRequestOptions {
+  include_statistics?: boolean;
+  label_offset_strategy?: 'stack' | 'none';
+  limit?: number;
+}
+
+export interface GraphSnapshot {
+  generatedAt: string;
+  viewMode: 'agent' | 'blackboard';
+  filters: GraphFilters;
+  nodes: GraphNode[];
+  edges: GraphEdge[];
+  statistics: GraphStatistics | null;
+  totalArtifacts: number;
+  truncated: boolean;
+}
+
+export interface GraphNode {
+  id: string;
+  type: 'agent' | 'message';
+  data: Record<string, any>;
+  position: { x: number; y: number };
+  hidden: boolean;
+}
+
+export interface GraphEdge {
+  id: string;
+  source: string;
+  target: string;
+  type: 'message_flow' | 'transformation';
+  label?: string | null;
+  data: Record<string, any>;
+  markerEnd?: { type: string; width: number; height: number };
+  hidden: boolean;
+}
+
+export interface GraphStatistics {
+  producedByAgent: Record<string, GraphAgentMetrics>;
+  consumedByAgent: Record<string, GraphAgentMetrics>;
+  artifactSummary: ArtifactSummary;
+}
+
+export interface GraphAgentMetrics {
+  total: number;
+  byType: Record<string, number>;
+}
+
+export interface ArtifactSummary {
+  total: number;
+  by_type: Record<string, number>;
+  by_producer: Record<string, number>;
+  by_visibility: Record<string, number>;
+  tag_counts: Record<string, number>;
+  earliest_created_at: string;
+  latest_created_at: string;
+}

flock/frontend/src/utils/mockData.ts

@@ -1,6 +1,19 @@
-import { Agent, Message } from '../types/graph';
+import { Message } from '../types/graph';
 
-export const mockAgents: Agent[] = [
+// UI Optimization Migration (Phase 4.1 - Spec 002): OLD Phase 1 mock data (unused)
+// Kept for potential future testing, but Agent type no longer exists
+type LegacyAgent = {
+  id: string;
+  name: string;
+  status: string;
+  subscriptions: string[];
+  lastActive: number;
+  sentCount: number;
+  recvCount: number;
+  position: { x: number; y: number };
+};
+
+export const mockAgents: LegacyAgent[] = [
   {
     id: 'movie',
     name: 'movie',
@@ -46,7 +59,7 @@ export const mockMessages: Message[] = [
     id: 'msg-2',
     type: 'Movie',
     payload: { title: 'Inception', year: 2010, genre: 'Sci-Fi' },
-    timestamp: Date.now() - 8000,
+    timestamp: Date.now() - 8344,
     correlationId: 'corr-123',
     producedBy: 'movie',
   },

flock/frontend/vite.config.ts

@@ -13,11 +13,11 @@ export default defineConfig({
     port: 5173,
     proxy: {
       '/api': {
-        target: 'http://localhost:8000',
+        target: 'http://localhost:8344',
         changeOrigin: true,
       },
       '/ws': {
-        target: 'ws://localhost:8000',
+        target: 'ws://localhost:8344',
         ws: true,
       },
     },

flock/orchestrator.py

@@ -6,10 +6,11 @@ import asyncio
 import logging
 import os
 from asyncio import Task
-from collections.abc import Iterable, Mapping, Sequence
+from collections.abc import AsyncGenerator, Iterable, Mapping, Sequence
 from contextlib import asynccontextmanager
 from datetime import datetime, timezone
-from typing import TYPE_CHECKING, Any, AsyncGenerator
+from pathlib import Path
+from typing import TYPE_CHECKING, Any
 from uuid import uuid4
 
 from opentelemetry import trace
@@ -545,14 +546,20 @@ class Flock(metaclass=AutoTracedMeta):
         return self
 
     async def serve(
-        self, *, dashboard: bool = False, host: str = "127.0.0.1", port: int = 8000
+        self,
+        *,
+        dashboard: bool = False,
+        dashboard_v2: bool = False,
+        host: str = "127.0.0.1",
+        port: int = 8344,
     ) -> None:
         """Start HTTP service for the orchestrator (blocking).
 
         Args:
             dashboard: Enable real-time dashboard with WebSocket support (default: False)
+            dashboard_v2: Launch the new dashboard v2 frontend (implies dashboard=True)
             host: Host to bind to (default: "127.0.0.1")
-            port: Port to bind to (default: 8000)
+            port: Port to bind to (default: 8344)
 
         Examples:
             # Basic HTTP API (no dashboard) - runs until interrupted
@@ -561,6 +568,9 @@ class Flock(metaclass=AutoTracedMeta):
             # With dashboard (WebSocket + browser launch) - runs until interrupted
             await orchestrator.serve(dashboard=True)
         """
+        if dashboard_v2:
+            dashboard = True
+
         if not dashboard:
             # Standard service without dashboard
             from flock.service import BlackboardHTTPService
@@ -577,8 +587,9 @@ class Flock(metaclass=AutoTracedMeta):
 
         # Create dashboard components
         websocket_manager = WebSocketManager()
-        event_collector = DashboardEventCollector()
+        event_collector = DashboardEventCollector(store=self.store)
         event_collector.set_websocket_manager(websocket_manager)
+        await event_collector.load_persistent_snapshots()
 
         # Store collector reference for agents added later
         self._dashboard_collector = event_collector
@@ -589,7 +600,13 @@ class Flock(metaclass=AutoTracedMeta):
             agent.utilities.insert(0, event_collector)
 
         # Start dashboard launcher (npm process + browser)
-        launcher = DashboardLauncher(port=port)
+        launcher_kwargs: dict[str, Any] = {"port": port}
+        if dashboard_v2:
+            dashboard_pkg_dir = Path(__file__).parent / "dashboard"
+            launcher_kwargs["frontend_dir"] = dashboard_pkg_dir.parent / "frontend_v2"
+            launcher_kwargs["static_dir"] = dashboard_pkg_dir / "static_v2"
+
+        launcher = DashboardLauncher(**launcher_kwargs)
         launcher.start()
 
         # Create dashboard HTTP service
@@ -597,6 +614,7 @@ class Flock(metaclass=AutoTracedMeta):
             orchestrator=self,
             websocket_manager=websocket_manager,
             event_collector=event_collector,
+            use_v2=dashboard_v2,
         )
 
         # Store launcher for cleanup

flock/service.py

@@ -257,14 +257,14 @@ class BlackboardHTTPService:
             return PlainTextResponse("\n".join(lines))
 
     def run(
-        self, host: str = "127.0.0.1", port: int = 8000
+        self, host: str = "127.0.0.1", port: int = 8344
     ) -> None:  # pragma: no cover - manual execution
         import uvicorn
 
         uvicorn.run(self.app, host=host, port=port)
 
     async def run_async(
-        self, host: str = "127.0.0.1", port: int = 8000
+        self, host: str = "127.0.0.1", port: int = 8344
     ) -> None:  # pragma: no cover - manual execution
         """Run the service asynchronously (for use within async context)."""
         import uvicorn