diff options
Diffstat (limited to 'packages/desktop/src/pages')
| -rw-r--r-- | packages/desktop/src/pages/index.tsx | 110 | ||||
| -rw-r--r-- | packages/desktop/src/pages/layout.tsx | 5 |
2 files changed, 56 insertions, 59 deletions
diff --git a/packages/desktop/src/pages/index.tsx b/packages/desktop/src/pages/index.tsx index 2e26eb0c2..1174f1e16 100644 --- a/packages/desktop/src/pages/index.tsx +++ b/packages/desktop/src/pages/index.tsx @@ -1,5 +1,5 @@ -import { FileIcon, Icon, IconButton, Tooltip } from "@/ui" -import * as KobalteTabs from "@kobalte/core/tabs" +import { Icon, Tooltip } from "@opencode-ai/ui" +import { FileIcon, IconButton } from "@/ui" import FileTree from "@/components/file-tree" import EditorPane from "@/components/editor-pane" import { For, Match, onCleanup, onMount, Show, Switch } from "solid-js" @@ -11,9 +11,7 @@ import SessionTimeline from "@/components/session-timeline" import PromptForm, { type PromptContentPart, type PromptSubmitValue } from "@/components/prompt-form" import { createStore } from "solid-js/store" import { getDirectory, getFilename } from "@/utils" -import { Select } from "@/components/select" -import { Tabs } from "@/ui/tabs" -import { Code } from "@/components/code" +import { PromptInput } from "@/components/prompt-input" export default function Page() { const local = useLocal() @@ -52,7 +50,7 @@ export default function Page() { const focused = document.activeElement === inputRef if (focused) { if (event.key === "Escape") { - inputRef?.blur() + // inputRef?.blur() } return } @@ -79,7 +77,7 @@ export default function Page() { } if (event.key.length === 1 && event.key !== "Unidentified") { - inputRef?.focus() + // inputRef?.focus() } } @@ -106,6 +104,8 @@ export default function Page() { } } + const handlePromptSubmit2 = () => {} + const handlePromptSubmit = async (prompt: PromptSubmitValue) => { const existingSession = local.session.active() let session = existingSession @@ -231,51 +231,54 @@ export default function Page() { <div class="shrink-0 w-70"> <SessionList /> </div> - <div class="grow w-full min-w-0 overflow-y-auto flex justify-center"> - <Show when={local.session.active()}> - {(activeSession) => <SessionTimeline session={activeSession().id} class="max-w-xl" />} - </Show> - </div> - <div class="hidden shrink-0 w-56 p-2 h-full overflow-y-auto"> - <FileTree path="" onFileClick={handleFileClick} /> - </div> - <div class="hidden shrink-0 w-56 p-2"> - <Show - when={local.file.changes().length} - fallback={<div class="px-2 text-xs text-text-muted">No changes</div>} - > - <ul class=""> - <For each={local.file.changes()}> - {(path) => ( - <li> - <button - onClick={() => local.file.open(path, { view: "diff-unified", pinned: true })} - class="w-full flex items-center px-2 py-0.5 gap-x-2 text-text-muted grow min-w-0 cursor-pointer hover:bg-background-element" - > - <FileIcon node={{ path, type: "file" }} class="shrink-0 size-3" /> - <span class="text-xs text-text whitespace-nowrap">{getFilename(path)}</span> - <span class="text-xs text-text-muted/60 whitespace-nowrap truncate min-w-0"> - {getDirectory(path)} - </span> - </button> - </li> - )} - </For> - </ul> - </Show> - </div> - <div class="hidden grow min-w-0"> - <EditorPane onFileClick={handleFileClick} /> - </div> - <div class="absolute bottom-4 inset-x-0 p-2 flex flex-col justify-center items-center gap-2 z-50"> - <PromptForm - class="w-xl" - onSubmit={handlePromptSubmit} - onOpenModelSelect={() => setStore("modelSelectOpen", true)} - onInputRefChange={(element: HTMLTextAreaElement | undefined) => { - inputRef = element ?? undefined - }} - /> + <div class="relative grid grid-cols-2"> + <div class="min-w-0 overflow-y-auto no-scrollbar flex justify-center"> + <Show when={local.session.active()}> + {(activeSession) => <SessionTimeline session={activeSession().id} class="w-full" />} + </Show> + </div> + <div class="p-1.5 pl-px flex flex-col items-center justify-center overflow-y-auto no-scrollbar"> + <EditorPane onFileClick={handleFileClick} /> + </div> + <div class="absolute bottom-4 inset-x-0 p-2 flex flex-col justify-center items-center z-50"> + <PromptInput onSubmit={handlePromptSubmit2} /> + {/* <PromptForm */} + {/* class="w-2xl" */} + {/* onSubmit={handlePromptSubmit} */} + {/* onOpenModelSelect={() => setStore("modelSelectOpen", true)} */} + {/* onInputRefChange={(element: HTMLTextAreaElement | undefined) => { */} + {/* inputRef = element ?? undefined */} + {/* }} */} + {/* /> */} + </div> + <div class="hidden shrink-0 w-56 p-2 h-full overflow-y-auto"> + <FileTree path="" onFileClick={handleFileClick} /> + </div> + <div class="hidden shrink-0 w-56 p-2"> + <Show + when={local.file.changes().length} + fallback={<div class="px-2 text-xs text-text-muted">No changes</div>} + > + <ul class=""> + <For each={local.file.changes()}> + {(path) => ( + <li> + <button + onClick={() => local.file.open(path, { view: "diff-unified", pinned: true })} + class="w-full flex items-center px-2 py-0.5 gap-x-2 text-text-muted grow min-w-0 cursor-pointer hover:bg-background-element" + > + <FileIcon node={{ path, type: "file" }} class="shrink-0 size-3" /> + <span class="text-xs text-text whitespace-nowrap">{getFilename(path)}</span> + <span class="text-xs text-text-muted/60 whitespace-nowrap truncate min-w-0"> + {getDirectory(path)} + </span> + </button> + </li> + )} + </For> + </ul> + </Show> + </div> </div> </main> <Show when={store.modelSelectOpen}> @@ -343,8 +346,7 @@ export default function Page() { </div> )} onClose={() => setStore("fileSelectOpen", false)} - onSelect={(x) => (x ? local.context.openFile(x) : undefined)} - // onSelect={(x) => (x ? local.file.open(x, { pinned: true }) : undefined)} + onSelect={(x) => (x ? local.file.open(x, { pinned: true }) : undefined)} /> </Show> </div> diff --git a/packages/desktop/src/pages/layout.tsx b/packages/desktop/src/pages/layout.tsx deleted file mode 100644 index d2e33a2ca..000000000 --- a/packages/desktop/src/pages/layout.tsx +++ /dev/null @@ -1,5 +0,0 @@ -import { type ParentProps } from "solid-js" - -export default function Layout(props: ParentProps) { - return <main class="">{props.children}</main> -} |