gitforest 0.1.0

package/test/unit/components/FilterOptionsOverlay.test.tsx

@@ -0,0 +1,197 @@
+/**
+ * Tests for FilterOptionsOverlay component
+ */
+
+import { describe, test, expect } from "bun:test";
+import React from "react";
+import { render } from "ink-testing-library";
+import { FilterOptionsOverlay } from "../../../src/components/FilterOptionsOverlay.tsx";
+import { StoreProvider } from "../../../src/state/store.tsx";
+
+// Helper to render with store provider
+function renderWithStore(ui: React.ReactNode) {
+  return render(<StoreProvider>{ui}</StoreProvider>);
+}
+
+describe("FilterOptionsOverlay", () => {
+  test("renders title", () => {
+    const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+
+    expect(lastFrame()).toContain("Filter Options");
+  });
+
+  describe("Quick Filters section", () => {
+    test("shows all filter options with keyboard shortcuts", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+
+      expect(lastFrame()).toContain("Quick Filters:");
+      
+      // Check all filter options are present
+      expect(lastFrame()).toContain("0");
+      expect(lastFrame()).toContain("All repos");
+      
+      expect(lastFrame()).toContain("1");
+      expect(lastFrame()).toContain("Dirty (uncommitted)");
+      
+      expect(lastFrame()).toContain("2");
+      expect(lastFrame()).toContain("Unpushed commits");
+      
+      expect(lastFrame()).toContain("3");
+      expect(lastFrame()).toContain("No remote configured");
+      
+      expect(lastFrame()).toContain("4");
+      expect(lastFrame()).toContain("GitHub-only");
+      
+      expect(lastFrame()).toContain("5");
+      expect(lastFrame()).toContain("Local-only");
+      
+      expect(lastFrame()).toContain("6");
+      expect(lastFrame()).toContain("Private repos");
+      
+      expect(lastFrame()).toContain("7");
+      expect(lastFrame()).toContain("Public repos");
+      
+      expect(lastFrame()).toContain("8");
+      expect(lastFrame()).toContain("Archived");
+      
+      expect(lastFrame()).toContain("9");
+      expect(lastFrame()).toContain("Forks");
+    });
+
+    test("shows active filter with checkmark", () => {
+      // Mock a custom state where "dirty" filter is active
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+      
+      // Default state has "all" filter active
+      expect(lastFrame()).toContain("All repos");
+      // Should contain checkmark for active filter
+      const frame = lastFrame();
+      expect(frame && (frame.includes("✓") || frame.includes("✓"))).toBe(true);
+    });
+  });
+
+  describe("View Modes section", () => {
+    test("shows view mode options with Tab instruction", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+
+      expect(lastFrame()).toContain("View Modes:");
+      expect(lastFrame()).toContain("(Tab to cycle)");
+      
+      // Check all view modes are present
+      expect(lastFrame()).toContain("local");
+      expect(lastFrame()).toContain("github");
+      expect(lastFrame()).toContain("combined");
+    });
+
+    test("highlights current view mode", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+      
+      // Default view mode should be highlighted
+      // Since we can't easily test colors, we verify the text is present
+      expect(lastFrame()).toContain("local");
+    });
+  });
+
+  describe("Sort section", () => {
+    test("shows sort options with 's' instruction", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+
+      expect(lastFrame()).toContain("Sort:");
+      expect(lastFrame()).toContain("(s to cycle)");
+      
+      // Check all sort options are present
+      expect(lastFrame()).toContain("status");
+      expect(lastFrame()).toContain("name");
+      expect(lastFrame()).toContain("lastActivity");
+      expect(lastFrame()).toContain("stars");
+      expect(lastFrame()).toContain("size");
+    });
+
+    test("highlights current sort field", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+      
+      // Default sort field should be highlighted
+      expect(lastFrame()).toContain("status");
+    });
+  });
+
+  describe("Search section", () => {
+    test("shows search functionality", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+
+      expect(lastFrame()).toContain("Search:");
+      expect(lastFrame()).toContain("/");
+      expect(lastFrame()).toContain("Start text search (by name, description, path)");
+    });
+  });
+
+  describe("Language Filter section", () => {
+    test("shows language filter instructions", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+
+      expect(lastFrame()).toContain("Language Filter:");
+      expect(lastFrame()).toContain("Type language name to filter (e.g., typescript, rust)");
+    });
+
+    test("shows current language filter when set", () => {
+      // We can't easily mock the state with the current setup
+      // But we can verify the structure is there
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+      
+      expect(lastFrame()).toContain("Current:");
+      expect(lastFrame()).toContain("[none]");
+    });
+  });
+
+  describe("Footer", () => {
+    test("shows close instruction", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+
+      expect(lastFrame()).toContain("Press any key to close");
+    });
+  });
+
+  describe("Visual layout", () => {
+    test("has proper border styling", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+      
+      // Check for border characters (this is a simplified check)
+      const frame = lastFrame();
+      // The component should render with border styling
+      expect(frame).toBeTruthy();
+      expect(frame && frame.length).toBeGreaterThan(0);
+    });
+
+    test("has proper section spacing", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+      
+      const frame = lastFrame();
+      
+      // Verify all sections are present
+      expect(frame).toContain("Filter Options");
+      expect(frame).toContain("Quick Filters:");
+      expect(frame).toContain("View Modes:");
+      expect(frame).toContain("Sort:");
+      expect(frame).toContain("Search:");
+      expect(frame).toContain("Language Filter:");
+    });
+  });
+
+  describe("Keyboard shortcuts", () => {
+    test("shows all keyboard shortcuts", () => {
+      const { lastFrame } = renderWithStore(<FilterOptionsOverlay />);
+      
+      const frame = lastFrame();
+      
+      // Check numbers 0-9 are shown for quick filters
+      for (let i = 0; i <= 9; i++) {
+        expect(frame).toContain(i.toString());
+      }
+      
+      // Check other shortcuts
+      expect(frame).toContain("/"); // Search
+      expect(frame).toContain("s"); // Sort
+      expect(frame).toContain("Tab"); // View mode cycle
+    });
+  });
+});

