From 12efbbfa4c49631f8a0201459a0956f78461b355 Mon Sep 17 00:00:00 2001 From: Adam <2363879+adamdotdevin@users.noreply.github.com> Date: Thu, 12 Mar 2026 08:52:51 -0500 Subject: chore: cleanup (#17184) --- .../session/composer/session-composer-region.tsx | 65 ++++------------------ .../pages/session/composer/session-todo-dock.tsx | 62 ++++++--------------- 2 files changed, 27 insertions(+), 100 deletions(-) (limited to 'packages/app/src/pages/session/composer') diff --git a/packages/app/src/pages/session/composer/session-composer-region.tsx b/packages/app/src/pages/session/composer/session-composer-region.tsx index 08746b51a..964bf18dd 100644 --- a/packages/app/src/pages/session/composer/session-composer-region.tsx +++ b/packages/app/src/pages/session/composer/session-composer-region.tsx @@ -1,11 +1,10 @@ import { Show, createEffect, createMemo, createSignal, onCleanup } from "solid-js" -import { createStore } from "solid-js/store" -import { useParams } from "@solidjs/router" import { useSpring } from "@opencode-ai/ui/motion-spring" import { PromptInput } from "@/components/prompt-input" import { useLanguage } from "@/context/language" import { usePrompt } from "@/context/prompt" import { getSessionHandoff, setSessionHandoff } from "@/pages/session/handoff" +import { useSessionKey } from "@/pages/session/session-layout" import { SessionPermissionDock } from "@/pages/session/composer/session-permission-dock" import { SessionQuestionDock } from "@/pages/session/composer/session-question-dock" import { SessionRevertDock } from "@/pages/session/composer/session-revert-dock" @@ -27,29 +26,11 @@ export function SessionComposerRegion(props: { onRestore: (id: string) => void } setPromptDockRef: (el: HTMLDivElement) => void - visualDuration?: number - bounce?: number - dockOpenVisualDuration?: number - dockOpenBounce?: number - dockCloseVisualDuration?: number - dockCloseBounce?: number - drawerExpandVisualDuration?: number - drawerExpandBounce?: number - drawerCollapseVisualDuration?: number - drawerCollapseBounce?: number - subtitleDuration?: number - subtitleTravel?: number - subtitleEdge?: number - countDuration?: number - countMask?: number - countMaskHeight?: number - countWidthDuration?: number }) { - const params = useParams() const prompt = usePrompt() const language = useLanguage() + const { sessionKey } = useSessionKey() - const sessionKey = createMemo(() => `${params.dir}${params.id ? "/" + params.id : ""}`) const handoffPrompt = createMemo(() => getSessionHandoff(sessionKey())?.prompt) const previewPrompt = () => @@ -69,9 +50,7 @@ export function SessionComposerRegion(props: { setSessionHandoff(sessionKey(), { prompt: previewPrompt() }) }) - const [gate, setGate] = createStore({ - ready: false, - }) + const [ready, setReady] = createSignal(false) let timer: number | undefined let frame: number | undefined @@ -88,17 +67,17 @@ export function SessionComposerRegion(props: { createEffect(() => { sessionKey() - const ready = props.ready + const active = props.ready const delay = 140 clear() - setGate("ready", false) - if (!ready) return + setReady(false) + if (!active) return frame = requestAnimationFrame(() => { frame = undefined timer = window.setTimeout(() => { - setGate("ready", true) + setReady(true) timer = undefined }, delay) }) @@ -106,22 +85,11 @@ export function SessionComposerRegion(props: { onCleanup(clear) - const open = createMemo(() => gate.ready && props.state.dock() && !props.state.closing()) - const config = createMemo(() => - open() - ? { - visualDuration: props.dockOpenVisualDuration ?? props.visualDuration ?? 0.3, - bounce: props.dockOpenBounce ?? props.bounce ?? 0, - } - : { - visualDuration: props.dockCloseVisualDuration ?? props.visualDuration ?? 0.3, - bounce: props.dockCloseBounce ?? props.bounce ?? 0, - }, - ) - const progress = useSpring(() => (open() ? 1 : 0), config) + const open = createMemo(() => ready() && props.state.dock() && !props.state.closing()) + const progress = useSpring(() => (open() ? 1 : 0), { visualDuration: 0.3, bounce: 0 }) const value = createMemo(() => Math.max(0, Math.min(1, progress()))) const [height, setHeight] = createSignal(320) - const dock = createMemo(() => (gate.ready && props.state.dock()) || value() > 0.001) + const dock = createMemo(() => (ready() && props.state.dock()) || value() > 0.001) const rolled = createMemo(() => (props.revert?.items.length ? props.revert : undefined)) const lift = createMemo(() => (rolled() ? 18 : 36 * value())) const full = createMemo(() => Math.max(78, height())) @@ -213,19 +181,6 @@ export function SessionComposerRegion(props: { collapseLabel={language.t("session.todo.collapse")} expandLabel={language.t("session.todo.expand")} dockProgress={value()} - visualDuration={props.visualDuration} - bounce={props.bounce} - expandVisualDuration={props.drawerExpandVisualDuration} - expandBounce={props.drawerExpandBounce} - collapseVisualDuration={props.drawerCollapseVisualDuration} - collapseBounce={props.drawerCollapseBounce} - subtitleDuration={props.subtitleDuration} - subtitleTravel={props.subtitleTravel} - subtitleEdge={props.subtitleEdge} - countDuration={props.countDuration} - countMask={props.countMask} - countMaskHeight={props.countMaskHeight} - countWidthDuration={props.countWidthDuration} /> diff --git a/packages/app/src/pages/session/composer/session-todo-dock.tsx b/packages/app/src/pages/session/composer/session-todo-dock.tsx index 04aeb6317..baea51593 100644 --- a/packages/app/src/pages/session/composer/session-todo-dock.tsx +++ b/packages/app/src/pages/session/composer/session-todo-dock.tsx @@ -7,7 +7,6 @@ import { useSpring } from "@opencode-ai/ui/motion-spring" import { TextReveal } from "@opencode-ai/ui/text-reveal" import { TextStrikethrough } from "@opencode-ai/ui/text-strikethrough" import { Index, createEffect, createMemo, createSignal, on, onCleanup } from "solid-js" -import { createStore } from "solid-js/store" function dot(status: Todo["status"]) { if (status !== "in_progress") return undefined @@ -39,26 +38,10 @@ export function SessionTodoDock(props: { title: string collapseLabel: string expandLabel: string - dockProgress?: number - visualDuration?: number - bounce?: number - expandVisualDuration?: number - expandBounce?: number - collapseVisualDuration?: number - collapseBounce?: number - subtitleDuration?: number - subtitleTravel?: number - subtitleEdge?: number - countDuration?: number - countMask?: number - countMaskHeight?: number - countWidthDuration?: number + dockProgress: number }) { - const [store, setStore] = createStore({ - collapsed: false, - }) - - const toggle = () => setStore("collapsed", (value) => !value) + const [collapsed, setCollapsed] = createSignal(false) + const toggle = () => setCollapsed((value) => !value) const total = createMemo(() => props.todos.length) const done = createMemo(() => props.todos.filter((todo) => todo.status === "completed").length) @@ -73,19 +56,8 @@ export function SessionTodoDock(props: { ) const preview = createMemo(() => active()?.content ?? "") - const config = createMemo(() => - store.collapsed - ? { - visualDuration: props.collapseVisualDuration ?? props.visualDuration ?? 0.3, - bounce: props.collapseBounce ?? props.bounce ?? 0, - } - : { - visualDuration: props.expandVisualDuration ?? props.visualDuration ?? 0.3, - bounce: props.expandBounce ?? props.bounce ?? 0, - }, - ) - const collapse = useSpring(() => (store.collapsed ? 1 : 0), config) - const dock = createMemo(() => Math.max(0, Math.min(1, props.dockProgress ?? 1))) + const collapse = useSpring(() => (collapsed() ? 1 : 0), { visualDuration: 0.3, bounce: 0 }) + const dock = createMemo(() => Math.max(0, Math.min(1, props.dockProgress))) const shut = createMemo(() => 1 - dock()) const value = createMemo(() => Math.max(0, Math.min(1, collapse()))) const hide = createMemo(() => Math.max(value(), shut())) @@ -133,10 +105,10 @@ export function SessionTodoDock(props: { class="text-14-regular text-text-strong cursor-default inline-flex items-baseline shrink-0 whitespace-nowrap overflow-visible" aria-label={label()} style={{ - "--tool-motion-odometer-ms": `${props.countDuration ?? 600}ms`, - "--tool-motion-mask": `${props.countMask ?? 18}%`, - "--tool-motion-mask-height": `${props.countMaskHeight ?? 0}px`, - "--tool-motion-spring-ms": `${props.countWidthDuration ?? 560}ms`, + "--tool-motion-odometer-ms": "600ms", + "--tool-motion-mask": "18%", + "--tool-motion-mask-height": "0px", + "--tool-motion-spring-ms": "560ms", opacity: `${Math.max(0, Math.min(1, 1 - shut()))}`, }} > @@ -155,10 +127,10 @@ export function SessionTodoDock(props: { >
0.1, }} @@ -197,7 +169,7 @@ export function SessionTodoDock(props: { opacity: `${Math.max(0, Math.min(1, 1 - hide()))}`, }} > - +
-- cgit v1.2.3