Skip to content

Commit f7df4ef

Browse files
committed
Adjust how agent chat UI and toggle are displayed
1 parent 35b2266 commit f7df4ef

File tree

2 files changed

+19
-19
lines changed

2 files changed

+19
-19
lines changed

app/components/ui/Overlay.tsx

+18-18
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,10 @@ import {
33
ArrowUturnLeftIcon,
44
ArrowUturnRightIcon,
55
Bars3Icon,
6-
ChatBubbleBottomCenterIcon,
6+
ChatBubbleOvalLeftEllipsisIcon,
77
Cog8ToothIcon,
88
FolderIcon,
99
QuestionMarkCircleIcon,
10-
QueueListIcon,
1110
TrashIcon,
1211
} from '@heroicons/react/24/solid';
1312
import { useAtom, useAtomValue } from 'jotai';
@@ -196,10 +195,24 @@ export function OverlayUI() {
196195

197196
return (
198197
<div className="fixed pointer-events-none my-6 px-4 z-10 h-screen w-screen bg-transparent">
199-
<div className="flex justify-between w-full h-fit">
198+
<div
199+
className={`flex w-full h-fit items-center ${
200+
uiLayout === 'agent' ? 'justify-between' : 'justify-normal'
201+
}`}
202+
>
203+
<div className="pointer-events-auto">
204+
<Button
205+
onClick={() =>
206+
setUiLayout((l) => (l === 'agent' ? 'execution' : 'agent'))
207+
}
208+
>
209+
<ChatBubbleOvalLeftEllipsisIcon title="Toggle chat UI" />
210+
</Button>
211+
</div>
212+
200213
<MenuHolder>
201214
<Dropdown>
202-
<DropdownButton>
215+
<DropdownButton className={uiLayout === 'agent' ? 'ml-4' : ''}>
203216
<Bars3Icon />
204217
</DropdownButton>
205218
<DropdownMenu
@@ -270,20 +283,7 @@ export function OverlayUI() {
270283
</Dropdown>
271284
</MenuHolder>
272285

273-
<div className="pointer-events-auto">
274-
<Button
275-
outline
276-
onClick={() =>
277-
setUiLayout((l) => (l === 'agent' ? 'execution' : 'agent'))
278-
}
279-
>
280-
{uiLayout === 'agent' ? (
281-
<QueueListIcon title="Switch to execution UI" />
282-
) : (
283-
<ChatBubbleBottomCenterIcon title="Switch to agent UI" />
284-
)}
285-
</Button>
286-
</div>
286+
{uiLayout === 'agent' ? <div className="flex" /> : <></>}
287287
</div>
288288

289289
{/* Pipeline reset dialog */}

app/components/ui/UI.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ function ClientOnly({ children }: { children: React.ReactNode }) {
2121
if (!hasMounted) {
2222
return (
2323
<main className="relative min-h-screen min-w-screen">
24-
<Background className="items-center justify-center">
24+
<Background className="items-center justify-center min-h-screen min-w-screen">
2525
<Spinner /> Loading...
2626
</Background>
2727
</main>

0 commit comments

Comments
 (0)