Agent V2 Configure Interface#
The Agent V2 configure interface lives under web/features/agent-v2/agent-detail/configure/ and drives both the Agent App configure page and the inline configure surface inside Workflow Agent nodes. It composes agent-composer editable state with server synchronization, build chat sessions, version viewing, build draft mode, and the preview side panel .
The page renders a split-pane layout:
- Left pane (Orchestrate) β the agent configuration editor (prompt, tools, skills, knowledge, model, environment variables, etc.)
- Right pane (Preview surface) β an interactive chat interface for testing; contains either Build or Preview mode chat
The right panel mode is tracked via URL query parameter ?mode=build|preview using nuqs, defaulting to build and using history: 'replace' so navigation doesn't pollute browser history .
Build Mode vs. Preview Mode#
The right panel header exposes a SegmentedControl with Build and Preview tabs . The two modes serve distinct purposes:
| Mode | What it tests | Data source |
|---|---|---|
| Build | Converses with the agent to iteratively refine config via a "build draft" | Active build draft (debug_build draft type) |
| Preview | Tests the published/saved configuration as an end-user would | Normal published draft |
Preview mode is feature-gated: it is disabled on Community Edition. The page reads deployment_edition from the system-features API and computes previewEnabled = deploymentEdition !== 'COMMUNITY' . When disabled, the Preview tab renders in a tooltip-wrapped disabled state , and any ?mode=preview URL param is silently overridden to build .
Build mode renders AgentBuildChat with draftType="debug_build" and a "Start build" send label. It shows a decorative empty state until the first message is sent .
The Build Draft System#
The build draft is a server-side isolated snapshot of the agent's soul config, created and modified conversationally during a build chat session, separate from the normal composer draft the user is editing.
The useAgentConfigureBuildDraftData hook manages the lifecycle:
- Detection: Queries
GET /agents/{agent_id}/build-draft. On first load, the request is made silently (no error toast). If the API returns 404, there is no active build draft, andsoulSourceOverrideis set to'draft'. - Active state: When a build draft exists,
soulSourceresolves to'build-draft', and the orchestrate pane displays the build draft config rather than the normal draft . - Change summary: A diff is computed between the build draft and the current composer state across skills, files, and env variables β surfaced as
AgentBuildDraftChangeSummary. This powers the change indicator UI shown while a build draft is active.
The useAgentConfigureBuildDraftActions hook exposes the terminal actions:
- Apply (
applyBuildDraft): CallsPOST /agents/{id}/build-chat/finalize, thenPOST /agents/{id}/build-draft/apply, invalidates query caches, and exits build-draft mode by rebasing the composer to the updated config . - Discard (
discardBuildDraft): CallsDELETE /agents/{id}/build-draftand exits build-draft mode without rebasing . - Refresh after build chat (
refreshBuildDraftAfterBuildChat): Debounced 1 s after the last build chat message, refetches the build draft and rebases the composer . - Start fresh session (
startFreshBuildSession): Resets the build chat conversation and forces a checkout of the current draft before the next run .
Soul Source: The Config Source Abstraction#
AgentConfigureSoulSource is a union type with three values that determines which agent config is rendered in the orchestrate pane:
| Value | Meaning |
|---|---|
'draft' | Normal editable composer draft |
'build-draft' | Active build draft (transient, conversationally modified) |
'view-version' | A specific published version opened read-only |
Resolution logic : 'view-version' takes precedence β then explicit soulSourceOverride β then build-draft existence β falls back to 'draft'. Critically, if the user switches to Preview mode while a build draft is active, the source is forced back to 'draft' β you cannot preview an uncommitted build draft .
Draft Autosave#
The normal composer draft (not the build draft) autosaves via useAgentConfigureSync:
- 5-second debounce after any composer change
- Deduplication via
lastAutosavedDraftKeyRef,explicitlySavingDraftKeysRef, and asaveSequencecounter to prevent duplicate API calls - Page-close persistence: saves pending dirty drafts on
visibilitychange/beforeunloadusing keepalive requests - Autosave is suspended when a build draft is active or a version is being viewed
Key Source Files#
| File | Role |
|---|---|
configure/page.tsx | Root page: mode routing, layout, previewEnabled gate |
configure/state.ts | Jotai atoms: soul source override, version selection, conversation IDs, rebase revision |
configure/use-agent-configure-build-draft.ts | Build draft lifecycle: data fetching, change diffing, apply/discard actions |
configure/use-agent-configure-sync.ts | Normal draft autosave and publish logic |
configure/components/preview/header.tsx | AgentPreviewHeader: Build/Preview segmented control, disabled state for Community |
configure/components/preview/build-chat.tsx | AgentBuildChat: build mode chat with debug_build draft type |
configure/components/workspace/ | Layout primitives: AgentConfigureWorkspace, AgentConfigurePreviewSurface |