package/test/unit/components/HelpOverlay.test.tsx

@@ -0,0 +1,90 @@
+/**
+ * Tests for HelpOverlay component
+ */
+
+import { describe, test, expect } from "bun:test";
+import React from "react";
+import { render } from "ink-testing-library";
+import { HelpOverlay } from "../../../src/components/HelpOverlay.tsx";
+
+describe("HelpOverlay", () => {
+  test("renders keyboard shortcuts header", () => {
+    const { lastFrame } = render(<HelpOverlay />);
+
+    expect(lastFrame()).toContain("Keyboard Shortcuts");
+  });
+
+  describe("navigation section", () => {
+    test("shows navigation keys", () => {
+      const { lastFrame } = render(<HelpOverlay />);
+
+      expect(lastFrame()).toContain("Navigation");
+      expect(lastFrame()).toContain("Move down");
+      expect(lastFrame()).toContain("Move up");
+      expect(lastFrame()).toContain("Go to top");
+      expect(lastFrame()).toContain("Go to bottom");
+    });
+  });
+
+  describe("selection section", () => {
+    test("shows selection keys", () => {
+      const { lastFrame } = render(<HelpOverlay />);
+
+      expect(lastFrame()).toContain("Selection");
+      expect(lastFrame()).toContain("Toggle selection");
+      expect(lastFrame()).toContain("Select all");
+    });
+  });
+
+  describe("git operations section", () => {
+    test("shows git operation keys", () => {
+      const { lastFrame } = render(<HelpOverlay />);
+
+      expect(lastFrame()).toContain("Git Operations");
+      expect(lastFrame()).toContain("Push selected");
+      expect(lastFrame()).toContain("Pull all repos");
+      // Text may wrap across lines - check for key parts
+      expect(lastFrame()).toContain("Fetch all");
+      expect(lastFrame()).toContain("Init git");
+    });
+  });
+
+  describe("github section", () => {
+    test("shows github keys", () => {
+      const { lastFrame } = render(<HelpOverlay />);
+
+      expect(lastFrame()).toContain("GitHub");
+      // Text may wrap - check for key parts
+      expect(lastFrame()).toContain("Create GitHub");
+      expect(lastFrame()).toContain("Archive GitHub");
+    });
+  });
+
+  describe("view section", () => {
+    test("shows view keys", () => {
+      const { lastFrame } = render(<HelpOverlay />);
+
+      expect(lastFrame()).toContain("View");
+      expect(lastFrame()).toContain("Filter projects");
+      expect(lastFrame()).toContain("Cycle sort field");
+      expect(lastFrame()).toContain("Refresh");
+    });
+  });
+
+  describe("general section", () => {
+    test("shows general keys", () => {
+      const { lastFrame } = render(<HelpOverlay />);
+
+      expect(lastFrame()).toContain("General");
+      expect(lastFrame()).toContain("Toggle help");
+      expect(lastFrame()).toContain("Cancel");
+      expect(lastFrame()).toContain("Quit");
+    });
+  });
+
+  test("shows close instruction", () => {
+    const { lastFrame } = render(<HelpOverlay />);
+
+    expect(lastFrame()).toContain("Press any key to close");
+  });
+});

