agent-relay 2.0.21 → 2.0.23

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

@@ -1,140 +0,0 @@
-/**
- * usePinnedAgents Hook
- *
- * Manages pinned agents with localStorage persistence.
- * Pinned agents appear at the top of the agents panel.
- */
-
-import { useState, useCallback, useEffect, useMemo } from 'react';
-
-export const STORAGE_KEY = 'agent-relay-pinned-agents';
-export const MAX_PINNED = 5;
-
-/**
- * Load pinned agents from localStorage
- * Exported for testing
- */
-export function loadPinnedAgents(): string[] {
-  try {
-    if (typeof localStorage === 'undefined') return [];
-    const stored = localStorage.getItem(STORAGE_KEY);
-    if (stored) {
-      const parsed = JSON.parse(stored);
-      if (Array.isArray(parsed)) {
-        return parsed.slice(0, MAX_PINNED);
-      }
-    }
-  } catch {
-    // localStorage not available or invalid data
-  }
-  return [];
-}
-
-/**
- * Save pinned agents to localStorage
- * Exported for testing
- */
-export function savePinnedAgents(agents: string[]): void {
-  try {
-    if (typeof localStorage === 'undefined') return;
-    localStorage.setItem(STORAGE_KEY, JSON.stringify(agents));
-  } catch {
-    // localStorage not available
-  }
-}
-
-/**
- * Pin an agent to the list
- * Returns the new list and whether the pin was successful
- */
-export function pinAgent(
-  currentPinned: string[],
-  agentName: string
-): { newPinned: string[]; success: boolean } {
-  if (currentPinned.includes(agentName)) {
-    return { newPinned: currentPinned, success: true }; // Already pinned
-  }
-  if (currentPinned.length >= MAX_PINNED) {
-    return { newPinned: currentPinned, success: false }; // At max capacity
-  }
-  return { newPinned: [...currentPinned, agentName], success: true };
-}
-
-/**
- * Unpin an agent from the list
- */
-export function unpinAgent(currentPinned: string[], agentName: string): string[] {
-  return currentPinned.filter((name) => name !== agentName);
-}
-
-export interface UsePinnedAgentsReturn {
-  /** Array of pinned agent names */
-  pinnedAgents: string[];
-  /** Check if an agent is pinned */
-  isPinned: (agentName: string) => boolean;
-  /** Toggle pin status for an agent */
-  togglePin: (agentName: string) => void;
-  /** Pin an agent (no-op if already pinned or at max) */
-  pin: (agentName: string) => boolean;
-  /** Unpin an agent */
-  unpin: (agentName: string) => void;
-  /** Whether max pins reached */
-  isMaxPinned: boolean;
-  /** Maximum number of pinned agents allowed */
-  maxPinned: number;
-}
-
-export function usePinnedAgents(): UsePinnedAgentsReturn {
-  const [pinnedAgents, setPinnedAgents] = useState<string[]>(() => loadPinnedAgents());
-
-  // Persist to localStorage when pinnedAgents changes
-  useEffect(() => {
-    savePinnedAgents(pinnedAgents);
-  }, [pinnedAgents]);
-
-  const isPinned = useCallback(
-    (agentName: string) => pinnedAgents.includes(agentName),
-    [pinnedAgents]
-  );
-
-  const pin = useCallback(
-    (agentName: string): boolean => {
-      const { newPinned, success } = pinAgent(pinnedAgents, agentName);
-      if (newPinned !== pinnedAgents) {
-        setPinnedAgents(newPinned);
-      }
-      return success;
-    },
-    [pinnedAgents]
-  );
-
-  const unpin = useCallback((agentName: string) => {
-    setPinnedAgents((prev) => unpinAgent(prev, agentName));
-  }, []);
-
-  const togglePin = useCallback(
-    (agentName: string) => {
-      if (isPinned(agentName)) {
-        unpin(agentName);
-      } else {
-        pin(agentName);
-      }
-    },
-    [isPinned, pin, unpin]
-  );
-
-  const isMaxPinned = useMemo(
-    () => pinnedAgents.length >= MAX_PINNED,
-    [pinnedAgents]
-  );
-
-  return {
-    pinnedAgents,
-    isPinned,
-    togglePin,
-    pin,
-    unpin,
-    isMaxPinned,
-    maxPinned: MAX_PINNED,
-  };
-}

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

