← All changes | src/Agent/Agent.jsx +163 -65 3.1.6 → 3.2.3 View file →

		@@ -12,9 +12,16 @@
12	12	useCanvasOpen,
13	13	} from '@agent/components/Canvas';
14	14	import { ChatInput } from '@agent/components/ChatInput';
15	15	import { ChatMessages } from '@agent/components/ChatMessages';
	16	+import { StatusIndicator } from '@agent/components/messages/StatusIndicator';
16	17	import { UsageMessage } from '@agent/components/messages/UsageMessage';
	18	+import { useFollowUpHistory } from '@agent/follow-ups/history';
	19	+import {
	20	+ cardMessageIndex,
	21	+ pickNextCard,
	22	+ toolCallsThisRun,
	23	+} from '@agent/follow-ups/pick-next';
17	24	import { useLockPost } from '@agent/hooks/useLockPost';
18	25	import { isAbilityTool, isAbilityWorkflow } from '@agent/lib/abilities';
19	26	import {
20	27	getClientToolFallbackReply,
		@@ -20,17 +27,16 @@
20	27	getClientToolFallbackReply,
21	28	getClientTools,
22	29	} from '@agent/lib/client-tools';
23	30	import { localPickWorkflow } from '@agent/lib/local-pick';
24		-import { getRedirectUrl } from '@agent/lib/redirects';
25	31	import { doReload } from '@agent/lib/reload';
26	32	import { useCanvasStore } from '@agent/state/canvas';
27	33	import { useChatStore } from '@agent/state/chat';
28	34	import { useGlobalStore } from '@agent/state/global';
29	35	import { useStatusStore } from '@agent/state/status';
30		-import { useSuggestionsStore } from '@agent/state/suggestions';
31	36	import { useWorkflowStore } from '@agent/state/workflows';
32	37	import { hasRunComponent } from '@agent/workflows/abilities/components/run';
	38	+import startOnboardingWorkflow from '@agent/workflows/misc/start-onboarding';
33	39	import { useQuickEditStore } from '@quick-edit/state/store';
34	40	import { digest } from '@shared/api/digest';
35	41	import {
36	42	useCallback,
		@@ -58,8 +64,25 @@
58	64	]);
59	65	return result;
60	66	};
61	67
	68	+// cleanup() swaps in a fresh controller; a signal read after the wait is never aborted.
	69	+const canceledDuring = async (ms) => {
	70	+ const { signal } = controller;
	71	+ await new Promise((resolve) => setTimeout(resolve, ms));
	72	+ return signal.aborted;
	73	+};
	74	+
	75	+const nextSteps = (workflowId, status, messages) => {
	76	+ if (status === 'completed') {
	77	+ useFollowUpHistory.getState().markDone(workflowId);
	78	+ }
	79	+ const card = pickNextCard({ workflowId, status, messages });
	80	+ return card
	81	+ ? { followUp: card.id, followUpData: card.data }
	82	+ : { followUp: null };
	83	+};
	84	+
