diff options
| author | Adam <[email protected]> | 2025-12-22 10:13:50 -0600 |
|---|---|---|
| committer | Adam <[email protected]> | 2025-12-22 10:13:57 -0600 |
| commit | 4a32fa6f0231f581d7f6dfcf3bede4286874df65 (patch) | |
| tree | 7db18e7909109bc203c1c27937ac6c68ad0f98e1 /packages | |
| parent | 29c99ed4abfce2f1fef06dc55be0b575436e028d (diff) | |
| download | opencode-4a32fa6f0231f581d7f6dfcf3bede4286874df65.tar.gz opencode-4a32fa6f0231f581d7f6dfcf3bede4286874df65.zip | |
fix(share): expanded state and responsiveness
Diffstat (limited to 'packages')
| -rw-r--r-- | packages/enterprise/src/routes/share/[shareID].tsx | 34 |
1 files changed, 23 insertions, 11 deletions
diff --git a/packages/enterprise/src/routes/share/[shareID].tsx b/packages/enterprise/src/routes/share/[shareID].tsx index a8b2c7f24..471104d79 100644 --- a/packages/enterprise/src/routes/share/[shareID].tsx +++ b/packages/enterprise/src/routes/share/[shareID].tsx @@ -212,6 +212,7 @@ export default function () { {iife(() => { const [store, setStore] = createStore({ messageId: undefined as string | undefined, + expandedSteps: {} as Record<string, boolean>, }) const messages = createMemo(() => data().sessionID @@ -253,20 +254,22 @@ export default function () { const title = () => ( <div class="flex flex-col gap-4"> - <div class="h-8 flex gap-4 items-center justify-start self-stretch"> - <div class="pl-[2.5px] pr-2 flex items-center gap-1.75 bg-surface-strong shadow-xs-border-base"> + <div class="flex flex-col gap-2 sm:flex-row sm:gap-4 sm:items-center sm:h-8 justify-start self-stretch"> + <div class="pl-[2.5px] pr-2 flex items-center gap-1.75 bg-surface-strong shadow-xs-border-base w-fit"> <Mark class="shrink-0 w-3 my-0.5" /> <div class="text-12-mono text-text-base">v{info().version}</div> </div> - <div class="flex gap-2 items-center"> - <ProviderIcon - id={provider() as IconName} - class="size-3.5 shrink-0 text-icon-strong-base" - /> - <div class="text-12-regular text-text-base">{model()?.name ?? modelID()}</div> - </div> - <div class="text-12-regular text-text-weaker"> - {DateTime.fromMillis(info().time.created).toFormat("dd MMM yyyy, HH:mm")} + <div class="flex gap-4 items-center"> + <div class="flex gap-2 items-center"> + <ProviderIcon + id={provider() as IconName} + class="size-3.5 shrink-0 text-icon-strong-base" + /> + <div class="text-12-regular text-text-base">{model()?.name ?? modelID()}</div> + </div> + <div class="text-12-regular text-text-weaker"> + {DateTime.fromMillis(info().time.created).toFormat("dd MMM yyyy, HH:mm")} + </div> </div> </div> <div class="text-left text-16-medium text-text-strong">{info().title}</div> @@ -282,6 +285,8 @@ export default function () { <SessionTurn sessionID={data().sessionID} messageID={message.id} + stepsExpanded={store.expandedSteps[message.id] ?? false} + onStepsExpandedToggle={() => setStore("expandedSteps", message.id, (v) => !v)} classes={{ root: "min-w-0 w-full relative", content: @@ -359,6 +364,13 @@ export default function () { <SessionTurn sessionID={data().sessionID} messageID={store.messageId ?? firstUserMessage()!.id!} + stepsExpanded={ + store.expandedSteps[store.messageId ?? firstUserMessage()!.id!] ?? false + } + onStepsExpandedToggle={() => { + const id = store.messageId ?? firstUserMessage()!.id! + setStore("expandedSteps", id, (v) => !v) + }} classes={{ root: "grow", content: "flex flex-col justify-between", |