package/test/unit/components/Layout.test.tsx

@@ -0,0 +1,328 @@
+/**
+ * Tests for Layout component
+ *
+ * Uses TestStoreProvider for dependency injection instead of mock.module()
+ */
+
+import { describe, test, expect } from "bun:test";
+import React from "react";
+import { render } from "ink-testing-library";
+import { Layout } from "../../../src/components/Layout.tsx";
+import { StoreProvider, TestStoreProvider } from "../../../src/state/store.tsx";
+import type { GitforestConfig, UnifiedAppState, AppMode, UnifiedRepo } from "../../../src/types/index.ts";
+import { createMockUnifiedAppState, createMockUnifiedRepo, createLocalOnlyUnifiedRepo, createGitHubOnlyUnifiedRepo, createSyncedUnifiedRepo, createMockGitHubRepoInfo } from "../mocks/index.ts";
+
+/**
+ * Mock config for testing
+ */
+const mockConfig: GitforestConfig = {
+  directories: [{ path: "/test", maxDepth: 3 }],
+  scan: { ignore: [], includeHidden: false, concurrency: 4 },
+  github: { defaultVisibility: "private" },
+  display: { showSubmodules: true, showNonGitProjects: true, sortBy: "status", sortDirection: "desc" },
+  cache: { 
+    ttlSeconds: 300,
+    githubTtlSeconds: 600,
+    enableBackgroundRefresh: true,
+    backgroundRefreshIntervalSeconds: 300,
+  },
+  commands: [
+    { name: "Test Command", key: "t", command: "echo test", confirm: false, background: false }
+  ],
+};
+
+/**
+ * Mock refresh function
+ */
+const mockRefresh = async () => {};
+
+/**
+ * Mock clone function
+ */
+const mockClone = async (_repos: any[], _targetDir: string, _useSSH: boolean) => {};
+
+/**
+ * Track dispatch calls
+ */
+let dispatchCalls: any[] = [];
+const mockDispatch = (action: any) => {
+  dispatchCalls.push(action);
+};
+
+/**
+ * Helper to create a mock state with specific mode and repos
+ */
+function createStateForMode(mode: AppMode, repos: UnifiedRepo[] = []): UnifiedAppState {
+  return createMockUnifiedAppState({
+    mode,
+    isLoading: false,
+    unifiedRepos: repos,
+    // Add specific dialog states based on mode
+    confirmDialog: mode === "confirm" ? {
+      operation: "setup" as const,
+      title: "Test Confirm",
+      message: "Are you sure?",
+      items: ["item1", "item2"],
+      projectPaths: ["/test/path1", "/test/path2"],
+      showVisibilityToggle: false,
+    } : null,
+    cloneDialog: mode === "clone" ? {
+      repos: [createMockUnifiedRepo({ name: "test-repo" })],
+      directories: [{ path: "/test/dir", maxDepth: 3 }],
+      selectedDirIndex: 0,
+      useSSH: false,
+    } : null,
+    detailModal: mode === "detail" ? {
+      repo: createMockUnifiedRepo({ name: "detail-repo" }),
+      readmeContent: "# Test README",
+      readmeLoading: false,
+      readmeError: null,
+      readmeScrollOffset: 0,
+    } : null,
+  });
+}
+
+/**
+ * Helper to render Layout with TestStoreProvider (no mock.module needed)
+ */
+function renderLayoutWithState(state: UnifiedAppState) {
+  // Clear previous dispatch calls
+  dispatchCalls = [];
+
+  return render(
+    <TestStoreProvider initialState={state} dispatch={mockDispatch}>
+      <Layout config={mockConfig} onRefresh={mockRefresh} onClone={mockClone} />
+    </TestStoreProvider>
+  );
+}
+
+/**
+ * Helper to render Layout with store provider (for normal mode tests)
+ */
+function renderLayout() {
+  return render(
+    <StoreProvider>
+      <Layout config={mockConfig} onRefresh={mockRefresh} />
+    </StoreProvider>
+  );
+}
+
+describe("Layout", () => {
+
+  describe("header", () => {
+    test("shows gitforest title", () => {
+      const { lastFrame } = renderLayout();
+
+      expect(lastFrame()).toContain("gitforest");
+    });
+
+    test("shows subtitle", () => {
+      const { lastFrame } = renderLayout();
+
+      expect(lastFrame()).toContain("Git Repository Manager");
+    });
+  });
+
+  describe("filter bar", () => {
+    test("shows filter bar", () => {
+      const { lastFrame } = renderLayout();
+
+      expect(lastFrame()).toContain("Filter:");
+    });
+  });
+
+  describe("initial state", () => {
+    test("shows loading spinner initially", () => {
+      const { lastFrame } = renderLayout();
+
+      // Initial state has isLoading: true
+      expect(lastFrame()).toContain("Scanning projects");
+    });
+  });
+
+  describe("mode rendering", () => {
+    test("renders HelpOverlay when mode is 'help'", () => {
+      const state = createStateForMode("help");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("Keyboard Shortcuts");
+      expect(lastFrame()).toContain("Navigation");
+      expect(lastFrame()).toContain("Selection");
+    });
+
+    test("renders CommandPalette when mode is 'command-palette'", () => {
+      const state = createStateForMode("command-palette");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("Command Palette");
+      expect(lastFrame()).toContain("Available Commands");
+      expect(lastFrame()).toContain("[t]    Test Command");
+    });
+
+    test("renders ConfirmDialog when mode is 'confirm'", () => {
+      const state = createStateForMode("confirm");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("Test Confirm");
+      expect(lastFrame()).toContain("Are you sure?");
+      expect(lastFrame()).toContain("item1");
+      expect(lastFrame()).toContain("item2");
+    });
+
+    test("renders CloneDialog when mode is 'clone'", () => {
+      const state = createStateForMode("clone");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("Clone GitHub Repository");
+      expect(lastFrame()).toContain("test-repo");
+      expect(lastFrame()).toContain("Target directory");
+    });
+
+    test("renders RepoDetailModal when mode is 'detail'", () => {
+      const state = createStateForMode("detail");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("detail-repo");
+      expect(lastFrame()).toContain("Test README");
+    });
+
+    test("renders filter-options placeholder when mode is 'filter-options'", () => {
+      const state = createStateForMode("filter-options");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("Filter Options Overlay - To be implemented");
+    });
+
+    test("renders main layout when mode is 'normal'", () => {
+      const state = createStateForMode("normal");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("gitforest");
+      expect(lastFrame()).toContain("Git Repository Manager");
+      expect(lastFrame()).toContain("Filter:");
+      expect(lastFrame()).toContain("No repositories found");
+    });
+  });
+
+  describe("StatusBar props", () => {
+    test("passes correct counts to StatusBar", () => {
+      const repos = [
+        createMockUnifiedRepo({ 
+          name: "dirty-repo", 
+          local: { status: { isDirty: true } } as any 
+        }),
+        createMockUnifiedRepo({ 
+          name: "ahead-repo", 
+          local: { status: { isAhead: true } } as any 
+        }),
+        createLocalOnlyUnifiedRepo("local-only"),
+        createGitHubOnlyUnifiedRepo("github-only"),
+        createSyncedUnifiedRepo("synced"),
+      ];
+      
+      const state = createStateForMode("normal", repos);
+      const { lastFrame } = renderLayoutWithState(state);
+
+      // Check that StatusBar receives the correct counts
+      expect(lastFrame()).toContain("5 repos");
+      expect(lastFrame()).toContain("1 synced");
+      expect(lastFrame()).toContain("3 local");
+      expect(lastFrame()).toContain("1 remote");
+      expect(lastFrame()).toContain("1 dirty");
+      expect(lastFrame()).toContain("1 unpushed");
+    });
+  });
+
+  describe("dialog handlers", () => {
+    test("handleCloneConfirm calls onClone with correct params", async () => {
+      const state = createStateForMode("clone");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      // The dialog should be rendered
+      expect(lastFrame()).toContain("Clone GitHub Repository");
+      expect(lastFrame()).toContain("test-repo");
+      expect(lastFrame()).toContain("Esc/n   to cancel");
+    });
+
+    test("handleCloneSelectDir dispatches UPDATE_CLONE_DIALOG", () => {
+      const state = createStateForMode("clone");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("Target directory");
+      // Directory selection would be tested in CloneDialog component tests
+    });
+
+    test("handleCloneToggleSSH toggles SSH setting", () => {
+      const state = createStateForMode("clone");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("Protocol:");
+      expect(lastFrame()).toContain("SSH");
+      expect(lastFrame()).toContain("HTTPS");
+      // SSH toggle would be tested in CloneDialog component tests
+    });
+  });
+
+  describe("detail modal handlers", () => {
+    test("handleDetailClose would dispatch HIDE_DETAIL_MODAL", () => {
+      const state = createStateForMode("detail");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("detail-repo");
+      // Close handler would be tested in RepoDetailModal component tests
+    });
+
+    test("handleDetailAction handles browser action", () => {
+      const repo = createMockUnifiedRepo({ 
+        name: "browser-repo",
+        github: createMockGitHubRepoInfo({ 
+          name: "browser-repo",
+          htmlUrl: "https://github.com/test/browser-repo" 
+        })
+      });
+      const state = createStateForMode("detail");
+      state.detailModal!.repo = repo;
+      
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("browser-repo");
+      // Browser action would open the URL (tested in integration tests)
+    });
+
+    test("handleDetailAction handles editor action", () => {
+      const repo = createMockUnifiedRepo({ 
+        name: "editor-repo",
+        localPath: "/test/editor-repo"
+      });
+      const state = createStateForMode("detail");
+      state.detailModal!.repo = repo;
+      
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("editor-repo");
+      // Editor action would open the editor (tested in integration tests)
+    });
+
+    test("handleDetailScroll dispatches UPDATE_DETAIL_MODAL", () => {
+      const state = createStateForMode("detail");
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("Test README");
+      // Scroll handler would be tested in RepoDetailModal component tests
+    });
+
+    test("handleDetailCommand executes command", () => {
+      const repo = createMockUnifiedRepo({ 
+        name: "command-repo",
+        localPath: "/test/command-repo"
+      });
+      const state = createStateForMode("detail");
+      state.detailModal!.repo = repo;
+      
+      const { lastFrame } = renderLayoutWithState(state);
+
+      expect(lastFrame()).toContain("command-repo");
+      // Command execution would be tested in RepoDetailModal component tests
+    });
+  });
+});

