@toolkit-cli/toolkode 1.3.8 → 1.3.9

package/src/cli/cmd/tui/component/dialog-provider.tsx

@@ -1,334 +0,0 @@
-import { createMemo, createSignal, onMount, Show } from "solid-js"
-import { useSync } from "@tui/context/sync"
-import { map, pipe, sortBy } from "remeda"
-import { DialogSelect } from "@tui/ui/dialog-select"
-import { useDialog } from "@tui/ui/dialog"
-import { useSDK } from "../context/sdk"
-import { DialogPrompt } from "../ui/dialog-prompt"
-import { Link } from "../ui/link"
-import { useTheme } from "../context/theme"
-import { TextAttributes } from "@opentui/core"
-import type { ProviderAuthAuthorization, ProviderAuthMethod } from "@toolkode.com/sdk/v2"
-import { DialogModel } from "./dialog-model"
-import { useKeyboard } from "@opentui/solid"
-import { Clipboard } from "@tui/util/clipboard"
-import { useToast } from "../ui/toast"
-
-// Fair ordering — toolkit first (our product), then what devs use
-const PROVIDER_PRIORITY: Record<string, number> = {
-  toolkit: 0,
-  anthropic: 1,
-  openai: 2,
-  google: 3,
-  "github-copilot": 4,
-  openrouter: 5,
-}
-
-export function createDialogProviderOptions() {
-  const sync = useSync()
-  const dialog = useDialog()
-  const sdk = useSDK()
-  const toast = useToast()
-  const options = createMemo(() => {
-    return pipe(
-      sync.data.provider_next.all,
-      sortBy((x) => PROVIDER_PRIORITY[x.id] ?? 99),
-      map((provider) => ({
-        title: provider.name,
-        value: provider.id,
-        description: {
-          toolkit: "Self-hosted domestic models (API key)",
-          anthropic: "Claude (API key)",
-          openai: "GPT / o-series (API key)",
-          google: "Gemini (API key)",
-          "github-copilot": "GitHub Copilot subscription",
-          openrouter: "70+ models, one API key",
-          opencode: "Zen models",
-          "opencode-go": "Zen subscription",
-        }[provider.id],
-        category: provider.id in PROVIDER_PRIORITY ? "Popular" : "Other",
-        async onSelect() {
-          const methods = sync.data.provider_auth[provider.id] ?? [
-            {
-              type: "api",
-              label: "API key",
-            },
-          ]
-          let index: number | null = 0
-          if (methods.length > 1) {
-            index = await new Promise<number | null>((resolve) => {
-              dialog.replace(
-                () => (
-                  <DialogSelect
-                    title="Select auth method"
-                    options={methods.map((x, index) => ({
-                      title: x.label,
-                      value: index,
-                    }))}
-                    onSelect={(option) => resolve(option.value)}
-                  />
-                ),
-                () => resolve(null),
-              )
-            })
-          }
-          if (index == null) return
-          const method = methods[index]
-          if (method.type === "oauth") {
-            let inputs: Record<string, string> | undefined
-            if (method.prompts?.length) {
-              const value = await PromptsMethod({
-                dialog,
-                prompts: method.prompts,
-              })
-              if (!value) return
-              inputs = value
-            }
-
-            const result = await sdk.client.provider.oauth.authorize({
-              providerID: provider.id,
-              method: index,
-              inputs,
-            })
-            if (result.error) {
-              toast.show({
-                variant: "error",
-                message: JSON.stringify(result.error),
-              })
-              dialog.clear()
-              return
-            }
-            if (result.data?.method === "code") {
-              dialog.replace(() => (
-                <CodeMethod providerID={provider.id} title={method.label} index={index} authorization={result.data!} />
-              ))
-            }
-            if (result.data?.method === "auto") {
-              dialog.replace(() => (
-                <AutoMethod providerID={provider.id} title={method.label} index={index} authorization={result.data!} />
-              ))
-            }
-          }
-          if (method.type === "api") {
-            return dialog.replace(() => <ApiMethod providerID={provider.id} title={method.label} />)
-          }
-        },
-      })),
-    )
-  })
-  return options
-}
-
-export function DialogProvider() {
-  const options = createDialogProviderOptions()
-  return <DialogSelect title="Connect a provider" options={options()} />
-}
-
-interface AutoMethodProps {
-  index: number
-  providerID: string
-  title: string
-  authorization: ProviderAuthAuthorization
-}
-function AutoMethod(props: AutoMethodProps) {
-  const { theme } = useTheme()
-  const sdk = useSDK()
-  const dialog = useDialog()
-  const sync = useSync()
-  const toast = useToast()
-
-  useKeyboard((evt) => {
-    if (evt.name === "c" && !evt.ctrl && !evt.meta) {
-      const code = props.authorization.instructions.match(/[A-Z0-9]{4}-[A-Z0-9]{4,5}/)?.[0] ?? props.authorization.url
-      Clipboard.copy(code)
-        .then(() => toast.show({ message: "Copied to clipboard", variant: "info" }))
-        .catch(toast.error)
-    }
-  })
-
-  onMount(async () => {
-    const result = await sdk.client.provider.oauth.callback({
-      providerID: props.providerID,
-      method: props.index,
-    })
-    if (result.error) {
-      dialog.clear()
-      return
-    }
-    await sdk.client.instance.dispose()
-    await sync.bootstrap()
-    dialog.replace(() => <DialogModel providerID={props.providerID} />)
-  })
-
-  return (
-    <box paddingLeft={2} paddingRight={2} gap={1} paddingBottom={1}>
-      <box flexDirection="row" justifyContent="space-between">
-        <text attributes={TextAttributes.BOLD} fg={theme.text}>
-          {props.title}
-        </text>
-        <text fg={theme.textMuted} onMouseUp={() => dialog.clear()}>
-          esc
-        </text>
-      </box>
-      <box gap={1}>
-        <Link href={props.authorization.url} fg={theme.primary} />
-        <text fg={theme.textMuted}>{props.authorization.instructions}</text>
-      </box>
-      <text fg={theme.textMuted}>Waiting for authorization...</text>
-      <text fg={theme.text}>
-        c <span style={{ fg: theme.textMuted }}>copy</span>
-      </text>
-    </box>
-  )
-}
-
-interface CodeMethodProps {
-  index: number
-  title: string
-  providerID: string
-  authorization: ProviderAuthAuthorization
-}
-function CodeMethod(props: CodeMethodProps) {
-  const { theme } = useTheme()
-  const sdk = useSDK()
-  const sync = useSync()
-  const dialog = useDialog()
-  const [error, setError] = createSignal(false)
-
-  return (
-    <DialogPrompt
-      title={props.title}
-      placeholder="Authorization code"
-      onConfirm={async (value) => {
-        const { error } = await sdk.client.provider.oauth.callback({
-          providerID: props.providerID,
-          method: props.index,
-          code: value,
-        })
-        if (!error) {
-          await sdk.client.instance.dispose()
-          await sync.bootstrap()
-          dialog.replace(() => <DialogModel providerID={props.providerID} />)
-          return
-        }
-        setError(true)
-      }}
-      description={() => (
-        <box gap={1}>
-          <text fg={theme.textMuted}>{props.authorization.instructions}</text>
-          <Link href={props.authorization.url} fg={theme.primary} />
-          <Show when={error()}>
-            <text fg={theme.error}>Invalid code</text>
-          </Show>
-        </box>
-      )}
-    />
-  )
-}
-
-interface ApiMethodProps {
-  providerID: string
-  title: string
-}
-function ApiMethod(props: ApiMethodProps) {
-  const dialog = useDialog()
-  const sdk = useSDK()
-  const sync = useSync()
-  const { theme } = useTheme()
-
-  return (
-    <DialogPrompt
-      title={props.title}
-      placeholder="API key"
-      description={
-        {
-          opencode: (
-            <box gap={1}>
-              <text fg={theme.textMuted}>
-                Toolkode Zen gives you access to all the best coding models at the cheapest prices with a single API
-                key.
-              </text>
-              <text fg={theme.text}>
-                Go to <span style={{ fg: theme.primary }}>https://toolkit-llm.com/pricing</span> to get a key
-              </text>
-            </box>
-          ),
-          "opencode-go": (
-            <box gap={1}>
-              <text fg={theme.textMuted}>
-                Toolkode Pro is a $10 per month subscription that provides reliable access to popular open coding models
-                with generous usage limits.
-              </text>
-              <text fg={theme.text}>
-                Go to <span style={{ fg: theme.primary }}>https://toolkit-llm.com/pricing</span> and enable Toolkode Pro
-              </text>
-            </box>
-          ),
-        }[props.providerID] ?? undefined
-      }
-      onConfirm={async (value) => {
-        if (!value) return
-        await sdk.client.auth.set({
-          providerID: props.providerID,
-          auth: {
-            type: "api",
-            key: value,
-          },
-        })
-        await sdk.client.instance.dispose()
-        await sync.bootstrap()
-        dialog.replace(() => <DialogModel providerID={props.providerID} />)
-      }}
-    />
-  )
-}
-
-interface PromptsMethodProps {
-  dialog: ReturnType<typeof useDialog>
-  prompts: NonNullable<ProviderAuthMethod["prompts"]>[number][]
-}
-async function PromptsMethod(props: PromptsMethodProps) {
-  const inputs: Record<string, string> = {}
-  for (const prompt of props.prompts) {
-    if (prompt.when) {
-      const value = inputs[prompt.when.key]
-      if (value === undefined) continue
-      const matches = prompt.when.op === "eq" ? value === prompt.when.value : value !== prompt.when.value
-      if (!matches) continue
-    }
-
-    if (prompt.type === "select") {
-      const value = await new Promise<string | null>((resolve) => {
-        props.dialog.replace(
-          () => (
-            <DialogSelect
-              title={prompt.message}
-              options={prompt.options.map((x) => ({
-                title: x.label,
-                value: x.value,
-                description: x.hint,
-              }))}
-              onSelect={(option) => resolve(option.value)}
-            />
-          ),
-          () => resolve(null),
-        )
-      })
-      if (value === null) return null
-      inputs[prompt.key] = value
-      continue
-    }
-
-    const value = await new Promise<string | null>((resolve) => {
-      props.dialog.replace(
-        () => (
-          <DialogPrompt title={prompt.message} placeholder={prompt.placeholder} onConfirm={(value) => resolve(value)} />
-        ),
-        () => resolve(null),
-      )
-    })
-    if (value === null) return null
-    inputs[prompt.key] = value
-  }
-  return inputs
-}

