Skip to content

fix: duplicate header flash and help menu truncation #955

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
notgitika wants to merge 1 commit into
base: main
Choose a base branch
from
Open

fix: duplicate header flash and help menu truncation #955

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/cli/tui/copy.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ export const COMMAND_DESCRIPTIONS = {
fetch: 'Fetch access info for deployed resources.',
pause: 'Pause an online eval config. Supports --arn for configs outside the project.',
resume: 'Resume a paused online eval config. Supports --arn for configs outside the project.',
run: 'Run on-demand evaluation. Supports --agent-arn for agents outside the project.',
run: 'Run on-demand evaluation.',
import: 'Import a runtime, memory, or starter toolkit into this project. [experimental]',
telemetry: 'Manage anonymous usage analytics preferences.',
update: 'Check for and install CLI updates',
Expand Down
145 changes: 73 additions & 72 deletions src/cli/tui/screens/create/CreateScreen.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -237,75 +237,12 @@ export function CreateScreen({ cwd, isInteractive, onExit, onNavigate }: CreateS
isActive: flow.phase === 'create-prompt',
});

// Checking phase: brief loading state
// Checking phase: instant async check — render nothing to avoid a flash before the real UI
if (flow.phase === 'checking') {
return (
<Screen title="AgentCore Create" onExit={handleExit}>
<Text dimColor>Checking for existing project...</Text>
</Screen>
);
}

// Existing project error phase
if (flow.phase === 'existing-project-error') {
return (
<Screen title="AgentCore Create" onExit={handleExit} helpText="Press Esc to exit">
<Box marginBottom={1} flexDirection="column">
<Text color="red">A project already exists at this location.</Text>
{flow.existingProjectPath && <Text dimColor>Found: {flow.existingProjectPath}</Text>}
<Box marginTop={1}>
<Text>
Use <Text color="cyan">add agent</Text> to create a new agent in the existing project.
</Text>
</Box>
</Box>
</Screen>
);
return null;
}

// Input phase: ask for project name
if (flow.phase === 'input') {
return (
<Screen title="AgentCore Create" onExit={handleExit} helpText={HELP_TEXT.TEXT_INPUT}>
<Box marginBottom={1} flexDirection="column">
<Text>Create a new AgentCore project</Text>
<Text dimColor>This will create a directory with your project name.</Text>
</Box>
<TextInput
prompt="Project name"
initialValue=""
schema={ProjectNameSchema}
customValidation={name => validateFolderNotExists(name, cwd)}
onSubmit={name => {
flow.setProjectName(name);
flow.confirmProjectName();
}}
onCancel={handleExit}
/>
</Screen>
);
}

// Create prompt phase
if (flow.phase === 'create-prompt') {
return (
<Screen title="AgentCore Create" onExit={handleExit} helpText={HELP_TEXT.NAVIGATE_SELECT}>
<Box marginBottom={1}>
<Text>
Project: <Text color={STATUS_COLORS.success}>{flow.projectName}</Text>
</Text>
</Box>
<Box flexDirection="column">
<Text>Would you like to add an agent now?</Text>
<Box marginTop={1}>
<SelectList items={CREATE_PROMPT_ITEMS} selectedIndex={createPromptIndex} />
</Box>
</Box>
</Screen>
);
}

// Create wizard phase - use AddAgentScreen for consistent experience
// Create wizard phase - use AddAgentScreen (separate component, no header conflict)
if (flow.phase === 'create-wizard') {
return (
<AddAgentScreen
Expand All @@ -316,22 +253,84 @@ export function CreateScreen({ cwd, isInteractive, onExit, onNavigate }: CreateS
);
}

// Running/complete phase: show progress
const headerContent = (
// All other phases share a single <Screen> to prevent duplicate header flashes
// when Ink transitions between different <Screen> mounts.
const phase = flow.phase;
const showProjectHeader = phase !== 'input' && phase !== 'existing-project-error';
const headerContent = showProjectHeader ? (
<Box marginTop={1}>
<Text>
Project: <Text color={STATUS_COLORS.success}>{flow.projectName}</Text>
</Text>
</Box>
);

const helpText = flow.hasError || allSuccess ? HELP_TEXT.EXIT : undefined;
) : undefined;

const helpText =
phase === 'existing-project-error'
? 'Press Esc to exit'
: phase === 'input'
? HELP_TEXT.TEXT_INPUT
: phase === 'create-prompt'
? HELP_TEXT.NAVIGATE_SELECT
: flow.hasError || allSuccess
? HELP_TEXT.EXIT
: undefined;

return (
<Screen title="AgentCore Create" onExit={handleExit} headerContent={headerContent} helpText={helpText}>
<StepProgress steps={flow.steps} />
{phase === 'existing-project-error' && (
<Box marginBottom={1} flexDirection="column">
<Text color="red">A project already exists at this location.</Text>
{flow.existingProjectPath && <Text dimColor>Found: {flow.existingProjectPath}</Text>}
<Box marginTop={1}>
<Text>
Use <Text color="cyan">add agent</Text> to create a new agent in the existing project.
</Text>
</Box>
</Box>
)}

{phase === 'input' && (
<>
<Box marginBottom={1} flexDirection="column">
<Text>Create a new AgentCore project</Text>
<Text dimColor>This will create a directory with your project name.</Text>
</Box>
<TextInput
prompt="Project name"
initialValue=""
schema={ProjectNameSchema}
customValidation={name => validateFolderNotExists(name, cwd)}
onSubmit={name => {
flow.setProjectName(name);
flow.confirmProjectName();
}}
onCancel={handleExit}
/>
</>
)}

{phase === 'create-prompt' && (
<>
<Box marginBottom={1}>
<Text>
Project: <Text color={STATUS_COLORS.success}>{flow.projectName}</Text>
</Text>
</Box>
<Box flexDirection="column">
<Text>Would you like to add an agent now?</Text>
<Box marginTop={1}>
<SelectList items={CREATE_PROMPT_ITEMS} selectedIndex={createPromptIndex} />
</Box>
</Box>
</>
)}

{phase === 'running' && <StepProgress steps={flow.steps} />}

{allSuccess && flow.outputDir && (
<Box marginTop={1} flexDirection="column">
<StepProgress steps={flow.steps} />
<CreatedSummary projectName={flow.projectName} agentConfig={flow.addAgentConfig} />
{isInteractive ? (
<Box marginTop={1}>
Expand All @@ -352,8 +351,10 @@ export function CreateScreen({ cwd, isInteractive, onExit, onNavigate }: CreateS
)}
</Box>
)}

{flow.hasError && (
<Box marginTop={1} flexDirection="column">
<StepProgress steps={flow.steps} />
<Text color={STATUS_COLORS.error}>Project creation failed.</Text>
{flow.logFilePath && (
<Box marginTop={1}>
Expand Down
Loading
Loading