62	85	export const Agent = () => {
63	86	const { addMessage, updateMessage, popMessage, messages } = useChatStore();
64	87	const { pushStatus, clearStatuses, leavingPage } = useStatusStore();
65	88	const {
		@@ -92,9 +115,8 @@
92	115	const canvasOpen = useCanvasOpen();
93	116	const canvasAssist = useCanvasAssist();
94	117	const canvasNoticeShown = useRef(false);
95	118	const chatAvailable = useMemo(() => isChatAvailable(), [isChatAvailable]);
96		- const { addSuggestions, getSuggestions } = useSuggestionsStore();
97	119	// Options render only while their message is last; a reply dismisses them.
98	120	const lastMessage = messages.at(-1);
99	121	const qaSuggestions =
100	122	lastMessage?.type === 'message' &&
		@@ -102,8 +124,18 @@
102	124	Array.isArray(lastMessage.details?.qaSuggestions)
103	125	? lastMessage.details.qaSuggestions
104	126	: null;
105	127
	128	+ useEffect(() => {
	129	+ const { messages, updateMessage } = useChatStore.getState();
	130	+ const index = cardMessageIndex(messages);
	131	+ const { id, details } = messages[index] ?? {};
	132	+ if (!id || details.followUp !== undefined || details.followUpClosed) return;
	133	+ const { workflowId, status } = details;
	134	+ const steps = nextSteps(workflowId, status, messages.slice(0, index));
	135	+ if (steps.followUp) updateMessage(id, steps);
	136	+ }, []);
	137	+
106	138	// Without this the input stays disabled for as long as the canvas is open.
107	139	useEffect(() => {
108	140	if (canvasOpen && canvasAssist) setCanType(true);
109	141	// A workflow reached by example carries no sessionId to key this on.
		@@ -119,9 +151,14 @@
119	151	agentBlock && setBlock(null);
120	152	// A class or pin left up freezes Quick Edit hover site-wide.
121	153	document
122	154	.querySelector('.wp-site-blocks')
123		- ?.classList.remove('extendify-agent-working', 'extendify-agent-busy');
	155	+ ?.classList.remove(
	156	+ 'extendify-agent-working',
	157	+ 'extendify-agent-busy',
	158	+ 'extendify-agent-waiting',
	159	+ 'extendify-agent-task',
	160	+ );
124	161	setCommittedSelection(null);
125	162	clearStatuses();
126	163	window.dispatchEvent(new Event('extendify-agent:remove-block-highlight'));
127	164	}, [setBlock, clearStatuses]);
		@@ -143,13 +180,14 @@
143	180
144	181	const findAgent = useCallback(
145	182	async (options = {}) => {
146	183	pushStatus('calling-agent');
	184	+ const { signal } = controller;
147	185	const response = await withMinDuration(
148	186	pickWorkflow({
149	187	// A mid-turn drop clears the block after this closure was made.
150	188	workflows: getAvailableWorkflows().map((w) => w.id),
151		- options: { signal: controller.signal, ...options },
	189	+ options: { signal, ...options },
152	190	}).catch(async (error) => {
153	191	devmode && console.error(error);
154	192	if (error?.response?.status === 429) {
155	193	updateRetryAfter(error?.response?.headers?.get('Retry-After'));
		@@ -157,15 +195,9 @@
157	195	pushStatus('credits-exhausted');
158	196	return;
159	197	}
160	198	setCanType(true);
161		- if (error === 'Workflow aborted') {
162		- addMessage('workflow', {
163		- status: 'canceled',
164		- suggestions: getSuggestions(),
165		- });
166		- return;
167		- }
	199	+ if (error === 'Workflow aborted') return;
168	200
169	201	await new Promise((resolve) => setTimeout(resolve, 1000));
170	202	addMessage('message', {
171	203	role: 'assistant',
		@@ -179,9 +211,9 @@
179	211	return;
180	212	}),
181	213	500,
182	214	);
183		- if (!response) return;
	215	+ if (!response || signal.aborted) return;
184	216
185	217	const { workflow: wf, reply } = response;
186	218	if (wf?.id) setWorkflow(wf);
187	219	if (reply) {
		@@ -195,9 +227,8 @@
195	227	pushStatus,
196	228	updateRetryAfter,
197	229	setWorkflow,
198	230	getAvailableWorkflows,
199		- getSuggestions,
200	231	],
201	232	);
202	233
203	234	// The backend caps tool runs; nothing here bounds the loop.
		@@ -270,18 +301,34 @@
270	301	setCanType(true);
271	302	}, [addMessage, pushStatus, whenFinishedToolProps, workflow]);
272	303
273	304	const handleSubmit = useCallback(
274		- async (message) => {
275		- // Suggestions reach the agent without the textarea; disabling it isn't enough.
	305	+ async (message, { hidden = false, step } = {}) => {
	306	+ // chat-submit events skip the textarea; disabling it isn't enough.
276	307	if (useQuickEditStore.getState().selected) return;
	308	+ if (whenFinishedToolProps?.processing) return;
277	309	setWaitingOnToolOrUser(false);
278	310	agentWorking.current = false;
279		- addMessage('message', { role: 'user', content: message });
	311	+ if (step) addMessage('tool', { ...step, inputs: {}, fromCard: true });
	312	+ addMessage('message', { role: 'user', content: message, hidden });
280	313
281	314	// Without this a typed message would drop the workflow and close the canvas.
282	315	if (canvasOpen && canvasAssist) return handleCanvasMessage();
283	316
	317	+ // A staged tool the user walked away from still owes its receipt.
	318	+ if (workflow?.id && whenFinishedToolProps?.id) {
	319	+ const { answerId, whenFinishedTool } =
	320	+ whenFinishedToolProps.agentResponse || {};
	321	+ addMessage('workflow', {
	322	+ status: 'canceled',
	323	+ label: whenFinishedTool?.labels?.cancel,
	324	+ agent: workflow.agent,
	325	+ workflowId: workflow.id,
	326	+ answerId,
	327	+ followUp: null,
	328	+ });
	329	+ }
	330	+
284	331	// Let some phrases auto load workflows
285	332	const bypass = getWorkflowByExample(message);
286	333	if (bypass?.example?.agentResponse) {
287	334	// whenFinishedTool → inline input UI; none → ask for a typed reply.
		@@ -309,9 +356,9 @@
309	356
310	357	// Skip the network find-agent when the staged block makes the edit certain.
311	358	const localPick = localPickWorkflow({ block });
312	359	if (localPick) {
313		- await new Promise((resolve) => setTimeout(resolve, 500));
	360	+ if (await canceledDuring(500)) return;
314	361	setWorkflow(localPick);
315	362	return;
316	363	}
317	364
		@@ -340,9 +387,9 @@
340	387	if (!agentResponse) return;
341	388	setWorkflow(workflow);
342	389	setCanType(false);
343	390	agentWorking.current = true;
344		- await new Promise((resolve) => setTimeout(resolve, 750));
	391	+ if (await canceledDuring(750)) return;
345	392	addMessage('message', {
346	393	role: 'assistant',
347	394	content: agentResponse.reply,
348	395	});
		@@ -366,9 +413,9 @@
366	413	// Without this the loop calls the backend before the user has typed.
367	414	setWaitingOnToolOrUser(true);
368	415	setCanType(false);
369	416	agentWorking.current = true;
370		- await new Promise((resolve) => setTimeout(resolve, 750));
	417	+ if (await canceledDuring(750)) return;
371	418	addMessage('message', {
372	419	role: 'assistant',
373	420	content: agentResponse.reply,
374	421	// A workflow example can carry its own suggestions; none still asks.
		@@ -386,12 +433,15 @@
386	433	useEffect(() => {
387	434	// Allow external messages to trigger the agent
388	435	const handleMessage = ({ detail }) => {
389	436	if (!detail?.message) return;
390		- handleSubmit(detail.message);
	437	+ const { message, hidden, step } = detail;
	438	+ handleSubmit(message, { hidden, step });
391	439	};
392	440	// Allow external code to clear the block and workflow
393	441	const handleCleanup = () => {
	442	+ // cleanup() resets canType and agentWorking, so read them before it runs.
	443	+ const interrupted = agentWorking.current || !canType;
394	444	controller.abort('Workflow aborted');
395	445	cleanup();
396	446	// Deferred a frame: the input stays disabled until the cancel lands.
397	447	requestAnimationFrame(() =>
		@@ -398,15 +448,15 @@
398	448	document.querySelector('#extendify-agent-chat-textarea')?.focus(),
399	449	);
400	450
401	451	// An options panel can outlive its workflow; cancel must still clear it.
402		- if (!workflow?.id && !qaSuggestions) return;
	452	+ if (!workflow?.id && !qaSuggestions && !interrupted) return;
403	453	setWorkflow(null);
404	454	addMessage('workflow', {
405	455	status: 'canceled',
406	456	agent: workflow?.agent,
407	457	workflowId: workflow?.id,
408		- suggestions: getSuggestions(),
	458	+ ...nextSteps(workflow?.id, 'canceled'),
409	459	});
410	460	return;
411	461	};
412	462	window.addEventListener('extendify-agent:cancel-workflow', handleCleanup);
		@@ -424,25 +474,52 @@
424	474	setWorkflow,
425	475	addMessage,
426	476	workflow,
427	477	qaSuggestions,
428		- getSuggestions,
	478	+ canType,
429	479	]);
430	480
	481	+ // Dispatching before chat-submit has a listener drops the workflow.
	482	+ useEffect(() => {
	483	+ if (!startOnboardingWorkflow.available()) return;
	484	+ window.dispatchEvent(
	485	+ new CustomEvent('extendify-agent:chat-submit', {
	486	+ detail: { message: startOnboardingWorkflow.example.text, hidden: true },
	487	+ }),
	488	+ );
	489	+ }, []);
	490	+
	491	+ // ChatMessages hides a confirm restored by a reload; left open, the workflow would sit unfinishable.
	492	+ useEffect(() => {
	493	+ const { getWorkflow, reloadedToolProps } = useWorkflowStore.getState();
	494	+ const { whenFinished, needsRedirect } = getWorkflow() ?? {};
	495	+ if (!reloadedToolProps?.id || !whenFinished?.component) return;
	496	+ if (whenFinished.canvas || needsRedirect?.()) return;
	497	+ window.dispatchEvent(new Event('extendify-agent:cancel-workflow'));
	498	+ }, []);
	499	+
431	500	// Handle whenFinished component confirm/cancel
432	501	useEffect(() => {
433	502	const handleConfirm = async ({ detail }) => {
434	503	if (toolWorking.current) return;
435		- setWhenFinishedToolProps(null);
436	504	toolWorking.current = true;
437	505	const { data, whenFinishedToolProps, shouldRefreshPage, redirectUrl } =
438	506	detail ?? {};
439		- const { whenFinishedTool, answerId, redirectTo } =
	507	+ // Staged until the tool returns, so the chat shows it saving.
	508	+ setWhenFinishedToolProps(
	509	+ whenFinishedToolProps
	510	+ ? { ...whenFinishedToolProps, processing: true }
	511	+ : null,
	512	+ );
	513	+ const { whenFinishedTool, answerId } =
440	514	whenFinishedToolProps?.agentResponse || {};
441	515	const { id, labels } = whenFinishedTool || {};
442	516	// Staged unanswered so its own component can show the run in progress.
443	517	const runMessageId = id ? addMessage('tool', { id, inputs: data }) : null;
444		- if (!hasRunComponent(id)) pushStatus('workflow-tool-processing');
	518	+ // In the chat, the saving state shows this label instead.
	519	+ if (!hasRunComponent(id) && workflow?.whenFinished?.canvas) {
	520	+ pushStatus('workflow-tool-processing', labels?.started);
	521	+ }
445	522	// Not all workflows have a tool at the end (e.g. tours)
446	523	const toolResponse = await callTool?.({ tool: id, inputs: data }).catch(
447	524	(error) => {
448	525	const { sessionId } = workflow || {};
		@@ -458,8 +535,9 @@
458	535	return { error: { message: error?.message, code: error?.code } };
459	536	},
460	537	);
461	538	toolWorking.current = false;
	539	+ setWhenFinishedToolProps(null);
462	540	if (runMessageId) updateMessage(runMessageId, { result: toolResponse });
463	541	if (toolResponse?.refused) {
464	542	await new Promise((resolve) => setTimeout(resolve, 1000));
465	543	const refusalMessages = {
		@@ -467,13 +545,8 @@
467	545	'no-op': __(
468	546	"That edit came back unchanged, which wasn't expected. Please try rephrasing what you'd like to change.",
469	547	'extendify-local',
470	548	),
471		- // translators: Shown when the user asked the AI agent to edit a block that lives in a site template (e.g. the header or footer), which the agent cannot save yet.
472		- 'template-part': __(
473		- "That block is part of your site's template, like the header or footer, and I can't make changes there yet.",
474		- 'extendify-local',
475		- ),
476	549	};
477	550	addMessage('message', {
478	551	role: 'assistant',
479	552	content:
		@@ -497,9 +570,13 @@
497	570	setLoop((prev) => prev + 1);
498	571	return;
499	572	}
500	573
501		- addSuggestions(whenFinishedToolProps.agentResponse?.recommendations);
	574	+ // Reloading here unmounts a run component still watching its ability finish.
	575	+ const refreshForAbility =
	576	+ isAbilityTool(id) && shouldRefreshPage !== false;
	577	+ const willReload = redirectUrl || shouldRefreshPage || refreshForAbility;
	578	+ // A card shown now would flash just before the reload.
502	579	addMessage('workflow', {
503	580	status: 'completed',
504	581	label: labels?.confirm,
505	582	agent: workflow.agent,
		@@ -504,9 +581,9 @@
504	581	label: labels?.confirm,
505	582	agent: workflow.agent,
506	583	workflowId: workflow.id,
507	584	answerId,
508		- suggestions: getSuggestions(),
	585	+ ...(willReload ? {} : nextSteps(workflow.id, 'completed')),
509	586	});
510	587	// A chat message persists, so the next turn's model knows the save was partial.
511	588	const refusedCount = toolResponse?.refusedOperations?.length;
512	589	if (refusedCount) {
		@@ -526,13 +603,9 @@
526	603	}
527	604	setWorkflow(null);
528	605	useCanvasStore.getState().endSession();
529	606
530		- const url = getRedirectUrl(redirectTo, whenFinishedToolProps?.inputs);
531		- const refreshForAbility = isAbilityTool(id);
532		- if (url || redirectUrl || shouldRefreshPage || refreshForAbility) {
533		- return doReload(url || redirectUrl);
534		- }
	607	+ if (willReload) return doReload(redirectUrl);
535	608	cleanup();
536	609	};
537	610	const handleCancel = ({ detail }) => {
538	611	if (toolWorking.current) return;
		@@ -545,9 +618,9 @@
545	618	label: whenFinishedTool?.labels?.cancel,
546	619	agent: workflow.agent,
547	620	workflowId: workflow.id,
548	621	answerId,
549		- suggestions: getSuggestions(),
	622	+ ...nextSteps(workflow.id, 'canceled'),
550	623	});
551	624	setWorkflow(null);
552	625	useCanvasStore.getState().endSession();
553	626	cleanup();
		@@ -572,18 +645,9 @@
572	645	handleCancel,
573	646	);
574	647	window.removeEventListener('extendify-agent:workflow-retry', handleRetry);
575	648	};
576		- }, [
577		- addMessage,
578		- pushStatus,
579		- popMessage,
580		- cleanup,
581		- setWorkflow,
582		- workflow,
583		- getSuggestions,
584		- addSuggestions,
585		- ]);
	649	+ }, [addMessage, pushStatus, popMessage, cleanup, setWorkflow, workflow]);
586	650
587	651	useEffect(() => {
588	652	const handleClose = () => setOpen(false);
589	653	const handleOpen = () => setOpen(true);
		@@ -603,9 +667,26 @@
603	667	if (open) return;
604	668	if (block) setBlock(null);
605	669	}, [open, block, setBlock]);
606	670
	671	+ // A pick answers select-block's "which one?"; making the user also type stalls it.
	672	+ const previousBlock = useRef(block);
607	673	useEffect(() => {
	674	+ const picked = block && !previousBlock.current;
	675	+ previousBlock.current = block;
	676	+ if (!picked || workflow?.id !== 'select-block') return;
	677	+ if (!waitingOnToolOrUser || !canType || whenFinishedToolProps?.id) return;
	678	+ handleSubmit('This is the block I mean.', { hidden: true });
	679	+ }, [
	680	+ block,
	681	+ workflow?.id,
	682	+ waitingOnToolOrUser,
	683	+ canType,
	684	+ whenFinishedToolProps?.id,
	685	+ handleSubmit,
	686	+ ]);
	687	+
	688	+ useEffect(() => {
608	689	if (waitingOnToolOrUser || !open || !workflow?.id) return;
609	690	// Some workflows require they dont change pages
610	691	const theyMoved = workflow?.startingPage !== window.location.href;
611	692	// Requires a block to be selected
		@@ -616,9 +697,9 @@
616	697	addMessage('workflow', {
617	698	status: 'canceled',
618	699	agent: workflow.agent,
619	700	workflowId: workflow.id,
620		- suggestions: getSuggestions(),
	701	+ ...nextSteps(workflow.id, 'canceled'),
621	702	});
622	703	setWorkflow(null);
623	704	cleanup();
624	705	return;
		@@ -693,9 +774,9 @@
693	774	// translators: Shown while the AI agent deselects a block that can't serve the request.
694	775	__('Removing selected block', 'extendify-local'),
695	776	);
696	777	// findAgent pushes its own status right away; let this one read first.
697		- await new Promise((resolve) => setTimeout(resolve, 2500));
	778	+ if (await canceledDuring(2500)) return;
698	779	agentWorking.current = false;
699	780	await findAgent();
700	781	return;
701	782	}
		@@ -715,9 +796,8 @@
715	796	status: 'completed',
716	797	inputs,
717	798	workflowId: workflow.id,
718	799	});
719		- addSuggestions(agentResponse.recommendations);
720	800	setWorkflow(null);
721	801	addMessage('workflow', {
722	802	status: 'completed',
723	803	agent: workflow.agent,
		@@ -722,9 +802,9 @@
722	802	status: 'completed',
723	803	agent: workflow.agent,
724	804	workflowId: workflow.id,
725	805	answerId,
726		- suggestions: getSuggestions(),
	806	+ ...nextSteps(workflow.id, 'completed'),
727	807	});
728	808	cleanup();
729	809	}
730	810	return;
		@@ -730,19 +810,21 @@
730	810	return;
731	811	}
732	812	// If we're done, it means the AI has the answer
733	813	if (agentResponse.status !== 'in-progress') {
734		- const { recommendations, status } = agentResponse;
735		- const isCompleted = status === 'completed';
736		- if (recommendations) addSuggestions(recommendations);
	814	+ const status =
	815	+ agentResponse.status === 'completed' ? 'completed' : 'canceled';
	816	+ // A reply that changed nothing isn't a finished task to follow up.
	817	+ const didWork =
	818	+ toolCallsThisRun(useChatStore.getState().messages).length > 0;
737	819	setWorkflow(null);
738	820	cleanup();
739	821	addMessage('workflow', {
740		- status: isCompleted ? 'completed' : 'canceled',
	822	+ status,
741	823	agent: workflow.agent,
742	824	workflowId: workflow.id,
743	825	answerId,
744		- suggestions: getSuggestions(),
	826	+ ...(didWork ? nextSteps(workflow.id, status) : { followUp: null }),
745	827	});
746	828	return;
747	829	}
748	830	if (sessionId && sessionId !== workflow.sessionId) {
		@@ -762,9 +844,10 @@
762	844	setWaitingOnToolOrUser(true);
763	845	setCanType(false);
764	846	return;
765	847	}
766		- pushStatus('tool-started', labels?.started);
	848	+ // A reply sent with the tool clears the status, blanking the line.
	849	+ pushStatus('agent-working');
767	850	const toolData = await Promise.all([
768	851	callTool({ tool: id, inputs }),
769	852	new Promise((resolve) => setTimeout(resolve, 3000)),
770	853	])
		@@ -795,8 +878,9 @@
795	878	id,
796	879	inputs,
797	880	result: toolData,
798	881	label: labels?.confirm,
	882	+ started: labels?.started,
799	883	});
800	884	setWaitingOnToolOrUser(false);
801	885	agentWorking.current = false;
802	886	setLoop((prev) => prev + 1); // Trigger next loop
		@@ -842,10 +926,8 @@
