summaryrefslogtreecommitdiff
path: root/packages/cli/src/ui/components
diff options
context:
space:
mode:
Diffstat (limited to 'packages/cli/src/ui/components')
-rw-r--r--packages/cli/src/ui/components/Footer.tsx12
-rw-r--r--packages/cli/src/ui/components/Header.tsx38
-rw-r--r--packages/cli/src/ui/components/HistoryDisplay.tsx37
-rw-r--r--packages/cli/src/ui/components/InputPrompt.tsx4
-rw-r--r--packages/cli/src/ui/components/Tips.tsx26
-rw-r--r--packages/cli/src/ui/components/messages/ToolGroupMessage.tsx34
6 files changed, 73 insertions, 78 deletions
diff --git a/packages/cli/src/ui/components/Footer.tsx b/packages/cli/src/ui/components/Footer.tsx
index 6b069a2f..f2afc1bd 100644
--- a/packages/cli/src/ui/components/Footer.tsx
+++ b/packages/cli/src/ui/components/Footer.tsx
@@ -6,12 +6,12 @@ interface FooterProps {
}
const Footer: React.FC<FooterProps> = ({ queryLength }) => (
- <Box marginTop={1} justifyContent="space-between">
- <Box minWidth={15}>
- <Text color="gray">{queryLength === 0 ? '? for shortcuts' : ''}</Text>
- </Box>
- <Text color="blue">Gemini</Text>
+ <Box marginTop={1} justifyContent="space-between">
+ <Box minWidth={15}>
+ <Text color="gray">{queryLength === 0 ? '? for shortcuts' : ''}</Text>
</Box>
- );
+ <Text color="blue">Gemini</Text>
+ </Box>
+);
export default Footer;
diff --git a/packages/cli/src/ui/components/Header.tsx b/packages/cli/src/ui/components/Header.tsx
index d3f0f9d5..f8f7d27e 100644
--- a/packages/cli/src/ui/components/Header.tsx
+++ b/packages/cli/src/ui/components/Header.tsx
@@ -8,31 +8,31 @@ interface HeaderProps {
}
const Header: React.FC<HeaderProps> = ({ cwd }) => (
- <>
- {/* Static Header Art */}
- <Box marginBottom={1}>
- <Text color="blue">{`
+ <>
+ {/* Static Header Art */}
+ <Box marginBottom={1}>
+ <Text color="blue">{`
______ ________ ____ ____ _____ ____ _____ _____
.' ___ ||_ __ ||_ \\ / _||_ _||_ \\|_ _||_ _|
/ .' \\_| | |_ \\_| | \\/ | | | | \\ | | | |
| | ____ | _| _ | |\\ /| | | | | |\\ \\| | | |
\\ \`.___] |_| |__/ | _| |_\\/_| |_ _| |_ _| |_\\ |_ _| |_
\`._____.'|________||_____||_____||_____||_____|\\____||_____|`}</Text>
+ </Box>
+ {/* CWD Display */}
+ <Box
+ borderStyle="round"
+ borderColor="blue"
+ paddingX={BOX_PADDING_X}
+ flexDirection="column"
+ marginBottom={1}
+ width={UI_WIDTH}
+ >
+ <Box paddingLeft={2}>
+ <Text color="gray">cwd: {shortenPath(cwd, /*maxLength*/ 70)}</Text>
</Box>
- {/* CWD Display */}
- <Box
- borderStyle="round"
- borderColor="blue"
- paddingX={BOX_PADDING_X}
- flexDirection="column"
- marginBottom={1}
- width={UI_WIDTH}
- >
- <Box paddingLeft={2}>
- <Text color="gray">cwd: {shortenPath(cwd, /*maxLength*/ 70)}</Text>
- </Box>
- </Box>
- </>
- );
+ </Box>
+ </>
+);
export default Header;
diff --git a/packages/cli/src/ui/components/HistoryDisplay.tsx b/packages/cli/src/ui/components/HistoryDisplay.tsx
index fe0bf4c1..7565c5bc 100644
--- a/packages/cli/src/ui/components/HistoryDisplay.tsx
+++ b/packages/cli/src/ui/components/HistoryDisplay.tsx
@@ -17,26 +17,23 @@ interface HistoryDisplayProps {
const HistoryDisplay: React.FC<HistoryDisplayProps> = ({
history,
onSubmit,
-}) =>
+}) => (
// No grouping logic needed here anymore
- (
- <Box flexDirection="column">
- {history.map((item) => (
- <Box key={item.id} marginBottom={1}>
- {/* Render standard message types */}
- {item.type === 'user' && <UserMessage text={item.text} />}
- {item.type === 'gemini' && <GeminiMessage text={item.text} />}
- {item.type === 'info' && <InfoMessage text={item.text} />}
- {item.type === 'error' && <ErrorMessage text={item.text} />}
-
- {/* Render the tool group component */}
- {item.type === 'tool_group' && (
- <ToolGroupMessage toolCalls={item.tools} onSubmit={onSubmit} />
- )}
- </Box>
- ))}
- </Box>
- )
-;
+ <Box flexDirection="column">
+ {history.map((item) => (
+ <Box key={item.id} marginBottom={1}>
+ {/* Render standard message types */}
+ {item.type === 'user' && <UserMessage text={item.text} />}
+ {item.type === 'gemini' && <GeminiMessage text={item.text} />}
+ {item.type === 'info' && <InfoMessage text={item.text} />}
+ {item.type === 'error' && <ErrorMessage text={item.text} />}
+ {/* Render the tool group component */}
+ {item.type === 'tool_group' && (
+ <ToolGroupMessage toolCalls={item.tools} onSubmit={onSubmit} />
+ )}
+ </Box>
+ ))}
+ </Box>
+);
export default HistoryDisplay;
diff --git a/packages/cli/src/ui/components/InputPrompt.tsx b/packages/cli/src/ui/components/InputPrompt.tsx
index 1102e75d..96089eec 100644
--- a/packages/cli/src/ui/components/InputPrompt.tsx
+++ b/packages/cli/src/ui/components/InputPrompt.tsx
@@ -3,8 +3,6 @@ import { Box, Text } from 'ink';
import TextInput from 'ink-text-input';
import { globalConfig } from '../../config/config.js';
-
-
interface InputPromptProps {
query: string;
setQuery: (value: string) => void;
@@ -34,6 +32,6 @@ const InputPrompt: React.FC<InputPromptProps> = ({
</Box>
</Box>
);
-}
+};
export default InputPrompt;
diff --git a/packages/cli/src/ui/components/Tips.tsx b/packages/cli/src/ui/components/Tips.tsx
index 6be53360..aa8d39d6 100644
--- a/packages/cli/src/ui/components/Tips.tsx
+++ b/packages/cli/src/ui/components/Tips.tsx
@@ -3,18 +3,18 @@ import { Box, Text } from 'ink';
import { UI_WIDTH } from '../constants.js';
const Tips: React.FC = () => (
- <Box flexDirection="column" marginBottom={1} width={UI_WIDTH}>
- <Text>Tips for getting started:</Text>
- <Text>
- 1. <Text bold>/help</Text> for more information.
- </Text>
- <Text>
- 2. <Text bold>/init</Text> to create a GEMINI.md for instructions &
- context.
- </Text>
- <Text>3. Ask coding questions, edit code or run commands.</Text>
- <Text>4. Be specific for the best results.</Text>
- </Box>
- );
+ <Box flexDirection="column" marginBottom={1} width={UI_WIDTH}>
+ <Text>Tips for getting started:</Text>
+ <Text>
+ 1. <Text bold>/help</Text> for more information.
+ </Text>
+ <Text>
+ 2. <Text bold>/init</Text> to create a GEMINI.md for instructions &
+ context.
+ </Text>
+ <Text>3. Ask coding questions, edit code or run commands.</Text>
+ <Text>4. Be specific for the best results.</Text>
+ </Box>
+);
export default Tips;
diff --git a/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx b/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx
index 6627faee..6644cd5f 100644
--- a/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx
+++ b/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx
@@ -21,23 +21,23 @@ const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
return (
<Box flexDirection="column" borderStyle="round" borderColor={borderColor}>
{toolCalls.map((tool) => (
- <React.Fragment key={tool.callId}>
- <ToolMessage
- key={tool.callId} // Use callId as the key
- name={tool.name}
- description={tool.description}
- resultDisplay={tool.resultDisplay}
- status={tool.status}
- />
- {tool.status === ToolCallStatus.Confirming &&
- tool.confirmationDetails && (
- <ToolConfirmationMessage
- confirmationDetails={tool.confirmationDetails}
- onSubmit={onSubmit}
- ></ToolConfirmationMessage>
- )}
- </React.Fragment>
- ))}
+ <React.Fragment key={tool.callId}>
+ <ToolMessage
+ key={tool.callId} // Use callId as the key
+ name={tool.name}
+ description={tool.description}
+ resultDisplay={tool.resultDisplay}
+ status={tool.status}
+ />
+ {tool.status === ToolCallStatus.Confirming &&
+ tool.confirmationDetails && (
+ <ToolConfirmationMessage
+ confirmationDetails={tool.confirmationDetails}
+ onSubmit={onSubmit}
+ ></ToolConfirmationMessage>
+ )}
+ </React.Fragment>
+ ))}
{/* Optional: Add padding below the last item if needed,
though ToolMessage already has some vertical space implicitly */}
{/* {tools.length > 0 && <Box height={1} />} */}