fss-link 1.0.40 → 1.0.45

package/dist/ui/hooks/useCommandCompletion.tsx

@@ -0,0 +1,238 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { useCallback, useMemo, useEffect } from 'react';
+import { Suggestion } from '../components/SuggestionsDisplay.js';
+import { CommandContext, SlashCommand } from '../commands/types.js';
+import {
+  logicalPosToOffset,
+  TextBuffer,
+} from '../components/shared/text-buffer.js';
+import { isSlashCommand } from '../utils/commandUtils.js';
+import { toCodePoints } from '../utils/textUtils.js';
+import { useAtCompletion } from './useAtCompletion.js';
+import { useSlashCompletion } from './useSlashCompletion.js';
+import { Config } from 'fss-link-core';
+import { useCompletion } from './useCompletion.js';
+
+export enum CompletionMode {
+  IDLE = 'IDLE',
+  AT = 'AT',
+  SLASH = 'SLASH',
+}
+
+export interface UseCommandCompletionReturn {
+  suggestions: Suggestion[];
+  activeSuggestionIndex: number;
+  visibleStartIndex: number;
+  showSuggestions: boolean;
+  isLoadingSuggestions: boolean;
+  isPerfectMatch: boolean;
+  setActiveSuggestionIndex: React.Dispatch<React.SetStateAction<number>>;
+  setShowSuggestions: React.Dispatch<React.SetStateAction<boolean>>;
+  resetCompletionState: () => void;
+  navigateUp: () => void;
+  navigateDown: () => void;
+  handleAutocomplete: (indexToUse: number) => void;
+}
+
+export function useCommandCompletion(
+  buffer: TextBuffer,
+  dirs: readonly string[],
+  cwd: string,
+  slashCommands: readonly SlashCommand[],
+  commandContext: CommandContext,
+  reverseSearchActive: boolean = false,
+  config?: Config,
+): UseCommandCompletionReturn {
+  const {
+    suggestions,
+    activeSuggestionIndex,
+    visibleStartIndex,
+    showSuggestions,
+    isLoadingSuggestions,
+    isPerfectMatch,
+
+    setSuggestions,
+    setShowSuggestions,
+    setActiveSuggestionIndex,
+    setIsLoadingSuggestions,
+    setIsPerfectMatch,
+    setVisibleStartIndex,
+
+    resetCompletionState,
+    navigateUp,
+    navigateDown,
+  } = useCompletion();
+
+  const cursorRow = buffer.cursor[0];
+  const cursorCol = buffer.cursor[1];
+
+  const { completionMode, query, completionStart, completionEnd } =
+    useMemo(() => {
+      const currentLine = buffer.lines[cursorRow] || '';
+      if (cursorRow === 0 && isSlashCommand(currentLine.trim())) {
+        return {
+          completionMode: CompletionMode.SLASH,
+          query: currentLine,
+          completionStart: 0,
+          completionEnd: currentLine.length,
+        };
+      }
+
+      const codePoints = toCodePoints(currentLine);
+      for (let i = cursorCol - 1; i >= 0; i--) {
+        const char = codePoints[i];
+
+        if (char === ' ') {
+          let backslashCount = 0;
+          for (let j = i - 1; j >= 0 && codePoints[j] === '\\'; j--) {
+            backslashCount++;
+          }
+          if (backslashCount % 2 === 0) {
+            return {
+              completionMode: CompletionMode.IDLE,
+              query: null,
+              completionStart: -1,
+              completionEnd: -1,
+            };
+          }
+        } else if (char === '@') {
+          let end = codePoints.length;
+          for (let i = cursorCol; i < codePoints.length; i++) {
+            if (codePoints[i] === ' ') {
+              let backslashCount = 0;
+              for (let j = i - 1; j >= 0 && codePoints[j] === '\\'; j--) {
+                backslashCount++;
+              }
+
+              if (backslashCount % 2 === 0) {
+                end = i;
+                break;
+              }
+            }
+          }
+          const pathStart = i + 1;
+          const partialPath = currentLine.substring(pathStart, end);
+          return {
+            completionMode: CompletionMode.AT,
+            query: partialPath,
+            completionStart: pathStart,
+            completionEnd: end,
+          };
+        }
+      }
+      return {
+        completionMode: CompletionMode.IDLE,
+        query: null,
+        completionStart: -1,
+        completionEnd: -1,
+      };
+    }, [cursorRow, cursorCol, buffer.lines]);
+
+  useAtCompletion({
+    enabled: completionMode === CompletionMode.AT,
+    pattern: query || '',
+    config,
+    cwd,
+    setSuggestions,
+    setIsLoadingSuggestions,
+  });
+
+  const slashCompletionRange = useSlashCompletion({
+    enabled: completionMode === CompletionMode.SLASH,
+    query,
+    slashCommands,
+    commandContext,
+    setSuggestions,
+    setIsLoadingSuggestions,
+    setIsPerfectMatch,
+  });
+
+  useEffect(() => {
+    setActiveSuggestionIndex(suggestions.length > 0 ? 0 : -1);
+    setVisibleStartIndex(0);
+  }, [suggestions, setActiveSuggestionIndex, setVisibleStartIndex]);
+
+  useEffect(() => {
+    if (completionMode === CompletionMode.IDLE || reverseSearchActive) {
+      resetCompletionState();
+      return;
+    }
+    // Show suggestions if we are loading OR if there are results to display.
+    setShowSuggestions(isLoadingSuggestions || suggestions.length > 0);
+  }, [
+    completionMode,
+    suggestions.length,
+    isLoadingSuggestions,
+    reverseSearchActive,
+    resetCompletionState,
+    setShowSuggestions,
+  ]);
+
+  const handleAutocomplete = useCallback(
+    (indexToUse: number) => {
+      if (indexToUse < 0 || indexToUse >= suggestions.length) {
+        return;
+      }
+      const suggestion = suggestions[indexToUse].value;
+
+      let start = completionStart;
+      let end = completionEnd;
+      if (completionMode === CompletionMode.SLASH) {
+        start = slashCompletionRange.completionStart;
+        end = slashCompletionRange.completionEnd;
+      }
+
+      if (start === -1 || end === -1) {
+        return;
+      }
+
+      let suggestionText = suggestion;
+      if (completionMode === CompletionMode.SLASH) {
+        if (
+          start === end &&
+          start > 1 &&
+          (buffer.lines[cursorRow] || '')[start - 1] !== ' '
+        ) {
+          suggestionText = ' ' + suggestionText;
+        }
+      }
+
+      suggestionText += ' ';
+
+      buffer.replaceRangeByOffset(
+        logicalPosToOffset(buffer.lines, cursorRow, start),
+        logicalPosToOffset(buffer.lines, cursorRow, end),
+        suggestionText,
+      );
+    },
+    [
+      cursorRow,
+      buffer,
+      suggestions,
+      completionMode,
+      completionStart,
+      completionEnd,
+      slashCompletionRange,
+    ],
+  );
+
+  return {
+    suggestions,
+    activeSuggestionIndex,
+    visibleStartIndex,
+    showSuggestions,
+    isLoadingSuggestions,
+    isPerfectMatch,
+    setActiveSuggestionIndex,
+    setShowSuggestions,
+    resetCompletionState,
+    navigateUp,
+    navigateDown,
+    handleAutocomplete,
+  };
+}

