hjworktree-cli 2.0.0

package/web/src/stores/useAppStore.ts

@@ -0,0 +1,348 @@
+import { create } from 'zustand';
+import type { Branch, TerminalInfo, AgentId, AgentStatus, NavigationStep, StepStatus } from '../../../shared/types/index.js';
+import { STEP_ORDER } from '../../../shared/types/index.js';
+import { DEFAULT_PARALLEL_COUNT, MIN_PARALLEL_COUNT, MAX_PARALLEL_COUNT } from '../../../shared/constants.js';
+
+interface ProjectInfo {
+  cwd: string;
+  isGitRepository: boolean;
+  currentBranch: string | null;
+}
+
+interface AppState {
+  // Navigation
+  step: NavigationStep;
+  completedSteps: NavigationStep[];
+
+  // Project info
+  projectInfo: ProjectInfo | null;
+
+  // Branches
+  branches: Branch[];
+  selectedBranch: string | null;
+
+  // Agent selection
+  selectedAgent: AgentId;
+
+  // Worktree count
+  worktreeCount: number;
+
+  // Terminals
+  terminals: TerminalInfo[];
+  activeTerminalIndex: number;
+
+  // Loading states
+  isLoading: boolean;
+  loadingMessage: string;
+
+  // Error state
+  error: string | null;
+}
+
+interface AppActions {
+  // Navigation
+  setStep: (step: NavigationStep) => void;
+  goToStep: (step: NavigationStep) => void;
+  goToNext: () => void;
+  goToPrev: () => void;
+  canNavigateTo: (step: NavigationStep) => boolean;
+  isStepComplete: (step: NavigationStep) => boolean;
+  getStepStatus: (step: NavigationStep) => StepStatus;
+
+  // Project info
+  setProjectInfo: (info: ProjectInfo) => void;
+  fetchProjectInfo: () => Promise<void>;
+
+  // Branches
+  setBranches: (branches: Branch[]) => void;
+  setSelectedBranch: (branch: string | null) => void;
+  fetchBranches: () => Promise<void>;
+
+  // Agent selection
+  setSelectedAgent: (agent: AgentId) => void;
+
+  // Worktree count
+  setWorktreeCount: (count: number) => void;
+  incrementWorktreeCount: () => void;
+  decrementWorktreeCount: () => void;
+
+  // Terminals
+  addTerminal: (terminal: TerminalInfo) => void;
+  updateTerminalStatus: (sessionId: string, status: AgentStatus) => void;
+  removeTerminal: (sessionId: string) => void;
+  setActiveTerminal: (index: number) => void;
+  clearAllTerminals: () => void;
+
+  // Execute
+  execute: () => Promise<void>;
+
+  // Loading
+  setLoading: (loading: boolean, message?: string) => void;
+
+  // Error
+  setError: (error: string | null) => void;
+
+  // Reset
+  reset: () => void;
+}
+
+type AppStore = AppState & AppActions;
+
+const initialState: AppState = {
+  step: 'branch',
+  completedSteps: [],
+  projectInfo: null,
+  branches: [],
+  selectedBranch: null,
+  selectedAgent: 'claude',
+  worktreeCount: DEFAULT_PARALLEL_COUNT,
+  terminals: [],
+  activeTerminalIndex: 0,
+  isLoading: false,
+  loadingMessage: '',
+  error: null,
+};
+
+export const useAppStore = create<AppStore>((set, get) => ({
+  ...initialState,
+
+  // Navigation
+  setStep: (step) => set({ step }),
+
+  goToStep: (targetStep) => {
+    const { canNavigateTo, step, isStepComplete, completedSteps } = get();
+    if (!canNavigateTo(targetStep)) return;
+
+    // Mark current step as complete if valid
+    const newCompleted = [...completedSteps];
+    if (isStepComplete(step) && !newCompleted.includes(step)) {
+      newCompleted.push(step);
+    }
+
+    set({ step: targetStep, completedSteps: newCompleted });
+  },
+
+  goToNext: () => {
+    const { step, isStepComplete, completedSteps } = get();
+    const currentIndex = STEP_ORDER.indexOf(step);
+
+    if (currentIndex < STEP_ORDER.length - 1 && isStepComplete(step)) {
+      const newCompleted = [...completedSteps];
+      if (!newCompleted.includes(step)) {
+        newCompleted.push(step);
+      }
+      set({
+        step: STEP_ORDER[currentIndex + 1],
+        completedSteps: newCompleted
+      });
+    }
+  },
+
+  goToPrev: () => {
+    const { step } = get();
+    const currentIndex = STEP_ORDER.indexOf(step);
+
+    if (currentIndex > 0) {
+      set({ step: STEP_ORDER[currentIndex - 1] });
+    }
+  },
+
+  canNavigateTo: (targetStep) => {
+    const { step, completedSteps, isStepComplete } = get();
+    const currentIndex = STEP_ORDER.indexOf(step);
+    const targetIndex = STEP_ORDER.indexOf(targetStep);
+
+    // Can always go to current step
+    if (targetIndex === currentIndex) return true;
+
+    // Can always go back to completed or earlier steps
+    if (targetIndex < currentIndex) return true;
+
+    // Can only go forward if all previous steps are complete
+    for (let i = 0; i < targetIndex; i++) {
+      const checkStep = STEP_ORDER[i];
+      if (!completedSteps.includes(checkStep) && !isStepComplete(checkStep)) {
+        return false;
+      }
+    }
+    return true;
+  },
+
+  isStepComplete: (checkStep) => {
+    const { selectedBranch, selectedAgent, worktreeCount, terminals } = get();
+
+    switch (checkStep) {
+      case 'branch':
+        return selectedBranch !== null;
+      case 'agent':
+        return selectedAgent !== null;
+      case 'worktree':
+        return worktreeCount >= MIN_PARALLEL_COUNT;
+      case 'running':
+        return terminals.length > 0;
+      default:
+        return false;
+    }
+  },
+
+  getStepStatus: (checkStep) => {
+    const { step, completedSteps, isStepComplete } = get();
+
+    if (checkStep === step) return 'current';
+    if (completedSteps.includes(checkStep)) return 'completed';
+    if (isStepComplete(checkStep)) return 'completed';
+    return 'pending';
+  },
+
+  // Project info
+  setProjectInfo: (info) => set({ projectInfo: info }),
+
+  fetchProjectInfo: async () => {
+    try {
+      const response = await fetch('/api/info');
+      if (!response.ok) throw new Error('Failed to fetch project info');
+      const info = await response.json();
+      set({ projectInfo: info });
+    } catch (error) {
+      set({ error: error instanceof Error ? error.message : 'Unknown error' });
+    }
+  },
+
+  // Branches
+  setBranches: (branches) => set({ branches }),
+
+  setSelectedBranch: (branch) => set({ selectedBranch: branch }),
+
+  fetchBranches: async () => {
+    try {
+      const response = await fetch('/api/branches');
+      if (!response.ok) throw new Error('Failed to fetch branches');
+      const branches = await response.json();
+      set({ branches });
+
+      // Auto-select current branch if none selected
+      const state = get();
+      if (!state.selectedBranch && branches.length > 0) {
+        const currentBranch = branches.find((b: Branch) => b.isCurrent);
+        set({ selectedBranch: currentBranch?.name || branches[0].name });
+      }
+    } catch (error) {
+      set({ error: error instanceof Error ? error.message : 'Unknown error' });
+    }
+  },
+
+  // Agent selection
+  setSelectedAgent: (agent) => set({ selectedAgent: agent }),
+
+  // Worktree count
+  setWorktreeCount: (count) => set({
+    worktreeCount: Math.max(MIN_PARALLEL_COUNT, Math.min(MAX_PARALLEL_COUNT, count))
+  }),
+
+  incrementWorktreeCount: () => {
+    const { worktreeCount } = get();
+    if (worktreeCount < MAX_PARALLEL_COUNT) {
+      set({ worktreeCount: worktreeCount + 1 });
+    }
+  },
+
+  decrementWorktreeCount: () => {
+    const { worktreeCount } = get();
+    if (worktreeCount > MIN_PARALLEL_COUNT) {
+      set({ worktreeCount: worktreeCount - 1 });
+    }
+  },
+
+  // Terminals
+  addTerminal: (terminal) => set((state) => ({
+    terminals: [...state.terminals, terminal]
+  })),
+
+  updateTerminalStatus: (sessionId, status) => set((state) => ({
+    terminals: state.terminals.map((t) =>
+      t.sessionId === sessionId ? { ...t, status } : t
+    )
+  })),
+
+  removeTerminal: (sessionId) => set((state) => {
+    const newTerminals = state.terminals.filter((t) => t.sessionId !== sessionId);
+    const newActiveIndex = Math.min(state.activeTerminalIndex, Math.max(0, newTerminals.length - 1));
+    return {
+      terminals: newTerminals,
+      activeTerminalIndex: newActiveIndex,
+      step: newTerminals.length === 0 ? 'branch' : state.step,
+      completedSteps: newTerminals.length === 0 ? [] : state.completedSteps,
+    };
+  }),
+
+  setActiveTerminal: (index) => set({ activeTerminalIndex: index }),
+
+  clearAllTerminals: () => set({ terminals: [], activeTerminalIndex: 0 }),
+
+  // Execute
+  execute: async () => {
+    const { selectedBranch, worktreeCount, selectedAgent, setLoading, setError, setStep, addTerminal } = get();
+
+    if (!selectedBranch) {
+      setError('Please select a branch');
+      return;
+    }
+
+    setLoading(true, 'Creating worktrees...');
+    setError(null);
+
+    try {
+      const response = await fetch('/api/worktrees', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          branch: selectedBranch,
+          count: worktreeCount,
+          agentType: selectedAgent,
+        }),
+      });
+
+      if (!response.ok) {
+        const data = await response.json();
+        throw new Error(data.error || 'Failed to create worktrees');
+      }
+
+      const { worktrees } = await response.json();
+
+      // Create terminal info for each worktree
+      for (const worktree of worktrees) {
+        const sessionId = `${worktree.name}-${Date.now()}`;
+        addTerminal({
+          sessionId,
+          worktreePath: worktree.path,
+          worktreeName: worktree.name,
+          branchName: worktree.branch,
+          agentType: selectedAgent,
+          status: 'initializing',
+        });
+      }
+
+      // Mark all setup steps as complete and transition to running
+      set({
+        step: 'running',
+        completedSteps: ['branch', 'agent', 'worktree']
+      });
+    } catch (error) {
+      setError(error instanceof Error ? error.message : 'Unknown error');
+    } finally {
+      setLoading(false);
+    }
+  },
+
+  // Loading
+  setLoading: (loading, message = '') => set({
+    isLoading: loading,
+    loadingMessage: message,
+  }),
+
+  // Error
+  setError: (error) => set({ error }),
+
+  // Reset
+  reset: () => set(initialState),
+}));