package/src/cli/cmd/tui/component/dialog-session-list.tsx

@@ -1,108 +0,0 @@
-import { useDialog } from "@tui/ui/dialog"
-import { DialogSelect } from "@tui/ui/dialog-select"
-import { useRoute } from "@tui/context/route"
-import { useSync } from "@tui/context/sync"
-import { createMemo, createSignal, createResource, onMount, Show } from "solid-js"
-import { Locale } from "@/util/locale"
-import { useKeybind } from "../context/keybind"
-import { useTheme } from "../context/theme"
-import { useSDK } from "../context/sdk"
-import { DialogSessionRename } from "./dialog-session-rename"
-import { useKV } from "../context/kv"
-import { createDebouncedSignal } from "../util/signal"
-import { Spinner } from "./spinner"
-
-export function DialogSessionList() {
-  const dialog = useDialog()
-  const route = useRoute()
-  const sync = useSync()
-  const keybind = useKeybind()
-  const { theme } = useTheme()
-  const sdk = useSDK()
-  const kv = useKV()
-
-  const [toDelete, setToDelete] = createSignal<string>()
-  const [search, setSearch] = createDebouncedSignal("", 150)
-
-  const [searchResults] = createResource(search, async (query) => {
-    if (!query) return undefined
-    const result = await sdk.client.session.list({ search: query, limit: 30 })
-    return result.data ?? []
-  })
-
-  const currentSessionID = createMemo(() => (route.data.type === "session" ? route.data.sessionID : undefined))
-
-  const sessions = createMemo(() => searchResults() ?? sync.data.session)
-
-  const options = createMemo(() => {
-    const today = new Date().toDateString()
-    return sessions()
-      .filter((x) => x.parentID === undefined)
-      .toSorted((a, b) => b.time.updated - a.time.updated)
-      .map((x) => {
-        const date = new Date(x.time.updated)
-        let category = date.toDateString()
-        if (category === today) {
-          category = "Today"
-        }
-        const isDeleting = toDelete() === x.id
-        const status = sync.data.session_status?.[x.id]
-        const isWorking = status?.type === "busy"
-        return {
-          title: isDeleting ? `Press ${keybind.print("session_delete")} again to confirm` : x.title,
-          bg: isDeleting ? theme.error : undefined,
-          value: x.id,
-          category,
-          footer: Locale.time(x.time.updated),
-          gutter: isWorking ? <Spinner /> : undefined,
-        }
-      })
-  })
-
-  onMount(() => {
-    dialog.setSize("large")
-  })
-
-  return (
-    <DialogSelect
-      title="Sessions"
-      options={options()}
-      skipFilter={true}
-      current={currentSessionID()}
-      onFilter={setSearch}
-      onMove={() => {
-        setToDelete(undefined)
-      }}
-      onSelect={(option) => {
-        route.navigate({
-          type: "session",
-          sessionID: option.value,
-        })
-        dialog.clear()
-      }}
-      keybind={[
-        {
-          keybind: keybind.all.session_delete?.[0],
-          title: "delete",
-          onTrigger: async (option) => {
-            if (toDelete() === option.value) {
-              sdk.client.session.delete({
-                sessionID: option.value,
-              })
-              setToDelete(undefined)
-              return
-            }
-            setToDelete(option.value)
-          },
-        },
-        {
-          keybind: keybind.all.session_rename?.[0],
-          title: "rename",
-          onTrigger: async (option) => {
-            dialog.replace(() => <DialogSessionRename session={option.value} />)
-          },
-        },
-      ]}
-    />
-  )
-}

