Fire prompt completions on focus and send every sibling in context

Two fixes to the PromptArgumentsForm autocomplete:

- Focusing an argument input now fires completion/complete immediately
  (handleFocus) — the dropdown is populated as soon as the user clicks
  in, not only after they start typing. Any in-flight debounce timer
  for the same arg is cancelled so a stale keystroke request can't
  overwrite the fresh focus response.
- The completion context now includes every declared prompt argument
  (with "" for ones the user hasn't typed into yet), minus the one
  being completed. Previously the context only carried args the user
  had touched, so servers that disambiguate based on co-arguments
  couldn't see the full picture on the first keystroke.

Tests cover both: a focus-only path that fires before any keystroke,
and a typing path that asserts the empty sibling is sent through.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: cliffhall

clients/web/src/components/groups/PromptArgumentsForm/PromptArgumentsForm.test.tsx

@@ -173,6 +173,37 @@ describe("PromptArgumentsForm", () => {
   });
 
   describe("completions", () => {
+    it("fires a completion immediately on focus before any keystroke", async () => {
+      const user = userEvent.setup();
+      const onCompleteArgument = vi
+        .fn<
+          (
+            argName: string,
+            value: string,
+            context: Record<string, string>,
+          ) => Promise<string[]>
+        >()
+        .mockResolvedValue(["alpha", "alphabet"]);
+
+      renderWithMantine(
+        <StatefulForm
+          prompt={promptWithArgs}
+          onGetPrompt={vi.fn()}
+          completionsSupported
+          onCompleteArgument={onCompleteArgument}
+        />,
+      );
+
+      await user.click(screen.getByRole("textbox", { name: /^text/ }));
+      // No debounce on focus — the call fires synchronously off the
+      // focus handler. A microtask is enough for the response to settle.
+      await new Promise((r) => setTimeout(r, 0));
+      expect(onCompleteArgument).toHaveBeenCalledWith("text", "", {
+        targetLanguage: "",
+      });
+      expect(await screen.findByText("alpha")).toBeInTheDocument();
+    });
+
     it("calls onCompleteArgument (debounced) and surfaces values when supported", async () => {
       const user = userEvent.setup();
       const onCompleteArgument = vi
@@ -196,13 +227,16 @@ describe("PromptArgumentsForm", () => {
 
       await user.type(screen.getByRole("textbox", { name: /^text/ }), "al");
       await new Promise((r) => setTimeout(r, 400));
-      expect(onCompleteArgument).toHaveBeenCalled();
-      expect(onCompleteArgument).toHaveBeenLastCalledWith("text", "al", {});
+      // The last call carries the typed value and the context for the
+      // other (still empty) sibling.
+      expect(onCompleteArgument).toHaveBeenLastCalledWith("text", "al", {
+        targetLanguage: "",
+      });
       expect(await screen.findByText("alpha")).toBeInTheDocument();
       expect(screen.getByText("alphabet")).toBeInTheDocument();
     });
 
-    it("passes sibling argument values as completion context", async () => {
+    it("sends every sibling argument in context, including the unset ones", async () => {
       const user = userEvent.setup();
       const onCompleteArgument = vi
         .fn<
@@ -226,7 +260,8 @@ describe("PromptArgumentsForm", () => {
 
       await user.type(screen.getByRole("textbox", { name: /^text/ }), "h");
       await new Promise((r) => setTimeout(r, 400));
-      // The completing arg ("text") is excluded from context; siblings ride along.
+      // The completing arg ("text") is excluded from context; every
+      // other declared argument rides along — even ones still empty.
       expect(onCompleteArgument).toHaveBeenLastCalledWith("text", "h", {
         targetLanguage: "es",
       });
@@ -243,6 +278,8 @@ describe("PromptArgumentsForm", () => {
           onCompleteArgument={onCompleteArgument}
         />,
       );
+      // Focus the input first, then type — neither should trigger a call.
+      await user.click(screen.getByPlaceholderText("Enter text..."));
       await user.type(screen.getByPlaceholderText("Enter text..."), "ab");
       await new Promise((r) => setTimeout(r, 400));
       expect(onCompleteArgument).not.toHaveBeenCalled();

clients/web/src/components/groups/PromptArgumentsForm/PromptArgumentsForm.tsx

@@ -113,16 +113,25 @@ export function PromptArgumentsForm({
     [onCompleteArgument],
   );
 
+  // Build the `context.arguments` payload for a completion request.
+  // Includes every prompt argument the user could fill in (with `""`
+  // for ones they haven't typed yet) except the one being completed —
+  // the completing arg goes in `params.argument`. Servers that
+  // disambiguate based on co-arguments need all of them, not just
+  // whatever the user has already typed.
+  function buildContext(currentArg: string): Record<string, string> {
+    const ctx: Record<string, string> = {};
+    for (const a of promptArguments ?? []) {
+      if (a.name === currentArg) continue;
+      ctx[a.name] = argumentValues[a.name] ?? "";
+    }
+    return ctx;
+  }
+
   function handleChange(argName: string, value: string) {
     onArgumentChange(argName, value);
     if (!useAutocomplete) return;
-    // The completing arg is excluded from context so the server can
-    // disambiguate when one argument depends on another.
-    const context: Record<string, string> = {
-      ...argumentValues,
-      [argName]: value,
-    };
-    delete context[argName];
+    const context = buildContext(argName);
     const existing = timersRef.current.get(argName);
     if (existing) clearTimeout(existing);
     const timer = setTimeout(() => {
@@ -132,6 +141,20 @@ export function PromptArgumentsForm({
     timersRef.current.set(argName, timer);
   }
 
+  function handleFocus(argName: string) {
+    if (!useAutocomplete) return;
+    // Fire immediately so the dropdown isn't empty when the user first
+    // clicks in. Cancel any pending debounce so a stale keystroke
+    // request doesn't overwrite this fresher one.
+    const existing = timersRef.current.get(argName);
+    if (existing) {
+      clearTimeout(existing);
+      timersRef.current.delete(argName);
+    }
+    const value = argumentValues[argName] ?? "";
+    void runCompletion(argName, value, buildContext(argName));
+  }
+
   return (
     <Stack gap="md">
       <PromptTitle>{title ?? name}</PromptTitle>
@@ -155,6 +178,7 @@ export function PromptArgumentsForm({
                   // suggestions client-side.
                   filter={({ options }) => options}
                   onChange={(value) => handleChange(arg.name, value)}
+                  onFocus={() => handleFocus(arg.name)}
                 />
               ) : (
                 <TextInput