From 1ff4a44b61b6997c79979176130d60f70d0d17bc Mon Sep 17 00:00:00 2001 From: Danny Avila Date: Tue, 1 Sep 2026 00:29:22 -0400 Subject: [PATCH] =?UTF-8?q?=F0=9F=A9=B9=20fix:=20Stop=20the=20Subagent=20C?= =?UTF-8?q?omposer=20Unmounting,=20and=20Give=20It=20Main=20Chat's=20Shape?= =?UTF-8?q?=20(#15448)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * ๐Ÿฉน fix: Stop the Subagent Composer Unmounting, and Give It Main Chat's Shape Measured with react-scan and a DOM presence probe against the live panel: every external delivery unmounted and remounted the composer inside 10ms, taking focus and any half-typed steer with it. - The composer stays mounted across a delivery. A delivery re-keys the thread query to its new task and the task view blanks for the render or two that takes โ€” deliberately, so task-scoped fields are never misattributed โ€” but presence followed it down. The last mode the thread showed now carries the surface across that gap, holding submission until the new task's own view lands. `dispatched` also counts as live, so a run that has only just started no longer withdraws the field either. - One control, not three labels. Submitting IS the steer; with nothing to send the send button becomes main chat's Stop, which cancels the task. Queue and interrupt keep the chords main chat gives them (โŒ˜/Ctrl+Enter, โŒฅ/Alt+Enter) instead of spelling themselves out beside the field, and every control says what it is through its tooltip and accessible name rather than a word label. - The two composers line up. The field takes `ChatForm`'s own metrics and the footer clears the viewport floor by the height of main chat's disclaimer, so both textareas now measure top 805 / height 52 and both surfaces end at 910 in a 950px viewport. - The header is main chat's header: a 52px bar that floats over the thread and fades into it, so the conversation scrolls under it instead of starting below a solid bordered bar. Residual re-renders are the per-second timestamp and elapsed tickers plus the 2s poll both queries run while a child is live โ€” shared with main chat, about 2ms of render time across a 14s window, and left alone. * ๐ŸŽ›๏ธ fix: Bind the Chord to Its Own Submission, and Keep Queue Reachable Codex and Copilot, round one. - A refused chord no longer decides a later click. `Composer` hands the submitting event to its host, and the panel keeps the resolved control bound to THAT event โ€” a โŒ˜/Ctrl or โŒฅ chord the composer then refuses (empty field, settling, a command in flight) leaves nothing behind for the next pointer submission to pick up. - The control comes from the reader's own key policy, not from raw modifiers. With Enter-to-send off, โŒ˜/Ctrl+Enter IS the submit chord, so reading modifiers directly made steering unreachable; the verdict from `resolveComposerKeyDown` decides instead. - Queue and interrupt keep a pointer. Chords alone stranded touch readers, and anyone whose shortcuts are disabled, rebound, or yielded. They are back as icon-only controls that say what they are through their tooltip and accessible name rather than a word label. - Stop cannot render unlabelled. Handler and label travel as one value (`ComposerStopProps`), so the type refuses a Stop without a name. * ๐Ÿ”— refactor: Hang the Panel's Alternate Submissions Off One Shared Send Control Queue and interrupt had no pointer, then briefly had controls of their own beside the field โ€” which repeats what submitting already does. Main chat never did that: it hangs its during-run actions off the send button. - `SendActions` moves to `@librechat/client`: the hovercard, the rows, the chord chips and their classes, lifted out of `DuringRunSendButton` unchanged. Each host passes its own anchor whole, so main chat keeps its ref (Enter's synthetic click routes through it), its submit type, and its identifying attributes. Its 13 existing tests still cover the rows. - The panel offers steer, queue and interrupt from that same control, and advertises a chord only while it still reaches its action โ€” each hint is read from the decision table that will execute it, so a rebound, yielded or disabled chord advertises nothing. - The send control names what IT does (`com_ui_steer_send`) as distinct from the `Steer` row it offers, exactly as main chat pairs them. Two hosts now share one implementation, which is what the seam wanted. * ๐Ÿงน chore: Sort Panel Imports and Drop an Unrelated Reorder The import sort ran before the last edits to this file. Also reverts a Tailwind class reorder `eslint --fix` made to `MultiSearch`, which this change has no business touching. * ๐Ÿ›ก๏ธ fix: Only Offer Controls a Dispatched Task Can Actually Take Codex, round two. - A dispatched task is controllable only once the server can address it. `control.ts` answers 404 when the task has no durable input row and no live lease, which this panel reads as an inaccessible task and closes its controls for good โ€” so treating every dispatched task as controllable could brick them. The field still stays (withdrawing it as a run starts is the swap this panel exists to avoid); submission waits for evidence. A task whose controls are definitively closed holds nothing. - Semantic status roles replace `text-amber-500`, `text-cyan-500` and `text-red-500` in the action rows โ€” in main chat's list too, since both now render through the same module. - One popup over the send control. With actions to offer, the tooltip is withheld: both attached to the same button, opened on the same focus, above the same point, and the tooltip's higher z-index covered the list. - Where the pointer cannot hover, the alternate submissions are controls of their own: a tap on the hovercard anchor submits, so touch readers could not reach queue or interrupt at all. * ๐Ÿšช fix: Send Every Control Through the Same Addressability Gate Codex, round three โ€” both findings were doors around the gate added last round. - Stop and the inline actions now answer to `controlAvailable`, not just to `composerMode`. A retained surface over a dispatched task the server cannot address yet still offered Stop, and the touch-side queue and interrupt buttons were live too; each is a command, and each 404 closes this task's controls for good. - A trapped panel keeps its actions inside itself. At mobile width with a hover-capable pointer the list still hung off the send control, portaled outside the `aside` the focus trap knows โ€” so Tab never reached it. The actions come inline whenever the panel is a modal, hover or not. --- .../Chat/Input/DuringRunSendButton.tsx | 100 ++--- .../Chat/Subagents/SubagentActivity.tsx | 14 +- .../Subagents/SubagentThreadPanel.test.tsx | 352 ++++++++++++++++-- .../Chat/Subagents/SubagentThreadPanel.tsx | 309 +++++++++++---- .../client/src/components/Composer.spec.tsx | 42 +++ packages/client/src/components/Composer.tsx | 258 ++++++++----- .../src/components/SendActions.spec.tsx | 73 ++++ .../client/src/components/SendActions.tsx | 81 ++++ packages/client/src/components/index.ts | 9 +- 9 files changed, 971 insertions(+), 267 deletions(-) create mode 100644 packages/client/src/components/SendActions.spec.tsx create mode 100644 packages/client/src/components/SendActions.tsx diff --git a/client/src/components/Chat/Input/DuringRunSendButton.tsx b/client/src/components/Chat/Input/DuringRunSendButton.tsx index 73fc9845a1..ea84300e75 100644 --- a/client/src/components/Chat/Input/DuringRunSendButton.tsx +++ b/client/src/components/Chat/Input/DuringRunSendButton.tsx @@ -1,9 +1,9 @@ import React, { forwardRef, useMemo } from 'react'; import { useRecoilValue } from 'recoil'; -import * as Ariakit from '@ariakit/react'; import { useWatch } from 'react-hook-form'; -import { SendIcon } from '@librechat/client'; +import { SendActions, SendIcon } from '@librechat/client'; import { Zap, Clock, OctagonPause, ZapOff } from 'lucide-react'; +import type { SendAction } from '@librechat/client'; import type { Control } from 'react-hook-form'; import type { ComposerKeyContext, KeyChordSource } from '~/utils/shortcuts'; import type { SteeringControls } from '~/hooks/Chat/useSteering'; @@ -13,25 +13,9 @@ import { useLocalize } from '~/hooks'; import { cn } from '~/utils'; import store from '~/store'; -const ROW_CLASS = - 'flex w-full cursor-pointer items-center gap-2 rounded-lg px-2.5 py-1.5 text-sm text-text-primary hover:bg-surface-tertiary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-xheavy aria-disabled:cursor-not-allowed aria-disabled:opacity-50'; - -function Kbd({ children }: { children: React.ReactNode }) { - return ( - - {children} - - ); -} - -type ActionRow = { - key: string; - label: string; - kbd?: string; - icon: React.ReactNode; - disabled?: boolean; - onClick: () => void; -}; +/** The rows, the popover and the chord chips are shared with every other chat + * surface that can submit more than one way โ€” see `SendActions`. */ +type ActionRow = SendAction; type DuringRunSendButtonProps = { control: Control<{ text: string }>; @@ -141,7 +125,7 @@ const DuringRunSendButton = React.memo( key: 'steer', label: localize('com_ui_steer'), kbd: steerKbd, - icon: