gitspace 0.2.0-rc.2 → 0.2.0-rc.21

package/src/tui/hooks/useAppState.ts

@@ -1,314 +0,0 @@
-/**
- * TUI App State Management
- *
- * Unified state management for the TUI that works with both local and remote modes.
- * Uses shared components and providers.
- */
-
-import { useState, useCallback, useEffect, useReducer } from 'react';
-import type { MachineInfo } from '../../shared/components/index.js';
-import type { MachineProvider } from '../../shared/providers/index.js';
-import type { Project, Workspace, WorkspaceSession, InboxItem } from '../../shared/types.js';
-
-// ============================================================================
-// Types
-// ============================================================================
-
-/** App view modes */
-export type AppView =
-  | 'machines'     // Machine list (when in remote mode or has multiple machines)
-  | 'projects'     // Project list (local mode default)
-  | 'workspaces'   // Workspace browser for selected project
-  | 'terminal';    // Attached to session
-
-/** Panel focus */
-export type PanelFocus = 'projects' | 'workspaces';
-
-/** App state */
-export interface AppState {
-  // View state
-  view: AppView;
-  panelFocus: PanelFocus;
-
-  // Machine state (remote mode)
-  selectedMachine: MachineInfo | null;
-  machineProvider: MachineProvider | null;
-
-  // Project state
-  projects: Project[];
-  selectedProjectIndex: number;
-  currentProject: string | null;
-
-  // Workspace state
-  workspaces: Workspace[];
-  sessions: Map<string, WorkspaceSession[]>;
-  selectedWorkspaceIndex: number;
-  expandedWorkspaces: Set<string>;
-
-  // Inbox
-  inbox: InboxItem[];
-  unreadCount: number;
-
-  // UI state
-  isLoading: boolean;
-  error: string | null;
-}
-
-/** State actions */
-export type AppAction =
-  | { type: 'SET_LOADING'; loading: boolean }
-  | { type: 'SET_ERROR'; error: string | null }
-  | { type: 'SET_VIEW'; view: AppView }
-  | { type: 'SET_PANEL_FOCUS'; focus: PanelFocus }
-  | { type: 'SET_MACHINE'; machine: MachineInfo | null; provider: MachineProvider | null }
-  | { type: 'SET_PROJECTS'; projects: Project[] }
-  | { type: 'SELECT_PROJECT'; index: number }
-  | { type: 'SET_CURRENT_PROJECT'; project: string | null }
-  | { type: 'SET_WORKSPACES'; workspaces: Workspace[] }
-  | { type: 'SET_SESSIONS'; workspaceId: string; sessions: WorkspaceSession[] }
-  | { type: 'SELECT_WORKSPACE'; index: number }
-  | { type: 'TOGGLE_WORKSPACE'; workspaceId: string }
-  | { type: 'SET_INBOX'; inbox: InboxItem[]; unreadCount: number }
-  | { type: 'SWITCH_PANEL' }
-  | { type: 'MOVE_UP' }
-  | { type: 'MOVE_DOWN' };
-
-// ============================================================================
-// Reducer
-// ============================================================================
-
-function appReducer(state: AppState, action: AppAction): AppState {
-  switch (action.type) {
-    case 'SET_LOADING':
-      return { ...state, isLoading: action.loading };
-
-    case 'SET_ERROR':
-      return { ...state, error: action.error };
-
-    case 'SET_VIEW':
-      return { ...state, view: action.view };
-
-    case 'SET_PANEL_FOCUS':
-      return { ...state, panelFocus: action.focus };
-
-    case 'SET_MACHINE':
-      return {
-        ...state,
-        selectedMachine: action.machine,
-        machineProvider: action.provider,
-        // Reset project/workspace state when switching machines
-        projects: [],
-        workspaces: [],
-        sessions: new Map(),
-        selectedProjectIndex: 0,
-        selectedWorkspaceIndex: 0,
-        expandedWorkspaces: new Set(),
-      };
-
-    case 'SET_PROJECTS':
-      return { ...state, projects: action.projects };
-
-    case 'SELECT_PROJECT': {
-      const index = Math.max(0, Math.min(action.index, state.projects.length - 1));
-      return { ...state, selectedProjectIndex: index };
-    }
-
-    case 'SET_CURRENT_PROJECT':
-      return { ...state, currentProject: action.project };
-
-    case 'SET_WORKSPACES':
-      return { ...state, workspaces: action.workspaces, selectedWorkspaceIndex: 0 };
-
-    case 'SET_SESSIONS': {
-      const newSessions = new Map(state.sessions);
-      newSessions.set(action.workspaceId, action.sessions);
-      return { ...state, sessions: newSessions };
-    }
-
-    case 'SELECT_WORKSPACE': {
-      const maxIndex = getMaxWorkspaceIndex(state);
-      const index = Math.max(0, Math.min(action.index, maxIndex));
-      return { ...state, selectedWorkspaceIndex: index };
-    }
-
-    case 'TOGGLE_WORKSPACE': {
-      const newExpanded = new Set(state.expandedWorkspaces);
-      if (newExpanded.has(action.workspaceId)) {
-        newExpanded.delete(action.workspaceId);
-      } else {
-        newExpanded.add(action.workspaceId);
-      }
-      return { ...state, expandedWorkspaces: newExpanded };
-    }
-
-    case 'SET_INBOX':
-      return { ...state, inbox: action.inbox, unreadCount: action.unreadCount };
-
-    case 'SWITCH_PANEL':
-      return {
-        ...state,
-        panelFocus: state.panelFocus === 'projects' ? 'workspaces' : 'projects',
-      };
-
-    case 'MOVE_UP':
-      if (state.panelFocus === 'projects') {
-        const index = Math.max(0, state.selectedProjectIndex - 1);
-        return { ...state, selectedProjectIndex: index };
-      } else {
-        const index = Math.max(0, state.selectedWorkspaceIndex - 1);
-        return { ...state, selectedWorkspaceIndex: index };
-      }
-
-    case 'MOVE_DOWN':
-      if (state.panelFocus === 'projects') {
-        const index = Math.min(state.projects.length - 1, state.selectedProjectIndex + 1);
-        return { ...state, selectedProjectIndex: index };
-      } else {
-        const maxIndex = getMaxWorkspaceIndex(state);
-        const index = Math.min(maxIndex, state.selectedWorkspaceIndex + 1);
-        return { ...state, selectedWorkspaceIndex: index };
-      }
-
-    default:
-      return state;
-  }
-}
-
-function getMaxWorkspaceIndex(state: AppState): number {
-  // Count total items in tree (workspaces + sessions + new-session options)
-  let count = 0;
-  for (const ws of state.workspaces) {
-    count++; // workspace itself
-    if (state.expandedWorkspaces.has(ws.name)) {
-      const sessions = state.sessions.get(ws.name) || [];
-      count += sessions.length; // sessions
-      count++; // new-session option
-    }
-  }
-  return Math.max(0, count - 1);
-}
-
-// ============================================================================
-// Initial State
-// ============================================================================
-
-function createInitialState(isRemoteMode: boolean): AppState {
-  return {
-    view: isRemoteMode ? 'machines' : 'projects',
-    panelFocus: 'projects',
-    selectedMachine: null,
-    machineProvider: null,
-    projects: [],
-    selectedProjectIndex: 0,
-    currentProject: null,
-    workspaces: [],
-    sessions: new Map(),
-    selectedWorkspaceIndex: 0,
-    expandedWorkspaces: new Set(),
-    inbox: [],
-    unreadCount: 0,
-    isLoading: true,
-    error: null,
-  };
-}
-
-// ============================================================================
-// Hook
-// ============================================================================
-
-export interface UseAppStateOptions {
-  isRemoteMode: boolean;
-}
-
-export function useAppState(options: UseAppStateOptions) {
-  const { isRemoteMode } = options;
-
-  const [state, dispatch] = useReducer(appReducer, isRemoteMode, createInitialState);
-
-  // Convenience methods
-  const setLoading = useCallback((loading: boolean) => {
-    dispatch({ type: 'SET_LOADING', loading });
-  }, []);
-
-  const setError = useCallback((error: string | null) => {
-    dispatch({ type: 'SET_ERROR', error });
-  }, []);
-
-  const setView = useCallback((view: AppView) => {
-    dispatch({ type: 'SET_VIEW', view });
-  }, []);
-
-  const setPanelFocus = useCallback((focus: PanelFocus) => {
-    dispatch({ type: 'SET_PANEL_FOCUS', focus });
-  }, []);
-
-  const setMachine = useCallback((machine: MachineInfo | null, provider: MachineProvider | null) => {
-    dispatch({ type: 'SET_MACHINE', machine, provider });
-  }, []);
-
-  const setProjects = useCallback((projects: Project[]) => {
-    dispatch({ type: 'SET_PROJECTS', projects });
-  }, []);
-
-  const selectProject = useCallback((index: number) => {
-    dispatch({ type: 'SELECT_PROJECT', index });
-  }, []);
-
-  const setCurrentProject = useCallback((project: string | null) => {
-    dispatch({ type: 'SET_CURRENT_PROJECT', project });
-  }, []);
-
-  const setWorkspaces = useCallback((workspaces: Workspace[]) => {
-    dispatch({ type: 'SET_WORKSPACES', workspaces });
-  }, []);
-
-  const setSessions = useCallback((workspaceId: string, sessions: WorkspaceSession[]) => {
-    dispatch({ type: 'SET_SESSIONS', workspaceId, sessions });
-  }, []);
-
-  const selectWorkspace = useCallback((index: number) => {
-    dispatch({ type: 'SELECT_WORKSPACE', index });
-  }, []);
-
-  const toggleWorkspace = useCallback((workspaceId: string) => {
-    dispatch({ type: 'TOGGLE_WORKSPACE', workspaceId });
-  }, []);
-
-  const setInbox = useCallback((inbox: InboxItem[], unreadCount: number) => {
-    dispatch({ type: 'SET_INBOX', inbox, unreadCount });
-  }, []);
-
-  const switchPanel = useCallback(() => {
-    dispatch({ type: 'SWITCH_PANEL' });
-  }, []);
-
-  const moveUp = useCallback(() => {
-    dispatch({ type: 'MOVE_UP' });
-  }, []);
-
-  const moveDown = useCallback(() => {
-    dispatch({ type: 'MOVE_DOWN' });
-  }, []);
-
-  return {
-    state,
-    dispatch,
-    // Actions
-    setLoading,
-    setError,
-    setView,
-    setPanelFocus,
-    setMachine,
-    setProjects,
-    selectProject,
-    setCurrentProject,
-    setWorkspaces,
-    setSessions,
-    selectWorkspace,
-    toggleWorkspace,
-    setInbox,
-    switchPanel,
-    moveUp,
-    moveDown,
-  };
-}

