diff --git a/src/browser/components/ChatInput/CreationCenterContent.tsx b/src/browser/components/ChatInput/CreationCenterContent.tsx
index 3db11368d2..ceb480201f 100644
--- a/src/browser/components/ChatInput/CreationCenterContent.tsx
+++ b/src/browser/components/ChatInput/CreationCenterContent.tsx
@@ -3,38 +3,36 @@ import React from "react";
interface CreationCenterContentProps {
projectName: string;
isSending: boolean;
- inputPreview?: string;
+ /** The confirmed workspace name (null while name generation is in progress) */
+ workspaceName?: string | null;
}
/**
* Center content displayed during workspace creation
- * Shows either a loading state with the user's prompt or welcome message
+ * Shows either a loading state with the workspace name or welcome message
*/
export function CreationCenterContent(props: CreationCenterContentProps) {
- // Truncate long prompts for preview display
- const truncatedPreview =
- props.inputPreview && props.inputPreview.length > 150
- ? props.inputPreview.slice(0, 150) + "..."
- : props.inputPreview;
-
return (
- Describe what you want to build. A new workspace will be created with an automatically
- generated branch name. Configure runtime and model options below.
+ Describe what you want to build and a workspace will be created.
)}
diff --git a/src/browser/components/ChatInput/CreationControls.tsx b/src/browser/components/ChatInput/CreationControls.tsx
index dd01b02022..00c99dcc71 100644
--- a/src/browser/components/ChatInput/CreationControls.tsx
+++ b/src/browser/components/ChatInput/CreationControls.tsx
@@ -1,7 +1,11 @@
-import React from "react";
+import React, { useCallback } from "react";
import { RUNTIME_MODE, type RuntimeMode } from "@/common/types/runtime";
import { Select } from "../Select";
import { RuntimeIconSelector } from "../RuntimeIconSelector";
+import { Loader2, Wand2 } from "lucide-react";
+import { cn } from "@/common/lib/utils";
+import { Tooltip, TooltipWrapper } from "../Tooltip";
+import type { WorkspaceNameState } from "@/browser/hooks/useWorkspaceName";
interface CreationControlsProps {
branches: string[];
@@ -10,68 +14,144 @@ interface CreationControlsProps {
runtimeMode: RuntimeMode;
defaultRuntimeMode: RuntimeMode;
sshHost: string;
- /** Called when user clicks a runtime icon to select it (does not persist) */
onRuntimeModeChange: (mode: RuntimeMode) => void;
- /** Called when user checks "Default for project" checkbox (persists) */
onSetDefaultRuntime: (mode: RuntimeMode) => void;
- /** Called when user changes SSH host */
onSshHostChange: (host: string) => void;
disabled: boolean;
+ /** Workspace name generation state and actions */
+ nameState: WorkspaceNameState;
}
/**
* Additional controls shown only during workspace creation
* - Trunk branch selector (which branch to fork from) - hidden for Local runtime
* - Runtime mode (Local, Worktree, SSH)
+ * - Workspace name (auto-generated with manual override)
*/
export function CreationControls(props: CreationControlsProps) {
// Local runtime doesn't need a trunk branch selector (uses project dir as-is)
const showTrunkBranchSelector =
props.branches.length > 0 && props.runtimeMode !== RUNTIME_MODE.LOCAL;
- return (
-