842	926	setWhenFinishedToolProps,
843	927	block,
844	928	setBlock,
845	929	findAgent,
846		- addSuggestions,
847		- getSuggestions,
848	930	]);
849	931
850	932	useEffect(() => {
851	933	if (!canType) return;
		@@ -851,9 +933,15 @@
851	933	if (!canType) return;
852	934	document.querySelector('#extendify-agent-chat-textarea')?.focus();
853	935	}, [canType]);
854	936
855		- const busy = !canType || !chatAvailable || workflow?.id;
	937	+ // A task waiting on a reply leaves the page pickable so the user can answer by pointing.
	938	+ const waiting =
	939	+ canType &&
	940	+ chatAvailable &&
	941	+ Boolean(workflow?.id) &&
	942	+ !whenFinishedToolProps?.id;
	943	+ const busy = !canType || !chatAvailable || (workflow?.id && !waiting);
856	944	// `busy` is true at rest; 429 is blocked, not working.
857	945	const working = !canType && chatAvailable;
858	946
859	947	return (
		@@ -858,9 +946,14 @@
858	946
859	947	return (
860	948	<>
861	949	<Canvas />
862		- <Chat busy={busy} working={working}>
	950	+ <Chat
	951	+ busy={busy}
	952	+ working={working}
	953	+ waiting={waiting}
	954	+ taskActive={Boolean(workflow?.id)}
	955	+ >
863	956	<div className="relative z-50 flex h-full flex-col justify-between overflow-auto">
864	957	<ChatMessages
865	958	redirectComponent={
866	959	workflow?.needsRedirect?.() ? workflow.redirectComponent : null
		@@ -875,11 +968,16 @@
875	968	}}
876	969	/>
877	970	</div>
878	971	<div className="p-4 pb-2 pt-0">
	972	+ <StatusIndicator />
879	973	<ChatInput
880	974	disabled={
881		- !canType || !chatAvailable || !!qaSuggestions || leavingPage
	975	+ !canType ||
	976	+ !chatAvailable ||
	977	+ !!qaSuggestions ||
	978	+ leavingPage ||
	979	+ whenFinishedToolProps?.processing
882	980	}
883	981	handleSubmit={handleSubmit}
884	982	/>
885	983	</div>