diff options
| author | Taylor Mullen <[email protected]> | 2025-04-17 18:06:21 -0400 |
|---|---|---|
| committer | N. Taylor Mullen <[email protected]> | 2025-04-17 15:29:34 -0700 |
| commit | cfc697a96d2e716a75e1c3b7f0f34fce81abaf1e (patch) | |
| tree | e06bcba67ca71a874048aa887b17457dbd409bdf /packages/cli/src/ui/App.tsx | |
| parent | 7928c1727f0b208ed34850cc89bbb36ea3dd23e5 (diff) | |
Run `npm run format`
- Also updated README.md accordingly.
Part of https://b.corp.google.com/issues/411384603
Diffstat (limited to 'packages/cli/src/ui/App.tsx')
| -rw-r--r-- | packages/cli/src/ui/App.tsx | 153 |
1 files changed, 93 insertions, 60 deletions
diff --git a/packages/cli/src/ui/App.tsx b/packages/cli/src/ui/App.tsx index 9a2ee49d..1bc0f6c6 100644 --- a/packages/cli/src/ui/App.tsx +++ b/packages/cli/src/ui/App.tsx @@ -13,78 +13,111 @@ import { StreamingState } from '../core/gemini-stream.js'; import { PartListUnion } from '@google/genai'; interface AppProps { - directory: string; + 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 [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(''); - }); - }; + 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]); + 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; + 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} /> - return ( - <Box flexDirection="column" padding={1} marginBottom={1} width="100%"> - <Header cwd={directory} /> + <Tips /> - <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> + {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> + <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} - /> - )} + {!isWaitingForToolConfirmation && isInputActive && ( + <InputPrompt + query={query} + setQuery={setQuery} + onSubmit={handleInputSubmit} + isActive={isInputActive} + /> + )} - <Footer queryLength={query.length} /> - </Box> - ); + <Footer queryLength={query.length} /> + </Box> + ); }; -export default App;
\ No newline at end of file +export default App; |
