fix(composer): an @ search stays open across spaces in a name

apps/mobile/src/features/threads/ThreadComposer.tsx

@@ -964,6 +964,9 @@ export const ThreadComposer = function ThreadComposer(props: ThreadComposerProps
                   readOnly={isSubmissionLocked}
                   skills={composerMenu.skills}
                   selection={composerMenu.selection}
+                  searchingMentionStart={
+                    composerMenu.trigger?.kind === "path" ? composerMenu.trigger.rangeStart : null
+                  }
                   onChangeText={(text) => {
                     if (!isSubmissionLocked) props.onChangeDraftMessage(text);
                   }}

apps/mobile/src/features/threads/use-composer-command-menu.test.ts

@@ -1,10 +1,23 @@
+import { act, createElement, useLayoutEffect } from "react";
+import { createRoot } from "react-dom/client";
 import { describe, expect, it, vi } from "vite-plus/test";
-import { ProviderDriverKind, ProviderInstanceId, type ServerProvider } from "@t3tools/contracts";
+import {
+  EnvironmentId,
+  ProviderDriverKind,
+  ProviderInstanceId,
+  type ServerProvider,
+} from "@t3tools/contracts";
 
 vi.mock("react-native", () => ({ Alert: { alert: vi.fn() } }));
 
 vi.mock("../../state/queries", () => ({
-  useComposerPathSearch: () => ({ entries: [], isPending: false }),
+  useThreadSearch: vi.fn(() => ({
+    matches: [],
+    query: "",
+    isPending: false,
+    hasOlderRows: false,
+  })),
+  useComposerPathSearch: vi.fn(() => ({ entries: [], isPending: false, truncated: false })),
   useComposerPullRequestSearch: () => ({ entries: [], isPending: false, error: null }),
 }));
 vi.mock("../../state/use-composer-drafts", () => ({
@@ -21,11 +34,13 @@ vi.mock("../../state/server", () => ({
 }));
 
 import type { ModelOption } from "../../lib/modelOptions";
+import { useComposerPathSearch, useThreadSearch } from "../../state/queries";
 import {
   buildComposerModelItems,
   buildComposerSlashCommandItems,
   resolveComposerCommandSelection,
   resolveComposerMenuSelection,
+  useComposerCommandMenu,
 } from "./use-composer-command-menu";
 
 describe("resolveComposerMenuSelection", () => {
@@ -174,3 +189,95 @@ describe("mobile model mentions", () => {
     expect(buildComposerModelItems([option("traex:gpt-6.1")], "gpt", providers)).toEqual([]);
   });
 });
+
+describe("a mention search with spaces", () => {
+  type MenuInput = Parameters<typeof useComposerCommandMenu>[0];
+
+  async function mountMenu(options: Partial<MenuInput> = {}) {
+    vi.stubGlobal("IS_REACT_ACT_ENVIRONMENT", true);
+    const root = createRoot(document.createElement("div"));
+    let menu: ReturnType<typeof useComposerCommandMenu> | null = null;
+    function Probe(props: { readonly text: string; readonly ownerKey: string }) {
+      const value = useComposerCommandMenu({
+        draftMessage: props.text,
+        ownerKey: props.ownerKey,
+        environmentId: null,
+        projectCwd: null,
+        selectedProviderStatus: null,
+        hasThread: false,
+        hasCompactableConversation: false,
+        onChangeDraftMessage: () => {},
+        ...options,
+      });
+      useLayoutEffect(() => {
+        menu = value;
+      });
+      return null;
+    }
+    return {
+      /** Renders the draft with the caret at its end, as typing leaves it. */
+      type: async (text: string, ownerKey = "draft-a") => {
+        await act(() => root.render(createElement(Probe, { text, ownerKey })));
+        await act(() => menu!.onSelectionChange({ start: text.length, end: text.length }));
+        return menu!;
+      },
+      [Symbol.asyncDispose]: async () => {
+        await act(() => root.unmount());
+        vi.unstubAllGlobals();
+        vi.mocked(useComposerPathSearch).mockReset();
+      },
+    };
+  }
+
+  const pathSearch = (isPending: boolean, paths: ReadonlyArray<string>) =>
+    vi.mocked(useComposerPathSearch).mockReturnValue({
+      entries: paths.map((path) => ({ path, kind: "file" as const })),
+      error: null,
+      isPending,
+      truncated: false,
+      refresh: vi.fn(),
+    });
+
+  const olderThreads = (hasOlderRows: boolean) =>
+    vi
+      .mocked(useThreadSearch)
+      .mockReturnValue({ matches: [], query: "", isPending: false, hasOlderRows });
+
+  it("stays open across a space while a result contains the typed text", async () => {
+    pathSearch(false, ["Foreign Subsidiaries/Script Notes.md", "Foreign.md"]);
+    await using menu = await mountMenu({
+      environmentId: EnvironmentId.make("local"),
+      environments: [
+        { environmentId: EnvironmentId.make("remote"), label: "Foreign Server", machine: "server" },
+      ],
+    });
+    await menu.type("Open @Foreign");
+    const spaced = await menu.type("Open @Foreign S");
+    expect(spaced.trigger).toMatchObject({ query: "Foreign S", rangeStart: 5, rangeEnd: 15 });
+    expect(spaced.items.map((item) => item.label)).toEqual(["Foreign Server", "Script Notes.md"]);
+    // Another draft's search is not continued into this one.
+    expect((await menu.type("Open @Foreign S", "draft-b")).trigger).toBeNull();
+  });
+
+  it("refuses a fuzzy result for prose and ends the search once results settle", async () => {
+    const onChangeDraftMessage = vi.fn();
+    pathSearch(false, ["ChatComposer.tsx"]);
+    await using menu = await mountMenu({ onChangeDraftMessage });
+    const stale = (await menu.type("Fix @ChatComposer")).items[0]!;
+
+    pathSearch(true, ["ChatComposer.tsx"]);
+    const pending = await menu.type("Fix @ChatComposer so");
+    expect(pending.trigger?.query).toBe("ChatComposer so");
+    expect(pending.items).toEqual([]);
+    await act(() => pending.onSelect(stale));
+    expect(onChangeDraftMessage).not.toHaveBeenCalled();
+
+    pathSearch(false, ["ChatComposer.tsx"]);
+    // An older thread the search found is not in the shells yet, so the search stays open for it.
+    olderThreads(true);
+    expect((await menu.type("Fix @ChatComposer so")).trigger?.query).toBe("ChatComposer so");
+    olderThreads(false);
+    expect((await menu.type("Fix @ChatComposer so")).trigger).toBeNull();
+    expect((await menu.type("Fix @ChatComposer so that")).trigger).toBeNull();
+  });
+});

apps/mobile/src/features/threads/use-composer-command-menu.ts

@@ -31,6 +31,8 @@ import {
 } from "../../state/use-composer-drafts";
 import { USAGE_LIMITS_COMMAND } from "@t3tools/shared/usageLimits";
 import {
+  composerItemAnswersTrigger,
+  continueComposerPathTrigger,
   detectComposerTrigger,
   replaceTextRange,
   serializeComposerFileLink,
@@ -329,19 +331,29 @@ export function useComposerCommandMenu({
     setSelection(nextSelection);
   };
 
+  // The `@` search of the last render, which a space in this one continues.
+  const [carried, setCarried] = useState<{
+    readonly ownerKey: string | null;
+    readonly trigger: ComposerTrigger | null;
+  }>({ ownerKey, trigger: null });
   const trigger = (() => {
     if (!enabled || selection.start !== selection.end) {
       return null;
     }
-    return detectComposerTrigger(draftMessage, selection.end);
+    return continueComposerPathTrigger({
+      text: draftMessage,
+      cursor: selection.end,
+      detected: detectComposerTrigger(draftMessage, selection.end),
+      previous: carried.ownerKey === ownerKey ? carried.trigger : null,
+    });
   })();
   const pathSearch = useComposerPathSearch({
     environmentId,
     cwd: trigger?.kind === "path" ? projectCwd : null,
     query: trigger?.kind === "path" ? trigger.query : null,
   });
   // Mounts older settled threads matching the mention, which shells may leave out.
-  useThreadSearch(
+  const threadSearch = useThreadSearch(
     trigger?.kind === "path" && environmentId ? [environmentId] : [],
     trigger?.kind === "path" ? trigger.query : "",
     { titlesOnly: true },
@@ -515,7 +527,7 @@ export function useComposerCommandMenu({
         modelOptions && modelProviders
           ? buildComposerModelItems(modelOptions, trigger.query, modelProviders)
           : [];
-      return [
+      const pathItems: ComposerCommandItem[] = [
         ...threadItems,
         ...environmentItems,
         ...modelItems,
@@ -531,13 +543,35 @@ export function useComposerCommandMenu({
           };
         }),
       ];
+      return pathItems.filter((item) => composerItemAnswersTrigger(item, trigger));
     }
 
     return [];
   })();
 
+  // A query with a space ends once its search settles with nothing containing it, so prose
+  // after `@word` stops searching. A capped list waits for the next word instead.
+  const ruledOut =
+    trigger?.kind === "path" &&
+    trigger.query.includes(" ") &&
+    items.length === 0 &&
+    !pathSearch.isPending &&
+    !threadSearch.isPending &&
+    !threadSearch.hasOlderRows &&
+    !(pathSearch.truncated && trigger.query.endsWith(" "));
+  const nextCarried = ruledOut ? null : trigger;
+  if (
+    carried.ownerKey !== ownerKey ||
+    carried.trigger?.kind !== nextCarried?.kind ||
+    carried.trigger?.query !== nextCarried?.query ||
+    carried.trigger?.rangeStart !== nextCarried?.rangeStart ||
+    carried.trigger?.rangeEnd !== nextCarried?.rangeEnd
+  ) {
+    setCarried({ ownerKey, trigger: nextCarried });
+  }
+
   const onSelect = (item: ComposerCommandItem) => {
-    if (!trigger) return;
+    if (!trigger || !composerItemAnswersTrigger(item, trigger)) return;
     if (item.type === "environment") {
       if (!ownerKey || trigger.kind !== "path") return;
       const record = environmentComposerContext(item.environmentId, item.label);

apps/mobile/src/native/T3ComposerEditor.ios.tsx

@@ -141,6 +141,7 @@ export function ComposerEditor({
   skills = EMPTY_SKILLS,
   models = EMPTY_MODELS,
   selection,
+  searchingMentionStart,
   style,
   textStyle,
   onChangeText,
@@ -176,6 +177,11 @@ export function ComposerEditor({
     });
     setConfirmedTokens({ value: props.value, tokens });
   }
+  if (searchingMentionStart != null) {
+    tokens = tokens.filter(
+      (token) => token.type !== "mention" || token.start !== searchingMentionStart,
+    );
+  }
   const bodyText = useScaledTextRole("body");
   const theme = useUniwindTheme();
   const fontFamily = FONT_FAMILIES.regular;

apps/mobile/src/native/T3ComposerEditor.native.tsx

@@ -133,6 +133,7 @@ export function ComposerEditor({
   skills = EMPTY_SKILLS,
   models = EMPTY_MODELS,
   selection,
+  searchingMentionStart,
   style,
   textStyle,
   onChangeText,
@@ -165,6 +166,11 @@ export function ComposerEditor({
     });
     setConfirmedTokens({ value: props.value, tokens });
   }
+  if (searchingMentionStart != null) {
+    tokens = tokens.filter(
+      (token) => token.type !== "mention" || token.start !== searchingMentionStart,
+    );
+  }
   const theme = useUniwindTheme();
   const handlePaste = useNativePaste((uris) => onPasteImages?.(uris));
 

apps/mobile/src/native/T3ComposerEditor.types.ts

@@ -47,6 +47,8 @@ export interface ComposerEditorProps {
   >;
   readonly models?: ReadonlyArray<SelectableMarkdownModel>;
   readonly selection?: ComposerEditorSelection;
+  /** Where the `@` of a search still being typed sits; that text is not drawn as a mention chip. */
+  readonly searchingMentionStart?: number | null;
   readonly placeholder?: string;
   readonly autoFocus?: boolean;
   readonly editable?: boolean;

apps/mobile/src/state/queries.ts

@@ -223,6 +223,8 @@ export function useThreadSearch(
   /** The query `matches` are for, which lags the typed one while a search runs. */
   readonly query: string;
   readonly isPending: boolean;
+  /** Older threads were found whose rows reach the caller's shells a render after `isPending` clears. */
+  readonly hasOlderRows: boolean;
 } {
   // A pasted wall of text searches by its start rather than failing the request.
   const normalizedQuery = query.trim().slice(0, THREAD_SEARCH_QUERY_MAX_LENGTH).trim();
@@ -276,6 +278,7 @@ export function useThreadSearch(
     matches: visible.matches,
     query: visible.query,
     isPending,
+    hasOlderRows: result.rows.length > 0,
   };
 }
 
@@ -452,6 +455,7 @@ export function useComposerPathSearch(target: ComposerPathSearchTarget) {
     isPending:
       normalizedTarget.query !== debouncedTarget.query ||
       (hasTarget && (fileAccess.isPending || result.isPending)),
+    truncated: result.data?.truncated ?? false,
     refresh: result.refresh,
   };
 }

apps/mobile/vite.config.ts

@@ -4,6 +4,7 @@ import { defineConfig, normalizePath } from "vite-plus";
 import "vite-plus/test/config";
 
 const reactTests = [
+  "src/features/threads/use-composer-command-menu.test.ts",
   "src/features/threads/git/GitBranchesSheet.test.tsx",
   "src/features/threads/new-task-flow-provider.test.tsx",
   "src/features/layout/workspace/workspace-tabs-state.test.ts",