fix(chat): preserve composer drafts while interrupt input is blocked

Author: blove

apps/website/content/docs/ag-ui/api/api-docs.json

@@ -461,6 +461,12 @@
         "description": "Full interrupt batch and its request ownership phase.",
         "optional": false
       },
+      {
+        "name": "isInputBlocked",
+        "type": "Signal<boolean>",
+        "description": "Optional gate for ordinary composer input while the runtime requires resolution or recovery. Resume actions remain adapter-controlled.",
+        "optional": true
+      },
       {
         "name": "isLoading",
         "type": "Signal<boolean>",

apps/website/content/docs/ag-ui/guides/interrupts.mdx

@@ -168,6 +168,8 @@ Atomic storage claims coordinate clients sharing that store. Preventing duplicat
 
 Await `agent.ready` before rendering restored approval controls; actions also wait for hydration. An interrupted in-flight claim restores as uncertain, and an acknowledged attempt requires recovery. Configure `persistence.reconcile(record)` to obtain an authoritative backend outcome and call `agent.reconcileInterrupt()` to apply it. The callback returns `unknown`, or `pending`, `acknowledged`, or `completed` with authoritative `committed` and `session` snapshots. An unknown outcome keeps recovery blocked. The adapter does not provide a backend reconciliation endpoint, and stored client state cannot recreate a checkpoint lost by a restarted `MemorySaver` process.
 
+The optional `isInputBlocked` signal disables ordinary chat input during hydration, reconciliation, and unresolved interrupt phases. The built-in composer preserves drafts while blocked; approval controls still submit through the resume path.
+
 Providers dispose the adapter with their injector. If you create it with `toAgent()` directly, call `agent.dispose()` when finished. Disposal unsubscribes and stops local work; it does not delete or cancel backend checkpoints.
 
 ### Migration note

apps/website/content/docs/chat/api/api-docs.json

@@ -5996,6 +5996,12 @@
         "description": "Optional display projection of the pending interrupt. A runtime may expose\na separate full batch and lifecycle surface. A cleared display projection\ndoes not by itself prove that resumed backend work completed.",
         "optional": true
       },
+      {
+        "name": "isInputBlocked",
+        "type": "Signal<boolean>",
+        "description": "Optional gate for ordinary composer input while the runtime requires resolution or recovery. Resume actions remain adapter-controlled.",
+        "optional": true
+      },
       {
         "name": "isLoading",
         "type": "Signal<boolean>",
@@ -6316,6 +6322,12 @@
         "description": "Optional display projection of the pending interrupt. A runtime may expose\na separate full batch and lifecycle surface. A cleared display projection\ndoes not by itself prove that resumed backend work completed.",
         "optional": true
       },
+      {
+        "name": "isInputBlocked",
+        "type": "Signal<boolean>",
+        "description": "Optional gate for ordinary composer input while the runtime requires resolution or recovery. Resume actions remain adapter-controlled.",
+        "optional": true
+      },
       {
         "name": "isLoading",
         "type": "Signal<boolean>",
@@ -7496,6 +7508,12 @@
         "description": "Optional display projection of the pending interrupt. A runtime may expose\na separate full batch and lifecycle surface. A cleared display projection\ndoes not by itself prove that resumed backend work completed.",
         "optional": true
       },