package/dist/ui/hooks/useCompletion.ts

@@ -0,0 +1,128 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { useState, useCallback } from 'react';
+
+import {
+  MAX_SUGGESTIONS_TO_SHOW,
+  Suggestion,
+} from '../components/SuggestionsDisplay.js';
+
+export interface UseCompletionReturn {
+  suggestions: Suggestion[];
+  activeSuggestionIndex: number;
+  visibleStartIndex: number;
+  showSuggestions: boolean;
+  isLoadingSuggestions: boolean;
+  isPerfectMatch: boolean;
+  setSuggestions: React.Dispatch<React.SetStateAction<Suggestion[]>>;
+  setActiveSuggestionIndex: React.Dispatch<React.SetStateAction<number>>;
+  setVisibleStartIndex: React.Dispatch<React.SetStateAction<number>>;
+  setIsLoadingSuggestions: React.Dispatch<React.SetStateAction<boolean>>;
+  setIsPerfectMatch: React.Dispatch<React.SetStateAction<boolean>>;
+  setShowSuggestions: React.Dispatch<React.SetStateAction<boolean>>;
+  resetCompletionState: () => void;
+  navigateUp: () => void;
+  navigateDown: () => void;
+}
+
+export function useCompletion(): UseCompletionReturn {
+  const [suggestions, setSuggestions] = useState<Suggestion[]>([]);
+  const [activeSuggestionIndex, setActiveSuggestionIndex] =
+    useState<number>(-1);
+  const [visibleStartIndex, setVisibleStartIndex] = useState<number>(0);
+  const [showSuggestions, setShowSuggestions] = useState<boolean>(false);
+  const [isLoadingSuggestions, setIsLoadingSuggestions] =
+    useState<boolean>(false);
+  const [isPerfectMatch, setIsPerfectMatch] = useState<boolean>(false);
+
+  const resetCompletionState = useCallback(() => {
+    setSuggestions([]);
+    setActiveSuggestionIndex(-1);
+    setVisibleStartIndex(0);
+    setShowSuggestions(false);
+    setIsLoadingSuggestions(false);
+    setIsPerfectMatch(false);
+  }, []);
+
+  const navigateUp = useCallback(() => {
+    if (suggestions.length === 0) return;
+
+    setActiveSuggestionIndex((prevActiveIndex) => {
+      // Calculate new active index, handling wrap-around
+      const newActiveIndex =
+        prevActiveIndex <= 0 ? suggestions.length - 1 : prevActiveIndex - 1;
+
+      // Adjust scroll position based on the new active index
+      setVisibleStartIndex((prevVisibleStart) => {
+        // Case 1: Wrapped around to the last item
+        if (
+          newActiveIndex === suggestions.length - 1 &&
+          suggestions.length > MAX_SUGGESTIONS_TO_SHOW
+        ) {
+          return Math.max(0, suggestions.length - MAX_SUGGESTIONS_TO_SHOW);
+        }
+        // Case 2: Scrolled above the current visible window
+        if (newActiveIndex < prevVisibleStart) {
+          return newActiveIndex;
+        }
+        // Otherwise, keep the current scroll position
+        return prevVisibleStart;
+      });
+
+      return newActiveIndex;
+    });
+  }, [suggestions.length]);
+
+  const navigateDown = useCallback(() => {
+    if (suggestions.length === 0) return;
+
+    setActiveSuggestionIndex((prevActiveIndex) => {
+      // Calculate new active index, handling wrap-around
+      const newActiveIndex =
+        prevActiveIndex >= suggestions.length - 1 ? 0 : prevActiveIndex + 1;
+
+      // Adjust scroll position based on the new active index
+      setVisibleStartIndex((prevVisibleStart) => {
+        // Case 1: Wrapped around to the first item
+        if (
+          newActiveIndex === 0 &&
+          suggestions.length > MAX_SUGGESTIONS_TO_SHOW
+        ) {
+          return 0;
+        }
+        // Case 2: Scrolled below the current visible window
+        const visibleEndIndex = prevVisibleStart + MAX_SUGGESTIONS_TO_SHOW;
+        if (newActiveIndex >= visibleEndIndex) {
+          return newActiveIndex - MAX_SUGGESTIONS_TO_SHOW + 1;
+        }
+        // Otherwise, keep the current scroll position
+        return prevVisibleStart;
+      });
+
+      return newActiveIndex;
+    });
+  }, [suggestions.length]);
+  return {
+    suggestions,
+    activeSuggestionIndex,
+    visibleStartIndex,
+    showSuggestions,
+    isLoadingSuggestions,
+    isPerfectMatch,
+
+    setSuggestions,
+    setShowSuggestions,
+    setActiveSuggestionIndex,
+    setVisibleStartIndex,
+    setIsLoadingSuggestions,
+    setIsPerfectMatch,
+
+    resetCompletionState,
+    navigateUp,
+    navigateDown,
+  };
+}

