summaryrefslogtreecommitdiff
path: root/packages/cli/src/ui/App.tsx
diff options
context:
space:
mode:
authorTaylor Mullen <[email protected]>2025-04-17 18:06:21 -0400
committerN. Taylor Mullen <[email protected]>2025-04-17 15:29:34 -0700
commitcfc697a96d2e716a75e1c3b7f0f34fce81abaf1e (patch)
treee06bcba67ca71a874048aa887b17457dbd409bdf /packages/cli/src/ui/App.tsx
parent7928c1727f0b208ed34850cc89bbb36ea3dd23e5 (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.tsx153
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;