summaryrefslogtreecommitdiffhomepage
path: root/packages/web
diff options
context:
space:
mode:
Diffstat (limited to 'packages/web')
-rw-r--r--packages/web/config.mjs8
-rw-r--r--packages/web/src/components/Share.tsx15
-rw-r--r--packages/web/src/components/share/content-diff.module.css1
-rw-r--r--packages/web/src/components/share/content-error.module.css1
-rw-r--r--packages/web/src/components/share/content-error.tsx11
-rw-r--r--packages/web/src/components/share/copy-button.tsx14
-rw-r--r--packages/web/src/components/share/part.tsx52
-rw-r--r--packages/web/src/content/docs/cli.mdx2
-rw-r--r--packages/web/src/content/docs/commands.mdx2
-rw-r--r--packages/web/src/content/docs/config.mdx8
-rw-r--r--packages/web/src/content/docs/formatters.mdx28
-rw-r--r--packages/web/src/content/docs/gitlab.mdx10
-rw-r--r--packages/web/src/content/docs/index.mdx24
-rw-r--r--packages/web/src/content/docs/server.mdx14
-rw-r--r--packages/web/src/content/docs/tui.mdx3
-rw-r--r--packages/web/src/content/docs/zen.mdx12
-rw-r--r--packages/web/sst-env.d.ts2
17 files changed, 82 insertions, 125 deletions
diff --git a/packages/web/config.mjs b/packages/web/config.mjs
index 69b6b4f57..5e2c8d3e4 100644
--- a/packages/web/config.mjs
+++ b/packages/web/config.mjs
@@ -1,12 +1,8 @@
const stage = process.env.SST_STAGE || "dev"
export default {
- url: stage === "production"
- ? "https://opencode.ai"
- : `https://${stage}.opencode.ai`,
- console: stage === "production"
- ? "https://opencode.ai/auth"
- : `https://${stage}.opencode.ai/auth`,
+ url: stage === "production" ? "https://opencode.ai" : `https://${stage}.opencode.ai`,
+ console: stage === "production" ? "https://opencode.ai/auth" : `https://${stage}.opencode.ai/auth`,
email: "[email protected]",
socialCard: "https://social-cards.sst.dev",
github: "https://github.com/sst/opencode",
diff --git a/packages/web/src/components/Share.tsx b/packages/web/src/components/Share.tsx
index 2b0e52c1a..062449712 100644
--- a/packages/web/src/components/Share.tsx
+++ b/packages/web/src/components/Share.tsx
@@ -37,11 +37,7 @@ function getStatusText(status: [Status, string?]): string {
}
}
-export default function Share(props: {
- id: string
- api: string
- info: Session.Info
-}) {
+export default function Share(props: { id: string; api: string; info: Session.Info }) {
let lastScrollY = 0
let hasScrolledToAnchor = false
let scrollTimeout: number | undefined
@@ -67,7 +63,8 @@ export default function Share(props: {
created: props.info.time.created,
updated: props.info.time.updated,
},
- }, messages: {}
+ },
+ messages: {},
})
const messages = createMemo(() => Object.values(store.messages).toSorted((a, b) => a.id?.localeCompare(b.id)))
const [connectionStatus, setConnectionStatus] = createSignal<[Status, string?]>(["disconnected", "Disconnected"])
@@ -413,7 +410,11 @@ export default function Share(props: {
</li>
<li>
<span data-element-label>Output Tokens</span>
- {data().tokens.output ? <span>{data().tokens.output}</span> : <span data-placeholder>&mdash;</span>}
+ {data().tokens.output ? (
+ <span>{data().tokens.output}</span>
+ ) : (
+ <span data-placeholder>&mdash;</span>
+ )}
</li>
<li>
<span data-element-label>Reasoning Tokens</span>
diff --git a/packages/web/src/components/share/content-diff.module.css b/packages/web/src/components/share/content-diff.module.css
index 5bf6e2243..1dfb0777b 100644
--- a/packages/web/src/components/share/content-diff.module.css
+++ b/packages/web/src/components/share/content-diff.module.css
@@ -90,7 +90,6 @@
}
[data-component="mobile"] {
-
& > [data-component="diff-block"]:first-child > div {
padding-top: 0.25rem;
}
diff --git a/packages/web/src/components/share/content-error.module.css b/packages/web/src/components/share/content-error.module.css
index 6303be633..9ed051a80 100644
--- a/packages/web/src/components/share/content-error.module.css
+++ b/packages/web/src/components/share/content-error.module.css
@@ -61,5 +61,4 @@
padding: 2px 0;
font-size: 0.75rem;
}
-
}
diff --git a/packages/web/src/components/share/content-error.tsx b/packages/web/src/components/share/content-error.tsx
index b6d7023b2..1e8cbeaad 100644
--- a/packages/web/src/components/share/content-error.tsx
+++ b/packages/web/src/components/share/content-error.tsx
@@ -10,19 +10,12 @@ export function ContentError(props: Props) {
const overflow = createOverflow()
return (
- <div
- class={style.root}
- data-expanded={expanded() || props.expand === true ? true : undefined}
- >
+ <div class={style.root} data-expanded={expanded() || props.expand === true ? true : undefined}>
<div data-section="content" ref={overflow.ref}>
{props.children}
</div>
{((!props.expand && overflow.status) || expanded()) && (
- <button
- type="button"
- data-element-button-text
- onClick={() => setExpanded((e) => !e)}
- >
+ <button type="button" data-element-button-text onClick={() => setExpanded((e) => !e)}>
{expanded() ? "Show less" : "Show more"}
</button>
)}
diff --git a/packages/web/src/components/share/copy-button.tsx b/packages/web/src/components/share/copy-button.tsx
index ad2e83b2e..892d5553f 100644
--- a/packages/web/src/components/share/copy-button.tsx
+++ b/packages/web/src/components/share/copy-button.tsx
@@ -11,8 +11,7 @@ export function CopyButton(props: CopyButtonProps) {
function handleCopyClick() {
if (props.text) {
- navigator.clipboard.writeText(props.text)
- .catch((err) => console.error("Copy failed", err))
+ navigator.clipboard.writeText(props.text).catch((err) => console.error("Copy failed", err))
setCopied(true)
setTimeout(() => setCopied(false), 2000)
@@ -21,15 +20,8 @@ export function CopyButton(props: CopyButtonProps) {
return (
<div data-component="copy-button" class={styles.root}>
- <button
- type="button"
- onClick={handleCopyClick}
- data-copied={copied() ? true : undefined}
- >
- {copied()
- ? <IconCheckCircle width={16} height={16} />
- : <IconClipboard width={16} height={16} />
- }
+ <button type="button" onClick={handleCopyClick} data-copied={copied() ? true : undefined}>
+ {copied() ? <IconCheckCircle width={16} height={16} /> : <IconClipboard width={16} height={16} />}
</button>
</div>
)
diff --git a/packages/web/src/components/share/part.tsx b/packages/web/src/components/share/part.tsx
index b27e4806a..ddef206ba 100644
--- a/packages/web/src/components/share/part.tsx
+++ b/packages/web/src/components/share/part.tsx
@@ -168,32 +168,25 @@ export function Part(props: PartProps) {
</Show>
</div>
)}
- {
- props.message.role === "user" && props.part.type === "file" && (
- <div data-component="attachment">
- <div data-slot="copy">Attachment</div>
- <div data-slot="filename">{props.part.filename}</div>
- </div>
- )
- }
- {
- props.part.type === "step-start" && props.message.role === "assistant" && (
- <div data-component="step-start">
- <div data-slot="provider">{props.message.providerID}</div>
- <div data-slot="model">{props.message.modelID}</div>
- </div>
- )
- }
- {
- props.part.type === "tool" && props.part.state.status === "error" && (
- <div data-component="tool" data-tool="error">
- <ContentError>{formatErrorString(props.part.state.error)}</ContentError>
- <Spacer />
- </div>
- )
- }
- {
- props.part.type === "tool" &&
+ {props.message.role === "user" && props.part.type === "file" && (
+ <div data-component="attachment">
+ <div data-slot="copy">Attachment</div>
+ <div data-slot="filename">{props.part.filename}</div>
+ </div>
+ )}
+ {props.part.type === "step-start" && props.message.role === "assistant" && (
+ <div data-component="step-start">
+ <div data-slot="provider">{props.message.providerID}</div>
+ <div data-slot="model">{props.message.modelID}</div>
+ </div>
+ )}
+ {props.part.type === "tool" && props.part.state.status === "error" && (
+ <div data-component="tool" data-tool="error">
+ <ContentError>{formatErrorString(props.part.state.error)}</ContentError>
+ <Spacer />
+ </div>
+ )}
+ {props.part.type === "tool" &&
props.part.state.status === "completed" &&
props.message.role === "assistant" && (
<>
@@ -295,10 +288,9 @@ export function Part(props: PartProps) {
.toMillis()}
/>
</>
- )
- }
- </div >
- </div >
+ )}
+ </div>
+ </div>
)
}
diff --git a/packages/web/src/content/docs/cli.mdx b/packages/web/src/content/docs/cli.mdx
index 903c3638d..c0fbbd3ba 100644
--- a/packages/web/src/content/docs/cli.mdx
+++ b/packages/web/src/content/docs/cli.mdx
@@ -17,8 +17,6 @@ But it also accepts commands as documented on this page. This allows you to inte
opencode run "Explain how closures work in JavaScript"
```
-
-
---
## Commands
diff --git a/packages/web/src/content/docs/commands.mdx b/packages/web/src/content/docs/commands.mdx
index 59c9536ac..8653e26cc 100644
--- a/packages/web/src/content/docs/commands.mdx
+++ b/packages/web/src/content/docs/commands.mdx
@@ -62,7 +62,7 @@ Use the `command` option in your opencode [config](/docs/config):
"description": "Run tests with coverage",
"agent": "build",
"model": "anthropic/claude-3-5-sonnet-20241022"
- },
+ }
}
}
```
diff --git a/packages/web/src/content/docs/config.mdx b/packages/web/src/content/docs/config.mdx
index 045bc596c..68c14fc79 100644
--- a/packages/web/src/content/docs/config.mdx
+++ b/packages/web/src/content/docs/config.mdx
@@ -164,13 +164,13 @@ You can configure custom commands for repetitive tasks through the `command` opt
"template": "Run the full test suite with coverage report and show any failures.\nFocus on the failing tests and suggest fixes.",
"description": "Run tests with coverage",
"agent": "build",
- "model": "anthropic/claude-3-5-sonnet-20241022"
+ "model": "anthropic/claude-3-5-sonnet-20241022",
},
"component": {
"template": "Create a new React component named $ARGUMENTS with TypeScript support.\nInclude proper typing and basic structure.",
- "description": "Create a new component"
- }
- }
+ "description": "Create a new component",
+ },
+ },
}
```
diff --git a/packages/web/src/content/docs/formatters.mdx b/packages/web/src/content/docs/formatters.mdx
index 9c9411aeb..5c00c3ca7 100644
--- a/packages/web/src/content/docs/formatters.mdx
+++ b/packages/web/src/content/docs/formatters.mdx
@@ -11,19 +11,19 @@ opencode automatically formats files after they are written or edited using lang
opencode comes with several built-in formatters for popular languages and frameworks. Below is a list of the formatters, supported file extensions, and commands or config options it needs.
-| Formatter | Extensions | Requirements |
-| -------------- | -------------------------------------------------------------------------------------------------------- | ------------------------------------- |
-| gofmt | .go | `gofmt` command available |
-| mix | .ex, .exs, .eex, .heex, .leex, .neex, .sface | `mix` command available |
+| Formatter | Extensions | Requirements |
+| -------------- | -------------------------------------------------------------------------------------------------------- | --------------------------------------- |
+| gofmt | .go | `gofmt` command available |
+| mix | .ex, .exs, .eex, .heex, .leex, .neex, .sface | `mix` command available |
| prettier | .js, .jsx, .ts, .tsx, .html, .css, .md, .json, .yaml, and [more](https://prettier.io/docs/en/index.html) | `prettier` dependency in `package.json` |
-| biome | .js, .jsx, .ts, .tsx, .html, .css, .md, .json, .yaml, and [more](https://biomejs.dev/) | `biome.json(c)` config file |
-| zig | .zig, .zon | `zig` command available |
-| clang-format | .c, .cpp, .h, .hpp, .ino, and [more](https://clang.llvm.org/docs/ClangFormat.html) | `.clang-format` config file |
-| ktlint | .kt, .kts | `ktlint` command available |
-| ruff | .py, .pyi | `ruff` command available with config |
-| rubocop | .rb, .rake, .gemspec, .ru | `rubocop` command available |
-| standardrb | .rb, .rake, .gemspec, .ru | `standardrb` command available |
-| htmlbeautifier | .erb, .html.erb | `htmlbeautifier` command available |
+| biome | .js, .jsx, .ts, .tsx, .html, .css, .md, .json, .yaml, and [more](https://biomejs.dev/) | `biome.json(c)` config file |
+| zig | .zig, .zon | `zig` command available |
+| clang-format | .c, .cpp, .h, .hpp, .ino, and [more](https://clang.llvm.org/docs/ClangFormat.html) | `.clang-format` config file |
+| ktlint | .kt, .kts | `ktlint` command available |
+| ruff | .py, .pyi | `ruff` command available with config |
+| rubocop | .rb, .rake, .gemspec, .ru | `rubocop` command available |
+| standardrb | .rb, .rake, .gemspec, .ru | `standardrb` command available |
+| htmlbeautifier | .erb, .html.erb | `htmlbeautifier` command available |
So if your project has `prettier` in your `package.json`, opencode will automatically use it.
@@ -48,7 +48,7 @@ You can customize formatters through the `formatter` section in your opencode co
```json title="opencode.json"
{
"$schema": "https://opencode.ai/config.json",
- "formatter": { }
+ "formatter": {}
}
```
@@ -56,7 +56,7 @@ Each formatter configuration supports the following:
| Property | Type | Description |
| ------------- | -------- | ------------------------------------------------------- |
-| `disabled` | boolean | Set this to `true` to disable the formatter |
+| `disabled` | boolean | Set this to `true` to disable the formatter |
| `command` | string[] | The command to run for formatting |
| `environment` | object | Environment variables to set when running the formatter |
| `extensions` | string[] | File extensions this formatter should handle |
diff --git a/packages/web/src/content/docs/gitlab.mdx b/packages/web/src/content/docs/gitlab.mdx
index 023ac678e..0d21d70c5 100644
--- a/packages/web/src/content/docs/gitlab.mdx
+++ b/packages/web/src/content/docs/gitlab.mdx
@@ -33,7 +33,7 @@ Check out the [**GitLab docs**](https://docs.gitlab.com/user/duo_agent_platform/
6. Create a flow config file, here's an example:
<details>
- <summary>Flow configuration</summary>
+ <summary>Flow configuration</summary>
```yaml
image: node:22-slim
@@ -67,17 +67,17 @@ Check out the [**GitLab docs**](https://docs.gitlab.com/user/duo_agent_platform/
- |
opencode run "
You are an AI assistant helping with GitLab operations.
-
+
Context: $AI_FLOW_CONTEXT
Task: $AI_FLOW_INPUT
Event: $AI_FLOW_EVENT
-
+
Please execute the requested task using the available GitLab tools.
Be thorough in your analysis and provide clear explanations.
-
+
<important>
Please use the glab CLI to access data from GitLab. The glab CLI has already been authenticated. You can run the corresponding commands.
-
+
If you are asked to summarise an MR or issue or asked to provide more information then please post back a note to the MR/Issue so that the user can see it.
You don't need to commit or push up changes, those will be done automatically based on the file changes you make.
</important>
diff --git a/packages/web/src/content/docs/index.mdx b/packages/web/src/content/docs/index.mdx
index 7ca2fee79..7513d5bf4 100644
--- a/packages/web/src/content/docs/index.mdx
+++ b/packages/web/src/content/docs/index.mdx
@@ -41,26 +41,10 @@ You can also install it with the following:
- **Using Node.js**
<Tabs>
- <TabItem label="npm">
- ```bash
- npm install -g opencode-ai
- ```
- </TabItem>
- <TabItem label="Bun">
- ```bash
- bun install -g opencode-ai
- ```
- </TabItem>
- <TabItem label="pnpm">
- ```bash
- pnpm install -g opencode-ai
- ```
- </TabItem>
- <TabItem label="Yarn">
- ```bash
- yarn global add opencode-ai
- ```
- </TabItem>
+ <TabItem label="npm">```bash npm install -g opencode-ai ```</TabItem>
+ <TabItem label="Bun">```bash bun install -g opencode-ai ```</TabItem>
+ <TabItem label="pnpm">```bash pnpm install -g opencode-ai ```</TabItem>
+ <TabItem label="Yarn">```bash yarn global add opencode-ai ```</TabItem>
</Tabs>
- **Using Homebrew on macOS and Linux**
diff --git a/packages/web/src/content/docs/server.mdx b/packages/web/src/content/docs/server.mdx
index 0713cce65..2eea2ba74 100644
--- a/packages/web/src/content/docs/server.mdx
+++ b/packages/web/src/content/docs/server.mdx
@@ -79,9 +79,9 @@ The opencode server exposes the following APIs.
### Config
-| Method | Path | Description | Response |
-| ------ | ------------------- | --------------------------------- | ----------------------------------------------------------------------------------------------------- |
-| `GET` | `/config` | Get config info | <a href={typesUrl}><code>Config</code></a> |
+| Method | Path | Description | Response |
+| ------ | ------------------- | --------------------------------- | ---------------------------------------------------------------------------------------- |
+| `GET` | `/config` | Get config info | <a href={typesUrl}><code>Config</code></a> |
| `GET` | `/config/providers` | List providers and default models | `{ providers: `<a href={typesUrl}>Provider[]</a>`, default: { [key: string]: string } }` |
---
@@ -101,8 +101,8 @@ The opencode server exposes the following APIs.
| `POST` | `/session/:id/share` | Share session | Returns <a href={typesUrl}><code>Session</code></a> |
| `DELETE` | `/session/:id/share` | Unshare session | Returns <a href={typesUrl}><code>Session</code></a> |
| `POST` | `/session/:id/summarize` | Summarize session | |
-| `GET` | `/session/:id/message` | List messages in a session | Returns `{ info: `<a href={typesUrl}>Message</a>`, parts: `<a href={typesUrl}>Part[]</a>`}[]` |
-| `GET` | `/session/:id/message/:messageID` | Get message details | Returns `{ info: `<a href={typesUrl}>Message</a>`, parts: `<a href={typesUrl}>Part[]</a>`}` |
+| `GET` | `/session/:id/message` | List messages in a session | Returns `{ info: `<a href={typesUrl}>Message</a>`, parts: `<a href={typesUrl}>Part[]</a>`}[]` |
+| `GET` | `/session/:id/message/:messageID` | Get message details | Returns `{ info: `<a href={typesUrl}>Message</a>`, parts: `<a href={typesUrl}>Part[]</a>`}` |
| `POST` | `/session/:id/message` | Send chat message | body matches [`ChatInput`](https://github.com/sst/opencode/blob/main/packages/opencode/src/session/index.ts#L358), returns <a href={typesUrl}><code>Message</code></a> |
| `POST` | `/session/:id/shell` | Run a shell command | body matches [`CommandInput`](https://github.com/sst/opencode/blob/main/packages/opencode/src/session/index.ts#L1007), returns <a href={typesUrl}><code>Message</code></a> |
| `POST` | `/session/:id/revert` | Revert a message | body: `{ messageID }` |
@@ -175,6 +175,6 @@ The opencode server exposes the following APIs.
### Docs
-| Method | Path | Description | Response |
-| ------ | ------ | -------------------------------------- | ------------------------------------------ |
+| Method | Path | Description | Response |
+| ------ | ------ | ------------------------- | --------------------------- |
| `GET` | `/doc` | OpenAPI 3.1 specification | HTML page with OpenAPI spec |
diff --git a/packages/web/src/content/docs/tui.mdx b/packages/web/src/content/docs/tui.mdx
index 113bad697..19fafe822 100644
--- a/packages/web/src/content/docs/tui.mdx
+++ b/packages/web/src/content/docs/tui.mdx
@@ -272,6 +272,7 @@ Both the `/editor` and `/export` commands use the editor specified in your `EDIT
To make it permanent, add this to your shell profile;
`~/.bashrc`, `~/.zshrc`, etc.
+
</TabItem>
<TabItem label="Windows (CMD)">
@@ -284,6 +285,7 @@ Both the `/editor` and `/export` commands use the editor specified in your `EDIT
To make it permanent, use **System Properties** > **Environment
Variables**.
+
</TabItem>
<TabItem label="Windows (PowerShell)">
@@ -295,6 +297,7 @@ Both the `/editor` and `/export` commands use the editor specified in your `EDIT
```
To make it permanent, add this to your PowerShell profile.
+
</TabItem>
</Tabs>
diff --git a/packages/web/src/content/docs/zen.mdx b/packages/web/src/content/docs/zen.mdx
index 9f4069a81..3f54d30e2 100644
--- a/packages/web/src/content/docs/zen.mdx
+++ b/packages/web/src/content/docs/zen.mdx
@@ -73,11 +73,11 @@ We created opencode zen to:
Below are the models that we currently support and their prices **per 1M
tokens**.
-| Model | Input | Output |
-| ----- | ----- | ------ |
-| Qwen3 Coder 480B | $0.38 | $0.50 |
-| Grok Code Fast 1 | Free | Free |
-| Sonnet 4 | Soon | Soon |
+| Model | Input | Output |
+| ---------------- | ----- | ------ |
+| Qwen3 Coder 480B | $0.38 | $0.50 |
+| Grok Code Fast 1 | Free | Free |
+| Sonnet 4 | Soon | Soon |
:::note
We add a small markup to cover our costs.
@@ -86,7 +86,7 @@ We add a small markup to cover our costs.
A couple of notes:
- These are the raw prices based on the provider we are using internally. We
-charge a small markup on top of this to cover our processing fees.
+ charge a small markup on top of this to cover our processing fees.
- Grok Code Fast 1 is currently free on opencode till Sep 10th. The xAI team is
using this time to collect feedback and improve Grok Code.
diff --git a/packages/web/sst-env.d.ts b/packages/web/sst-env.d.ts
index b6a7e9066..0397645b5 100644
--- a/packages/web/sst-env.d.ts
+++ b/packages/web/sst-env.d.ts
@@ -6,4 +6,4 @@
/// <reference path="../../sst-env.d.ts" />
import "sst"
-export {} \ No newline at end of file
+export {}
generated by cgit v1.2.3 (git 2.39.1) at 2026-06-29 07:58:23 +0000