md-redline 0.1.0

package/src/hooks/useSearch.test.ts

@@ -0,0 +1,72 @@
+// @vitest-environment jsdom
+
+import { describe, it, expect, vi } from 'vitest';
+import { renderHook, act } from '@testing-library/react';
+import { useSearch } from './useSearch';
+
+describe('useSearch', () => {
+  it('handleSearchCount clamps activeSearchIndex when count decreases', () => {
+    const onClose = vi.fn();
+    const { result } = renderHook(() => useSearch(onClose));
+
+    // Set count to 5, then navigate to index 4
+    act(() => result.current.handleSearchCount(5));
+    act(() => result.current.handleSearchNext()); // 1
+    act(() => result.current.handleSearchNext()); // 2
+    act(() => result.current.handleSearchNext()); // 3
+    act(() => result.current.handleSearchNext()); // 4
+    expect(result.current.activeSearchIndex).toBe(4);
+
+    // Now reduce count to 3 — index should clamp to 2 (count - 1)
+    act(() => result.current.handleSearchCount(3));
+    expect(result.current.activeSearchIndex).toBe(2);
+  });
+
+  it('handleSearchCount resets index to 0 when count becomes 0', () => {
+    const onClose = vi.fn();
+    const { result } = renderHook(() => useSearch(onClose));
+
+    act(() => result.current.handleSearchCount(5));
+    act(() => result.current.handleSearchNext()); // 1
+    expect(result.current.activeSearchIndex).toBe(1);
+
+    act(() => result.current.handleSearchCount(0));
+    expect(result.current.activeSearchIndex).toBe(0);
+  });
+
+  it('handleSearchNext wraps from last to first', () => {
+    const onClose = vi.fn();
+    const { result } = renderHook(() => useSearch(onClose));
+
+    act(() => result.current.handleSearchCount(3));
+    act(() => result.current.handleSearchNext()); // 1
+    act(() => result.current.handleSearchNext()); // 2
+    act(() => result.current.handleSearchNext()); // wraps to 0
+    expect(result.current.activeSearchIndex).toBe(0);
+  });
+
+  it('handleSearchPrev wraps from first to last', () => {
+    const onClose = vi.fn();
+    const { result } = renderHook(() => useSearch(onClose));
+
+    act(() => result.current.handleSearchCount(3));
+    expect(result.current.activeSearchIndex).toBe(0);
+
+    act(() => result.current.handleSearchPrev()); // wraps to 2
+    expect(result.current.activeSearchIndex).toBe(2);
+  });
+
+  it('handleSearchQueryChange resets index to 0', () => {
+    const onClose = vi.fn();
+    const { result } = renderHook(() => useSearch(onClose));
+
+    act(() => result.current.handleSearchCount(5));
+    act(() => result.current.handleSearchNext()); // 1
+    act(() => result.current.handleSearchNext()); // 2
+    expect(result.current.activeSearchIndex).toBe(2);
+
+    act(() => result.current.handleSearchQueryChange('new query'));
+    expect(result.current.activeSearchIndex).toBe(0);
+    expect(result.current.searchQuery).toBe('new query');
+  });
+});

package/src/hooks/useSearch.ts

@@ -0,0 +1,53 @@
+import { useState, useCallback, useRef } from 'react';
+
+export function useSearch(onClose: () => void) {
+  const [searchQuery, setSearchQuery] = useState('');
+  const [activeSearchIndex, setActiveSearchIndex] = useState(0);
+  const [searchMatchCount, setSearchMatchCount] = useState(0);
+  const [searchFocusTrigger, setSearchFocusTrigger] = useState(0);
+
+  const searchMatchCountRef = useRef(searchMatchCount);
+  searchMatchCountRef.current = searchMatchCount;
+
+  const handleSearchCount = useCallback((count: number) => {
+    setSearchMatchCount(count);
+    setActiveSearchIndex((prev) => (count === 0 ? 0 : Math.min(prev, count - 1)));
+  }, []);
+
+  const handleSearchNext = useCallback(() => {
+    setActiveSearchIndex((prev) =>
+      prev < searchMatchCountRef.current - 1 ? prev + 1 : 0,
+    );
+  }, []);
+
+  const handleSearchPrev = useCallback(() => {
+    setActiveSearchIndex((prev) =>
+      prev > 0 ? prev - 1 : Math.max(0, searchMatchCountRef.current - 1),
+    );
+  }, []);
+
+  const handleSearchClose = useCallback(() => {
+    onClose();
+    setSearchQuery('');
+    setActiveSearchIndex(0);
+    setSearchMatchCount(0);
+  }, [onClose]);
+
+  const handleSearchQueryChange = useCallback((query: string) => {
+    setSearchQuery(query);
+    setActiveSearchIndex(0);
+  }, []);
+
+  return {
+    searchQuery,
+    activeSearchIndex,
+    searchMatchCount,
+    searchFocusTrigger,
+    setSearchFocusTrigger,
+    handleSearchCount,
+    handleSearchNext,
+    handleSearchPrev,
+    handleSearchClose,
+    handleSearchQueryChange,
+  };
+}

