agent-relay 2.0.21 → 2.0.23

package/packages/dashboard/ui/react-components/hooks/useMessages.ts

@@ -1,309 +0,0 @@
-/**
- * useMessages Hook
- *
- * React hook for managing message state with filtering,
- * threading, and send functionality.
- */
-
-import { useState, useMemo, useCallback, useEffect } from 'react';
-import type { Message, SendMessageRequest } from '../../types';
-import { api } from '../../lib/api';
-
-export interface UseMessagesOptions {
-  messages: Message[];
-  currentChannel?: string;
-  /** Optional sender name for cloud mode (GitHub username). Falls back to 'Dashboard' if not provided. */
-  senderName?: string;
-}
-
-export interface ThreadInfo {
-  id: string;
-  name: string;
-  lastMessage: Message;
-  messageCount: number;
-  unreadCount: number;
-  participants: string[];
-}
-
-export interface UseMessagesReturn {
-  // Filtered messages
-  messages: Message[];
-  threadMessages: (threadId: string) => Message[];
-
-  // Channel/thread state
-  currentChannel: string;
-  setCurrentChannel: (channel: string) => void;
-  currentThread: string | null;
-  setCurrentThread: (threadId: string | null) => void;
-
-  // Thread info
-  activeThreads: ThreadInfo[];
-  totalUnreadThreadCount: number;
-
-  // Message actions
-  sendMessage: (to: string, content: string, thread?: string, attachmentIds?: string[]) => Promise<boolean>;
-  isSending: boolean;
-  sendError: string | null;
-
-  // Stats
-  totalCount: number;
-  unreadCount: number;
-}
-
-export function useMessages({
-  messages,
-  currentChannel: initialChannel = 'general',
-  senderName,
-}: UseMessagesOptions): UseMessagesReturn {
-  const [currentChannel, setCurrentChannel] = useState(initialChannel);
-  const [currentThreadInternal, setCurrentThreadInternal] = useState<string | null>(null);
-  const [isSending, setIsSending] = useState(false);
-  const [sendError, setSendError] = useState<string | null>(null);
-
-  // Track seen threads with timestamp of when they were last viewed
-  // This allows us to show new messages that arrive after viewing
-  const [seenThreads, setSeenThreads] = useState<Map<string, number>>(new Map());
-
-  // Effective sender name for the current user (used for filtering own messages)
-  const effectiveSenderName = senderName || 'Dashboard';
-
-  // Optimistic messages: shown immediately before server confirms
-  // These have status='sending' and a temp ID prefixed with 'optimistic-'
-  const [optimisticMessages, setOptimisticMessages] = useState<Message[]>([]);
-
-  // Clean up optimistic messages when they appear in the real messages list
-  // Match by to + content only (not from, since server may use different sender like '_DashboardUI')
-  useEffect(() => {
-    if (optimisticMessages.length === 0) return;
-
-    // Create a set of "fingerprints" for real messages (recent ones only)
-    // Use to + content only - the 'from' field may differ between optimistic (user's name)
-    // and real message (server may use '_DashboardUI' as relay client name)
-    const recentMessages = messages.slice(-50); // Only check recent messages for performance
-    const realFingerprints = new Set(
-      recentMessages.map((m) => `${m.to}:${m.content.slice(0, 100)}`)
-    );
-
-    // Remove optimistic messages that now exist in real messages
-    setOptimisticMessages((prev) =>
-      prev.filter((opt) => {
-        const fingerprint = `${opt.to}:${opt.content.slice(0, 100)}`;
-        return !realFingerprints.has(fingerprint);
-      })
-    );
-  }, [messages, optimisticMessages.length]);
-
-  // Combine real messages with optimistic messages
-  const allMessages = useMemo(() => {
-    if (optimisticMessages.length === 0) return messages;
-    // Append optimistic messages at the end (they're the most recent)
-    return [...messages, ...optimisticMessages];
-  }, [messages, optimisticMessages]);
-
-  // Filter messages by current channel
-  // Only exclude reply-chain replies (where thread is another message's ID)
-  // Keep topic thread messages (where thread is a topic name, not a message ID)
-  const filteredMessages = useMemo(() => {
-    // Build set of message IDs for efficient lookup
-    const messageIds = new Set(allMessages.map((m) => m.id));
-
-    // Filter out reply-chain replies (thread points to existing message ID)
-    // Keep topic thread messages (thread is a name, not a message ID)
-    const mainViewMessages = allMessages.filter((m) => {
-      if (!m.thread) return true; // No thread - show it
-      // If thread is a message ID, it's a reply - hide it from main view
-      // If thread is a topic name, show it
-      return !messageIds.has(m.thread);
-    });
-
-    if (currentChannel === 'general') {
-      return mainViewMessages;
-    }
-    return mainViewMessages.filter(
-      (m) => m.from === currentChannel || m.to === currentChannel
-    );
-  }, [allMessages, currentChannel]);
-
-  // Get messages for a specific thread
-  const threadMessages = useCallback(
-    (threadId: string) => allMessages.filter((m) => m.thread === threadId),
-    [allMessages]
-  );
-
-  // Calculate active threads with unread counts
-  const activeThreads = useMemo((): ThreadInfo[] => {
-    const threadMap = new Map<string, Message[]>();
-    const messageIds = new Set(allMessages.map((m) => m.id));
-
-    // Group messages by thread
-    for (const msg of allMessages) {
-      if (msg.thread) {
-        const existing = threadMap.get(msg.thread) || [];
-        existing.push(msg);
-        threadMap.set(msg.thread, existing);
-      }
-    }
-
-    // Convert to ThreadInfo array
-    const threads: ThreadInfo[] = [];
-    for (const [threadId, threadMsgs] of threadMap.entries()) {
-      // Sort by timestamp to get the last message
-      const sorted = [...threadMsgs].sort(
-        (a, b) => new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime()
-      );
-
-      // Get unique participants
-      const participants = [...new Set(threadMsgs.flatMap((m) => [m.from, m.to]))].filter(
-        (p) => p !== '*'
-      );
-
-      // Count unread messages in thread
-      // Consider messages as "read" if they arrived before we last viewed this thread
-      // Exclude messages from current user - users shouldn't get notifications for their own messages
-      const seenTimestamp = seenThreads.get(threadId);
-      const unreadCount = threadMsgs.filter((m) => {
-        if (m.from === effectiveSenderName) return false; // Don't count own messages as unread
-        if (m.isRead) return false; // Already marked as read
-        if (seenTimestamp) {
-          // If we've seen this thread, only count messages after that time
-          return new Date(m.timestamp).getTime() > seenTimestamp;
-        }
-        return true; // Not seen yet, count as unread
-      }).length;
-
-      // Determine thread name: if threadId is a message ID, use first message content as name
-      let name = threadId;
-      if (messageIds.has(threadId)) {
-        // Find the original message that started the thread
-        const originalMsg = allMessages.find((m) => m.id === threadId);
-        if (originalMsg) {
-          // Use first line of content, truncated
-          const firstLine = originalMsg.content.split('\n')[0];
-          name = firstLine.length > 30 ? firstLine.substring(0, 30) + '...' : firstLine;
-        }
-      }
-
-      threads.push({
-        id: threadId,
-        name,
-        lastMessage: sorted[0],
-        messageCount: threadMsgs.length,
-        unreadCount,
-        participants,
-      });
-    }
-
-    // Sort by last activity (most recent first)
-    return threads.sort(
-      (a, b) =>
-        new Date(b.lastMessage.timestamp).getTime() - new Date(a.lastMessage.timestamp).getTime()
-    );
-  }, [allMessages, seenThreads]);
-
-  // Wrapper for setCurrentThread that also marks the thread as seen
-  const setCurrentThread = useCallback((threadId: string | null) => {
-    setCurrentThreadInternal(threadId);
-    if (threadId) {
-      // Mark thread as seen with current timestamp
-      setSeenThreads((prev) => {
-        const next = new Map(prev);
-        next.set(threadId, Date.now());
-        return next;
-      });
-    }
-  }, []);
-
-  // Calculate total unread threads
-  const totalUnreadThreadCount = useMemo(
-    () => activeThreads.filter((t) => t.unreadCount > 0).length,
-    [activeThreads]
-  );
-
-  // Calculate stats
-  const stats = useMemo(() => {
-    const unread = allMessages.filter((m) => !m.isRead).length;
-    return {
-      totalCount: allMessages.length,
-      unreadCount: unread,
-    };
-  }, [allMessages]);
-
-  // Send message function with optimistic updates
-  const sendMessage = useCallback(
-    async (to: string, content: string, thread?: string, attachmentIds?: string[]): Promise<boolean> => {
-      setIsSending(true);
-      setSendError(null);
-
-      // Create optimistic message and add it immediately for snappy UX
-      const from = effectiveSenderName;
-      const optimisticId = `optimistic-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
-      const optimisticMsg: Message = {
-        id: optimisticId,
-        from,
-        to,
-        content,
-        timestamp: new Date().toISOString(),
-        status: 'sending',
-        thread,
-        isRead: true, // User's own messages are always "read"
-      };
-
-      // Add optimistic message immediately - UI updates instantly
-      setOptimisticMessages((prev) => [...prev, optimisticMsg]);
-
-      try {
-        const request: SendMessageRequest & { from?: string } = {
-          to,
-          message: content,
-          thread,
-          attachments: attachmentIds,
-        };
-
-        // Include sender name for cloud mode (GitHub username)
-        if (senderName) {
-          request.from = senderName;
-        }
-
-        // Use api.sendMessage which handles:
-        // - Workspace proxy routing (in cloud mode)
-        // - CSRF token headers
-        // - Credentials
-        const result = await api.sendMessage(request);
-
-        if (result.success) {
-          // Success! The optimistic message will be cleaned up when
-          // the real message arrives via WebSocket
-          return true;
-        }
-
-        // Failed - remove the optimistic message and show error
-        setOptimisticMessages((prev) => prev.filter((m) => m.id !== optimisticId));
-        setSendError(result.error || 'Failed to send message');
-        return false;
-      } catch (_error) {
-        // Network error - remove optimistic message
-        setOptimisticMessages((prev) => prev.filter((m) => m.id !== optimisticId));
-        setSendError('Network error');
-        return false;
-      } finally {
-        setIsSending(false);
-      }
-    },
-    [effectiveSenderName, senderName]
-  );
-
-  return {
-    messages: filteredMessages,
-    threadMessages,
-    currentChannel,
-    setCurrentChannel,
-    currentThread: currentThreadInternal,
-    setCurrentThread,
-    activeThreads,
-    totalUnreadThreadCount,
-    sendMessage,
-    isSending,
-    sendError,
-    ...stats,
-  };
-}

package/packages/dashboard/ui/react-components/hooks/useOrchestrator.ts

@@ -1,364 +0,0 @@
-/**
- * useOrchestrator Hook
- *
- * Connects to the daemon orchestrator for workspace and agent management.
- * Provides real-time updates via WebSocket.
- */
-
-import { useState, useEffect, useCallback, useRef } from 'react';
-import type { Workspace } from '../WorkspaceSelector';
-
-export interface OrchestratorAgent {
-  id: string;
-  name: string;
-  workspaceId: string;
-  provider: string;
-  status: 'running' | 'idle' | 'crashed' | 'restarting' | 'stopped';
-  pid?: number;
-  task?: string;
-  spawnedAt: Date;
-  restartCount: number;
-}
-
-export interface OrchestratorEvent {
-  type: string;
-  workspaceId?: string;
-  agentId?: string;
-  data: unknown;
-  timestamp: Date;
-}
-
-export interface UseOrchestratorOptions {
-  /** Orchestrator API URL (default: http://localhost:3456) */
-  apiUrl?: string;
-  /** Enable orchestrator connection (default: false - orchestrator is optional) */
-  enabled?: boolean;
-}
-
-export interface UseOrchestratorResult {
-  /** All workspaces */
-  workspaces: Workspace[];
-  /** Currently active workspace ID */
-  activeWorkspaceId?: string;
-  /** Active workspace agents */
-  agents: OrchestratorAgent[];
-  /** Connection status */
-  isConnected: boolean;
-  /** Loading state */
-  isLoading: boolean;
-  /** Error state */
-  error: Error | null;
-  /** Switch to a workspace */
-  switchWorkspace: (workspaceId: string) => Promise<void>;
-  /** Add a new workspace */
-  addWorkspace: (path: string, name?: string) => Promise<Workspace>;
-  /** Remove a workspace */
-  removeWorkspace: (workspaceId: string) => Promise<void>;
-  /** Spawn an agent */
-  spawnAgent: (name: string, task?: string, provider?: string) => Promise<OrchestratorAgent>;
-  /** Stop an agent */
-  stopAgent: (agentName: string) => Promise<void>;
-  /** Refresh data */
-  refresh: () => Promise<void>;
-}
-
-export function useOrchestrator(options: UseOrchestratorOptions = {}): UseOrchestratorResult {
-  const { apiUrl = 'http://localhost:3456', enabled = false } = options;
-
-  const [workspaces, setWorkspaces] = useState<Workspace[]>([]);
-  const [activeWorkspaceId, setActiveWorkspaceId] = useState<string>();
-  const [agents, setAgents] = useState<OrchestratorAgent[]>([]);
-  const [isConnected, setIsConnected] = useState(false);
-  const [isLoading, setIsLoading] = useState(enabled);
-  const [error, setError] = useState<Error | null>(null);
-
-  const wsRef = useRef<WebSocket | null>(null);
-  const reconnectTimeoutRef = useRef<ReturnType<typeof setTimeout>>();
-
-  // Convert API URL to WebSocket URL
-  const wsUrl = apiUrl.replace(/^http/, 'ws');
-
-  // Fetch initial data - only if enabled
-  const fetchData = useCallback(async () => {
-    if (!enabled) {
-      return;
-    }
-
-    try {
-      setIsLoading(true);
-      setError(null);
-
-      const response = await fetch(`${apiUrl}/workspaces`);
-      if (!response.ok) {
-        throw new Error(`Failed to fetch workspaces: ${response.statusText}`);
-      }
-
-      const data = await response.json();
-      setWorkspaces(
-        data.workspaces.map((w: Workspace) => ({
-          ...w,
-          lastActiveAt: new Date(w.lastActiveAt),
-        }))
-      );
-      setActiveWorkspaceId(data.activeWorkspaceId);
-
-      // Fetch agents for active workspace
-      if (data.activeWorkspaceId) {
-        const agentsResponse = await fetch(`${apiUrl}/workspaces/${data.activeWorkspaceId}/agents`);
-        if (agentsResponse.ok) {
-          const agentsData = await agentsResponse.json();
-          setAgents(
-            agentsData.agents.map((a: OrchestratorAgent) => ({
-              ...a,
-              spawnedAt: new Date(a.spawnedAt),
-            }))
-          );
-        }
-      }
-    } catch (err) {
-      setError(err instanceof Error ? err : new Error(String(err)));
-    } finally {
-      setIsLoading(false);
-    }
-  }, [apiUrl, enabled]);
-
-  // WebSocket connection - only connect if enabled
-  useEffect(() => {
-    // Skip connection if orchestrator is not enabled
-    if (!enabled) {
-      return;
-    }
-
-    const connect = () => {
-      try {
-        const ws = new WebSocket(wsUrl);
-
-        ws.onopen = () => {
-          setIsConnected(true);
-          setError(null);
-        };
-
-        ws.onmessage = (event) => {
-          try {
-            const message = JSON.parse(event.data);
-
-            if (message.type === 'init') {
-              // Initial state from server
-              setWorkspaces(
-                message.data.workspaces.map((w: Workspace) => ({
-                  ...w,
-                  lastActiveAt: new Date(w.lastActiveAt),
-                }))
-              );
-              setActiveWorkspaceId(message.data.activeWorkspaceId);
-              setAgents(
-                message.data.agents?.map((a: OrchestratorAgent) => ({
-                  ...a,
-                  spawnedAt: new Date(a.spawnedAt),
-                })) || []
-              );
-              setIsLoading(false);
-            } else if (message.type === 'event') {
-              handleEvent(message.data as OrchestratorEvent);
-            }
-          } catch (err) {
-            console.error('Failed to parse WebSocket message:', err);
-          }
-        };
-
-        ws.onclose = () => {
-          setIsConnected(false);
-          wsRef.current = null;
-
-          // Reconnect after delay
-          reconnectTimeoutRef.current = setTimeout(connect, 3000);
-        };
-
-        ws.onerror = (err) => {
-          console.error('WebSocket error:', err);
-          ws.close();
-        };
-
-        wsRef.current = ws;
-      } catch (err) {
-        setError(err instanceof Error ? err : new Error(String(err)));
-        // Retry connection
-        reconnectTimeoutRef.current = setTimeout(connect, 3000);
-      }
-    };
-
-    // Start with HTTP fetch, then upgrade to WebSocket
-    fetchData().then(connect);
-
-    return () => {
-      if (reconnectTimeoutRef.current) {
-        clearTimeout(reconnectTimeoutRef.current);
-      }
-      if (wsRef.current) {
-        wsRef.current.close();
-      }
-    };
-  }, [wsUrl, fetchData, enabled]);
-
-  // Handle real-time events
-  const handleEvent = useCallback((event: OrchestratorEvent) => {
-    switch (event.type) {
-      case 'workspace:added':
-        setWorkspaces((prev) => [...prev, event.data as Workspace]);
-        break;
-
-      case 'workspace:removed':
-        setWorkspaces((prev) => prev.filter((w) => w.id !== event.workspaceId));
-        break;
-
-      case 'workspace:updated':
-        setWorkspaces((prev) =>
-          prev.map((w) =>
-            w.id === event.workspaceId ? { ...w, ...(event.data as Partial<Workspace>) } : w
-          )
-        );
-        break;
-
-      case 'workspace:switched':
-        setActiveWorkspaceId((event.data as { currentId: string }).currentId);
-        break;
-
-      case 'agent:spawned':
-        setAgents((prev) => [...prev, event.data as OrchestratorAgent]);
-        break;
-
-      case 'agent:stopped':
-      case 'agent:crashed':
-        setAgents((prev) => prev.filter((a) => a.name !== (event.data as { name: string }).name));
-        break;
-
-      case 'agent:restarted':
-        setAgents((prev) =>
-          prev.map((a) =>
-            a.name === (event.data as { name: string }).name
-              ? { ...a, status: 'running' as const, restartCount: a.restartCount + 1 }
-              : a
-          )
-        );
-        break;
-    }
-  }, []);
-
-  // Switch workspace
-  const switchWorkspace = useCallback(
-    async (workspaceId: string) => {
-      const response = await fetch(`${apiUrl}/workspaces/${workspaceId}/switch`, {
-        method: 'POST',
-      });
-
-      if (!response.ok) {
-        throw new Error(`Failed to switch workspace: ${response.statusText}`);
-      }
-
-      // Fetch agents for new workspace
-      const agentsResponse = await fetch(`${apiUrl}/workspaces/${workspaceId}/agents`);
-      if (agentsResponse.ok) {
-        const agentsData = await agentsResponse.json();
-        setAgents(
-          agentsData.agents.map((a: OrchestratorAgent) => ({
-            ...a,
-            spawnedAt: new Date(a.spawnedAt),
-          }))
-        );
-      }
-    },
-    [apiUrl]
-  );
-
-  // Add workspace
-  const addWorkspace = useCallback(
-    async (path: string, name?: string): Promise<Workspace> => {
-      const response = await fetch(`${apiUrl}/workspaces`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ path, name }),
-      });
-
-      if (!response.ok) {
-        const error = await response.json();
-        throw new Error(error.error || 'Failed to add workspace');
-      }
-
-      return response.json();
-    },
-    [apiUrl]
-  );
-
-  // Remove workspace
-  const removeWorkspace = useCallback(
-    async (workspaceId: string) => {
-      const response = await fetch(`${apiUrl}/workspaces/${workspaceId}`, {
-        method: 'DELETE',
-      });
-
-      if (!response.ok) {
-        throw new Error(`Failed to remove workspace: ${response.statusText}`);
-      }
-    },
-    [apiUrl]
-  );
-
-  // Spawn agent
-  const spawnAgent = useCallback(
-    async (name: string, task?: string, provider?: string): Promise<OrchestratorAgent> => {
-      if (!activeWorkspaceId) {
-        throw new Error('No active workspace');
-      }
-
-      const response = await fetch(`${apiUrl}/workspaces/${activeWorkspaceId}/agents`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ name, task, provider }),
-      });
-
-      if (!response.ok) {
-        const error = await response.json();
-        throw new Error(error.error || 'Failed to spawn agent');
-      }
-
-      return response.json();
-    },
-    [apiUrl, activeWorkspaceId]
-  );
-
-  // Stop agent
-  const stopAgent = useCallback(
-    async (agentName: string) => {
-      if (!activeWorkspaceId) {
-        throw new Error('No active workspace');
-      }
-
-      const response = await fetch(
-        `${apiUrl}/workspaces/${activeWorkspaceId}/agents/${agentName}`,
-        {
-          method: 'DELETE',
-        }
-      );
-
-      if (!response.ok) {
-        throw new Error(`Failed to stop agent: ${response.statusText}`);
-      }
-    },
-    [apiUrl, activeWorkspaceId]
-  );
-
-  return {
-    workspaces,
-    activeWorkspaceId,
-    agents,
-    isConnected,
-    isLoading,
-    error,
-    switchWorkspace,
-    addWorkspace,
-    removeWorkspace,
-    spawnAgent,
-    stopAgent,
-    refresh: fetchData,
-  };
-}