Chat UX Enhancements

AGENTS.md

@@ -1,5 +1,9 @@
 # Superset Monorepo Guide
 
+## Question Tool
+
+When you need to ask the user ANY question — including simple yes/no, confirmations, and clarifications — ALWAYS use the `ask_user` tool. Never ask questions in plain text. The Superset UI renders `ask_user` calls as an interactive overlay with clickable option buttons; plain-text questions will not be surfaced to the user in the same way.
+
 Guidelines for agents and developers working in this repository.
 
 ## Structure

apps/desktop/package.json

@@ -72,7 +72,7 @@
 		"@hono/node-server": "^1.14.1",
 		"@hookform/resolvers": "^5.2.2",
 		"@lezer/highlight": "^1.2.3",
-		"@mastra/core": "1.25.0",
+		"@mastra/core": "1.26.0-alpha.3",
 		"@parcel/watcher": "^2.5.6",
 		"@pierre/diffs": "1.1.3",
 		"@radix-ui/react-dialog": "^1.1.15",
@@ -130,6 +130,7 @@
 		"@tiptap/extension-task-list": "^3.17.1",
 		"@tiptap/extension-text": "^3.17.1",
 		"@tiptap/extension-underline": "^3.17.1",
+		"@tiptap/pm": "^3.17.1",
 		"@tiptap/react": "^3.17.1",
 		"@tiptap/starter-kit": "^3.17.1",
 		"@tiptap/suggestion": "^3.17.1",
@@ -182,7 +183,7 @@
 		"lowdb": "^7.0.1",
 		"lowlight": "^3.3.0",
 		"lucide-react": "^0.563.0",
-		"mastracode": "0.14.0",
+		"mastracode": "0.15.0-alpha.3",
 		"nanoid": "^5.1.6",
 		"node-addon-api": "^7.1.0",
 		"node-pty": "1.1.0",
@@ -209,6 +210,7 @@
 		"semver": "^7.7.3",
 		"shell-env": "^4.0.3",
 		"shell-quote": "^1.8.3",
+		"shiki": "^3.21.0",
 		"simple-git": "^3.30.0",
 		"streamdown": "2.5.0",
 		"strip-ansi": "^7.1.2",

apps/desktop/src/main/lib/notifications/notification-manager.ts