@@ -1,340 +0,0 @@
-/**
- * usePresence Hook
- *
- * Manages user presence and typing indicators via WebSocket.
- * - Tracks which users are currently online
- * - Sends/receives typing indicator events
- * - Handles user presence announcements
- */
-
-import { useState, useEffect, useCallback, useRef } from 'react';
-
-/** User presence information */
-export interface UserPresence {
-  /** Username (GitHub username in cloud mode) */
-  username: string;
-  /** Optional avatar URL */
-  avatarUrl?: string;
-  /** When the user came online */
-  connectedAt: string;
-  /** Last activity timestamp */
-  lastSeen: string;
-  /** Whether user is currently typing */
-  isTyping?: boolean;
-}
-
-/** Typing indicator information */
-export interface TypingIndicator {
-  /** Username of the person typing */
-  username: string;
-  /** Avatar URL if available */
-  avatarUrl?: string;
-  /** Timestamp when typing started */
-  startedAt: number;
-}
-
-export interface UsePresenceOptions {
-  /** Current user info (if logged in) */
-  currentUser?: {
-    username: string;
-    avatarUrl?: string;
-  };
-  /** WebSocket URL (defaults to same as main WebSocket) */
-  wsUrl?: string;
-  /** Whether to auto-connect */
-  autoConnect?: boolean;
-  /** Optional handler for additional messages (e.g., channel_message) */
-  onEvent?: (event: any) => void;
-  /** Workspace ID for channel subscription (cloud mode) */
-  workspaceId?: string;
-}
-
-export interface UsePresenceReturn {
-  /** List of online users */
-  onlineUsers: UserPresence[];
-  /** Currently typing users (excluding self) */
-  typingUsers: TypingIndicator[];
-  /** Send typing indicator */
-  sendTyping: (isTyping: boolean) => void;
-  /** Whether connected to presence system */
-  isConnected: boolean;
-}
-
-/**
- * Get the presence WebSocket URL
- */
-function getPresenceUrl(): string {
-  const isDev = process.env.NODE_ENV === 'development';
-
-  if (typeof window === 'undefined') {
-    return 'ws://localhost:3889/ws/presence';
-  }
-
-  // Dev mode only: Next.js on 3888, dashboard server on 3889
-  // In production (static export), use same host regardless of port
-  if (isDev && window.location.port === '3888') {
-    const host = window.location.hostname || 'localhost';
-    return `ws://${host}:3889/ws/presence`;
-  }
-
-  const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
-  return `${protocol}//${window.location.host}/ws/presence`;
-}
-
-export function usePresence(options: UsePresenceOptions = {}): UsePresenceReturn {
-  const { currentUser, wsUrl, autoConnect = true, onEvent, workspaceId } = options;
-
-  const [onlineUsers, setOnlineUsers] = useState<UserPresence[]>([]);
-  const [typingUsers, setTypingUsers] = useState<TypingIndicator[]>([]);
-  const [isConnected, setIsConnected] = useState(false);
-
-  const wsRef = useRef<WebSocket | null>(null);
-  const reconnectTimeoutRef = useRef<NodeJS.Timeout | null>(null);
-  const typingTimeoutRef = useRef<NodeJS.Timeout | null>(null);
-  const isConnectingRef = useRef(false); // Prevent race conditions
-  const currentUserRef = useRef(currentUser);
-  currentUserRef.current = currentUser; // Keep ref in sync with prop
-  const workspaceIdRef = useRef(workspaceId);
-  workspaceIdRef.current = workspaceId; // Keep ref in sync with prop
-  const onEventRef = useRef(onEvent);
-  onEventRef.current = onEvent; // Keep ref in sync with callback prop
-
-  // Clear stale typing indicators (after 3 seconds of no update)
-  useEffect(() => {
-    const interval = setInterval(() => {
-      const now = Date.now();
-      setTypingUsers((prev) =>
-        prev.filter((t) => now - t.startedAt < 3000)
-      );
-    }, 1000);
-
-    return () => clearInterval(interval);
-  }, []);
-
-  const connect = useCallback(() => {
-    const user = currentUserRef.current;
-    if (!user) return; // Don't connect without user info
-    if (wsRef.current?.readyState === WebSocket.OPEN) return;
-    if (isConnectingRef.current) return; // Prevent concurrent connect attempts
-
-    isConnectingRef.current = true;
-    const url = wsUrl || getPresenceUrl();
-
-    try {
-      const ws = new WebSocket(url);
-
-      ws.onopen = () => {
-        isConnectingRef.current = false;
-        setIsConnected(true);
-
-        // Announce presence (use ref to get latest user info)
-        const currentUserInfo = currentUserRef.current;
-        if (currentUserInfo) {
-          ws.send(JSON.stringify({
-            type: 'presence',
-            action: 'join',
-            user: {
-              username: currentUserInfo.username,
-              avatarUrl: currentUserInfo.avatarUrl,
-            },
-          }));
-
-          // Subscribe to channel messages for this workspace (cloud mode)
-          // This enables receiving real-time channel messages from other users
-          const wsId = workspaceIdRef.current;
-          if (wsId) {
-            ws.send(JSON.stringify({
-              type: 'subscribe_channels',
-              workspaceId: wsId,
-            }));
-          }
-        }
-      };
-
-      ws.onclose = () => {
-        isConnectingRef.current = false;
-        setIsConnected(false);
-        wsRef.current = null;
-
-        // Reconnect after 2 seconds (only if not intentionally disconnected)
-        if (currentUserRef.current) {
-          reconnectTimeoutRef.current = setTimeout(() => {
-            connect();
-          }, 2000);
-        }
-      };
-
-      ws.onerror = (event) => {
-        console.error('[usePresence] Error:', event);
-      };
-
-      ws.onmessage = (event) => {
-        try {
-          const msg = JSON.parse(event.data);
-
-          switch (msg.type) {
-            case 'presence_list':
-              // Full list of online users
-              setOnlineUsers(msg.users || []);
-              break;
-
-            case 'presence_join':
-              // User came online
-              setOnlineUsers((prev) => {
-                const filtered = prev.filter((u) => u.username !== msg.user.username);
-                return [...filtered, msg.user];
-              });
-              // Also forward to onEvent for activity feed
-              onEventRef.current?.(msg);
-              break;
-
-            case 'presence_leave':
-              // User went offline
-              setOnlineUsers((prev) =>
-                prev.filter((u) => u.username !== msg.username)
-              );
-              setTypingUsers((prev) =>
-                prev.filter((t) => t.username !== msg.username)
-              );
-              // Also forward to onEvent for activity feed
-              onEventRef.current?.(msg);
-              break;
-
-            case 'typing':
-              // Typing indicator update
-              if (msg.username === currentUserRef.current?.username) break; // Ignore self
-
-              if (msg.isTyping) {
-                setTypingUsers((prev) => {
-                  const filtered = prev.filter((t) => t.username !== msg.username);
-                  return [
-                    ...filtered,
-                    {
-                      username: msg.username,
-                      avatarUrl: msg.avatarUrl,
-                      startedAt: Date.now(),
-                    },
-                  ];
-                });
-              } else {
-                setTypingUsers((prev) =>
-                  prev.filter((t) => t.username !== msg.username)
-                );
-              }
-              break;
-
-            default:
-              onEventRef.current?.(msg);
-          }
-        } catch (e) {
-          console.error('[usePresence] Failed to parse message:', e);
-        }
-      };
-
-      wsRef.current = ws;
-    } catch (e) {
-      console.error('[usePresence] Failed to create WebSocket:', e);
-    }
-  }, [wsUrl]); // Use ref for currentUser to avoid dependency
-
-  const disconnect = useCallback(() => {
-    // Clear reconnect timeout first
-    if (reconnectTimeoutRef.current) {
-      clearTimeout(reconnectTimeoutRef.current);
-      reconnectTimeoutRef.current = null;
-    }
-
-    // Reset connecting flag
-    isConnectingRef.current = false;
-
-    if (wsRef.current) {
-      // Prevent auto-reconnect by removing onclose handler before closing
-      const ws = wsRef.current;
-      ws.onclose = null;
-      ws.onerror = null;
-
-      // Send leave message before closing
-      const user = currentUserRef.current;
-      if (ws.readyState === WebSocket.OPEN && user) {
-        ws.send(JSON.stringify({
-          type: 'presence',
-          action: 'leave',
-          username: user.username,
-        }));
-      }
-      ws.close();
-      wsRef.current = null;
-    }
-
-    setIsConnected(false);
-  }, []); // Use ref for currentUser to avoid dependency
-
-  // Send typing indicator
-  const sendTyping = useCallback((isTyping: boolean) => {
-    if (!wsRef.current || wsRef.current.readyState !== WebSocket.OPEN) return;
-    const user = currentUserRef.current;
-    if (!user) return;
-
-    // Clear any existing timeout first
-    if (typingTimeoutRef.current) {
-      clearTimeout(typingTimeoutRef.current);
-      typingTimeoutRef.current = null;
-    }
-
-    wsRef.current.send(JSON.stringify({
-      type: 'typing',
-      isTyping,
-      username: user.username,
-      avatarUrl: user.avatarUrl,
-    }));
-
-    // Only set auto-clear timeout when starting to type
-    if (isTyping) {
-      typingTimeoutRef.current = setTimeout(() => {
-        typingTimeoutRef.current = null;
-        sendTyping(false);
-      }, 3000);
-    }
-  }, []); // Use ref for currentUser to avoid dependency
-
-  // Connect when user is available
-  useEffect(() => {
-    if (!autoConnect || !currentUserRef.current) return;
-
-    // Prevent connecting if already connected or connecting
-    if (wsRef.current && wsRef.current.readyState !== WebSocket.CLOSED) {
-      return;
-    }
-
-    connect();
-
-    return () => {
-      disconnect();
-    };
-    // Callbacks are now stable (use refs internally), so only need to depend on user identity
-  }, [autoConnect, currentUser?.username, connect, disconnect]);
-
-  // Send leave on page unload
-  useEffect(() => {
-    const handleUnload = () => {
-      const user = currentUserRef.current;
-      if (wsRef.current?.readyState === WebSocket.OPEN && user) {
-        wsRef.current.send(JSON.stringify({
-          type: 'presence',
-          action: 'leave',
-          username: user.username,
-        }));
-      }
-    };
-
-    window.addEventListener('beforeunload', handleUnload);
-    return () => window.removeEventListener('beforeunload', handleUnload);
-  }, []); // Use ref for currentUser to avoid dependency
-
-  return {
-    onlineUsers,
-    typingUsers,
-    sendTyping,
-    isConnected,
-  };
-}

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