package/test/unit/components/MarkdownRenderer.test.tsx

@@ -0,0 +1,45 @@
+import { test, expect } from "bun:test";
+import React from "react";
+import { render } from "ink-testing-library";
+import { MarkdownRenderer } from "../../../src/components/MarkdownRenderer";
+
+test("MarkdownRenderer renders basic markdown", () => {
+  const markdown = `# Hello World
+
+This is **bold** and *italic* text.`;
+  
+  const { lastFrame } = render(
+    React.createElement(MarkdownRenderer, { content: markdown })
+  );
+  
+  const output = lastFrame();
+  expect(output).toContain("Hello World");
+  expect(output).toContain("bold");
+  expect(output).toContain("italic");
+});
+
+test("MarkdownRenderer handles code blocks", () => {
+  const markdown = "\`\`\`javascript\nconst x = 1;\n\`\`\`";
+  
+  const { lastFrame } = render(
+    React.createElement(MarkdownRenderer, { content: markdown })
+  );
+  
+  const output = lastFrame();
+  expect(output).toContain("const x = 1;");
+});
+
+test("MarkdownRenderer handles lists", () => {
+  const markdown = `- Item 1
+- Item 2
+- Item 3`;
+  
+  const { lastFrame } = render(
+    React.createElement(MarkdownRenderer, { content: markdown })
+  );
+  
+  const output = lastFrame();
+  expect(output).toContain("Item 1");
+  expect(output).toContain("Item 2");
+  expect(output).toContain("Item 3");
+});