package/src/tui/hooks/useDaemonStatus.ts

@@ -1,174 +0,0 @@
-/**
- * Hook for monitoring daemon status (tmux-lite and serve)
- *
- * Provides real-time status of:
- * - tmux-lite server (sessions count, version)
- * - serve daemon (relay connection, clients count)
- */
-
-import { useState, useEffect, useCallback } from 'react';
-import { getStatus as getTmuxStatus, isServerRunning as isTmuxRunning } from '../../lib/tmux-lite/cli.js';
-import { queryServeStatus, isServeRunning, type StatusResponse } from '../../serve/daemon.js';
-
-/** Package version for comparison */
-const PACKAGE_VERSION = '1.0.0';
-
-/** Tmux daemon status */
-export interface TmuxStatus {
-  running: boolean;
-  version?: string;
-  sessions?: number;
-  attached?: number;
-  uptime?: number;
-}
-
-/** Serve daemon status */
-export interface ServeStatus {
-  running: boolean;
-  version?: string;
-  relayUrl?: string;
-  relayStatus?: 'connecting' | 'connected' | 'disconnected' | 'reconnecting';
-  clients?: number;
-  uptime?: number;
-  hosting?: {
-    subdomain: string;
-    tunnelActive: boolean;
-  };
-}
-
-/** Combined daemon status */
-export interface DaemonStatus {
-  tmux: TmuxStatus;
-  serve: ServeStatus;
-  versionMismatch: boolean;
-  packageVersion: string;
-}
-
-/** Hook options */
-export interface UseDaemonStatusOptions {
-  /** Polling interval in ms (default: 5000) */
-  pollInterval?: number;
-  /** Whether to poll automatically (default: true) */
-  autoPoll?: boolean;
-}
-
-/** Hook return type */
-export interface UseDaemonStatusReturn {
-  status: DaemonStatus;
-  refresh: () => Promise<void>;
-  isLoading: boolean;
-}
-
-/**
- * Hook for monitoring daemon status
- */
-export function useDaemonStatus(options: UseDaemonStatusOptions = {}): UseDaemonStatusReturn {
-  const { pollInterval = 5000, autoPoll = true } = options;
-
-  const [status, setStatus] = useState<DaemonStatus>({
-    tmux: { running: false },
-    serve: { running: false },
-    versionMismatch: false,
-    packageVersion: PACKAGE_VERSION,
-  });
-  const [isLoading, setIsLoading] = useState(true);
-
-  const refresh = useCallback(async () => {
-    try {
-      // Query tmux status
-      let tmuxStatus: TmuxStatus = { running: false };
-      if (await isTmuxRunning()) {
-        try {
-          const tmux = await getTmuxStatus();
-          tmuxStatus = {
-            running: true,
-            version: tmux.version,
-            sessions: tmux.sessions,
-            attached: tmux.attached,
-            uptime: tmux.uptime,
-          };
-        } catch {
-          tmuxStatus = { running: true }; // Running but couldn't get details
-        }
-      }
-
-      // Query serve status
-      let serveStatus: ServeStatus = { running: false };
-      if (isServeRunning()) {
-        try {
-          const serve = await queryServeStatus();
-          if (serve) {
-            serveStatus = {
-              running: true,
-              version: serve.version,
-              relayUrl: serve.relay.url,
-              relayStatus: serve.relay.status,
-              clients: serve.clients,
-              uptime: serve.uptime,
-              hosting: serve.hosting,
-            };
-          } else {
-            serveStatus = { running: true }; // Running but couldn't get details
-          }
-        } catch {
-          serveStatus = { running: true }; // Running but couldn't get details
-        }
-      }
-
-      // Check version mismatch
-      const versionMismatch =
-        (tmuxStatus.version && tmuxStatus.version !== PACKAGE_VERSION) ||
-        (serveStatus.version && serveStatus.version !== PACKAGE_VERSION);
-
-      setStatus({
-        tmux: tmuxStatus,
-        serve: serveStatus,
-        versionMismatch: !!versionMismatch,
-        packageVersion: PACKAGE_VERSION,
-      });
-    } finally {
-      setIsLoading(false);
-    }
-  }, []);
-
-  // Initial load
-  useEffect(() => {
-    refresh();
-  }, [refresh]);
-
-  // Polling
-  useEffect(() => {
-    if (!autoPoll) return;
-
-    const interval = setInterval(refresh, pollInterval);
-    return () => clearInterval(interval);
-  }, [autoPoll, pollInterval, refresh]);
-
-  return { status, refresh, isLoading };
-}
-
-/**
- * Format uptime in human-readable format
- */
-export function formatUptime(seconds: number): string {
-  if (seconds < 60) return `${seconds}s`;
-  if (seconds < 3600) return `${Math.floor(seconds / 60)}m`;
-  const hours = Math.floor(seconds / 3600);
-  const mins = Math.floor((seconds % 3600) / 60);
-  if (hours < 24) return `${hours}h ${mins}m`;
-  const days = Math.floor(hours / 24);
-  return `${days}d ${hours % 24}h`;
-}
-
-/**
- * Format relay status for display
- */
-export function formatRelayStatus(status: ServeStatus['relayStatus']): string {
-  switch (status) {
-    case 'connected': return '●';
-    case 'connecting': return '◐';
-    case 'reconnecting': return '◐';
-    case 'disconnected': return '○';
-    default: return '?';
-  }
-}

