@alpaca-editor/core 1.0.4085 → 1.0.4088

package/src/editor/ai/AgentTerminal.tsx

@@ -35,7 +35,7 @@ import { AgentCostDisplay } from "./AgentCostDisplay";
 import { Message } from "./AiTerminal";
 import { getComponentById } from "../componentTreeHelper";
 import { Comment } from "../../types";
-import { AiProfile, loadAiProfiles } from "../services/aiService";
+import { AiProfile } from "../services/aiService";
 import {
   Popover,
   PopoverContent,
@@ -179,9 +179,11 @@ const convertAgentMessagesToAiFormat = (
 export function AgentTerminal({
   agentStub,
   initialMetadata,
+  profiles,
 }: {
   agentStub: Agent;
   initialMetadata?: AgentMetadata;
+  profiles: AiProfile[];
 }) {
   const editContext = useEditContext();
   const fieldsContext = useFieldsEditContext();
@@ -245,7 +247,6 @@ export function AgentTerminal({
   });
   const [currentHistoryIndex, setCurrentHistoryIndex] = useState<number>(-1);
   const [showPredefined, setShowPredefined] = useState(false);
-  const [profiles, setProfiles] = useState<AiProfile[]>([]);
   const [activeProfile, setActiveProfile] = useState<AiProfile | undefined>(
     undefined,
   );
@@ -909,48 +910,102 @@ export function AgentTerminal({
         setIsLoading(false);
 
         // Initialize local context for a brand-new agent (not yet persisted)
-        // Prefer explicitly provided metadata; otherwise seed with page, selected componentIds, and focused field if available
+        // Seed with current page/selection/focused field. If initialMetadata is provided (e.g., profile only), merge context in.
+        const item = editContext?.currentItemDescriptor;
+        const localCtx: AgentMetadata | null = item
+          ? {
+              additionalData: {
+                context: {
+                  pages: [
+                    {
+                      id: item.id,
+                      language: item.language,
+                      version: item.version,
+                      name: editContext?.contentEditorItem?.name,
+                    },
+                  ],
+                  componentIds: editContext?.selection?.length
+                    ? editContext.selection
+                    : undefined,
+                  field:
+                    fieldsContext?.focusedField?.fieldId &&
+                    (fieldsContext.focusedField as any)?.item?.id
+                      ? {
+                          fieldId: fieldsContext.focusedField.fieldId,
+                          itemId: (fieldsContext.focusedField as any).item.id,
+                          name: (fieldsContext.focusedField as any).fieldName,
+                        }
+                      : undefined,
+                },
+              },
+            }
+          : null;
+
+        let nextMetadata: AgentMetadata | null = null;
         if (initialMetadata) {
-          setAgentMetadata(initialMetadata);
+          // Merge initial metadata (e.g., profile) with local context
+          const base: AgentMetadata = {
+            ...(initialMetadata as any),
+            additionalData: {
+              ...((initialMetadata as any)?.additionalData || {}),
+              context: {
+                ...(((initialMetadata as any)?.additionalData
+                  ?.context as any) || {}),
+              },
+            },
+          } as AgentMetadata;
+
+          if (localCtx?.additionalData?.context) {
+            const ctx = base.additionalData!.context as any;
+            const local = localCtx.additionalData!.context as any;
+            // Merge pages (avoid duplicates)
+            if (local.pages && local.pages.length) {
+              const existing = new Set(
+                (ctx.pages || []).map(
+                  (p: any) => `${p.id}-${p.language}-${p.version}`,
+                ),
+              );
+              const mergedPages = [
+                ...(ctx.pages || []),
+                ...local.pages.filter(
+                  (p: any) =>
+                    !existing.has(`${p.id}-${p.language}-${p.version}`),
+                ),
+              ];
+              if (mergedPages.length) ctx.pages = mergedPages;
+            }
+            // Merge componentIds
+            if (local.componentIds && local.componentIds.length) {
+              const existingIds = new Set(ctx.componentIds || []);
+              const mergedIds = [
+                ...(ctx.componentIds || []),
+                ...local.componentIds.filter(
+                  (id: string) => !existingIds.has(id),
+                ),
+              ];
+              if (mergedIds.length) ctx.componentIds = mergedIds;
+            }
+            // Set field if missing
+            if (!ctx.field && local.field) {
+              ctx.field = local.field;
+            }
+          }
+
+          nextMetadata = base;
+        } else {
+          nextMetadata = localCtx;
+        }
+
+        if (nextMetadata) {
+          setAgentMetadata(nextMetadata);
           // If an initial prompt is provided via metadata, seed the input once
           try {
-            const maybePrompt = (initialMetadata as any)?.additionalData
+            const maybePrompt = (nextMetadata as any)?.additionalData
               ?.initialPrompt;
             if (typeof maybePrompt === "string" && maybePrompt.trim()) {
               setPrompt(maybePrompt);
             }
           } catch {}
-        } else {
-          const item = editContext?.currentItemDescriptor;
-          const initialLocalContext: AgentMetadata | null = item
-            ? {
-                additionalData: {
-                  context: {
-                    pages: [
-                      {
-                        id: item.id,
-                        language: item.language,
-                        version: item.version,
-                        name: editContext?.contentEditorItem?.name,
-                      },
-                    ],
-                    componentIds: editContext?.selection?.length
-                      ? editContext.selection
-                      : undefined,
-                    field:
-                      fieldsContext?.focusedField?.fieldId &&
-                      (fieldsContext.focusedField as any)?.item?.id
-                        ? {
-                            fieldId: fieldsContext.focusedField.fieldId,
-                            itemId: (fieldsContext.focusedField as any).item.id,
-                            name: (fieldsContext.focusedField as any).fieldName,
-                          }
-                        : undefined,
-                  },
-                },
-              }
-            : null;
-          if (initialLocalContext) setAgentMetadata(initialLocalContext);
         }
         return;
       }
@@ -1052,23 +1107,7 @@ export function AgentTerminal({
       );
   }, []);
 
-  // Load AI profiles for predefined prompts
-  useEffect(() => {
-    let cancelled = false;
-    (async () => {
-      try {
-        if (!editContext?.currentItemDescriptor) return;
-        const fetched = await loadAiProfiles(editContext.currentItemDescriptor);
-        if (cancelled) return;
-        setProfiles(fetched || []);
-      } catch (e) {
-        console.error("Failed to load AI profiles", e);
-      }
-    })();
-    return () => {
-      cancelled = true;
-    };
-  }, [editContext?.currentItemDescriptor]);
+  // Profiles are provided by parent component (Agents). No local loading here.
 
   // Select active profile based on agent.profileId or default to first
   useEffect(() => {
@@ -1121,6 +1160,17 @@ export function AgentTerminal({
 
       if (!agentId) return;
 
+      const shouldAddTodoFormat = /\b(to-?do|check\s*list|task\s*list)\b/i.test(
+        prompt,
+      );
+      const todoFormatInstructions =
+        "If you produce a to-do list, output it as a 'todo_list' JSON block. Prefer one of these two forms only, with no extra commentary before/after it: \n" +
+        '```todo_list\n{ "title": "<optional title>", "items": [ { "text": "<task>", "done": false, "note": "<optional>" } ] }\n```\n' +
+        "or a plain header: todo_list: { ... }. Include only fields: title (optional), items (array of {text, done?, note?}).";
+      const finalMessageForAgent = shouldAddTodoFormat
+        ? `${prompt.trim()}\n\n${todoFormatInstructions}`
+        : prompt.trim();
+
       // Add user message to local state immediately for better UX
       const userMessage: AgentChatMessage = {
         id: `user-${Date.now()}`,
@@ -1147,20 +1197,17 @@ export function AgentTerminal({
       setMessages((prev) => [...prev, userMessage]);
 
       const metaCtx = (agentMetadata as any)?.additionalData?.context as
-        | { componentIds?: string[] }
+        | { componentIds?: string[]; comment?: { selectedText?: string } }
         | undefined;
       const selectionFromCtx = metaCtx?.componentIds?.length
         ? metaCtx.componentIds
         : undefined;
-      const effectiveSelection = selectionFromCtx?.length
-        ? selectionFromCtx
-        : editContext.selection && editContext.selection.length > 0
-          ? editContext.selection
-          : undefined;
+      const effectiveSelection = selectionFromCtx;
+      const selectedTextFromCtx = metaCtx?.comment?.selectedText || undefined;
 
       const request: StartAgentRequest = {
         agentId: agent.id,
-        message: prompt.trim(),
+        message: finalMessageForAgent,
         sessionId: editContext.sessionId,
         profileId: activeProfile?.id || "default",
         profile: activeProfile?.name || "default",
@@ -1169,7 +1216,7 @@ export function AgentTerminal({
         language: editContext.currentItemDescriptor?.language || "en",
         version: editContext.currentItemDescriptor?.version || 1,
         selection: effectiveSelection,
-        selectedText: editContext.selectedRange?.text || undefined,
+        selectedText: selectedTextFromCtx,
         addSelectedComponents: !!effectiveSelection?.length,
         addContextContent: false,
         addAllContent: false,
@@ -1296,16 +1343,13 @@ export function AgentTerminal({
       setMessages((prev) => [...prev, userMessage]);
 
       const metaCtx = (agentMetadata as any)?.additionalData?.context as
-        | { componentIds?: string[] }
+        | { componentIds?: string[]; comment?: { selectedText?: string } }
         | undefined;
       const selectionFromCtx = metaCtx?.componentIds?.length
         ? metaCtx.componentIds
         : undefined;
-      const effectiveSelection = selectionFromCtx?.length
-        ? selectionFromCtx
-        : editContext.selection && editContext.selection.length > 0
-          ? editContext.selection
-          : undefined;
+      const effectiveSelection = selectionFromCtx;
+      const selectedTextFromCtx = metaCtx?.comment?.selectedText || undefined;
 
       const request: StartAgentRequest = {
         agentId: agent.id,
@@ -1318,7 +1362,7 @@ export function AgentTerminal({
         language: editContext.currentItemDescriptor?.language || "en",
         version: editContext.currentItemDescriptor?.version || 1,
         selection: effectiveSelection,
-        selectedText: editContext.selectedRange?.text || undefined,
+        selectedText: selectedTextFromCtx,
         addSelectedComponents: !!effectiveSelection?.length,
         addContextContent: false,
         addAllContent: false,
@@ -1957,12 +2001,12 @@ export function AgentTerminal({
           })}
         </div>
 
-        {/* Show dancing dots only after 1s of inactivity */}
-        {showDots && <DancingDots />}
-
         <div ref={messagesEndRef} />
       </div>
 
+      {/* Show dancing dots only after 1s of inactivity */}
+      {showDots && <DancingDots />}
+
       {/* Context Info Bar */}
       {renderContextInfoBar()}
 
@@ -1982,6 +2026,7 @@ export function AgentTerminal({
             onKeyDown={handleKeyPress}
             placeholder="Type your message... (Enter to send, Ctrl+Enter for new line)"
             className="h-[80px] flex-1 resize-none overflow-y-auto text-xs"
+            data-testid="agent-terminal-prompt"
             disabled={isSubmitting}
           />
         </div>
@@ -1998,6 +2043,7 @@ export function AgentTerminal({
                 }}
                 title="Profile"
                 aria-label="Profile"
+                data-testid="agent-profile-select"
               >
                 {profiles.map((p) => (
                   <option key={p.id} value={p.id}>
@@ -2013,6 +2059,7 @@ export function AgentTerminal({
                 onChange={(e) => setSelectedModelId(e.target.value)}
                 title="Model"
                 aria-label="Model"
+                data-testid="agent-model-select"
               >
                 {activeProfile.models.map((m) => (
                   <option key={m.id} value={m.id}>

package/src/editor/ai/Agents.tsx

@@ -58,6 +58,7 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
   const [agents, setAgents] = useState<Agent[]>([]);
   const [activeAgentId, setActiveAgentId] = useState<string | null>(null);
   const activeAgentIdRef = useRef<string | null>(null);
+  const singleAgentModeRef = useRef<boolean>(false);
   const [historyPopoverOpen, setHistoryPopoverOpen] = useState(false);
   const [menuPopoverOpen, setMenuPopoverOpen] = useState(false);
   const [addPopoverOpen, setAddPopoverOpen] = useState(false);
@@ -73,6 +74,16 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
 
   const editContext = useEditContext();
 
+  // Detect single-agent mode from query parameter once on mount
+  useEffect(() => {
+    try {
+      const params = new URLSearchParams(window.location.search);
+      const value = params.get("singleAgent");
+      singleAgentModeRef.current =
+        value === "true" || params.has("singleAgent");
+    } catch {}
+  }, []);
+
   // Helper function to filter agents by name
   const getFilteredInactiveAgents = (): Agent[] => {
     if (!historyFilter.trim()) {
@@ -139,6 +150,29 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
     };
   }, [addPopoverOpen, agents.length, editContext?.currentItemDescriptor]);
 
+  // Ensure profiles are loaded once for terminals (centralized load)
+  useEffect(() => {
+    let cancelled = false;
+    (async () => {
+      try {
+        if (!editContext?.currentItemDescriptor) return;
+        setLoadingProfiles(true);
+        const profiles = await loadAiProfiles(
+          editContext.currentItemDescriptor,
+        );
+        if (cancelled) return;
+        setAvailableProfiles(profiles || []);
+      } catch (e) {
+        console.error("Failed to load AI profiles", e);
+      } finally {
+        if (!cancelled) setLoadingProfiles(false);
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [editContext?.currentItemDescriptor]);
+
   // Listen for external requests to add a new agent (e.g., AI command)
   useEffect(() => {
     const handleAddNewAgent = (ev: Event) => {
@@ -229,6 +263,15 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
 
   const loadAgentsFromBackend = async () => {
     try {
+      // In single-agent mode, skip loading any pre-existing/open agents or history
+      if (singleAgentModeRef.current) {
+        setAgents([]);
+        setInactiveAgents([]);
+        setActiveAgentIdWithStorage(null);
+        setLoadingAgents(false);
+        return;
+      }
+
       setLoadingAgents(true);
 
       // Load active agents
@@ -458,6 +501,7 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
                 createAgentWithSelectedProfile(value);
               }}
               aria-label="Profile"
+              data-testid="agents-empty-profile-select"
             >
               <option value="">Select a profile…</option>
               {availableProfiles.map((p) => (
@@ -676,7 +720,11 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
                 className="text-gray-600 hover:text-gray-800"
               />
             </PopoverTrigger>
-            <PopoverContent className="w-72 p-3" align="end">
+            <PopoverContent
+              className="w-72 p-3"
+              align="end"
+              data-testid="agents-add-popover"
+            >
               <div className="mb-2 text-xs font-medium text-gray-600">
                 Select profile
               </div>
@@ -689,6 +737,8 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
                       key={p.id}
                       onClick={() => createAgentWithSelectedProfile(p.id)}
                       className="w-full cursor-pointer rounded px-3 py-2 text-left text-xs hover:bg-gray-50"
+                      data-testid="agents-add-profile-option"
+                      data-profile-id={p.id}
                     >
                       {p.name}
                     </button>
@@ -722,6 +772,7 @@ export function Agents({ closeButton }: { closeButton?: React.ReactNode }) {
             <AgentTerminal
               agentStub={agent}
               initialMetadata={initialMetadataMap[agent.id]}
+              profiles={availableProfiles}
             />
           </div>
         ))}