package/dist/ui/hooks/useConsoleMessages.test.ts

@@ -0,0 +1,147 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { act, renderHook } from '@testing-library/react';
+import { vi } from 'vitest';
+import { useConsoleMessages } from './useConsoleMessages';
+import { useCallback } from 'react';
+
+describe('useConsoleMessages', () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+  });
+
+  afterEach(() => {
+    vi.runOnlyPendingTimers();
+    vi.useRealTimers();
+  });
+
+  const useTestableConsoleMessages = () => {
+    const { handleNewMessage, ...rest } = useConsoleMessages();
+    const log = useCallback(
+      (content: string) => handleNewMessage({ type: 'log', content, count: 1 }),
+      [handleNewMessage],
+    );
+    const error = useCallback(
+      (content: string) =>
+        handleNewMessage({ type: 'error', content, count: 1 }),
+      [handleNewMessage],
+    );
+    return {
+      ...rest,
+      log,
+      error,
+      clearConsoleMessages: rest.clearConsoleMessages,
+    };
+  };
+
+  it('should initialize with an empty array of console messages', () => {
+    const { result } = renderHook(() => useTestableConsoleMessages());
+    expect(result.current.consoleMessages).toEqual([]);
+  });
+
+  it('should add a new message when log is called', async () => {
+    const { result } = renderHook(() => useTestableConsoleMessages());
+
+    act(() => {
+      result.current.log('Test message');
+    });
+
+    await act(async () => {
+      await vi.advanceTimersByTimeAsync(20);
+    });
+
+    expect(result.current.consoleMessages).toEqual([
+      { type: 'log', content: 'Test message', count: 1 },
+    ]);
+  });
+
+  it('should batch and count identical consecutive messages', async () => {
+    const { result } = renderHook(() => useTestableConsoleMessages());
+
+    act(() => {
+      result.current.log('Test message');
+      result.current.log('Test message');
+      result.current.log('Test message');
+    });
+
+    await act(async () => {
+      await vi.advanceTimersByTimeAsync(20);
+    });
+
+    expect(result.current.consoleMessages).toEqual([
+      { type: 'log', content: 'Test message', count: 3 },
+    ]);
+  });
+
+  it('should not batch different messages', async () => {
+    const { result } = renderHook(() => useTestableConsoleMessages());
+
+    act(() => {
+      result.current.log('First message');
+      result.current.error('Second message');
+    });
+
+    await act(async () => {
+      await vi.advanceTimersByTimeAsync(20);
+    });
+
+    expect(result.current.consoleMessages).toEqual([
+      { type: 'log', content: 'First message', count: 1 },
+      { type: 'error', content: 'Second message', count: 1 },
+    ]);
+  });
+
+  it('should clear all messages when clearConsoleMessages is called', async () => {
+    const { result } = renderHook(() => useTestableConsoleMessages());
+
+    act(() => {
+      result.current.log('A message');
+    });
+
+    await act(async () => {
+      await vi.advanceTimersByTimeAsync(20);
+    });
+
+    expect(result.current.consoleMessages).toHaveLength(1);
+
+    act(() => {
+      result.current.clearConsoleMessages();
+    });
+
+    expect(result.current.consoleMessages).toHaveLength(0);
+  });
+
+  it('should clear the pending timeout when clearConsoleMessages is called', () => {
+    const { result } = renderHook(() => useTestableConsoleMessages());
+    const clearTimeoutSpy = vi.spyOn(global, 'clearTimeout');
+
+    act(() => {
+      result.current.log('A message');
+    });
+
+    act(() => {
+      result.current.clearConsoleMessages();
+    });
+
+    expect(clearTimeoutSpy).toHaveBeenCalled();
+    clearTimeoutSpy.mockRestore();
+  });
+
+  it('should clean up the timeout on unmount', () => {
+    const { result, unmount } = renderHook(() => useTestableConsoleMessages());
+    const clearTimeoutSpy = vi.spyOn(global, 'clearTimeout');
+
+    act(() => {
+      result.current.log('A message');
+    });
+
+    unmount();
+
+    expect(clearTimeoutSpy).toHaveBeenCalled();
+    clearTimeoutSpy.mockRestore();
+  });
+});