package/src/hooks/useSelection.ts

@@ -0,0 +1,48 @@
+import { useState, useEffect, useCallback, useRef } from 'react';
+import { resolveSelection } from '../lib/selection-resolver';
+import type { SelectionInfo } from '../types';
+
+export function useSelection(containerRef: React.RefObject<HTMLElement | null>) {
+  const [selection, setSelection] = useState<SelectionInfo | null>(null);
+  const lockedRef = useRef(false);
+
+  const lockSelection = useCallback(() => {
+    lockedRef.current = true;
+  }, []);
+
+  const clearSelection = useCallback(() => {
+    lockedRef.current = false;
+    setSelection(null);
+    window.getSelection()?.removeAllRanges();
+  }, []);
+
+  useEffect(() => {
+    const handleMouseUp = (e: MouseEvent) => {
+      if (lockedRef.current) return;
+      if ((e.target as Element)?.closest?.('[data-comment-form]')) return;
+      if ((e.target as Element)?.closest?.('[data-drag-handle]')) return;
+      if (document.body.classList.contains('anchor-dragging')) return;
+      if (!containerRef.current) return;
+
+      const info = resolveSelection(containerRef.current);
+      setSelection(info);
+    };
+
+    const handleKeyUp = (e: KeyboardEvent) => {
+      if (e.key === 'Escape') {
+        lockedRef.current = false;
+        setSelection(null);
+        window.getSelection()?.removeAllRanges();
+      }
+    };
+
+    document.addEventListener('mouseup', handleMouseUp);
+    document.addEventListener('keyup', handleKeyUp);
+    return () => {
+      document.removeEventListener('mouseup', handleMouseUp);
+      document.removeEventListener('keyup', handleKeyUp);
+    };
+  }, [containerRef]);
+
+  return { selection, clearSelection, lockSelection };
+}

package/src/hooks/useSessionPersistence.test.ts

@@ -0,0 +1,59 @@
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { loadSession } from './useSessionPersistence';
+
+const store: Record<string, string> = {};
+const localStorageMock = {
+  getItem: vi.fn((key: string) => store[key] ?? null),
+  setItem: vi.fn((key: string, value: string) => {
+    store[key] = value;
+  }),
+  removeItem: vi.fn((key: string) => {
+    delete store[key];
+  }),
+  clear: vi.fn(() => {
+    for (const key in store) delete store[key];
+  }),
+  get length() {
+    return Object.keys(store).length;
+  },
+  key: vi.fn((i: number) => Object.keys(store)[i] ?? null),
+};
+Object.defineProperty(globalThis, 'localStorage', { value: localStorageMock, writable: true });
+
+beforeEach(() => {
+  localStorageMock.clear();
+  vi.clearAllMocks();
+});
+
+describe('loadSession', () => {
+  it('returns null when localStorage is empty', () => {
+    expect(loadSession()).toBeNull();
+  });
+
+  it('returns null for invalid JSON', () => {
+    store['md-redline-session'] = 'not-json!!!';
+    expect(loadSession()).toBeNull();
+  });
+
+  it('returns null when openTabs is not an array', () => {
+    store['md-redline-session'] = JSON.stringify({ openTabs: 'not-array' });
+    expect(loadSession()).toBeNull();
+  });
+
+  it('returns null when openTabs is missing', () => {
+    store['md-redline-session'] = JSON.stringify({ activeFilePath: '/test.md' });
+    expect(loadSession()).toBeNull();
+  });
+
+  it('returns parsed session when valid', () => {
+    const session = { openTabs: ['/a.md', '/b.md'], activeFilePath: '/a.md' };
+    store['md-redline-session'] = JSON.stringify(session);
+    expect(loadSession()).toEqual(session);
+  });
+
+  it('returns session with empty openTabs array', () => {
+    const session = { openTabs: [], activeFilePath: null };
+    store['md-redline-session'] = JSON.stringify(session);
+    expect(loadSession()).toEqual(session);
+  });
+});

package/src/hooks/useSessionPersistence.ts

@@ -0,0 +1,43 @@
+import { useCallback, useRef, useEffect } from 'react';
+
+export interface SessionState {
+  openTabs: string[];
+  activeFilePath: string | null;
+}
+
+const STORAGE_KEY = 'md-redline-session';
+const DEBOUNCE_MS = 500;
+
+export function loadSession(): SessionState | null {
+  try {
+    const raw = localStorage.getItem(STORAGE_KEY);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw);
+    // Basic shape validation
+    if (!Array.isArray(parsed.openTabs)) return null;
+    return parsed as SessionState;
+  } catch {
+    return null;
+  }
+}
+
+export function useSessionPersistence() {
+  const timerRef = useRef<ReturnType<typeof setTimeout>>(undefined);
+
+  const persist = useCallback((state: SessionState) => {
+    clearTimeout(timerRef.current);
+    timerRef.current = setTimeout(() => {
+      try {
+        localStorage.setItem(STORAGE_KEY, JSON.stringify(state));
+      } catch {
+        // Storage full or unavailable — ignore
+      }
+    }, DEBOUNCE_MS);
+  }, []);
+
+  useEffect(() => {
+    return () => clearTimeout(timerRef.current);
+  }, []);
+
+  return { persist };
+}

