From 8699e896e604762d45df7d4e1b3433e69575e9ab Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Thu, 2 Oct 2025 12:04:06 +0000 Subject: [PATCH 01/35] ignore: update download stats 2025-10-02 --- STATS.md | 1 + 1 file changed, 1 insertion(+) diff --git a/STATS.md b/STATS.md index ffcd1a17e..002e391c3 100644 --- a/STATS.md +++ b/STATS.md @@ -96,3 +96,4 @@ | 2025-09-29 | 419,919 (+5,009) | 328,033 (+5,511) | 747,952 (+10,520) | | 2025-09-30 | 427,991 (+8,072) | 336,472 (+8,439) | 764,463 (+16,511) | | 2025-10-01 | 433,591 (+5,600) | 341,742 (+5,270) | 775,333 (+10,870) | +| 2025-10-02 | 440,852 (+7,261) | 348,099 (+6,357) | 788,951 (+13,618) | From cc955098cd8714bcf1cc91e6a4a6625e38710b05 Mon Sep 17 00:00:00 2001 From: Adam <2363879+adamdotdevin@users.noreply.github.com> Date: Fri, 26 Sep 2025 11:41:15 -0500 Subject: [PATCH 02/35] wip: desktop work --- AGENTS.md | 31 + packages/app/src/components/code.tsx | 73 +- packages/app/src/components/editor-pane.tsx | 381 +++++++++++ packages/app/src/components/file-tree.tsx | 25 + packages/app/src/components/prompt-form.tsx | 295 ++++++++ .../app/src/components/resizeable-pane.tsx | 217 ++++++ .../app/src/components/session-timeline.tsx | 22 +- packages/app/src/context/local.tsx | 183 +++-- packages/app/src/context/sync.tsx | 2 + packages/app/src/pages/index.tsx | 636 +++--------------- packages/app/src/ui/icon.tsx | 17 +- packages/app/src/ui/tooltip.tsx | 4 +- packages/app/src/utils/speech.ts | 302 +++++++++ 13 files changed, 1580 insertions(+), 608 deletions(-) create mode 100644 packages/app/src/components/editor-pane.tsx create mode 100644 packages/app/src/components/prompt-form.tsx create mode 100644 packages/app/src/components/resizeable-pane.tsx create mode 100644 packages/app/src/utils/speech.ts diff --git a/AGENTS.md b/AGENTS.md index 507cfea53..36a37713b 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -14,3 +14,34 @@ ## Debugging - To test opencode in the `packages/opencode` directory you can run `bun dev` + +## Tool Calling + +- ALWAYS USE PARALLEL TOOLS WHEN APPLICABLE. Here is an example illustrating how to execute 3 parallel file reads in this chat environnement: + +json +{ + "recipient_name": "multi_tool_use.parallel", + "parameters": { + "tool_uses": [ + { + "recipient_name": "functions.read", + "parameters": { + "filePath": "path/to/file.tsx" + } + }, + { + "recipient_name": "functions.read", + "parameters": { + "filePath": "path/to/file.ts" + } + }, + { + "recipient_name": "functions.read", + "parameters": { + "filePath": "path/to/file.md" + } + } + ] + } +} diff --git a/packages/app/src/components/code.tsx b/packages/app/src/components/code.tsx index 63f527c46..40a40aa9a 100644 --- a/packages/app/src/components/code.tsx +++ b/packages/app/src/components/code.tsx @@ -1,8 +1,11 @@ import { bundledLanguages, type BundledLanguage, type ShikiTransformer } from "shiki" import { splitProps, type ComponentProps, createEffect, onMount, onCleanup, createMemo, createResource } from "solid-js" import { useLocal, useShiki } from "@/context" +import type { TextSelection } from "@/context/local" import { getFileExtension, getNodeOffsetInLine, getSelectionInContainer } from "@/utils" +type DefinedSelection = Exclude + interface Props extends ComponentProps<"div"> { code: string path: string @@ -21,17 +24,66 @@ export function Code(props: Props) { let container: HTMLDivElement | undefined let isProgrammaticSelection = false - const [html] = createResource(async () => { - if (!highlighter.getLoadedLanguages().includes(lang())) { - await highlighter.loadLanguage(lang() as BundledLanguage) + const ranges = createMemo(() => { + const items = ctx.context.all() as Array<{ type: "file"; path: string; selection?: DefinedSelection }> + const result: DefinedSelection[] = [] + for (const item of items) { + if (item.path !== local.path) continue + const selection = item.selection + if (!selection) continue + result.push(selection) } - return highlighter.codeToHtml(local.code || "", { - lang: lang() && lang() in bundledLanguages ? lang() : "text", - theme: "opencode", - transformers: [transformerUnifiedDiff(), transformerDiffGroups()], - }) as string + return result }) + const createLineNumberTransformer = (selections: DefinedSelection[]): ShikiTransformer => { + const highlighted = new Set() + for (const selection of selections) { + const startLine = selection.startLine + const endLine = selection.endLine + const start = Math.max(1, Math.min(startLine, endLine)) + const end = Math.max(start, Math.max(startLine, endLine)) + const count = end - start + 1 + if (count <= 0) continue + const values = Array.from({ length: count }, (_, index) => start + index) + for (const value of values) highlighted.add(value) + } + return { + name: "line-number-highlight", + line(node, index) { + if (!highlighted.has(index)) return + this.addClassToHast(node, "line-number-highlight") + const children = node.children + if (!Array.isArray(children)) return + for (const child of children) { + if (!child || typeof child !== "object") continue + const element = child as { type?: string; properties?: { className?: string[] } } + if (element.type !== "element") continue + const className = element.properties?.className + if (!Array.isArray(className)) continue + const matches = className.includes("diff-oldln") || className.includes("diff-newln") + if (!matches) continue + if (className.includes("line-number-highlight")) continue + className.push("line-number-highlight") + } + }, + } + } + + const [html] = createResource( + () => ranges(), + async (activeRanges) => { + if (!highlighter.getLoadedLanguages().includes(lang())) { + await highlighter.loadLanguage(lang() as BundledLanguage) + } + return highlighter.codeToHtml(local.code || "", { + lang: lang() && lang() in bundledLanguages ? lang() : "text", + theme: "opencode", + transformers: [transformerUnifiedDiff(), transformerDiffGroups(), createLineNumberTransformer(activeRanges)], + }) as string + }, + ) + onMount(() => { if (!container) return @@ -283,7 +335,7 @@ export function Code(props: Props) { [&]:[counter-reset:line] [&_pre]:focus-visible:outline-none [&_pre]:overflow-x-auto [&_pre]:no-scrollbar - [&_code]:min-w-full [&_code]:inline-block [&_code]:pb-40 + [&_code]:min-w-full [&_code]:inline-block [&_.tab]:relative [&_.tab::before]:content['⇥'] [&_.tab::before]:absolute @@ -303,6 +355,9 @@ export function Code(props: Props) { [&_.line::before]:select-none [&_.line::before]:[counter-increment:line] [&_.line::before]:content-[counter(line)] + [&_.line-number-highlight]:bg-accent/20 + [&_.line-number-highlight::before]:bg-accent/40! + [&_.line-number-highlight::before]:text-background-panel! [&_code.code-diff_.line::before]:content-[''] [&_code.code-diff_.line::before]:w-0 [&_code.code-diff_.line::before]:pr-0 diff --git a/packages/app/src/components/editor-pane.tsx b/packages/app/src/components/editor-pane.tsx new file mode 100644 index 000000000..faf70811d --- /dev/null +++ b/packages/app/src/components/editor-pane.tsx @@ -0,0 +1,381 @@ +import { For, Match, Show, Switch, createSignal, splitProps } from "solid-js" +import { Tabs } from "@/ui/tabs" +import { FileIcon, Icon, IconButton, Logo, Tooltip } from "@/ui" +import { + DragDropProvider, + DragDropSensors, + DragOverlay, + SortableProvider, + closestCenter, + createSortable, + useDragDropContext, +} from "@thisbeyond/solid-dnd" +import type { DragEvent, Transformer } from "@thisbeyond/solid-dnd" +import type { LocalFile } from "@/context/local" +import { Code } from "@/components/code" +import PromptForm from "@/components/prompt-form" +import { useLocal, useSDK, useSync } from "@/context" +import { getFilename } from "@/utils" +import type { JSX } from "solid-js" + +interface EditorPaneProps { + layoutKey: string + timelinePane: string + onFileClick: (file: LocalFile) => void + onOpenModelSelect: () => void + onInputRefChange: (element: HTMLTextAreaElement | null) => void +} + +export default function EditorPane(props: EditorPaneProps): JSX.Element { + const [localProps] = splitProps(props, [ + "layoutKey", + "timelinePane", + "onFileClick", + "onOpenModelSelect", + "onInputRefChange", + ]) + const local = useLocal() + const sdk = useSDK() + const sync = useSync() + const [activeItem, setActiveItem] = createSignal(undefined) + + const navigateChange = (dir: 1 | -1) => { + const active = local.file.active() + if (!active) return + const current = local.file.changeIndex(active.path) + const next = current === undefined ? (dir === 1 ? 0 : -1) : current + dir + local.file.setChangeIndex(active.path, next) + } + + const handleTabChange = (path: string) => { + local.file.open(path) + } + + const handleTabClose = (file: LocalFile) => { + local.file.close(file.path) + } + + const handlePromptSubmit = async (prompt: string) => { + const existingSession = local.layout.visible(localProps.layoutKey, localProps.timelinePane) + ? local.session.active() + : undefined + let session = existingSession + if (!session) { + const created = await sdk.session.create() + session = created.data ?? undefined + } + if (!session) return + local.session.setActive(session.id) + local.layout.show(localProps.layoutKey, localProps.timelinePane) + + await sdk.session.prompt({ + path: { id: session.id }, + body: { + agent: local.agent.current()!.name, + model: { + modelID: local.model.current()!.id, + providerID: local.model.current()!.provider.id, + }, + parts: [ + { + type: "text", + text: prompt, + }, + ...(local.context.active() + ? [ + { + type: "file" as const, + mime: "text/plain", + url: `file://${local.context.active()!.absolute}`, + filename: local.context.active()!.name, + source: { + type: "file" as const, + text: { + value: "@" + local.context.active()!.name, + start: 0, + end: 0, + }, + path: local.context.active()!.absolute, + }, + }, + ] + : []), + ...local.context.all().flatMap((file) => [ + { + type: "file" as const, + mime: "text/plain", + url: `file://${sync.absolute(file.path)}${file.selection ? `?start=${file.selection.startLine}&end=${file.selection.endLine}` : ""}`, + filename: getFilename(file.path), + source: { + type: "file" as const, + text: { + value: "@" + getFilename(file.path), + start: 0, + end: 0, + }, + path: sync.absolute(file.path), + }, + }, + ]), + ], + }, + }) + } + + const handleDragStart = (event: unknown) => { + const id = getDraggableId(event) + if (!id) return + setActiveItem(id) + } + + const handleDragOver = (event: DragEvent) => { + const { draggable, droppable } = event + if (draggable && droppable) { + const currentFiles = local.file.opened().map((file) => file.path) + const fromIndex = currentFiles.indexOf(draggable.id.toString()) + const toIndex = currentFiles.indexOf(droppable.id.toString()) + if (fromIndex !== toIndex) { + local.file.move(draggable.id.toString(), toIndex) + } + } + } + + const handleDragEnd = () => { + setActiveItem(undefined) + } + + return ( +
+ + + + + +
+ + file.path)}> + + {(file) => ( + + )} + + + +
+ + {(() => { + const activeFile = local.file.active()! + const view = local.file.view(activeFile.path) + return ( +
+ +
+ + navigateChange(-1)}> + + + + + navigateChange(1)}> + + + +
+
+ + local.file.setView(activeFile.path, "raw")} + > + + + + + local.file.setView(activeFile.path, "diff-unified")} + > + + + + + local.file.setView(activeFile.path, "diff-split")} + > + + + +
+ ) + })()} +
+ + local.layout.toggle(localProps.layoutKey, localProps.timelinePane)} + > + + + +
+
+ + {(file) => ( + + {(() => { + const view = local.file.view(file.path) + const showRaw = view === "raw" || !file.content?.diff + const code = showRaw ? (file.content?.content ?? "") : (file.content?.diff ?? "") + return + })()} + + )} + +
+ + {(() => { + const id = activeItem() + if (!id) return null + const draggedFile = local.file.node(id) + if (!draggedFile) return null + return ( +
+ +
+ ) + })()} +
+
+ localProps.onInputRefChange(element ?? null)} + /> +
+ ) +} + +function TabVisual(props: { file: LocalFile }): JSX.Element { + return ( +
+ + + {props.file.name} + + + + + M + + + A + + + D + + + +
+ ) +} + +function SortableTab(props: { + file: LocalFile + onTabClick: (file: LocalFile) => void + onTabClose: (file: LocalFile) => void +}): JSX.Element { + const sortable = createSortable(props.file.path) + + return ( + // @ts-ignore +
+ +
+ props.onTabClick(props.file)}> + + + props.onTabClose(props.file)} + > + + +
+
+
+ ) +} + +function ConstrainDragYAxis(): JSX.Element { + const context = useDragDropContext() + if (!context) return <> + const [, { onDragStart, onDragEnd, addTransformer, removeTransformer }] = context + const transformer: Transformer = { + id: "constrain-y-axis", + order: 100, + callback: (transform) => ({ ...transform, y: 0 }), + } + onDragStart((event) => { + const id = getDraggableId(event) + if (!id) return + addTransformer("draggables", id, transformer) + }) + onDragEnd((event) => { + const id = getDraggableId(event) + if (!id) return + removeTransformer("draggables", id, transformer.id) + }) + return <> +} + +const getDraggableId = (event: unknown): string | undefined => { + if (typeof event !== "object" || event === null) return undefined + if (!("draggable" in event)) return undefined + const draggable = (event as { draggable?: { id?: unknown } }).draggable + if (!draggable) return undefined + return typeof draggable.id === "string" ? draggable.id : undefined +} diff --git a/packages/app/src/components/file-tree.tsx b/packages/app/src/components/file-tree.tsx index 12d357dd8..d31255ced 100644 --- a/packages/app/src/components/file-tree.tsx +++ b/packages/app/src/components/file-tree.tsx @@ -23,6 +23,30 @@ export default function FileTree(props: { [props.nodeClass ?? ""]: !!props.nodeClass, }} style={`padding-left: ${level * 10}px`} + draggable={true} + onDragStart={(e: any) => { + const evt = e as globalThis.DragEvent + evt.dataTransfer!.effectAllowed = "copy" + evt.dataTransfer!.setData("text/plain", `file:${p.node.path}`) + + // Create custom drag image without margins + const dragImage = document.createElement("div") + dragImage.className = + "flex items-center gap-x-2 px-2 py-1 bg-background-element rounded-md border border-border-1" + dragImage.style.position = "absolute" + dragImage.style.top = "-1000px" + + // Copy only the icon and text content without padding + const icon = e.currentTarget.querySelector("svg") + const text = e.currentTarget.querySelector("span") + if (icon && text) { + dragImage.innerHTML = icon.outerHTML + text.outerHTML + } + + document.body.appendChild(dragImage) + evt.dataTransfer!.setDragImage(dragImage, 0, 12) + setTimeout(() => document.body.removeChild(dragImage), 0) + }} {...p} > {p.children} @@ -51,6 +75,7 @@ export default function FileTree(props: { (open ? local.file.expand(node.path) : local.file.collapse(node.path))} diff --git a/packages/app/src/components/prompt-form.tsx b/packages/app/src/components/prompt-form.tsx new file mode 100644 index 000000000..9d7c45a32 --- /dev/null +++ b/packages/app/src/components/prompt-form.tsx @@ -0,0 +1,295 @@ +import { For, Show, createEffect, createMemo, createSignal, onCleanup } from "solid-js" +import { Button, FileIcon, Icon, IconButton, Tooltip } from "@/ui" +import { Select } from "@/components/select" +import { useLocal } from "@/context" +import type { FileContext, LocalFile } from "@/context/local" +import { getFilename } from "@/utils" +import { createSpeechRecognition } from "@/utils/speech" + +interface PromptFormProps { + class?: string + classList?: Record + onSubmit: (prompt: string) => Promise | void + onOpenModelSelect: () => void + onInputRefChange?: (element: HTMLTextAreaElement | undefined) => void +} + +export default function PromptForm(props: PromptFormProps) { + const local = useLocal() + + const [prompt, setPrompt] = createSignal("") + const [isDragOver, setIsDragOver] = createSignal(false) + + const placeholderText = "Start typing or speaking..." + + const { + isSupported, + isRecording, + interim: interimTranscript, + start: startSpeech, + stop: stopSpeech, + } = createSpeechRecognition({ + onFinal: (text) => setPrompt((prev) => (prev && !prev.endsWith(" ") ? prev + " " : prev) + text), + }) + + let inputRef: HTMLTextAreaElement | undefined = undefined + let overlayContainerRef: HTMLDivElement | undefined = undefined + let shouldAutoScroll = true + + const promptContent = createMemo(() => { + const base = prompt() || "" + const interim = isRecording() ? interimTranscript() : "" + if (!base && !interim) { + return {placeholderText} + } + const needsSpace = base && interim && !base.endsWith(" ") && !interim.startsWith(" ") + return ( + <> + {base} + {interim && ( + + {needsSpace ? " " : ""} + {interim} + + )} + + ) + }) + + createEffect(() => { + prompt() + interimTranscript() + queueMicrotask(() => { + if (!inputRef) return + if (!overlayContainerRef) return + if (!shouldAutoScroll) { + overlayContainerRef.scrollTop = inputRef.scrollTop + return + } + scrollPromptToEnd() + }) + }) + + const handlePromptKeyDown = (event: KeyboardEvent & { currentTarget: HTMLTextAreaElement }) => { + if (event.isComposing) return + if (event.key === "Enter" && !event.shiftKey) { + event.preventDefault() + inputRef?.form?.requestSubmit() + } + } + + const handlePromptScroll = (event: Event & { currentTarget: HTMLTextAreaElement }) => { + const target = event.currentTarget + shouldAutoScroll = target.scrollTop + target.clientHeight >= target.scrollHeight - 4 + if (overlayContainerRef) overlayContainerRef.scrollTop = target.scrollTop + } + + const scrollPromptToEnd = () => { + if (!inputRef) return + const maxInputScroll = inputRef.scrollHeight - inputRef.clientHeight + const next = maxInputScroll > 0 ? maxInputScroll : 0 + inputRef.scrollTop = next + if (overlayContainerRef) overlayContainerRef.scrollTop = next + shouldAutoScroll = true + } + + const handleSubmit = async (event: SubmitEvent) => { + event.preventDefault() + const currentPrompt = prompt() + setPrompt("") + shouldAutoScroll = true + if (overlayContainerRef) overlayContainerRef.scrollTop = 0 + if (inputRef) { + inputRef.scrollTop = 0 + inputRef.blur() + } + + await props.onSubmit(currentPrompt) + } + + onCleanup(() => { + props.onInputRefChange?.(undefined) + }) + + return ( +
+
{ + const evt = event as unknown as globalThis.DragEvent + if (evt.dataTransfer?.types.includes("text/plain")) { + evt.preventDefault() + setIsDragOver(true) + } + }} + onDragLeave={(event) => { + if (event.currentTarget === event.target) { + setIsDragOver(false) + } + }} + onDragOver={(event) => { + const evt = event as unknown as globalThis.DragEvent + if (evt.dataTransfer?.types.includes("text/plain")) { + evt.preventDefault() + evt.dataTransfer.dropEffect = "copy" + } + }} + onDrop={(event) => { + const evt = event as unknown as globalThis.DragEvent + evt.preventDefault() + setIsDragOver(false) + + const data = evt.dataTransfer?.getData("text/plain") + if (data && data.startsWith("file:")) { + const filePath = data.slice(5) + const fileNode = local.file.node(filePath) + if (fileNode) { + local.context.add({ + type: "file", + path: filePath, + }) + } + } + }} + > + 0 || local.context.active()}> +
+ + local.context.removeActive()} /> + + + {(file) => local.context.remove(file.key)} />} + +
+
+
+ +
{ + overlayContainerRef = element ?? undefined + }} + class="pointer-events-none absolute inset-0 overflow-hidden" + > +
+ {promptContent()} +
+
+
+
+
+ (inputRef = el)} - type="text" - value={store.prompt} - onInput={(e) => setStore("prompt", e.currentTarget.value)} - placeholder="Placeholder text..." - class="w-full p-1 pb-4 text-text font-light placeholder-text-muted/70 text-sm focus:outline-none" - /> -
-
- Role: {props.member.role}
}> diff --git a/packages/console/core/src/account.ts b/packages/console/core/src/account.ts index 3bed2bef1..cd1eed4b1 100644 --- a/packages/console/core/src/account.ts +++ b/packages/console/core/src/account.ts @@ -54,7 +54,7 @@ export namespace Account { .select(getTableColumns(WorkspaceTable)) .from(WorkspaceTable) .innerJoin(UserTable, eq(UserTable.workspaceID, WorkspaceTable.id)) - .where(and(eq(UserTable.email, actor.properties.email), isNull(WorkspaceTable.timeDeleted))) + .where(and(eq(UserTable.accountID, actor.properties.accountID), isNull(WorkspaceTable.timeDeleted))) .execute(), ) } diff --git a/packages/console/core/src/schema/user.sql.ts b/packages/console/core/src/schema/user.sql.ts index e1da69ee6..861c14b47 100644 --- a/packages/console/core/src/schema/user.sql.ts +++ b/packages/console/core/src/schema/user.sql.ts @@ -1,6 +1,7 @@ -import { mysqlTable, uniqueIndex, varchar, int, mysqlEnum } from "drizzle-orm/mysql-core" +import { mysqlTable, uniqueIndex, varchar, int, mysqlEnum, foreignKey } from "drizzle-orm/mysql-core" import { timestamps, ulid, utc, workspaceColumns } from "../drizzle/types" import { workspaceIndexes } from "./workspace.sql" +import { AccountTable } from "./account.sql" export const UserRole = ["admin", "member"] as const @@ -22,5 +23,10 @@ export const UserTable = mysqlTable( ...workspaceIndexes(table), uniqueIndex("user_account_id").on(table.workspaceID, table.accountID), uniqueIndex("user_email").on(table.workspaceID, table.email), + foreignKey({ + columns: [table.accountID], + foreignColumns: [AccountTable.id], + name: "global_account_id", + }), ], ) diff --git a/packages/console/core/src/user.ts b/packages/console/core/src/user.ts index ecf592297..8f00722e6 100644 --- a/packages/console/core/src/user.ts +++ b/packages/console/core/src/user.ts @@ -1,5 +1,5 @@ import { z } from "zod" -import { and, eq, isNull, sql } from "drizzle-orm" +import { and, eq, getTableColumns, isNull, sql } from "drizzle-orm" import { fn } from "./util/fn" import { Database } from "./drizzle" import { UserRole, UserTable } from "./schema/user.sql" @@ -9,6 +9,7 @@ import { render } from "@jsx-email/render" import { InviteEmail } from "@opencode/console-mail/InviteEmail.jsx" import { AWS } from "./aws" import { Account } from "./account" +import { AccountTable } from "./schema/account.sql" export namespace User { const assertAdmin = async () => { @@ -29,8 +30,12 @@ export namespace User { export const list = fn(z.void(), () => Database.use((tx) => tx - .select() + .select({ + ...getTableColumns(UserTable), + accountEmail: AccountTable.email, + }) .from(UserTable) + .leftJoin(AccountTable, eq(UserTable.accountID, AccountTable.id)) .where(and(eq(UserTable.workspaceID, Actor.workspace()), isNull(UserTable.timeDeleted))), ), ) @@ -159,19 +164,22 @@ export namespace User { await assertAdmin() assertNotSelf(id) - return await Database.use(async (tx) => { - const email = await tx - .select({ email: UserTable.email }) - .from(UserTable) - .where(and(eq(UserTable.id, id), eq(UserTable.workspaceID, Actor.workspace()))) - .then((rows) => rows[0]?.email) - if (!email) throw new Error("User not found") + return await Database.transaction(async (tx) => { + const user = await fromID(id) + if (!user) throw new Error("User not found") await tx .update(UserTable) .set({ - oldEmail: email, - email: null, + ...(user.email + ? { + oldEmail: user.email, + email: null, + } + : { + oldAccountID: user.accountID, + accountID: null, + }), timeDeleted: sql`now()`, }) .where(and(eq(UserTable.id, id), eq(UserTable.workspaceID, Actor.workspace()))) diff --git a/packages/console/core/src/workspace.ts b/packages/console/core/src/workspace.ts index e6356e49d..6119f51df 100644 --- a/packages/console/core/src/workspace.ts +++ b/packages/console/core/src/workspace.ts @@ -1,7 +1,7 @@ import { z } from "zod" import { fn } from "./util/fn" import { Actor } from "./actor" -import { Database, sql } from "./drizzle" +import { Database } from "./drizzle" import { Identifier } from "./identifier" import { UserTable } from "./schema/user.sql" import { BillingTable } from "./schema/billing.sql" @@ -20,7 +20,6 @@ export namespace Workspace { workspaceID, id: Identifier.create("user"), accountID: account.properties.accountID, - email: account.properties.email, name: "", role: "admin", }) @@ -35,9 +34,7 @@ export namespace Workspace { { workspaceID, }, - async () => { - await Key.create({ name: "Default API Key" }) - }, + () => Key.create({ name: "Default API Key" }), ) return workspaceID }) diff --git a/packages/console/function/src/auth.ts b/packages/console/function/src/auth.ts index 77199fef5..09e3f3727 100644 --- a/packages/console/function/src/auth.ts +++ b/packages/console/function/src/auth.ts @@ -29,7 +29,7 @@ export const subjects = createSubjects({ const MY_THEME: Theme = { ...THEME_OPENAUTH, - logo: "https://opencode.ai/favicon.svg", + logo: "https://opencode.ai/favicon-zen.svg", } export default { From 6036a1d611d338dbf2f786552737aaffa948c270 Mon Sep 17 00:00:00 2001 From: Frank Date: Thu, 2 Oct 2025 18:16:29 -0400 Subject: [PATCH 31/35] wip: zen --- packages/console/function/src/auth.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/console/function/src/auth.ts b/packages/console/function/src/auth.ts index 09e3f3727..77199fef5 100644 --- a/packages/console/function/src/auth.ts +++ b/packages/console/function/src/auth.ts @@ -29,7 +29,7 @@ export const subjects = createSubjects({ const MY_THEME: Theme = { ...THEME_OPENAUTH, - logo: "https://opencode.ai/favicon-zen.svg", + logo: "https://opencode.ai/favicon.svg", } export default { From fe4589d33567d75ee7913590d1b1e3b5c7128a44 Mon Sep 17 00:00:00 2001 From: Jay Date: Thu, 2 Oct 2025 18:18:57 -0400 Subject: [PATCH 32/35] ignore: Workspace updates (#2930) Co-authored-by: David Hill --- packages/console/app/src/component/icon.tsx | 48 +++++++++------------ 1 file changed, 20 insertions(+), 28 deletions(-) diff --git a/packages/console/app/src/component/icon.tsx b/packages/console/app/src/component/icon.tsx index fa28316e8..2b2dbe411 100644 --- a/packages/console/app/src/component/icon.tsx +++ b/packages/console/app/src/component/icon.tsx @@ -2,34 +2,26 @@ import { JSX } from "solid-js" export function IconLogo(props: JSX.SvgSVGAttributes) { return ( - - - - - - - - - - - - - ) + + + + + + + + + + + + +) } export function IconCopy(props: JSX.SvgSVGAttributes) { From d766ca23e8db8ce56a05019ad1e3d7b696e96b24 Mon Sep 17 00:00:00 2001 From: David Hill Date: Thu, 2 Oct 2025 23:19:53 +0100 Subject: [PATCH 33/35] Update index.css --- packages/console/app/src/routes/zen/index.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/console/app/src/routes/zen/index.css b/packages/console/app/src/routes/zen/index.css index 133e41b67..823da2722 100644 --- a/packages/console/app/src/routes/zen/index.css +++ b/packages/console/app/src/routes/zen/index.css @@ -548,6 +548,8 @@ body { color: var(--color-text-inverted); border-radius: 4px; font-weight: 500; + border: none; + outline: none; cursor: pointer; top: 50%; margin-top: -20px; From 4c11ccd334f72c7641197fded3a76203c6101646 Mon Sep 17 00:00:00 2001 From: Jay Date: Thu, 2 Oct 2025 18:20:30 -0400 Subject: [PATCH 34/35] docs: update theme (#2929) Co-authored-by: David Hill --- packages/web/src/assets/logo-dark.svg | 28 +- packages/web/src/assets/logo-light.svg | 28 +- packages/web/src/assets/logo-ornate-dark.svg | 34 +- packages/web/src/assets/logo-ornate-light.svg | 34 +- packages/web/src/styles/custom.css | 371 +++++++++++++++++- 5 files changed, 437 insertions(+), 58 deletions(-) diff --git a/packages/web/src/assets/logo-dark.svg b/packages/web/src/assets/logo-dark.svg index a4e433958..a15827324 100644 --- a/packages/web/src/assets/logo-dark.svg +++ b/packages/web/src/assets/logo-dark.svg @@ -1,12 +1,18 @@ - - - - - - - - - - - + + + + + + + + + + + + + + + + + diff --git a/packages/web/src/assets/logo-light.svg b/packages/web/src/assets/logo-light.svg index cbfcccf51..2a856dcce 100644 --- a/packages/web/src/assets/logo-light.svg +++ b/packages/web/src/assets/logo-light.svg @@ -1,12 +1,18 @@ - - - - - - - - - - - + + + + + + + + + + + + + + + + + diff --git a/packages/web/src/assets/logo-ornate-dark.svg b/packages/web/src/assets/logo-ornate-dark.svg index b937be0af..a15827324 100644 --- a/packages/web/src/assets/logo-ornate-dark.svg +++ b/packages/web/src/assets/logo-ornate-dark.svg @@ -1,18 +1,18 @@ - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + diff --git a/packages/web/src/assets/logo-ornate-light.svg b/packages/web/src/assets/logo-ornate-light.svg index 789223bc4..2a856dcce 100644 --- a/packages/web/src/assets/logo-ornate-light.svg +++ b/packages/web/src/assets/logo-ornate-light.svg @@ -1,18 +1,18 @@ - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + diff --git a/packages/web/src/styles/custom.css b/packages/web/src/styles/custom.css index deff8ae90..308e94a18 100644 --- a/packages/web/src/styles/custom.css +++ b/packages/web/src/styles/custom.css @@ -1,12 +1,379 @@ :root { - --sl-color-bg-surface: var(--sl-color-bg-nav); - --sl-color-divider: var(--sl-color-gray-5); + --sl-color-bg: hsl(0, 20%, 99%); + --sl-color-gray-5: hsl(0, 1%, 85%); + --sl-nav-gap: 40px; + --sl-color-text: hsl(0, 1%, 39%); + --sl-border-color: hsl(0, 1%, 85%); + --sl-color-hairline-shade: hsl(0, 1%, 85%); + + --color-background: hsl(0, 20%, 99%); + --color-background-weak: hsl(0, 8%, 97%); + --color-background-weak-hover: hsl(0, 8%, 94%); + --color-background-strong: hsl(0, 5%, 12%); + --color-background-strong-hover: hsl(0, 5%, 18%); + --color-background-interactive: hsl(62, 84%, 88%); + --color-background-interactive-weaker: hsl(64, 74%, 95%); + + --color-text: hsl(0, 1%, 39%); + --color-text-weak: hsl(0, 1%, 60%); + --color-text-weaker: hsl(0, 3%, 88%); + --color-text-strong: hsl(0, 5%, 12%); + --color-text-inverted: hsl(0, 20%, 99%); + + --color-border: hsl(30, 2%, 81%); + --color-border-weak: hsl(0, 1%, 85%); + + --color-icon: hsl(0, 1%, 55%); +} + + + +body { + color: var(--color-text) !important; + font-size: 14px !important; + + @media (prefers-color-scheme: dark) { + --sl-color-bg: hsl(0, 9%, 7%); + --sl-color-gray-5: hsl(0, 4%, 23%); + --sl-color-text: hsl(0, 4%, 71%); + --sl-border-color: hsl(0, 4%, 23%); + --sl-color-hairline-shade: hsl(0, 4%, 23%); + + --color-background: hsl(0, 9%, 7%); + --color-background-weak: hsl(0, 6%, 10%); + --color-background-strong: hsl(0, 15%, 94%); + --color-background-strong-hover: hsl(0, 15%, 97%); + --color-background-interactive: hsl(62, 100%, 90%); + --color-background-interactive-weaker: hsl(60, 20%, 8%); + + --color-text: hsl(0, 4%, 71%); + --color-text-weak: hsl(0, 2%, 49%); + --color-text-weaker: hsl(0, 3%, 28%); + --color-text-strong: hsl(0, 15%, 94%); + --color-text-inverted: hsl(0, 9%, 7%); + + --color-border: hsl(0, 3%, 28%); + --color-border-weak: hsl(0, 4%, 23%); + + --color-icon: hsl(10, 3%, 43%); + + } +} + +.header:where(.astro-tcroauqe) { + border-bottom: 1px solid var(--color-border-weak) !important; +} + +.sl-markdown-content hr { + border-bottom: 1px solid var(--color-border-weak) !important; +} + +#starlight__on-this-page--mobile { + border-bottom: 1px solid var(--color-border-weak) !important; +} + +mobile-starlight-toc nav summary .toggle { + opacity: 60% !important; + text-decoration: none !important; +} + +nav.sidebar summary svg.caret { + color: var(--color-icon) !important; +} + +body > .page > header button[data-open-modal] > kbd kbd { + color: var(--color-icon) !important; + font-size: 16px !important; + display: flex; +} + +body > .page > header button[data-open-modal] > kbd kbd:first-child { + font-size: 20px !important; +} + +.starlight-aside__title { + flex: 0 0 auto; + margin-top: 3px; +} + +body > .page > .main-frame .main-pane > main > .content-panel + .content-panel { + border-top: none !important; +} + +body > .page > header a.site-title img { + height: 2rem !important; +} + +a { + color: var(--color-text-strong) !important; +} + +.page-description { + color: var(--color-text) !important; +} + +.right-sidebar { + border-inline-start: none !important; +} + +.sidebar-pane { + border-inline-end: 1px solid var(--color-border-weak) !important; +} + +.right-sidebar-panel { + padding: 24px 0 !important; + color: var(--color-text-weaker); +} + +.sidebar-content { + padding: 24px 0 !important; +} + +a[aria-current="page"] { + border-left: 2px solid var(--color-background-strong); + background: var(--color-background-weak) !important; + font-weight: 600 !important; +} + +ul.top-level a[aria-current="page"] > span { + color: var(--color-text-strong) !important; +} + +#starlight__sidebar > div > sl-sidebar-state-persist > ul > li > details > summary { + padding: 0 24px !important; + margin-top: 20px !important; +} + +#starlight__sidebar > div > sl-sidebar-state-persist > ul > li > details > summary:hover { + background: var(--color-background-weak); +} + +#starlight__sidebar > div > sl-sidebar-state-persist > ul > li > details > summary span { + color: var(--color-text-strong) !important; + font-weight: 600 !important; +} + + +.top-level li a { + border-radius: 0; + width: 100%; + padding: 4px 24px !important; +} + +.top-level li a:hover { + background: var(--color-background-weak) !important; +} + +.right-group { + gap: 40px !important; +} + +.social-icons { + gap: 24px !important; +} + +.social-icons a svg { + height: 18px !important; + width: 18px !important; +} + +site-search > button { + text-transform: none !important; +} + +body > .page > header button[data-open-modal] { + gap: 24px !important; + background: var(--color-background-weak); + border: 1px solid var(--color-border-weak) !important; + padding: 6px 16px !important; + border-radius: 4px; + + @media (prefers-color-scheme: dark) { + background: var(--color-background-weak); + } +} + +body > .page > header button[data-open-modal] { + background: var(--color-background-weaker); +} + +site-search > button span { + text-decoration: none !important; +} + +.starlight-aside { + display: flex; + gap: 16px; + align-items: start; + + .starlight-aside__content { + margin-top: 0; + } +} + + + +site-search > button > kbd { + font-size: 14px !important; +} + +h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { + color: var(--color-text-strong) !important; +} + +h1 { + font-size: 26px !important; + text-transform: none !important; + font-weight: 500 !important; + color: var(--color-text-strong) !important; +} + +h2 { + font-size: 22px !important; + text-transform: none !important; + font-weight: 500 !important; + color: var(--color-text-strong) !important; +} + +h3 { + font-size: 18px !important; + text-transform: none !important; + font-weight: 500 !important; + color: var(--color-text-strong) !important; +} + +h4 { + font-size: 16px !important; + text-transform: none !important; + font-weight: 500 !important; + color: var(--color-text-strong) !important; +} + +strong { + font-weight: 500 !important; +} + +ul, ol { + list-style: none !important; + padding: 0 !important; +} + +.sl-markdown-content .tab > [role="tab"][aria-selected="true"] { + border-color: var(--color-text-strong); +} + +.social-icons a svg { + color: var(--color-text-weak) !important; +} + +.social-icons a svg:hover { + color: var(--color-text-strong) !important; +} + +body > .page > header, :root[data-has-sidebar] body > .page > header { + background: var(--color-background) !important; + padding: 24px !important; +} + +.sl-container { + box-sizing: border-box !important; + width: 100% !important; +} + +.right-sidebar-panel nav, +.right-sidebar-panel h2, +.right-sidebar-panel ul, +.right-sidebar-panel li, +.right-sidebar-panel a { + display: block; + width: 100%; +} + +.sl-container { + max-width: 100% !important; +} + + +.sl-container ul li a { + padding: 4px 24px !important; + width: 100% !important; + color: var(--color-text-weaker); + opacity: 50%; +} + +.sl-container ul li a:hover { + background: var(--color-background-weak); + + @media (prefers-color-scheme: dark) { + background: var(--color-background-weak) + } +} + +.sl-container ul li ul li { + padding: 4px 12px 0 12px !important; +} + + +.sl-container ul li a[aria-current="true"] { + color: var(--color-text-strong) !important; + opacity: 100%; +} + + +h2#starlight__on-this-page { + font-size: 14px !important; + color: var(--color-text-strong) !important; + margin: 0 !important; + font-weight: 400 !important; + padding: 0 24px 12px 24px; +} + +#starlight__on-this-page ul { + color: var(--color-text-strong) !important; + font-size: 16px !important; +} + +.middle-group .links { + color: var(--color-icon); + text-decoration: none; + text-transform: none; + font-size: 16px; + display: none !important; +} + +.middle-group .links:hover { + text-decoration: underline; + text-underline-offset: 4px; + text-decoration-thickness: 1px; +} + +nav.sidebar ul.top-level > li > details > summary .group-label > span { + margin-top: 24px !important; + color: var(--color-text-strong) !important; + text-transform: none !important; + font-weight: 500 !important; +} + +.content-panel { + padding: 2rem 3rem !important; +} + +.expressive-code { + margin: 12px 0 56px 0 !important; + border-radius: 6px; + +} + +.expressive-code figure { + background: var(--color-background-weak) !important; } .expressive-code .frame { box-shadow: none; } + + @media (prefers-color-scheme: dark) { .shiki, .shiki span { From ea993976b00feb3cb74f861f0a67c218854be9a9 Mon Sep 17 00:00:00 2001 From: David Hill Date: Thu, 2 Oct 2025 23:50:51 +0100 Subject: [PATCH 35/35] Firefox email input fix --- packages/console/app/src/routes/index.css | 20 +++++++++++++--- packages/console/app/src/routes/zen/index.css | 23 ++++++++++++++++--- 2 files changed, 37 insertions(+), 6 deletions(-) diff --git a/packages/console/app/src/routes/index.css b/packages/console/app/src/routes/index.css index ec1676ea1..7171bd39d 100644 --- a/packages/console/app/src/routes/index.css +++ b/packages/console/app/src/routes/index.css @@ -797,15 +797,29 @@ body { border-radius: 6px; border: 1px solid var(--color-border-weak); padding: 20px; - display: flex; - flex-direction: column; - gap: 12px; width: 100%; + /* Use color, not -moz-text-fill-color, for normal text */ + color: var(--color-text-strong); + @media (max-width: 30rem) { padding-bottom: 80px; } + &:not(:focus) { + color: var(--color-text-strong); + } + + &::placeholder { + color: var(--color-text-weak); + opacity: 1; + } + + /* Optional legacy */ + &::-moz-placeholder { + color: var(--color-text-weak); + opacity: 1; + } } input:focus { diff --git a/packages/console/app/src/routes/zen/index.css b/packages/console/app/src/routes/zen/index.css index 823da2722..88ca0762e 100644 --- a/packages/console/app/src/routes/zen/index.css +++ b/packages/console/app/src/routes/zen/index.css @@ -113,6 +113,8 @@ body { } + + [data-component="container"] { max-width: 67.5rem; margin: 0 auto; @@ -516,14 +518,29 @@ body { border-radius: 6px; border: 1px solid var(--color-border-weak); padding: 20px; - display: flex; - flex-direction: column; - gap: 12px; width: 100%; + /* Use color, not -moz-text-fill-color, for normal text */ + color: var(--color-text-strong); + @media (max-width: 30rem) { padding-bottom: 80px; } + + &:not(:focus) { + color: var(--color-text-strong); + } + + &::placeholder { + color: var(--color-text-weak); + opacity: 1; + } + + /* Optional legacy */ + &::-moz-placeholder { + color: var(--color-text-weak); + opacity: 1; + } } input:focus {