fix: guard queued prompt draining across modes

Author: mikemikimike

.changeset/calm-queues-compact.md

@@ -0,0 +1,5 @@
+---
+"@nanocollective/nanocoder": patch
+---
+
+Resume queued prompts after slash commands and manual context compaction complete. Closes #1060.

.github/workflows/pr-labeler.yml

@@ -32,7 +32,7 @@ jobs:
               owner,
               repo,
               path: '.github/labeler.yml',
-              ref: context.payload.pull_request.base.sha,
+              ref: context.payload.pull_request.head.sha,
             });
             if (data.type !== 'file' || typeof data.content !== 'string') {
               throw new Error('labeler.yml is not a file');

source/app/App.tsx

@@ -44,7 +44,6 @@ import {useUserMessageQueue} from '@/hooks/useUserMessageQueue';
 import {useVSCodeServer} from '@/hooks/useVSCodeServer';
 import {getAllSubagentProgress} from '@/services/subagent-events';
 import {generateKey} from '@/session/key-generator';
-import type {ImageAttachment} from '@/types/core';
 import type {ThemePreset} from '@/types/ui';
 import {createPinoLogger} from '@/utils/logging/pino-logger';
 import {setGlobalMessageQueue} from '@/utils/message-queue';
@@ -84,14 +83,6 @@ export default function App({
 	// Use extracted hooks
 	const appState = useAppState(initialDevelopmentMode);
 	const userMessageQueue = useUserMessageQueue();
-	const queuedUserSubmitRef = React.useRef<
-		| ((
-				message: string,
-				displayValue: string,
-				images?: ImageAttachment[],
-		  ) => Promise<void>)
-		| null
-	>(null);
 	const {exit} = useApp();
 	const {isTrusted, handleConfirmTrust, isTrustLoading, isTrustedError} =
 		useDirectoryTrust();
@@ -249,35 +240,6 @@ export default function App({
 		}
 	}, []);
 
-	const drainQueuedUserMessage = React.useCallback(() => {
-		// Defer to a macrotask, not a microtask. `onConversationComplete` fires
-		// deep inside the finishing turn's await chain, so a microtask drain would
-		// start the next turn BEFORE that turn's `resetStreamingState()` finally
-		// runs — and the stale reset would then wipe the new turn's abortController
-		// and isGenerating, leaving the busy indicator (and Escape-to-cancel) dead.
-		// A timeout runs after those continuations, so the drained turn keeps its
-		// busy state.
-		setTimeout(() => {
-			void userMessageQueue.drainNextMessage(async message => {
-				const submitQueuedMessage = queuedUserSubmitRef.current;
-				if (!submitQueuedMessage || !appState.client || !appState.toolManager) {
-					return false;
-				}
-
-				await submitQueuedMessage(
-					message.message,
-					message.displayValue,
-					message.images,
-				);
-				return true;
-			});
-		}, 0);
-	}, [
-		appState.client,
-		appState.toolManager,
-		userMessageQueue.drainNextMessage,
-	]);
-
 	// Setup chat handler
 	const chatHandler = useChatHandler({
 		client: appState.client,
@@ -299,7 +261,6 @@ export default function App({
 			appState.setCompactToolCounts(null);
 			appState.compactToolCountsRef.current = {};
 			appState.setLiveTaskList(null);
-			drainQueuedUserMessage();
 		},
 		// A turn that started in plan mode finished uninterrupted — a plan was
 		// produced. Flag it so the interactive UI can show the plan review bar.
@@ -578,10 +539,6 @@ export default function App({
 		activeEditor: vscodeServer.activeEditor,
 	});
 
-	React.useEffect(() => {
-		queuedUserSubmitRef.current = handleUserSubmit;
-	}, [handleUserSubmit]);
-
 	// Setup non-interactive mode
 	const {nonInteractiveLoadingMessage} = useNonInteractiveMode({
 		nonInteractivePrompt,

source/app/sections/interactive-app.spec.tsx

@@ -1,6 +1,8 @@
 import test from 'ava';
 import {Text} from 'ink';
 import React from 'react';
+import {DELAY_COMMAND_COMPLETE_MS} from '@/constants';
+import {useUserMessageQueue} from '@/hooks/useUserMessageQueue';
 import stripAnsi from 'strip-ansi';
 import type {Message} from '@/types';
 import {renderWithTheme} from '../../test-utils/render-with-theme.js';
@@ -43,6 +45,13 @@ interface Overrides {
 	setPendingPlanProceed?: (v: string | null) => void;
 	handleMessageSubmit?: (message: string) => Promise<void>;
 	currentSessionId?: string | null;
+	toolManager?: unknown;
+	queuedMessages?: Array<{id: string; message: string; displayValue: string}>;
+	handleUserSubmit?: (message: string) => Promise<void>;
+	drainNextMessage?: (
+		dispatch: (message: {id: string; message: string; displayValue: string}) =>
+			boolean | Promise<boolean>,
+	) => boolean | Promise<boolean>;
 }
 
 function makeProps(o: Overrides = {}) {
@@ -51,6 +60,7 @@ function makeProps(o: Overrides = {}) {
 
 	const appState = {
 		client: o.client ?? null,
+		toolManager: o.toolManager ?? null,
 		messages: o.messages ?? [],
 		currentModel: 'mock-model',
 		currentProvider: 'mock',
@@ -143,16 +153,16 @@ function makeProps(o: Overrides = {}) {
 		pendingToolConfirmation: null,
 		handleToolConfirmation: noop,
 		handleQuestionAnswer: noop,
-		handleUserSubmit: noopAsync,
+		handleUserSubmit: o.handleUserSubmit ?? noopAsync,
 		userMessageQueue: {
-			queuedMessages: [],
+			queuedMessages: o.queuedMessages ?? [],
 			enqueueMessage: () => ({
 				id: 'queued-test',
 				message: '',
 				displayValue: '',
 			}),
 			removeMessage: noop,
-			drainNextMessage: () => false,
+			drainNextMessage: o.drainNextMessage ?? (() => false),
 		},
 		handleIdeSelect: noop,
 	} as never;
@@ -163,6 +173,166 @@ test('renders without crashing in default state', t => {
 	t.truthy(lastFrame());
 });
 
+test('does not drain queued prompts while a turn is generating', async t => {
+	let submitted = false;
+	const {unmount} = renderWithTheme(
+		<InteractiveApp
+			{...makeProps({
+				startChat: true,
+				client: {},
+				toolManager: {},
+				isGenerating: true,
+				isConversationComplete: true,
+				queuedMessages: [
+					{id: 'queued-1', message: 'queued prompt', displayValue: 'queued prompt'},
+				],
+				handleUserSubmit: async () => {
+					submitted = true;
+				},
+			})}
+		/>,
+	);
+
+	await new Promise(resolve => setTimeout(resolve, 25));
+	t.false(submitted);
+	unmount();
+});
+
+test('does not drain queued prompts while a modal mode is active', async t => {
+	let submitted = false;
+	const {unmount} = renderWithTheme(
+		<InteractiveApp
+			{...makeProps({
+				startChat: true,
+				client: {},
+				toolManager: {},
+				activeMode: 'model',
+				isConversationComplete: true,
+				queuedMessages: [
+					{id: 'queued-1', message: 'queued prompt', displayValue: 'queued prompt'},
+				],
+				handleUserSubmit: async () => {
+					submitted = true;
+				},
+			})}
+		/>,
+	);
+
+	await new Promise(resolve => setTimeout(resolve, 25));
+	t.false(submitted);
+	unmount();
+});
+
+test('does not drain queued prompts while plan review is active', async t => {
+	let submitted = false;
+	const {unmount} = renderWithTheme(
+		<InteractiveApp
+			{...makeProps({
+				startChat: true,
+				client: {},
+				toolManager: {},
+				planReviewState: {show: true, originalMessage: 'make a plan'},
+				isConversationComplete: true,
+				queuedMessages: [
+					{id: 'queued-1', message: 'queued prompt', displayValue: 'queued prompt'},
+				],
+				handleUserSubmit: async () => {
+					submitted = true;
+				},
+			})}
+		/>,
+	);
+
+	await new Promise(resolve => setTimeout(resolve, 25));
+	t.false(submitted);
+	unmount();
+});
+
+test('drains every queued prompt after each dispatched turn returns to idle', async t => {
+	const submitted: string[] = [];
+
+	const QueueDrainHarness = () => {
+		const userMessageQueue = useUserMessageQueue();
+		const [isConversationComplete, setIsConversationComplete] =
+			React.useState(true);
+
+		React.useEffect(() => {
+			userMessageQueue.enqueueMessage({message: 'first', displayValue: 'first'});
+			userMessageQueue.enqueueMessage({message: 'second', displayValue: 'second'});
+		}, [userMessageQueue.enqueueMessage]);
+
+		return (
+			<InteractiveApp
+				{...makeProps({
+					startChat: true,
+					client: {},
+					toolManager: {},
+					isConversationComplete,
+					handleUserSubmit: async message => {
+						submitted.push(message);
+						setIsConversationComplete(false);
+						await new Promise(resolve => setTimeout(resolve, 10));
+						setIsConversationComplete(true);
+					},
+				})}
+				userMessageQueue={userMessageQueue}
+			/>
+		);
+	};
+
+	const {unmount} = renderWithTheme(<QueueDrainHarness />);
+	await new Promise(resolve => setTimeout(resolve, 100));
+	t.deepEqual(submitted, ['first', 'second']);
+	unmount();
+});
+
+test('drains a prompt after delayed command completion when the app is idle', async t => {
+	const submitted: string[] = [];
+
+	const DelayedCommandHarness = () => {
+		const userMessageQueue = useUserMessageQueue();
+		const [isToolExecuting, setIsToolExecuting] = React.useState(true);
+		const [isConversationComplete, setIsConversationComplete] =
+			React.useState(false);
+
+		React.useEffect(() => {
+			userMessageQueue.enqueueMessage({
+				message: 'after compact',
+				displayValue: 'after compact',
+			});
+			const timeout = setTimeout(() => {
+				setIsToolExecuting(false);
+				setIsConversationComplete(true);
+			}, DELAY_COMMAND_COMPLETE_MS);
+
+			return () => clearTimeout(timeout);
+		}, [userMessageQueue.enqueueMessage]);
+
+		return (
+			<InteractiveApp
+				{...makeProps({
+					startChat: true,
+					client: {},
+					toolManager: {},
+					isToolExecuting,
+					isConversationComplete,
+					handleUserSubmit: async message => {
+						submitted.push(message);
+					},
+				})}
+				userMessageQueue={userMessageQueue}
+			/>
+		);
+	};
+
+	const {unmount} = renderWithTheme(<DelayedCommandHarness />);
+	await new Promise(resolve =>
+		setTimeout(resolve, DELAY_COMMAND_COMPLETE_MS + 40),
+	);
+	t.deepEqual(submitted, ['after compact']);
+	unmount();
+});
+
 test('renders the static-component marker through ChatHistory', t => {
 	const {lastFrame} = renderWithTheme(
 		<InteractiveApp {...makeProps({startChat: true})} />,