summaryrefslogtreecommitdiffhomepage
path: root/packages/desktop/src/components/dialog-model.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/desktop/src/components/dialog-model.tsx')
-rw-r--r--packages/desktop/src/components/dialog-model.tsx95
1 files changed, 0 insertions, 95 deletions
diff --git a/packages/desktop/src/components/dialog-model.tsx b/packages/desktop/src/components/dialog-model.tsx
deleted file mode 100644
index e8f9df055..000000000
--- a/packages/desktop/src/components/dialog-model.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-import { Component, createMemo, Show } from "solid-js"
-import { useLocal } from "@/context/local"
-import { useDialog } from "@/context/dialog"
-import { popularProviders } from "@/hooks/use-providers"
-import { Button } from "@opencode-ai/ui/button"
-import { Tag } from "@opencode-ai/ui/tag"
-import { Dialog } from "@opencode-ai/ui/dialog"
-import { List } from "@opencode-ai/ui/list"
-import { DialogSelectProvider } from "./dialog-select-provider"
-import { DialogManageModels } from "./dialog-manage-models"
-
-export const DialogModel: Component<{ provider?: string }> = (props) => {
- const local = useLocal()
- const dialog = useDialog()
-
- let closeButton!: HTMLButtonElement
- const models = createMemo(() =>
- local.model
- .list()
- .filter((m) => m.visible)
- .filter((m) => (props.provider ? m.provider.id === props.provider : true)),
- )
-
- return (
- <Dialog
- modal
- defaultOpen
- onOpenChange={(open) => {
- if (!open) {
- dialog.clear()
- }
- }}
- >
- <Dialog.Header>
- <Dialog.Title>Select model</Dialog.Title>
- <Button
- class="h-7 -my-1 text-14-medium"
- icon="plus-small"
- tabIndex={-1}
- onClick={() => dialog.replace(() => <DialogSelectProvider />)}
- >
- Connect provider
- </Button>
- <Dialog.CloseButton ref={closeButton} tabIndex={-1} style={{ display: "none" }} />
- </Dialog.Header>
- <Dialog.Body>
- <List
- class="px-2.5"
- search={{ placeholder: "Search models", autofocus: true }}
- emptyMessage="No model results"
- key={(x) => `${x.provider.id}:${x.id}`}
- items={models}
- current={local.model.current()}
- filterKeys={["provider.name", "name", "id"]}
- sortBy={(a, b) => a.name.localeCompare(b.name)}
- groupBy={(x) => x.provider.name}
- sortGroupsBy={(a, b) => {
- if (a.category === "Recent" && b.category !== "Recent") return -1
- if (b.category === "Recent" && a.category !== "Recent") return 1
- const aProvider = a.items[0].provider.id
- const bProvider = b.items[0].provider.id
- if (popularProviders.includes(aProvider) && !popularProviders.includes(bProvider)) return -1
- if (!popularProviders.includes(aProvider) && popularProviders.includes(bProvider)) return 1
- return popularProviders.indexOf(aProvider) - popularProviders.indexOf(bProvider)
- }}
- onSelect={(x) => {
- local.model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, {
- recent: true,
- })
- closeButton.click()
- }}
- >
- {(i) => (
- <div class="w-full flex items-center gap-x-2.5">
- <span>{i.name}</span>
- <Show when={i.provider.id === "opencode" && (!i.cost || i.cost?.input === 0)}>
- <Tag>Free</Tag>
- </Show>
- <Show when={i.latest}>
- <Tag>Latest</Tag>
- </Show>
- </div>
- )}
- </List>
- <Button
- variant="ghost"
- class="ml-2.5 mt-5 mb-6 text-text-base self-start"
- onClick={() => dialog.replace(() => <DialogManageModels />)}
- >
- Manage models
- </Button>
- </Dialog.Body>
- </Dialog>
- )
-}