package/dist/ui/hooks/useConsoleMessages.ts

@@ -0,0 +1,110 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import {
+  useCallback,
+  useEffect,
+  useReducer,
+  useRef,
+  useTransition,
+} from 'react';
+import { ConsoleMessageItem } from '../types.js';
+
+export interface UseConsoleMessagesReturn {
+  consoleMessages: ConsoleMessageItem[];
+  handleNewMessage: (message: ConsoleMessageItem) => void;
+  clearConsoleMessages: () => void;
+}
+
+type Action =
+  | { type: 'ADD_MESSAGES'; payload: ConsoleMessageItem[] }
+  | { type: 'CLEAR' };
+
+function consoleMessagesReducer(
+  state: ConsoleMessageItem[],
+  action: Action,
+): ConsoleMessageItem[] {
+  switch (action.type) {
+    case 'ADD_MESSAGES': {
+      const newMessages = [...state];
+      for (const queuedMessage of action.payload) {
+        const lastMessage = newMessages[newMessages.length - 1];
+        if (
+          lastMessage &&
+          lastMessage.type === queuedMessage.type &&
+          lastMessage.content === queuedMessage.content
+        ) {
+          // Create a new object for the last message to ensure React detects
+          // the change, preventing mutation of the existing state object.
+          newMessages[newMessages.length - 1] = {
+            ...lastMessage,
+            count: lastMessage.count + 1,
+          };
+        } else {
+          newMessages.push({ ...queuedMessage, count: 1 });
+        }
+      }
+      return newMessages;
+    }
+    case 'CLEAR':
+      return [];
+    default:
+      return state;
+  }
+}
+
+export function useConsoleMessages(): UseConsoleMessagesReturn {
+  const [consoleMessages, dispatch] = useReducer(consoleMessagesReducer, []);
+  const messageQueueRef = useRef<ConsoleMessageItem[]>([]);
+  const timeoutRef = useRef<NodeJS.Timeout | null>(null);
+  const [, startTransition] = useTransition();
+
+  const processQueue = useCallback(() => {
+    if (messageQueueRef.current.length > 0) {
+      const messagesToProcess = messageQueueRef.current;
+      messageQueueRef.current = [];
+      startTransition(() => {
+        dispatch({ type: 'ADD_MESSAGES', payload: messagesToProcess });
+      });
+    }
+    timeoutRef.current = null;
+  }, []);
+
+  const handleNewMessage = useCallback(
+    (message: ConsoleMessageItem) => {
+      messageQueueRef.current.push(message);
+      if (!timeoutRef.current) {
+        // Batch updates using a timeout. 16ms is a reasonable delay to batch
+        // rapid-fire messages without noticeable lag.
+        timeoutRef.current = setTimeout(processQueue, 16);
+      }
+    },
+    [processQueue],
+  );
+
+  const clearConsoleMessages = useCallback(() => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
+    messageQueueRef.current = [];
+    startTransition(() => {
+      dispatch({ type: 'CLEAR' });
+    });
+  }, []);
+
+  // Cleanup on unmount
+  useEffect(
+    () => () => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+    },
+    [],
+  );
+
+  return { consoleMessages, handleNewMessage, clearConsoleMessages };
+}