summaryrefslogtreecommitdiff
path: root/packages/cli/src/ui/hooks/useInputHistory.ts
blob: 21d7b9bfa43cdb3a83da2753fca72ef0c67937cd (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
/**
 * @license
 * Copyright 2025 Google LLC
 * SPDX-License-Identifier: Apache-2.0
 */

import { useState, useCallback } from 'react';
import { useInput } from 'ink';

interface UseInputHistoryProps {
  userMessages: readonly string[];
  onSubmit: (value: string) => void;
  isActive: boolean;
}

interface UseInputHistoryReturn {
  query: string;
  setQuery: React.Dispatch<React.SetStateAction<string>>;
  handleSubmit: (value: string) => void;
  inputKey: number;
  setInputKey: React.Dispatch<React.SetStateAction<number>>;
}

export function useInputHistory({
  userMessages,
  onSubmit,
  isActive,
}: UseInputHistoryProps): UseInputHistoryReturn {
  const [query, setQuery] = useState('');
  const [historyIndex, setHistoryIndex] = useState<number>(-1);
  const [originalQueryBeforeNav, setOriginalQueryBeforeNav] =
    useState<string>('');
  const [inputKey, setInputKey] = useState<number>(0);

  const resetHistoryNav = useCallback(() => {
    setHistoryIndex(-1);
    setOriginalQueryBeforeNav('');
  }, []);

  const handleSubmit = useCallback(
    (value: string) => {
      const trimmedValue = value.trim();
      if (trimmedValue) {
        onSubmit(trimmedValue);
      }
      setQuery('');
      resetHistoryNav();
    },
    [onSubmit, resetHistoryNav],
  );

  useInput(
    (input, key) => {
      if (!isActive) {
        return;
      }

      let didNavigate = false;

      if (key.upArrow) {
        if (userMessages.length === 0) return;

        let nextIndex = historyIndex;
        if (historyIndex === -1) {
          setOriginalQueryBeforeNav(query);
          nextIndex = 0;
        } else if (historyIndex < userMessages.length - 1) {
          nextIndex = historyIndex + 1;
        } else {
          return;
        }

        if (nextIndex !== historyIndex) {
          setHistoryIndex(nextIndex);
          const newValue = userMessages[userMessages.length - 1 - nextIndex];
          setQuery(newValue);
          setInputKey((k) => k + 1);
          didNavigate = true;
        }
      } else if (key.downArrow) {
        if (historyIndex === -1) return;

        const nextIndex = historyIndex - 1;
        setHistoryIndex(nextIndex);

        if (nextIndex === -1) {
          setQuery(originalQueryBeforeNav);
        } else {
          const newValue = userMessages[userMessages.length - 1 - nextIndex];
          setQuery(newValue);
        }
        setInputKey((k) => k + 1);
        didNavigate = true;
      } else {
        if (historyIndex !== -1 && !didNavigate) {
          if (input || key.backspace || key.delete) {
            resetHistoryNav();
          }
        }
      }
    },
    { isActive },
  );

  return {
    query,
    setQuery,
    handleSubmit,
    inputKey,
    setInputKey,
  };
}