@geminilight/mindos 0.6.58 → 0.6.60

package/_standalone/components/Panel.tsx

@@ -316,7 +316,12 @@ export default function Panel({
             </div>
           </div>
         </PanelHeader>
-        <div className="flex-1 overflow-y-auto min-h-0 px-2 py-2">
+        <div
+          className="flex-1 overflow-y-auto min-h-0 px-2 py-2"
+          onDragEnter={(e) => { if (e.dataTransfer.types.includes('Files')) e.stopPropagation(); }}
+          onDragOver={(e) => { if (e.dataTransfer.types.includes('Files')) { e.preventDefault(); e.stopPropagation(); } }}
+          onDrop={(e) => { if (e.dataTransfer.types.includes('Files')) { e.preventDefault(); e.stopPropagation(); } }}
+        >
           <FileTree nodes={fileTree} onNavigate={onNavigate} maxOpenDepth={maxOpenDepth} onImport={onImport} />
         </div>
         <SyncStatusBar collapsed={false} onOpenSyncSettings={onOpenSyncSettings} />

package/_standalone/components/RightAskPanel.tsx

@@ -119,7 +119,7 @@ export default function RightAskPanel({
     <aside
       className={`
         hidden md:flex fixed top-0 right-0 h-screen z-40
-        flex-col bg-card border-l border-border
+        flex-col bg-background border-l border-border/40 shadow-[-4px_0_16px_rgba(0,0,0,0.04)]
         transition-[width,transform] duration-200 ease-out
         ${open ? 'translate-x-0' : 'translate-x-full pointer-events-none'}
       `}
@@ -161,7 +161,7 @@ export default function RightAskPanel({
         className="absolute top-0 -left-[3px] w-[6px] h-full cursor-col-resize z-40 group hidden md:block"
         onMouseDown={handleMouseDown}
       >
-        <div className="absolute left-[2px] top-0 w-[2px] h-full opacity-0 group-hover:opacity-100 bg-[var(--amber)]/60 transition-opacity" />
+        <div className="absolute left-[2px] top-0 w-[1px] h-full opacity-0 group-hover:opacity-100 bg-[var(--amber)]/50 transition-opacity duration-150" />
       </div>
     </aside>
   );

package/_standalone/components/agents/AgentsOverviewSection.tsx

@@ -223,17 +223,7 @@ export default function AgentsOverviewSection({
             </span>
           </div>
           <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
-            {sortedAgents.map((agent, i) => (
-              <AgentCard
-                key={agent.key}
-                agent={agent}
-                copy={copy}
-                index={i}
-                mcpEnabled={mcpEnabled}
-                onEdit={agent.isCustom ? onEditCustomAgent : undefined}
-                onRemove={agent.isCustom ? onRemoveCustomAgent : undefined}
-              />
-            ))}
+            {/* Add Custom Agent Button — Always First */}
             {onAddCustomAgent && (
               <button
                 type="button"
@@ -254,6 +244,18 @@ export default function AgentsOverviewSection({
                 </span>
               </button>
             )}
+            {/* Agent Cards */}
+            {sortedAgents.map((agent, i) => (
+              <AgentCard
+                key={agent.key}
+                agent={agent}
+                copy={copy}
+                index={i}
+                mcpEnabled={mcpEnabled}
+                onEdit={agent.isCustom ? onEditCustomAgent : undefined}
+                onRemove={agent.isCustom ? onRemoveCustomAgent : undefined}
+              />
+            ))}
           </div>
         </section>
       ) : (

package/_standalone/components/agents/CustomAgentModal.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useState, useEffect, useRef, useCallback, useMemo } from 'react';
-import { X, Loader2, ChevronRight, ChevronDown, CheckCircle2, Info, AlertCircle } from 'lucide-react';
+import { X, Loader2, ChevronRight, ChevronDown, CheckCircle2, Info, AlertCircle, Server, Zap } from 'lucide-react';
 import { useLocale } from '@/lib/stores/locale-store';
 import { useFocusTrap } from '@/lib/hooks/useFocusTrap';
 import { toast } from '@/lib/toast';
@@ -19,6 +19,8 @@ interface DetectResult {
   detectedSkillDir?: string;
   skillCount?: number;
   skillNames?: string[];
+  mcpServers?: string[];
+  mcpParseError?: string;
   suggestedName?: string;
 }
 
@@ -406,7 +408,7 @@ export default function CustomAgentModal({
           {phase === 'result' && (
             <>
               {/* Result Card */}
-              <div className={`rounded-lg p-4 space-y-2 ${
+              <div className={`rounded-lg p-4 space-y-3 ${
                 detectResult?.exists
                   ? 'border border-[var(--success)]/20 bg-[var(--success)]/5'
                   : 'border border-border bg-muted/30'
@@ -414,22 +416,74 @@ export default function CustomAgentModal({
                 <p className="text-xs font-medium text-muted-foreground uppercase tracking-wider">
                   {detectResult?.exists ? p.customAgentDetectedTitle : p.customAgentDefaultTitle}
                 </p>
-                <div className="grid grid-cols-[auto_1fr] gap-x-4 gap-y-1.5 text-sm">
-                  <span className="text-muted-foreground">{p.customAgentConfigLabel}</span>
-                  <span className="text-foreground font-mono text-xs truncate">{form.global}</span>
-
-                  <span className="text-muted-foreground">{p.customAgentFormatLabel}</span>
-                  <span className="text-foreground">{form.format.toUpperCase()} · {form.configKey}</span>
-
-                  <span className="text-muted-foreground">{p.customAgentTransportLabel}</span>
-                  <span className="text-foreground">{form.preferredTransport}</span>
-
-                  <span className="text-muted-foreground">{p.customAgentSkillsLabel}</span>
-                  <span className="text-foreground">
-                    {detectResult?.hasSkillsDir
-                      ? p.customAgentSkillsFound(detectResult.skillCount ?? 0)
-                      : p.customAgentSkillsNone ?? '—'}
-                  </span>
+                <div className="space-y-2.5">
+                  {/* Config Path */}
+                  <div>
+                    <p className="text-xs text-muted-foreground mb-1">{p.customAgentConfigLabel}</p>
+                    <span className="text-sm text-foreground font-mono truncate block">{form.global}</span>
+                    {detectResult?.mcpParseError && (
+                      <p className="text-xs text-[var(--error)] mt-1 flex items-center gap-1">
+                        <AlertCircle size={12} className="shrink-0" />
+                        {detectResult.mcpParseError}
+                      </p>
+                    )}
+                  </div>
+
+                  {/* Format & Key */}
+                  <div className="grid grid-cols-2 gap-2">
+                    <div>
+                      <p className="text-xs text-muted-foreground mb-1">{p.customAgentFormatLabel}</p>
+                      <span className="text-sm text-foreground">{form.format.toUpperCase()}</span>
+                    </div>
+                    <div>
+                      <p className="text-xs text-muted-foreground mb-1">Config Key</p>
+                      <span className="text-sm text-foreground font-mono">{form.configKey}</span>
+                    </div>
+                  </div>
+
+                  {/* Transport */}
+                  <div>
+                    <p className="text-xs text-muted-foreground mb-1">{p.customAgentTransportLabel}</p>
+                    <span className="text-sm text-foreground">{form.preferredTransport}</span>
+                  </div>
+
+                  {/* MCP Servers */}
+                  <div>
+                    <p className="text-xs text-muted-foreground mb-1 flex items-center gap-1">
+                      <Server size={11} className="shrink-0" aria-hidden="true" />
+                      MCP Servers
+                    </p>
+                    {detectResult?.mcpServers && detectResult.mcpServers.length > 0 ? (
+                      <div className="flex flex-wrap gap-1">
+                        {detectResult.mcpServers.map(name => (
+                          <span key={name} className="text-xs bg-muted/60 text-foreground px-2 py-0.5 rounded font-mono">
+                            {name}
+                          </span>
+                        ))}
+                      </div>
+                    ) : (
+                      <span className="text-sm text-muted-foreground">—</span>
+                    )}
+                  </div>
+
+                  {/* Skills */}
+                  <div>
+                    <p className="text-xs text-muted-foreground mb-1 flex items-center gap-1">
+                      <Zap size={11} className="shrink-0" aria-hidden="true" />
+                      {p.customAgentSkillsLabel}
+                    </p>
+                    {detectResult?.skillNames && detectResult.skillNames.length > 0 ? (
+                      <div className="flex flex-wrap gap-1">
+                        {detectResult.skillNames.map(name => (
+                          <span key={name} className="text-xs bg-[var(--amber-dim)] text-[var(--amber-text,var(--foreground))] px-2 py-0.5 rounded font-mono">
+                            {name}
+                          </span>
+                        ))}
+                      </div>
+                    ) : (
+                      <span className="text-sm text-muted-foreground">—</span>
+                    )}
+                  </div>
                 </div>
               </div>
 

package/_standalone/components/ask/AskContent.tsx

@@ -15,7 +15,6 @@ import MessageList from '@/components/ask/MessageList';
 import MentionPopover from '@/components/ask/MentionPopover';
 import SlashCommandPopover from '@/components/ask/SlashCommandPopover';
 import SessionHistory from '@/components/ask/SessionHistory';
-import SessionTabBar from '@/components/ask/SessionTabBar';
 import AskHeader from '@/components/ask/AskHeader';
 import FileChip from '@/components/ask/FileChip';
 import AgentSelectorCapsule from '@/components/ask/AgentSelectorCapsule';
@@ -65,8 +64,8 @@ interface AskContentProps {
   /** ACP agent pre-selected via "Use" button from A2A tab */
   initialAcpAgent?: AcpAgentSelection | null;
   onFirstMessage?: () => void;
-  /** 'modal' renders close button + ESC handler; 'panel' renders compact header */
-  variant: 'modal' | 'panel';
+  /** 'modal' renders close button + ESC handler; 'panel' renders compact header; 'home' renders embedded on homepage */
+  variant: 'modal' | 'panel' | 'home';
   /** Required for modal variant — called on close button / ESC / backdrop click */
   onClose?: () => void;
   maximized?: boolean;
@@ -79,6 +78,7 @@ interface AskContentProps {
 
 export default function AskContent({ visible, currentFile, initialMessage, initialAcpAgent, onFirstMessage, variant, onClose, maximized, onMaximize, askMode, onModeSwitch }: AskContentProps) {
   const isPanel = variant === 'panel';
+  const isHome = variant === 'home';
 
   const inputRef = useRef<HTMLTextAreaElement>(null);
   const imageInputRef = useRef<HTMLInputElement>(null);
@@ -160,12 +160,26 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
     return () => window.removeEventListener('mindos:inject-ask-files', handler);
   }, []);
 
+  // Home suggestion chip click — inject text into input
+  useEffect(() => {
+    if (!isHome) return;
+    const handler = (e: Event) => {
+      const text = (e as CustomEvent).detail?.text;
+      if (typeof text === 'string') {
+        setInput(text);
+        setTimeout(() => inputRef.current?.focus(), 50);
+      }
+    };
+    window.addEventListener('mindos:home-suggestion', handler);
+    return () => window.removeEventListener('mindos:home-suggestion', handler);
+  }, [isHome]);
+
   // Focus and init session when becoming visible (edge-triggered for panel, level-triggered for modal)
   const prevVisibleRef = useRef(false);
   const prevFileRef = useRef(currentFile);
   useEffect(() => {
-    const justOpened = variant === 'panel'
-      ? (visible && !prevVisibleRef.current)  // panel: edge detection
+    const justOpened = variant === 'panel' || variant === 'home'
+      ? (visible && !prevVisibleRef.current)  // panel/home: edge detection
       : visible;                               // modal: level detection (reset every open)
 
     // Detect file change while panel is already open
@@ -173,14 +187,15 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
 
     if (justOpened) {
       setTimeout(() => inputRef.current?.focus(), 50);
+      // Home variant: also load sessions so user can switch
       void session.initSessions();
       setInput(initialMessage || '');
       chat.firstMessageFired.current = false;
       setAttachedFiles(currentFile ? [currentFile] : []);
-    upload.clearAttachments();
-    imageUpload.clearImages();
-    mention.resetMention();
-    slash.resetSlash();
+      upload.clearAttachments();
+      imageUpload.clearImages();
+      mention.resetMention();
+      slash.resetSlash();
     setSelectedSkill(null);
     setSelectedAcpAgent(initialAcpAgent ?? null);
     setShowHistory(false);
@@ -191,6 +206,10 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
       // Modal: abort streaming on close
       chat.abortRef.current?.abort();
     }
+    // Home variant: auto-focus on mount
+    if (variant === 'home' && visible && !prevVisibleRef.current) {
+      setTimeout(() => inputRef.current?.focus(), 150);
+    }
     prevVisibleRef.current = visible;
     prevFileRef.current = currentFile;
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -209,9 +228,9 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [visible, session.messages, session.activeSessionId, chat.isLoading]);
 
-  // Esc to close modal or exit focus mode
+  // Esc to close modal or exit focus mode (skip for home variant)
   useEffect(() => {
-    if (!visible) return;
+    if (!visible || variant === 'home') return;
     const isModal = variant === 'modal';
     const isFocused = variant === 'panel' && maximized;
     if (!isModal && !isFocused) return;
@@ -376,6 +395,7 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
     setSelectedSkill(null);
     setSelectedAcpAgent(null);
     setShowHistory(false);
+    chat.firstMessageFired.current = false;
     setTimeout(() => inputRef.current?.focus(), 0);
   }, [currentFile]);
 
@@ -383,6 +403,7 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
     // Accept mindos file paths and image drops
     if (e.dataTransfer.types.includes('text/mindos-path') || e.dataTransfer.types.includes('Files')) {
       e.preventDefault();
+      e.stopPropagation();
       e.dataTransfer.dropEffect = 'copy';
       setIsDragOver(true);
     }
@@ -392,6 +413,7 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
 
   const handleDrop = useCallback(async (e: React.DragEvent) => {
     e.preventDefault();
+    e.stopPropagation();
     setIsDragOver(false);
     const filePath = e.dataTransfer.getData('text/mindos-path');
     if (filePath) {
@@ -402,7 +424,21 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
       }
       return;
     }
-    await imageUploadRef.current.handleDrop(e);
+    // Try image upload first, then fall back to general file upload
+    const files = e.dataTransfer.files;
+    if (files.length > 0) {
+      const hasImages = Array.from(files).some(f => f.type.startsWith('image/'));
+      if (hasImages) {
+        await imageUploadRef.current.handleDrop(e);
+      }
+      // Upload non-image files as attachments
+      const nonImageFiles = Array.from(files).filter(f => !f.type.startsWith('image/'));
+      if (nonImageFiles.length > 0) {
+        const dt = new DataTransfer();
+        nonImageFiles.forEach(f => dt.items.add(f));
+        await uploadRef.current.pickFiles(dt.files);
+      }
+    }
   }, []);
 
   const handlePaste = useCallback((e: React.ClipboardEvent) => {
@@ -438,34 +474,31 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
     thinking: t.ask.thinking,
     generating: t.ask.generating,
     reconnecting: reconnectAttempt > 0 ? t.ask.reconnecting(reconnectAttempt, reconnectMaxRef.current) : undefined,
+    copyMessage: t.ask.copyMessage,
   }), [t, reconnectAttempt]);
 
   return (
     <>
+      {/* Header — home variant shows session switcher + new/history/fullscreen buttons */}
       <AskHeader
-        isPanel={isPanel}
+        isPanel={isPanel || isHome}
         showHistory={showHistory}
         onToggleHistory={toggleHistory}
         onReset={handleResetSession}
         isLoading={isLoading}
         maximized={maximized}
-        onMaximize={onMaximize}
-        askMode={askMode}
-        onModeSwitch={onModeSwitch}
-        onClose={onClose}
+        onMaximize={isHome ? onMaximize : onMaximize}
+        askMode={isHome ? undefined : askMode}
+        onModeSwitch={isHome ? undefined : onModeSwitch}
+        onClose={isHome ? undefined : onClose}
+        sessions={session.sessions}
+        activeSessionId={session.activeSessionId}
+        onLoadSession={handleLoadSession}
+        onDeleteSession={session.deleteSession}
+        onRenameSession={session.renameSession}
+        onTogglePinSession={session.togglePinSession}
       />
 
-      {/* Session tabs — panel variant only */}
-      {isPanel && session.sessions.length > 0 && (
-        <SessionTabBar
-          sessions={session.sessions}
-          activeSessionId={session.activeSessionId}
-          onLoad={handleLoadSession}
-          onDelete={session.deleteSession}
-          onNew={handleResetSession}
-        />
-      )}
-
       {showHistory && (
         <SessionHistory
           sessions={session.sessions}
@@ -473,6 +506,7 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
           onLoad={handleLoadSession}
           onDelete={session.deleteSession}
           onRename={session.renameSession}
+          onTogglePin={session.togglePinSession}
           onClearAll={session.clearAllSessions}
           labels={{
             title: t.ask.sessionHistory ?? 'Session History',
@@ -485,16 +519,31 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
       )}
 
       {/* Messages */}
-      <MessageList
-        messages={session.messages}
-        isLoading={isLoading}
-        loadingPhase={loadingPhase}
-        emptyPrompt={t.ask.emptyPrompt}
-        emptyHint={t.ask.emptyHint}
-        suggestions={t.ask.suggestions}
-        onSuggestionClick={setInput}
-        labels={messageLabels}
-      />
+      {/* Messages — home variant hides empty state (suggestions rendered externally) */}
+      {!isHome && (
+        <MessageList
+          messages={session.messages}
+          isLoading={isLoading}
+          loadingPhase={loadingPhase}
+          emptyPrompt={t.ask.emptyPrompt}
+          emptyHint={t.ask.emptyHint}
+          suggestions={t.ask.suggestions}
+          onSuggestionClick={setInput}
+          labels={messageLabels}
+        />
+      )}
+      {isHome && session.messages.length > 0 && (
+        <MessageList
+          messages={session.messages}
+          isLoading={isLoading}
+          loadingPhase={loadingPhase}
+          emptyPrompt={t.ask.emptyPrompt}
+          emptyHint={t.ask.emptyHint}
+          suggestions={[]}
+          onSuggestionClick={setInput}
+          labels={messageLabels}
+        />
+      )}
 
       {/* Popovers — flex children so they stay within overflow boundary (absolute positioning would be clipped by RightAskPanel's overflow-hidden) */}
       {mention.mentionQuery !== null && mention.mentionResults.length > 0 && (
@@ -519,11 +568,11 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
         </div>
       )}
 
-      {/* Composer card — unified input area with rounded container */}
-      <div className="shrink-0 px-3 pb-2 pt-1">
+      {/* Composer card — unified input area */}
+      <div className="shrink-0 px-3 pb-2.5 pt-1">
         <div
           className={cn(
-            'rounded-xl border border-border/60 bg-card shadow-sm transition-shadow',
+            'rounded-xl bg-muted/40 transition-all focus-within:bg-muted/60',
             isDragOver && 'ring-2 ring-[var(--amber)] bg-[var(--amber-dim)]',
           )}
           onDragOver={handleDragOver}
@@ -538,12 +587,12 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
                   <FileChip key={f} path={f} variant="kb" onRemove={() => setAttachedFiles(prev => prev.filter(x => x !== f))} />
                 ))}
                 {upload.localAttachments.map((f, idx) => (
-                  <FileChip key={`up-${f.name}-${idx}`} path={f.name} variant="upload" onRemove={() => upload.removeAttachment(idx)} />
+                  <FileChip key={`up-${f.name}-${idx}`} path={f.name} variant="upload" status={f.status} error={f.error} truncatedInfo={f.truncatedInfo} onRemove={() => upload.removeAttachment(idx)} />
                 ))}
                 {imageUpload.images.map((img, idx) => (
                   <FileChip
                     key={`img-${idx}`}
-                    path={`Image ${idx + 1}`}
+                    path={img.fileName || `Image ${idx + 1}`}
                     variant="image"
                     imageData={img.data}
                     imageMime={img.mimeType}
@@ -568,23 +617,23 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
           <form
             ref={formRef}
             onSubmit={handleSubmit}
-            className="flex items-end gap-1 px-1.5 py-1.5"
+            className="flex items-end gap-1.5 px-3 py-2"
           >
             {/* + attach button with mini menu */}
             <div className="relative shrink-0">
               <button
                 type="button"
                 onClick={() => setShowAttachMenu(v => !v)}
-                className="p-1.5 rounded-lg text-muted-foreground hover:text-foreground hover:bg-muted/60 transition-colors"
+                className="p-2 rounded-lg text-muted-foreground hover:text-foreground hover:bg-muted/60 transition-colors"
                 title={t.hints.attachFile}
               >
                 <Plus size={inputIconSize} />
               </button>
               {showAttachMenu && (
-                <div className="absolute bottom-full left-0 mb-1 py-1 rounded-lg border border-border bg-card shadow-lg z-50 min-w-[140px]">
+                <div className="absolute bottom-full left-0 mb-1.5 py-1 rounded-xl border border-border/60 bg-card shadow-lg z-50 min-w-[150px] animate-in fade-in-0 slide-in-from-bottom-2 duration-150">
                   <button
                     type="button"
-                    className="flex w-full items-center gap-2 px-3 py-1.5 text-xs hover:bg-muted transition-colors text-left"
+                    className="flex w-full items-center gap-2.5 px-3 py-2 text-xs hover:bg-muted transition-colors text-left rounded-lg"
                     onClick={() => { setShowAttachMenu(false); upload.uploadInputRef.current?.click(); }}
                   >
                     <FileText size={12} className="shrink-0 text-muted-foreground" />
@@ -592,7 +641,7 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
                   </button>
                   <button
                     type="button"
-                    className="flex w-full items-center gap-2 px-3 py-1.5 text-xs hover:bg-muted transition-colors text-left"
+                    className="flex w-full items-center gap-2.5 px-3 py-2 text-xs hover:bg-muted transition-colors text-left rounded-lg"
                     onClick={() => { setShowAttachMenu(false); imageInputRef.current?.click(); }}
                   >
                     <ImageIcon size={12} className="shrink-0 text-muted-foreground" />
@@ -637,23 +686,24 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
               onPaste={handlePaste}
               placeholder={t.ask.placeholder}
               rows={1}
-              className="min-w-0 flex-1 resize-none overflow-y-hidden bg-transparent py-1.5 text-sm leading-snug text-foreground placeholder:text-muted-foreground outline-none focus-visible:ring-0"
+              className="min-w-0 flex-1 resize-none overflow-y-hidden bg-transparent py-2 text-sm leading-relaxed text-foreground placeholder:text-muted-foreground/50 outline-none focus-visible:ring-0"
             />
 
             {isLoading ? (
-              <button type="button" onClick={handleStop} className="p-1.5 rounded-lg transition-colors shrink-0 text-muted-foreground hover:text-foreground hover:bg-muted/60" title={loadingPhase === 'reconnecting' ? t.ask.cancelReconnect : t.ask.stopTitle}>
+              <button type="button" onClick={handleStop} className="p-2 rounded-xl transition-colors shrink-0 text-foreground bg-muted hover:bg-muted/80" title={loadingPhase === 'reconnecting' ? t.ask.cancelReconnect : t.ask.stopTitle}>
                 {loadingPhase === 'reconnecting' ? <X size={inputIconSize} /> : <StopCircle size={inputIconSize} />}
               </button>
             ) : (
-              <button type="submit" disabled={!input.trim() && imageUpload.images.length === 0} className="p-1.5 rounded-lg disabled:opacity-40 disabled:cursor-not-allowed transition-opacity shrink-0 bg-[var(--amber)] text-[var(--amber-foreground)]">
+              <button type="submit" disabled={!input.trim() && imageUpload.images.length === 0} className="p-2 rounded-xl disabled:opacity-20 disabled:scale-95 disabled:cursor-not-allowed transition-all duration-150 shrink-0 bg-[var(--amber)] text-[var(--amber-foreground)] shadow-sm shadow-[var(--amber)]/15 hover:shadow-md hover:shadow-[var(--amber)]/20 active:scale-95">
                 <Send size={14} />
               </button>
             )}
           </form>
 
-          {/* Mode + Agent + Provider selector row — inside card bottom */}
-          <div className="flex items-center gap-1.5 px-3 pb-2 pt-0.5 border-t border-border/30">
-            <ModeCapsule mode={chatMode} onChange={setChatMode} disabled={isLoading} />
+          {/* Mode + Agent + Provider selector row + keyboard hint */}
+          <div className="flex items-center justify-between px-3 pb-2 pt-1.5 border-t border-border/10">
+            <div className="flex items-center gap-2">
+              <ModeCapsule mode={chatMode} onChange={setChatMode} disabled={isLoading} />
             {mounted && acpDetection.installedAgents.length > 0 && (
               <AgentSelectorCapsule
                 selectedAgent={selectedAcpAgent}
@@ -669,6 +719,11 @@ export default function AskContent({ visible, currentFile, initialMessage, initi
                 disabled={isLoading}
               />
             )}
+            </div>
+            {/* Keyboard hint */}
+            <span className="hidden md:inline text-2xs text-muted-foreground/40 select-none">
+              <kbd className="font-mono">Enter</kbd> {t.ask.send} · <kbd className="font-mono">Shift+Enter</kbd> {t.ask.newlineHint}
+            </span>
           </div>
         </div>
       </div>