package/src/cli/cmd/tui/component/dialog-session-rename.tsx

@@ -1,31 +0,0 @@
-import { DialogPrompt } from "@tui/ui/dialog-prompt"
-import { useDialog } from "@tui/ui/dialog"
-import { useSync } from "@tui/context/sync"
-import { createMemo } from "solid-js"
-import { useSDK } from "../context/sdk"
-
-interface DialogSessionRenameProps {
-  session: string
-}
-
-export function DialogSessionRename(props: DialogSessionRenameProps) {
-  const dialog = useDialog()
-  const sync = useSync()
-  const sdk = useSDK()
-  const session = createMemo(() => sync.session.get(props.session))
-
-  return (
-    <DialogPrompt
-      title="Rename Session"
-      value={session()?.title}
-      onConfirm={(value) => {
-        sdk.client.session.update({
-          sessionID: props.session,
-          title: value,
-        })
-        dialog.clear()
-      }}
-      onCancel={() => dialog.clear()}
-    />
-  )
-}

package/src/cli/cmd/tui/component/dialog-skill.tsx

@@ -1,36 +0,0 @@
-import { DialogSelect, type DialogSelectOption } from "@tui/ui/dialog-select"
-import { createResource, createMemo } from "solid-js"
-import { useDialog } from "@tui/ui/dialog"
-import { useSDK } from "@tui/context/sdk"
-
-export type DialogSkillProps = {
-  onSelect: (skill: string) => void
-}
-
-export function DialogSkill(props: DialogSkillProps) {
-  const dialog = useDialog()
-  const sdk = useSDK()
-  dialog.setSize("large")
-
-  const [skills] = createResource(async () => {
-    const result = await sdk.client.app.skills()
-    return result.data ?? []
-  })
-
-  const options = createMemo<DialogSelectOption<string>[]>(() => {
-    const list = skills() ?? []
-    const maxWidth = Math.max(0, ...list.map((s) => s.name.length))
-    return list.map((skill) => ({
-      title: skill.name.padEnd(maxWidth),
-      description: skill.description?.replace(/\s+/g, " ").trim(),
-      value: skill.name,
-      category: "Skills",
-      onSelect: () => {
-        props.onSelect(skill.name)
-        dialog.clear()
-      },
-    }))
-  })
-
-  return <DialogSelect title="Skills" placeholder="Search skills..." options={options()} />
-}