+      {
+        "name": "isInputBlocked",
+        "type": "Signal<boolean>",
+        "description": "Optional gate for ordinary composer input while the runtime requires resolution or recovery. Resume actions remain adapter-controlled.",
+        "optional": true
+      },
       {
         "name": "isLoading",
         "type": "WritableSignal<boolean>",
@@ -9652,7 +9670,7 @@
   {
     "name": "submitMessage",
     "kind": "function",
-    "description": "Submits a trimmed message to the agent.\nReturns the trimmed string on success, or `null` if the input was empty.",
+    "description": "Submits a trimmed message to the agent.\nReturns the trimmed string on dispatch, or `null` for empty or blocked input.",
     "signature": "submitMessage(agent: Agent<>, text: string): string | null",
     "params": [
       {

apps/website/content/docs/langgraph/api/api-docs.json

@@ -1534,6 +1534,12 @@
         "description": "Current human-in-the-loop pause, or `undefined` when the run is not paused.\n\nNarrowed from the neutral `Agent` contract, where `interrupt` is optional\nbecause a runtime without human-in-the-loop support omits it. The LangGraph\nadapter always provides it, so `injectAgent().interrupt()` type-checks\ndirectly under `strictNullChecks` — no `?.()` needed.",
         "optional": false
       },
+      {
+        "name": "isInputBlocked",
+        "type": "Signal<boolean>",
+        "description": "Optional gate for ordinary composer input while the runtime requires resolution or recovery. Resume actions remain adapter-controlled.",
+        "optional": true
+      },
       {
         "name": "isLoading",
         "type": "Signal<boolean>",
@@ -1968,6 +1974,12 @@
         "description": "Current human-in-the-loop pause, or `undefined` when the run is not paused.\n\nNarrowed from the neutral `Agent` contract, where `interrupt` is optional\nbecause a runtime without human-in-the-loop support omits it. The LangGraph\nadapter always provides it, so `injectAgent().interrupt()` type-checks\ndirectly under `strictNullChecks` — no `?.()` needed.",
         "optional": false
       },
+      {
+        "name": "isInputBlocked",
+        "type": "Signal<boolean>",
+        "description": "Optional gate for ordinary composer input while the runtime requires resolution or recovery. Resume actions remain adapter-controlled.",
+        "optional": true
+      },
       {
         "name": "isLoading",
         "type": "WritableSignal<boolean>",

libs/ag-ui/src/lib/to-agent.interrupt-restoration.spec.ts

@@ -32,6 +32,21 @@ function source() {
   return { source: new HttpAgent({ url: 'http://test.invalid', threadId: 't1', fetch }), fetch };
 }
 
+it('blocks the composer until asynchronous hydration completes', async () => {
+  const { config } = memory();
+  let release!: () => void;
+  config.store.load = async () => {
+    await new Promise<void>(resolve => { release = resolve; });
+    return null;
+  };
+  const agent = toAgent(source().source, { persistence: config, telemetry: false });
+  expect(agent.isInputBlocked?.()).toBe(true);
+  await vi.waitFor(() => expect(release).toBeTypeOf('function'));
+  release(); await agent.ready;
+  expect(agent.isInputBlocked?.()).toBe(false);
+  agent.dispose();
+});
+
 it('restores committed messages, state and a complete batch into a new adapter', async () => {
   const { config } = memory();
   const original = source();

libs/ag-ui/src/lib/to-agent.ts

@@ -187,8 +187,8 @@ function createAgentAdapter(
   let disposed = false;
   let resumeInput: { state: Record<string, unknown>; messages: typeof source.messages; localMessages?: Message[] } | undefined;
   const persistence = options.persistence ? new InterruptPersistence(options.persistence, source.threadId) : undefined;
-  let hydrated = !persistence;
-  let reconciling = false;
+  const hydrated = signal(!persistence);
+  const reconciling = signal(false);
   let persistenceFault: unknown;
   let persistenceWrites: Promise<void> = Promise.resolve();
   function storageError(error: unknown): void {
@@ -223,7 +223,7 @@ function createAgentAdapter(
     publishInterrupt();
   }
   const ready = persistence
-    ? persistence.load().then(record => { if (record) hydrate(record); hydrated = true; }).catch(error => { storageError(error); throw error; })
+    ? persistence.load().then(record => { if (record) hydrate(record); hydrated.set(true); }).catch(error => { storageError(error); throw error; })
     : Promise.resolve();
   void ready.catch(() => undefined);
   function publishInterrupt(): void {
@@ -242,8 +242,8 @@ function createAgentAdapter(
   }
   function assertAvailable(): void {
     if (disposed) throw new Error('Agent has been disposed');
-    if (reconciling) throw new Error('Interrupt reconciliation is in progress');
-    if (!hydrated) throw new Error('Wait for agent.ready before starting a request');
+    if (reconciling()) throw new Error('Interrupt reconciliation is in progress');
+    if (!hydrated()) throw new Error('Wait for agent.ready before starting a request');
     if (persistenceFault) throw new Error('Interrupt storage recovery requires reconciliation');
   }
   function assertNoInterrupt(): void {
@@ -642,22 +642,23 @@ function createAgentAdapter(
     ready,
     reconcileInterrupt: async () => {
       if (disposed) throw new Error('Agent has been disposed');
-      if (reconciling) throw new Error('Interrupt reconciliation is in progress');
+      if (reconciling()) throw new Error('Interrupt reconciliation is in progress');
       if (activeRun && activeRun.outcome === undefined) throw new Error('Stop the active request before reconciliation');
       if (!persistence) throw new Error('Interrupt recovery requires a persistence reconciler');
-      reconciling = true;
+      reconciling.set(true);
       try {
         await persistenceWrites.catch(() => undefined);
         const record = await persistence.reconcile();
         if (disposed) return;
         if (record) hydrate(record);
         persistenceFault = undefined; persistenceWrites = Promise.resolve();
-        hydrated = true; store.error.set(undefined); store.status.set('idle');
+        hydrated.set(true); store.error.set(undefined); store.status.set('idle');
       } finally {
-        reconciling = false;
+        reconciling.set(false);
       }
     },
     interruptSession: interruptSession.asReadonly(),
+    isInputBlocked: computed(() => !hydrated() || reconciling() || interruptSession().phase !== 'none'),
     dispose: () => {
       if (disposed) return;
       disposed = true;
@@ -692,7 +693,7 @@ function createAgentAdapter(
     clientTools:  clientToolsCap,
 
     submit: async (input: AgentSubmitInput, opts?: AgUiSubmitOptions) => {
-      if (!hydrated) await ready;
+      if (!hydrated()) await ready;
       assertAvailable();
       if (input.resume !== undefined) {
         if (opts?.interruptGeneration !== undefined && opts.interruptGeneration !== interrupts.snapshot.generation) {
@@ -736,7 +737,7 @@ function createAgentAdapter(
     },
 
     retry: async () => {
-      if (!hydrated) await ready;
+      if (!hydrated()) await ready;
       assertAvailable();
       if (interrupts.snapshot.attempt) {
         const attempt = interrupts.retry();
@@ -778,7 +779,7 @@ function createAgentAdapter(
     },
 
     regenerate: async (assistantMessageIndex: number): Promise<void> => {
-      if (!hydrated) await ready;
+      if (!hydrated()) await ready;
       assertNoInterrupt();
       if (store.isLoading()) {
         throw new Error('Cannot regenerate while agent is loading another response');

libs/chat/src/lib/agent/agent.ts

@@ -28,6 +28,8 @@ export interface Agent<TState = unknown> {
   messages:  Signal<Message[]>;
   status:    Signal<AgentStatus>;
   isLoading: Signal<boolean>;
+  /** Optional gate for ordinary composer input while the runtime requires resolution or recovery. Resume actions remain adapter-controlled. */
+  isInputBlocked?: Signal<boolean>;
   error:     Signal<AgentError | undefined>;
   toolCalls: Signal<ToolCall[]>;
   state:     Signal<TState>;

libs/chat/src/lib/compositions/chat/chat.component.ts

@@ -282,7 +282,7 @@ export function isPinned(
                     <chat-message-actions
                       chatMessageControls
                       [content]="content"
-                      [disabled]="agent().isLoading()"
+                      [disabled]="agent().isLoading() || !!agent().isInputBlocked?.()"
                       (regenerate)="onRegenerate(i)"
                       (rate)="onRate(message, $event)"
                       (contentCopied)="onCopy(message, $event)"
@@ -836,7 +836,7 @@ export class ChatComponent {
    */
   submitMessage(text: string): void {
     const trimmed = text.trim();
-    if (!trimmed) return;
+    if (!trimmed || this.agent().isInputBlocked?.()) return;
     void this.agent().submit({ message: trimmed });
     this.recordSubmit();
   }
@@ -1031,6 +1031,7 @@ export class ChatComponent {
   }
 
   onA2uiAction(message: A2uiActionMessage): void {
+    if (this.agent().isInputBlocked?.()) return;
     void this.agent().submit({ message: JSON.stringify(message) });
   }
 

libs/chat/src/lib/primitives/chat-input/chat-input.component.spec.ts

@@ -22,6 +22,12 @@ function setSignalInput<T>(sig: unknown, value: T): void {
 }
 
 describe('submitMessage()', () => {
+  it('does not dispatch ordinary input when the adapter blocks it', () => {
+    const agent = mockAgent();
+    const blocked = { ...agent, isInputBlocked: signal(true) };
+    expect(submitMessage(blocked, 'keep my draft')).toBeNull();
+    expect(agent.submitCalls).toHaveLength(0);
+  });
   it('calls agent.submit with { message: trimmed text }', async () => {
     const agent = mockAgent();
 
@@ -102,6 +108,22 @@ describe('ChatInputComponent', () => {
     fixture.detectChanges();
   });
 
+  it('disables Send and preserves the draft on Enter until the adapter releases input', () => {
+    const agent = mockAgent();
+    const blocked = signal(true);
+    setSignalInput(fixture.componentInstance.agent, { ...agent, isInputBlocked: blocked });
+    fixture.componentInstance.messageText.set('keep my draft');
+    fixture.detectChanges();
+    const button = fixture.nativeElement.querySelector('button[aria-label="Send message"]') as HTMLButtonElement;
+    expect(button.disabled).toBe(true);
+    fixture.componentInstance.onKeydown(new KeyboardEvent('keydown', { key: 'Enter' }));
+    expect(agent.submitCalls).toHaveLength(0);
+    expect(fixture.componentInstance.messageText()).toBe('keep my draft');
+    blocked.set(false);
+    fixture.detectChanges();
+    expect(button.disabled).toBe(false);
+  });
+
   it('renders the pill with full border-radius', () => {
     const pill = (fixture.nativeElement as HTMLElement).querySelector('.chat-input__pill') as HTMLElement;
     expect(pill).not.toBeNull();

libs/chat/src/lib/primitives/chat-input/chat-input.component.ts

@@ -16,14 +16,14 @@ import { CHAT_INPUT_STYLES } from '../../styles/chat-input.styles';
 
 /**
  * Submits a trimmed message to the agent.
- * Returns the trimmed string on success, or `null` if the input was empty.
+ * Returns the trimmed string on dispatch, or `null` for empty or blocked input.
  */
 export function submitMessage(
   agent: Agent,
   text: string,
 ): string | null {
   const trimmed = text.trim();
-  if (!trimmed) return null;
+  if (!trimmed || agent.isInputBlocked?.()) return null;
   void agent.submit({ message: trimmed });
   return trimmed;
 }
@@ -106,7 +106,7 @@ export class ChatInputComponent {
 
   /** Submit is allowed only when not loading and there's non-whitespace text. */
   readonly canSubmit = computed(() => {
-    if (this.isLoading()) return false;
+    if (this.isLoading() || this.agent().isInputBlocked?.()) return false;
     return this.messageText().trim().length > 0;
   });