@@ -64,13 +64,16 @@ export class NotificationManager {
 		const title = this.deps.getNotificationTitle(event);
 
 		const isPermissionRequest = event.eventType === "PermissionRequest";
+		const isPendingQuestion = event.eventType === "PendingQuestion";
 		const notification = this.deps.createNotification({
-			title: isPermissionRequest
-				? `Input Needed — ${workspaceName}`
-				: `Agent Complete — ${workspaceName}`,
-			body: isPermissionRequest
-				? `"${title}" needs your attention`
-				: `"${title}" has finished its task`,
+			title:
+				isPermissionRequest || isPendingQuestion
+					? `Awaiting Response — ${workspaceName}`
+					: `Agent Complete — ${workspaceName}`,
+			body:
+				isPermissionRequest || isPendingQuestion
+					? `"${title}" is waiting for your reply`
+					: `"${title}" has finished its task`,
 			silent: true,
 		});
 

apps/desktop/src/renderer/components/Chat/ChatInterface/components/ChatInputFooter/ChatInputFooter.tsx

@@ -3,26 +3,25 @@ import {
 	PromptInputAttachment,
 	PromptInputAttachments,
 	type PromptInputMessage,
-	PromptInputTextarea,
+	usePromptInputController,
 } from "@superset/ui/ai-elements/prompt-input";
 import type { ThinkingLevel } from "@superset/ui/ai-elements/thinking-toggle";
 import type { ChatStatus, FileUIPart } from "ai";
 import type React from "react";
 import type { ReactNode } from "react";
-import { useCallback, useRef, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { useFocusPromptOnPane } from "renderer/components/Chat/ChatInterface/hooks/useFocusPromptOnPane";
 import { useHotkeyDisplay } from "renderer/hotkeys";
 import type { SlashCommand } from "../../hooks/useSlashCommands";
 import type { ModelOption, PermissionMode } from "../../types";
 import { IssueLinkCommand } from "../IssueLinkCommand";
-import { MentionAnchor, MentionProvider } from "../MentionPopover";
-import { SlashCommandInput } from "../SlashCommandInput";
+import { TiptapPromptEditor } from "../TiptapPromptEditor";
 import { ChatComposerControls } from "./components/ChatComposerControls";
 import { ChatInputDropZone } from "./components/ChatInputDropZone";
 import { ChatShortcuts } from "./components/ChatShortcuts";
 import { FileDropOverlay } from "./components/FileDropOverlay";
 import { LinkedIssues } from "./components/LinkedIssues";
-import { SlashCommandPreview } from "./components/SlashCommandPreview";
+import { QuestionInputOverlay } from "./components/QuestionInputOverlay";
 import type { LinkedIssue } from "./types";
 import { getErrorMessage } from "./utils/getErrorMessage";
 
@@ -48,7 +47,14 @@ interface ChatInputFooterProps {
 	onSubmitEnd?: () => void;
 	onSend: (message: PromptInputMessage) => Promise<void> | void;
 	onStop: (e: React.MouseEvent) => void;
-	onSlashCommandSend: (command: SlashCommand) => void;
+	pendingQuestion?: {
+		questionId: string;
+		question: string;
+		options?: { label: string; description?: string }[];
+	} | null;
+	isQuestionSubmitting?: boolean;
+	onQuestionRespond?: (questionId: string, answer: string) => Promise<void>;
+	onQuestionCancel?: () => void;
 }
 
 export function ChatInputFooter({
@@ -73,9 +79,27 @@ export function ChatInputFooter({
 	onSubmitEnd,
 	onSend,
 	onStop,
-	onSlashCommandSend,
+	pendingQuestion,
+	isQuestionSubmitting,
+	onQuestionRespond,
+	onQuestionCancel,
 }: ChatInputFooterProps) {
 	useFocusPromptOnPane(isFocused);
+
+	// Focus the prompt when the question overlay dismisses (pendingQuestion → null).
+	// Uses rAF so the editor has time to mount, register its ref, and browser
+	// focus-stealing from the unmounting overlay has settled.
+	const { textInput } = usePromptInputController();
+	const prevPendingQuestionRef = useRef(pendingQuestion);
+	useEffect(() => {
+		const prev = prevPendingQuestionRef.current;
+		prevPendingQuestionRef.current = pendingQuestion;
+		if (prev != null && pendingQuestion == null) {
+			const id = requestAnimationFrame(() => textInput.focus());
+			return () => cancelAnimationFrame(id);
+		}
+	}, [pendingQuestion, textInput]);
+
 	const [issueLinkOpen, setIssueLinkOpen] = useState(false);
 	const [linkedIssues, setLinkedIssues] = useState<LinkedIssue[]>([]);
 	const inputRootRef = useRef<HTMLDivElement>(null);
@@ -115,7 +139,7 @@ export function ChatInputFooter({
 	);
 
 	return (
-		<ChatInputDropZone className="bg-background px-4 py-3">
+		<ChatInputDropZone className="relative bg-background px-4 pb-3 before:pointer-events-none before:absolute before:left-0 before:right-3 before:-top-8 before:h-8 before:bg-gradient-to-t before:from-background before:to-transparent">
 			{(dragType) => (
 				<div className="mx-auto w-full max-w-[680px]">
 					{errorMessage && (
@@ -126,82 +150,78 @@ export function ChatInputFooter({
 							{errorMessage}
 						</p>
 					)}
-					<SlashCommandInput
-						onCommandSend={onSlashCommandSend}
-						commands={slashCommands}
-					>
-						<MentionProvider cwd={cwd}>
-							<MentionAnchor>
-								<div
-									ref={inputRootRef}
-									className={
-										dragType === "path"
-											? "relative opacity-50 transition-opacity"
-											: "relative"
+					{pendingQuestion && onQuestionRespond && onQuestionCancel ? (
+						<QuestionInputOverlay
+							question={pendingQuestion}
+							isSubmitting={isQuestionSubmitting ?? false}
+							onRespond={onQuestionRespond}
+							onCancel={onQuestionCancel}
+						/>
+					) : (
+						<div
+							ref={inputRootRef}
+							className={
+								dragType === "path"
+									? "relative opacity-50 transition-opacity"
+									: "relative"
+							}
+						>
+							<PromptInput
+								className="[&>[data-slot=input-group]]:rounded-[13px] [&>[data-slot=input-group]]:border-[0.5px] [&>[data-slot=input-group]]:shadow-none [&>[data-slot=input-group]]:bg-foreground/[0.02]"
+								onSubmitStart={onSubmitStart}
+								onSubmitEnd={onSubmitEnd}
+								onSubmit={handleSend}
+								multiple
+								maxFiles={5}
+								maxFileSize={10 * 1024 * 1024}
+								globalDrop
+							>
+								<ChatShortcuts
+									isFocused={isFocused}
+									setIssueLinkOpen={setIssueLinkOpen}
+								/>
+								<IssueLinkCommand
+									open={issueLinkOpen}
+									onOpenChange={setIssueLinkOpen}
+									onSelect={addLinkedIssue}
+								/>
+								<FileDropOverlay visible={dragType === "files"} />
+								<PromptInputAttachments>
+									{renderAttachment ??
+										((file) => <PromptInputAttachment data={file} />)}
+								</PromptInputAttachments>
+								<LinkedIssues
+									issues={linkedIssues}
+									onRemove={removeLinkedIssue}
+								/>
+								<TiptapPromptEditor
+									cwd={cwd}
+									slashCommands={slashCommands}
+									availableModels={availableModels}
+									placeholder="Ask to make changes, @mention files, run /commands"
+									focusShortcutText={
+										showFocusHint ? focusShortcutText : undefined
 									}
-								>
-									{showFocusHint && (
-										<span className="pointer-events-none absolute top-3 right-3 z-10 text-xs text-muted-foreground/50 [:focus-within>&]:hidden">
-											{focusShortcutText} to focus
-										</span>
-									)}
-									<PromptInput
-										className="[&>[data-slot=input-group]]:rounded-[13px] [&>[data-slot=input-group]]:border-[0.5px] [&>[data-slot=input-group]]:shadow-none [&>[data-slot=input-group]]:bg-foreground/[0.02]"
-										onSubmitStart={onSubmitStart}
-										onSubmitEnd={onSubmitEnd}
-										onSubmit={handleSend}
-										multiple
-										maxFiles={5}
-										maxFileSize={10 * 1024 * 1024}
-										globalDrop
-									>
-										<ChatShortcuts
-											isFocused={isFocused}
-											setIssueLinkOpen={setIssueLinkOpen}
-										/>
-										<IssueLinkCommand
-											open={issueLinkOpen}
-											onOpenChange={setIssueLinkOpen}
-											onSelect={addLinkedIssue}
-										/>
-										<FileDropOverlay visible={dragType === "files"} />
-										<PromptInputAttachments>
-											{renderAttachment ??
-												((file) => <PromptInputAttachment data={file} />)}
-										</PromptInputAttachments>
-										<LinkedIssues
-											issues={linkedIssues}
-											onRemove={removeLinkedIssue}
-										/>
-										<SlashCommandPreview
-											cwd={cwd}
-											slashCommands={slashCommands}
-										/>
-										<PromptInputTextarea
-											placeholder="Ask to make changes, @mention files, run /commands"
-											className="min-h-10"
-										/>
-										<ChatComposerControls
-											availableModels={availableModels}
-											selectedModel={selectedModel}
-											setSelectedModel={setSelectedModel}
-											modelSelectorOpen={modelSelectorOpen}
-											setModelSelectorOpen={setModelSelectorOpen}
-											permissionMode={permissionMode}
-											setPermissionMode={setPermissionMode}
-											thinkingLevel={thinkingLevel}
-											setThinkingLevel={setThinkingLevel}
-											canAbort={canAbort}
-											submitStatus={submitStatus}
-											submitDisabled={submitDisabled}
-											onStop={onStop}
-											onLinkIssue={() => setIssueLinkOpen(true)}
-										/>
-									</PromptInput>
-								</div>
-							</MentionAnchor>
-						</MentionProvider>
-					</SlashCommandInput>
+								/>
+								<ChatComposerControls
+									availableModels={availableModels}
+									selectedModel={selectedModel}
+									setSelectedModel={setSelectedModel}
+									modelSelectorOpen={modelSelectorOpen}
+									setModelSelectorOpen={setModelSelectorOpen}
+									permissionMode={permissionMode}
+									setPermissionMode={setPermissionMode}
+									thinkingLevel={thinkingLevel}
+									setThinkingLevel={setThinkingLevel}
+									canAbort={canAbort}
+									submitStatus={submitStatus}
+									submitDisabled={submitDisabled}
+									onStop={onStop}
+									onLinkIssue={() => setIssueLinkOpen(true)}
+								/>
+							</PromptInput>
+						</div>
+					)}
 					<div className="py-1.5" />
 				</div>
 			)}