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
113
114
115
116
117
118
119
120
121
122
123
|
import React, { useState, useEffect } from 'react';
import { Box, Text } from 'ink';
import type { HistoryItem } from './types.js';
import { useGeminiStream } from './hooks/useGeminiStream.js';
import { useLoadingIndicator } from './hooks/useLoadingIndicator.js';
import Header from './components/Header.js';
import Tips from './components/Tips.js';
import HistoryDisplay from './components/HistoryDisplay.js';
import LoadingIndicator from './components/LoadingIndicator.js';
import InputPrompt from './components/InputPrompt.js';
import Footer from './components/Footer.js';
import { StreamingState } from '../core/gemini-stream.js';
import { PartListUnion } from '@google/genai';
interface AppProps {
directory: string;
}
const App = ({ directory }: AppProps) => {
const [query, setQuery] = useState('');
const [history, setHistory] = useState<HistoryItem[]>([]);
const { streamingState, submitQuery, initError } =
useGeminiStream(setHistory);
const { elapsedTime, currentLoadingPhrase } =
useLoadingIndicator(streamingState);
const handleInputSubmit = (value: PartListUnion) => {
submitQuery(value)
.then(() => {
setQuery('');
})
.catch(() => {
setQuery('');
});
};
useEffect(() => {
if (
initError &&
!history.some(
(item) => item.type === 'error' && item.text?.includes(initError),
)
) {
setHistory((prev) => [
...prev,
{
id: Date.now(),
type: 'error',
text: `Initialization Error: ${initError}. Please check API key and configuration.`,
} as HistoryItem,
]);
}
}, [initError, history]);
const isWaitingForToolConfirmation = history.some(
(item) =>
item.type === 'tool_group' &&
item.tools.some((tool) => tool.confirmationDetails !== undefined),
);
const isInputActive = streamingState === StreamingState.Idle && !initError;
return (
<Box flexDirection="column" padding={1} marginBottom={1} width="100%">
<Header cwd={directory} />
<Tips />
{initError &&
streamingState !== StreamingState.Responding &&
!isWaitingForToolConfirmation && (
<Box
borderStyle="round"
borderColor="red"
paddingX={1}
marginBottom={1}
>
{history.find(
(item) => item.type === 'error' && item.text?.includes(initError),
)?.text ? (
<Text color="red">
{
history.find(
(item) =>
item.type === 'error' && item.text?.includes(initError),
)?.text
}
</Text>
) : (
<>
<Text color="red">Initialization Error: {initError}</Text>
<Text color="red">
{' '}
Please check API key and configuration.
</Text>
</>
)}
</Box>
)}
<Box flexDirection="column">
<HistoryDisplay history={history} onSubmit={handleInputSubmit} />
<LoadingIndicator
isLoading={streamingState === StreamingState.Responding}
currentLoadingPhrase={currentLoadingPhrase}
elapsedTime={elapsedTime}
/>
</Box>
{!isWaitingForToolConfirmation && isInputActive && (
<InputPrompt
query={query}
setQuery={setQuery}
onSubmit={handleInputSubmit}
isActive={isInputActive}
/>
)}
<Footer queryLength={query.length} />
</Box>
);
};
export default App;
|