package/src/tui/hooks/useInboxTUI.ts

@@ -1,113 +0,0 @@
-/**
- * TUI-specific wrapper for shared useInbox hook
- *
- * Integrates with TUI's renderer suspend/resume and tmux-lite CLI.
- */
-
-import { useCallback } from 'react';
-import { spawn } from 'child_process';
-import { useInbox, type UseInboxProps, type UseInboxReturn } from '../../shared/components/Inbox.js';
-import type { InboxItem } from '../../lib/tmux-lite/cli.js';
-
-interface UseTUIInboxOptions {
-  items: InboxItem[];
-  unreadCount: number;
-  onClose: () => void;
-  onRefreshWorkspaces: () => Promise<void>;
-  onRefreshInbox: () => Promise<{ items: InboxItem[]; unreadCount: number }>;
-  renderer: {
-    suspend: () => void;
-    resume: () => void;
-  };
-}
-
-interface UseTUIInboxReturn extends UseInboxReturn {
-  /** Refresh inbox after operations */
-  refreshInbox: () => Promise<void>;
-}
-
-export function useTUIInbox(options: UseTUIInboxOptions): UseTUIInboxReturn {
-  const {
-    items,
-    unreadCount,
-    onClose,
-    onRefreshWorkspaces,
-    onRefreshInbox,
-    renderer,
-  } = options;
-
-  // Clear a single inbox item
-  const onClearItem = useCallback(async (itemId: string) => {
-    const { clearInbox } = await import('../../lib/tmux-lite/cli.js');
-    await clearInbox(itemId);
-  }, []);
-
-  // Clear all inbox items
-  const onClearAll = useCallback(async () => {
-    const { clearInbox } = await import('../../lib/tmux-lite/cli.js');
-    await clearInbox();
-  }, []);
-
-  // Mark an item as read
-  const onMarkRead = useCallback(async (itemId: string) => {
-    const { markInboxRead } = await import('../../lib/tmux-lite/cli.js');
-    await markInboxRead(itemId);
-  }, []);
-
-  // Attach to a session
-  const onAttachSession = useCallback(async (sessionId: string) => {
-    const { listSessions } = await import('../../lib/tmux-lite/cli.js');
-    const sessions = await listSessions();
-    const session = sessions.find(s => s.id === sessionId);
-
-    if (!session) {
-      throw new Error('Session no longer exists');
-    }
-
-    // Get CLI path for tmux-lite
-    const cliPath = new URL('../../lib/tmux-lite/cli.ts', import.meta.url).pathname;
-
-    // Suspend TUI, attach to session, resume TUI
-    renderer.suspend();
-    const proc = spawn('bun', ['run', cliPath, 'attach', session.id, '-f'], { stdio: 'inherit' });
-    await new Promise<void>((resolve) => proc.on('exit', () => resolve()));
-    renderer.resume();
-
-    // Refresh workspaces after detaching
-    await onRefreshWorkspaces();
-  }, [renderer, onRefreshWorkspaces]);
-
-  // Convert TUI InboxItem to shared InboxItem format
-  const convertedItems = items.map(item => ({
-    id: item.id,
-    sessionId: item.sessionId,
-    sessionName: item.sessionName,
-    type: item.type as 'exit' | 'title' | 'idle' | 'bell',
-    context: item.context,
-    timestamp: item.timestamp,
-    read: item.read,
-    processTitle: item.processTitle,
-    exitCode: item.exitCode,
-  }));
-
-  // Use the shared hook
-  const hookReturn = useInbox({
-    items: convertedItems,
-    unreadCount,
-    onClearItem,
-    onClearAll,
-    onMarkRead,
-    onAttachSession,
-    onClose,
-  });
-
-  // Wrap refresh to also update the TUI state
-  const refreshInbox = useCallback(async () => {
-    await onRefreshInbox();
-  }, [onRefreshInbox]);
-
-  return {
-    ...hookReturn,
-    refreshInbox,
-  };
-}