@@ -1,130 +0,0 @@
-/**
- * useRecentRepos Hook
- *
- * Tracks and persists recently accessed repositories/projects.
- * Stores in localStorage for persistence across sessions.
- */
-
-import { useState, useEffect, useCallback } from 'react';
-import type { Project } from '../../types';
-
-const STORAGE_KEY = 'relay:recentRepos';
-const MAX_RECENT = 5;
-
-export interface RecentRepo {
-  id: string;
-  path: string;
-  name?: string;
-  lastAccessed: number;
-}
-
-export interface UseRecentReposOptions {
-  /** Maximum number of recent repos to track (default: 5) */
-  maxRecent?: number;
-}
-
-export interface UseRecentReposReturn {
-  /** List of recent repos, most recent first */
-  recentRepos: RecentRepo[];
-  /** Add or update a repo in recent list */
-  addRecentRepo: (project: Project) => void;
-  /** Remove a repo from recent list */
-  removeRecentRepo: (id: string) => void;
-  /** Clear all recent repos */
-  clearRecentRepos: () => void;
-  /** Get recent repos as Project-like objects for display */
-  getRecentProjects: (allProjects: Project[]) => Project[];
-}
-
-/**
- * Load recent repos from localStorage
- */
-function loadRecentRepos(): RecentRepo[] {
-  try {
-    const stored = localStorage.getItem(STORAGE_KEY);
-    if (!stored) return [];
-    const parsed = JSON.parse(stored);
-    if (!Array.isArray(parsed)) return [];
-    return parsed;
-  } catch {
-    return [];
-  }
-}
-
-/**
- * Save recent repos to localStorage
- */
-function saveRecentRepos(repos: RecentRepo[]): void {
-  try {
-    localStorage.setItem(STORAGE_KEY, JSON.stringify(repos));
-  } catch {
-    // Silently fail if localStorage is not available
-  }
-}
-
-export function useRecentRepos(options: UseRecentReposOptions = {}): UseRecentReposReturn {
-  const maxRecent = options.maxRecent ?? MAX_RECENT;
-  const [recentRepos, setRecentRepos] = useState<RecentRepo[]>([]);
-
-  // Load from localStorage on mount
-  useEffect(() => {
-    setRecentRepos(loadRecentRepos());
-  }, []);
-
-  // Add or update a repo in recent list
-  const addRecentRepo = useCallback((project: Project) => {
-    setRecentRepos((prev) => {
-      // Remove if already exists
-      const filtered = prev.filter((r) => r.id !== project.id);
-
-      // Add to front with current timestamp
-      const newRepo: RecentRepo = {
-        id: project.id,
-        path: project.path,
-        name: project.name,
-        lastAccessed: Date.now(),
-      };
-
-      // Keep only maxRecent items
-      const updated = [newRepo, ...filtered].slice(0, maxRecent);
-
-      // Persist to localStorage
-      saveRecentRepos(updated);
-
-      return updated;
-    });
-  }, [maxRecent]);
-
-  // Remove a repo from recent list
-  const removeRecentRepo = useCallback((id: string) => {
-    setRecentRepos((prev) => {
-      const updated = prev.filter((r) => r.id !== id);
-      saveRecentRepos(updated);
-      return updated;
-    });
-  }, []);
-
-  // Clear all recent repos
-  const clearRecentRepos = useCallback(() => {
-    setRecentRepos([]);
-    saveRecentRepos([]);
-  }, []);
-
-  // Get recent repos as Project objects (matched against current projects)
-  const getRecentProjects = useCallback((allProjects: Project[]): Project[] => {
-    const projectMap = new Map(allProjects.map((p) => [p.id, p]));
-    return recentRepos
-      .map((r) => projectMap.get(r.id))
-      .filter((p): p is Project => p !== undefined);
-  }, [recentRepos]);
-
-  return {
-    recentRepos,
-    addRecentRepo,
-    removeRecentRepo,
-    clearRecentRepos,
-    getRecentProjects,
-  };
-}
-
-export default useRecentRepos;