fix(web): attach command palette threads outside the sidebar

apps/web/src/components/CommandPalette.browser.test.tsx

@@ -81,7 +81,9 @@ describe("CommandPalette open intents", () => {
       document.dispatchEvent(pointer("pointerup", 50, window.innerHeight - 30));
     });
     expect(onDrop).toHaveBeenCalledOnce();
-    expect((onDrop.mock.calls[0]![0] as CustomEvent).detail).toEqual([{ environmentId, threadId }]);
+    expect((onDrop.mock.calls[0]![0] as CustomEvent).detail).toEqual([
+      { environmentId, threadId, title: "Drag this thread" },
+    ]);
     expect(screen.router?.state.location.pathname).toBe(pathname);
   });
 

apps/web/src/components/CommandPalette.drag.ts

@@ -22,7 +22,7 @@ export function startPaletteThreadDrag(
       distance: 6,
       onAttach: () => {},
       onFinish: endThreadContextDrag,
-      onDrop: (point) => dropThreadContext(point, [thread]),
+      onDrop: (point) => dropThreadContext(point, [{ ...thread, title }]),
     },
     onStart: () => {
       flushSync(() => dispatchCommandPalette({ _tag: "SetOpen", open: false }));

apps/web/src/components/chat/ChatComposer.tsx

@@ -189,6 +189,7 @@ import {
 } from "~/lib/composerContextRecords";
 import { rememberCopiedComposerAttachments } from "~/lib/copiedComposerAttachments";
 import { useThreadContextDrop, threadContextDropTargetProps } from "./threadContextDrag";
+import { droppedThreadContextRecord } from "./threadContextDrop.logic";
 import { readThreadShell } from "~/state/entities";
 import { useLinkedEnvironments } from "~/state/peerLinks";
 import { encodeComposerContextFragment } from "@t3tools/shared/composerContextClipboard";
@@ -2877,8 +2878,8 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps)
         );
         return [];
       }
-      const shell = readThreadShell(ref);
-      return shell ? [threadContextRecord(ref, shell.title)] : [];
+      const record = droppedThreadContextRecord(ref, readThreadShell(ref));
+      return record ? [record] : [];
     });
     if (records.length === 0) return;
     if (questionAttachmentTarget !== null) {

apps/web/src/components/chat/threadContextDrag.ts

@@ -1,13 +1,15 @@
-import type { EnvironmentId, ScopedThreadRef } from "@t3tools/contracts";
+import type { EnvironmentId } from "@t3tools/contracts";
 import { type RefObject, useEffect, useEffectEvent, useSyncExternalStore } from "react";
 
+import type { ThreadContextDropRef } from "./threadContextDrop.logic";
+
 export const THREAD_CONTEXT_DROP_EVENT = "t3-thread-context-drop";
 
 export function useThreadContextDrop(
   targetRef: RefObject<EventTarget | null>,
   environmentId: EnvironmentId,
   targetKey: string,
-  onDrop: (refs: ReadonlyArray<ScopedThreadRef>, isActive: () => boolean) => void,
+  onDrop: (refs: ReadonlyArray<ThreadContextDropRef>, isActive: () => boolean) => void,
 ) {
   const handleDrop = useEffectEvent(onDrop);
   // oxlint-disable-next-line t3code/no-unreasoned-state-sync -- subscribes the target element to thread-context drop events and marks old drops inactive
@@ -16,7 +18,7 @@ export function useThreadContextDrop(
     if (!target) return;
     let active = true;
     const listener = (event: Event) =>
-      handleDrop((event as CustomEvent<ReadonlyArray<ScopedThreadRef>>).detail, () => active);
+      handleDrop((event as CustomEvent<ReadonlyArray<ThreadContextDropRef>>).detail, () => active);
     target.addEventListener(THREAD_CONTEXT_DROP_EVENT, listener);
     return () => {
       active = false;
@@ -91,7 +93,7 @@ export function endThreadContextDrag() {
 
 export function dropThreadContext(
   point: { x: number; y: number },
-  threads: ReadonlyArray<ScopedThreadRef>,
+  threads: ReadonlyArray<ThreadContextDropRef>,
 ): boolean {
   const target = findDropTarget(point);
   if (!target || threads.length === 0) return false;

apps/web/src/components/chat/threadContextDrop.logic.test.ts

@@ -0,0 +1,29 @@
+import { EnvironmentId, ThreadId } from "@t3tools/contracts";
+import { threadContextRecord } from "@t3tools/shared/composerContextReferences";
+import { describe, expect, it } from "vite-plus/test";
+import { droppedThreadContextRecord } from "./threadContextDrop.logic";
+
+describe("droppedThreadContextRecord", () => {
+  it.each([null, { title: "Cached title" }])(
+    "uses the search result title even when the sidebar shell is %s",
+    (shell) => {
+      const ref = {
+        environmentId: EnvironmentId.make("remote"),
+        threadId: ThreadId.make("search-result"),
+        title: "Search result",
+      };
+      expect(droppedThreadContextRecord(ref, shell)).toEqual(threadContextRecord(ref, ref.title));
+    },
+  );
+
+  it("uses the sidebar title for a drag without search metadata", () => {
+    const ref = {
+      environmentId: EnvironmentId.make("local"),
+      threadId: ThreadId.make("sidebar-thread"),
+    };
+    expect(droppedThreadContextRecord(ref, { title: "Sidebar thread" })).toEqual(
+      threadContextRecord(ref, "Sidebar thread"),
+    );
+    expect(droppedThreadContextRecord(ref, null)).toBeNull();
+  });
+});

apps/web/src/components/chat/threadContextDrop.logic.ts

@@ -0,0 +1,12 @@
+import type { ScopedThreadRef } from "@t3tools/contracts";
+import { threadContextRecord } from "@t3tools/shared/composerContextReferences";
+
+export type ThreadContextDropRef = ScopedThreadRef & { readonly title?: string };
+
+export function droppedThreadContextRecord(
+  ref: ThreadContextDropRef,
+  shell: { readonly title: string } | null,
+) {
+  const title = ref.title ?? shell?.title;
+  return title === undefined ? null : threadContextRecord(ref, title);
+}