package/src/cli/cmd/tui/component/dialog-stash.tsx

@@ -1,87 +0,0 @@
-import { useDialog } from "@tui/ui/dialog"
-import { DialogSelect } from "@tui/ui/dialog-select"
-import { createMemo, createSignal } from "solid-js"
-import { Locale } from "@/util/locale"
-import { useTheme } from "../context/theme"
-import { useKeybind } from "../context/keybind"
-import { usePromptStash, type StashEntry } from "./prompt/stash"
-
-function getRelativeTime(timestamp: number): string {
-  const now = Date.now()
-  const diff = now - timestamp
-  const seconds = Math.floor(diff / 1000)
-  const minutes = Math.floor(seconds / 60)
-  const hours = Math.floor(minutes / 60)
-  const days = Math.floor(hours / 24)
-
-  if (seconds < 60) return "just now"
-  if (minutes < 60) return `${minutes}m ago`
-  if (hours < 24) return `${hours}h ago`
-  if (days < 7) return `${days}d ago`
-  return Locale.datetime(timestamp)
-}
-
-function getStashPreview(input: string, maxLength: number = 50): string {
-  const firstLine = input.split("\n")[0].trim()
-  return Locale.truncate(firstLine, maxLength)
-}
-
-export function DialogStash(props: { onSelect: (entry: StashEntry) => void }) {
-  const dialog = useDialog()
-  const stash = usePromptStash()
-  const { theme } = useTheme()
-  const keybind = useKeybind()
-
-  const [toDelete, setToDelete] = createSignal<number>()
-
-  const options = createMemo(() => {
-    const entries = stash.list()
-    // Show most recent first
-    return entries
-      .map((entry, index) => {
-        const isDeleting = toDelete() === index
-        const lineCount = (entry.input.match(/\n/g)?.length ?? 0) + 1
-        return {
-          title: isDeleting ? `Press ${keybind.print("stash_delete")} again to confirm` : getStashPreview(entry.input),
-          bg: isDeleting ? theme.error : undefined,
-          value: index,
-          description: getRelativeTime(entry.timestamp),
-          footer: lineCount > 1 ? `~${lineCount} lines` : undefined,
-        }
-      })
-      .toReversed()
-  })
-
-  return (
-    <DialogSelect
-      title="Stash"
-      options={options()}
-      onMove={() => {
-        setToDelete(undefined)
-      }}
-      onSelect={(option) => {
-        const entries = stash.list()
-        const entry = entries[option.value]
-        if (entry) {
-          stash.remove(option.value)
-          props.onSelect(entry)
-        }
-        dialog.clear()
-      }}
-      keybind={[
-        {
-          keybind: keybind.all.stash_delete?.[0],
-          title: "delete",
-          onTrigger: (option) => {
-            if (toDelete() === option.value) {
-              stash.remove(option.value)
-              setToDelete(undefined)
-              return
-            }
-            setToDelete(option.value)
-          },
-        },
-      ]}
-    />
-  )
-}