91 lines
2.1 KiB
TypeScript
91 lines
2.1 KiB
TypeScript
import { Box, Text, useInput } from "ink";
|
|
import { useState } from "react";
|
|
import { DEFAULT_AGENT_NAME } from "../../constants";
|
|
import { colors } from "./colors";
|
|
import { PasteAwareTextInput } from "./PasteAwareTextInput";
|
|
import { validateAgentName } from "./PinDialog";
|
|
|
|
interface NewAgentDialogProps {
|
|
onSubmit: (name: string) => void;
|
|
onCancel: () => void;
|
|
}
|
|
|
|
export function NewAgentDialog({ onSubmit, onCancel }: NewAgentDialogProps) {
|
|
const [nameInput, setNameInput] = useState("");
|
|
const [error, setError] = useState("");
|
|
|
|
useInput((input, key) => {
|
|
// CTRL-C: immediately cancel
|
|
if (key.ctrl && input === "c") {
|
|
onCancel();
|
|
return;
|
|
}
|
|
|
|
if (key.escape) {
|
|
onCancel();
|
|
}
|
|
});
|
|
|
|
const handleNameSubmit = (text: string) => {
|
|
const trimmed = text.trim();
|
|
|
|
// Empty input = use default name
|
|
if (!trimmed) {
|
|
onSubmit(DEFAULT_AGENT_NAME);
|
|
return;
|
|
}
|
|
|
|
const validationError = validateAgentName(trimmed);
|
|
if (validationError) {
|
|
setError(validationError);
|
|
return;
|
|
}
|
|
|
|
onSubmit(trimmed);
|
|
};
|
|
|
|
return (
|
|
<Box flexDirection="column" paddingY={1}>
|
|
<Box marginBottom={1}>
|
|
<Text color={colors.approval.header} bold>
|
|
Create new agent
|
|
</Text>
|
|
</Box>
|
|
|
|
<Box marginBottom={1}>
|
|
<Text dimColor>
|
|
Enter a name for your new agent, or press Enter for default.
|
|
</Text>
|
|
</Box>
|
|
|
|
<Box flexDirection="column" marginBottom={1}>
|
|
<Box marginBottom={1}>
|
|
<Text>Agent name:</Text>
|
|
</Box>
|
|
<Box>
|
|
<Text color={colors.approval.header}>> </Text>
|
|
<PasteAwareTextInput
|
|
value={nameInput}
|
|
onChange={(val) => {
|
|
setNameInput(val);
|
|
setError("");
|
|
}}
|
|
onSubmit={handleNameSubmit}
|
|
placeholder={DEFAULT_AGENT_NAME}
|
|
/>
|
|
</Box>
|
|
</Box>
|
|
|
|
{error && (
|
|
<Box marginBottom={1}>
|
|
<Text color="red">{error}</Text>
|
|
</Box>
|
|
)}
|
|
|
|
<Box>
|
|
<Text dimColor>Press Enter to create • Esc to cancel</Text>
|
|
</Box>
|
|
</Box>
|
|
);
|
|
}
|