package/src/hooks/useTabs.test.ts

@@ -0,0 +1,127 @@
+import { describe, expect, it } from 'vitest';
+import { applyLoadedTabState, applyPendingTabState, type TabState } from './useTabs';
+
+function makeTab(path: string, overrides: Partial<TabState> = {}): TabState {
+  return {
+    filePath: path,
+    rawMarkdown: '',
+    isLoading: true,
+    error: null,
+    lastSaved: null,
+    ...overrides,
+  };
+}
+
+describe('applyLoadedTabState', () => {
+  it('migrates a requested tab to the canonical loaded path', () => {
+    const requestedPath = '/tmp/link.md';
+    const loadedPath = '/tmp/real.md';
+    const prevData = new Map([[requestedPath, makeTab(requestedPath)]]);
+    const result = applyLoadedTabState(
+      prevData,
+      [requestedPath],
+      requestedPath,
+      requestedPath,
+      loadedPath,
+      '# Loaded\n',
+      new Date('2026-03-30T00:00:00.000Z'),
+    );
+
+    expect(result.tabOrder).toEqual([loadedPath]);
+    expect(result.activeFilePath).toBe(loadedPath);
+    expect(result.tabData.has(requestedPath)).toBe(false);
+    expect(result.tabData.get(loadedPath)).toMatchObject({
+      filePath: loadedPath,
+      rawMarkdown: '# Loaded\n',
+      isLoading: false,
+      error: null,
+    });
+  });
+
+  it('deduplicates when the canonical path is already open', () => {
+    const requestedPath = '/tmp/link.md';
+    const loadedPath = '/tmp/real.md';
+    const prevData = new Map<string, TabState>([
+      [loadedPath, makeTab(loadedPath, { rawMarkdown: '# Existing\n', isLoading: false })],
+      [requestedPath, makeTab(requestedPath)],
+    ]);
+    const result = applyLoadedTabState(
+      prevData,
+      [loadedPath, requestedPath],
+      requestedPath,
+      requestedPath,
+      loadedPath,
+      '# Updated\n',
+      new Date('2026-03-30T00:00:00.000Z'),
+    );
+
+    expect(result.tabOrder).toEqual([loadedPath]);
+    expect(result.activeFilePath).toBe(loadedPath);
+    expect(result.tabData.size).toBe(1);
+    expect(result.tabData.get(loadedPath)?.rawMarkdown).toBe('# Updated\n');
+  });
+});
+
+describe('applyPendingTabState', () => {
+  it('preserves session-restore order and active tab for a fast load response', () => {
+    const firstPath = '/tmp/first.md';
+    const secondPath = '/tmp/second.md';
+    const withBackgroundTab = applyPendingTabState(new Map(), [], null, firstPath, false);
+    const withActiveTab = applyPendingTabState(
+      withBackgroundTab.tabData,
+      withBackgroundTab.tabOrder,
+      withBackgroundTab.activeFilePath,
+      secondPath,
+      true,
+    );
+
+    const loaded = applyLoadedTabState(
+      withActiveTab.tabData,
+      withActiveTab.tabOrder,
+      withActiveTab.activeFilePath,
+      secondPath,
+      secondPath,
+      '# Second\n',
+      new Date('2026-03-30T00:00:00.000Z'),
+    );
+
+    expect(loaded.tabOrder).toEqual([firstPath, secondPath]);
+    expect(loaded.activeFilePath).toBe(secondPath);
+    expect(loaded.tabData.get(secondPath)).toMatchObject({
+      filePath: secondPath,
+      rawMarkdown: '# Second\n',
+      isLoading: false,
+      error: null,
+    });
+  });
+});
+
+describe('TabState dirty flag', () => {
+  it('defaults to undefined (not dirty) on new tabs', () => {
+    const path = '/tmp/test.md';
+    const result = applyPendingTabState(new Map(), [], null, path, true);
+    expect(result.tabData.get(path)?.dirty).toBeUndefined();
+  });
+
+  it('is preserved through applyLoadedTabState', () => {
+    const path = '/tmp/test.md';
+    const prevData = new Map([
+      [path, makeTab(path, { dirty: true })],
+    ]);
+    const result = applyLoadedTabState(
+      prevData, [path], path, path, path, '# content', new Date(),
+    );
+    // applyLoadedTabState creates a new TabState without dirty, so it should be undefined
+    expect(result.tabData.get(path)?.dirty).toBeUndefined();
+  });
+
+  it('can be cleared by spreading dirty:false over a dirty tab', () => {
+    // This pattern is used by onExternalChange: external SSE content should
+    // NOT mark the tab dirty since the content already matches disk.
+    const path = '/tmp/test.md';
+    const tab = makeTab(path, { dirty: true, rawMarkdown: '# old' });
+    const updated = { ...tab, rawMarkdown: '# new', dirty: false };
+    expect(updated.dirty).toBe(false);
+    expect(updated.rawMarkdown).toBe('# new');
+  });
+});