diff --git a/.agents/skills/blog/SKILL.md b/.agents/skills/blog/SKILL.md index 703ce9ff21..27ebc382c1 100644 --- a/.agents/skills/blog/SKILL.md +++ b/.agents/skills/blog/SKILL.md @@ -81,10 +81,11 @@ The image is an **abstract, on-brand illustration with no text** — AI-rendered ### Write the prompt -A 2–4 sentence prompt that: +A 2–4 sentence prompt in the **house image style** — a glossy 3D-rendered circuit-board scene, not a flat/minimal gradient backdrop: -- Describes a clean, modern, **abstract** tech illustration conveying the post's concept (concept over literalism — e.g. interlocking rotating keys and a shield for key rotation; a hub routing glowing streams to many nodes for orchestration). -- Bakes in the **LLM Gateway brand feel** (from `apps/ui/src/lib/og.tsx`): near-black background, a soft cyan glow (`rgb(56,189,248)`) in one corner and a soft violet glow (`rgb(139,92,246)`) in the opposite corner, subtle depth and glow, generous negative space, premium and minimal, balanced as a backdrop behind a headline. +- Set the scene: a dark navy computer circuit board in glossy 3D isometric perspective, with bright neon-teal light traces flowing across it toward a central raised chip. +- Put the post's concept at the center: a glowing element mounted on the central chip (concept over literalism — e.g. a glowing doorway for the gateway, a glowing rotating key for key rotation), surrounded by supporting glossy rounded 3D icons that fit the topic (chat bubbles, keys, charts, coins…) in vivid purple, lime green, and mint, each on small pedestals on the board. +- Add the render feel: subtle depth of field at the edges, soft reflections, premium 3D render, vibrant against the dark board. - **Reserves the top-left corner**: include "the top-left corner is intentionally empty clean negative space, with no logo, no icon, no wordmark and no brand text there." The real logo is composited in afterward (see "Always composite the official logo" below), never drawn by the model. - **Ends with**: "no logos, no UI chrome. Wide 3:2 landscape composition, 1536×1024." (If you want a branded card, you may keep a short headline/subtitle in the prompt — gpt-image-2 renders short text well — but **never** the logo.) diff --git a/.agents/skills/changelog/SKILL.md b/.agents/skills/changelog/SKILL.md index c92f4bc245..0b279f7c9c 100644 --- a/.agents/skills/changelog/SKILL.md +++ b/.agents/skills/changelog/SKILL.md @@ -79,10 +79,12 @@ Hand the user a single, ready-to-paste **gpt-image-2** prompt that produces the **Resolution.** Target **1536×1024** (3:2 landscape). This is the recommended OpenGraph size for gpt-image-2: the dimensions are divisible by 16 (a gpt-image-2 requirement) and crop cleanly to the ~1.91:1 social card. Match the `width`/`height` in the frontmatter to whatever you generate. (Square `1024×1024` is acceptable for icon-style art but crops more on social cards — prefer landscape for OG.) -**Prompt guidance.** Write a *small summary* prompt — 2–4 sentences — that: +**Prompt guidance.** Write a *small summary* prompt — 2–4 sentences — in the **house image style**: a glossy 3D-rendered circuit-board scene, not a flat/minimal gradient backdrop. The prompt should: -- Describes a clean, modern, abstract tech illustration that conveys the feature's concept (e.g. a catalog/ledger of model cards with price tags and guard rails for the model catalog). Concept over literalism. -- States the LLM Gateway brand feel: minimal, premium, soft gradients, subtle depth, plenty of negative space, suitable as a backdrop behind a title. +- Set the scene: a dark navy computer circuit board in glossy 3D isometric perspective, with bright neon-teal light traces flowing across it toward a central raised chip. +- Put the feature's concept at the center: a glowing element mounted on the central chip (e.g. a glowing doorway for the gateway, a glowing key for API keys). Concept over literalism. +- Surround it with supporting glossy rounded 3D icons that fit the feature (chat bubbles, keys, charts, coins…) in vivid purple, lime green, and mint, each on small pedestals on the board. +- Add the render feel: subtle depth of field at the edges, soft reflections, premium 3D render, vibrant against the dark board. - **Says "no text, no words, no letters, no UI chrome"** — AI image text is unreliable; the title lives in the page, not the image. - Specifies the aspect: "wide 3:2 landscape composition, 1536×1024". @@ -92,10 +94,13 @@ Output the prompt in a fenced block, then the save path, e.g.: Prompt for gpt-image-2 (1536×1024): ``` -A clean, modern abstract illustration of , in the LLM Gateway brand -style: minimal and premium, soft gradients, subtle depth and glow, generous -negative space, balanced as a backdrop behind a headline. Wide 3:2 landscape -composition, 1536×1024. No text, no words, no letters, no UI chrome. +A dark navy computer circuit board in glossy 3D isometric perspective, with +bright neon-teal light traces flowing across it toward a central raised chip. +On the chip sits a glowing . Around it, glossy rounded 3D + in vivid purple, lime green, and mint stand on small +pedestals on the board. Subtle depth of field at the edges, soft reflections, +premium 3D render. Wide 3:2 landscape composition, 1536×1024. No text, no +words, no letters, no UI chrome. ``` Save the result to: apps/ui/public/changelog/.png diff --git a/apps/api/src/utils/profile.ts b/apps/api/src/utils/profile.ts index 02def7a8f2..8e727e64d4 100644 --- a/apps/api/src/utils/profile.ts +++ b/apps/api/src/utils/profile.ts @@ -61,6 +61,7 @@ export const profileSchema = z.object({ // Coding-agent x-source values that count toward a profile's agent stats. // Mirrors the AGENTS definitions used by the DevPass dashboard UI. export const CODING_AGENT_SOURCES = [ + "devpass-code", "claude.com/claude-code", "opencode", "open-code", diff --git a/apps/docs/content/guides/devpass-code.mdx b/apps/docs/content/guides/devpass-code.mdx index 41a8f3ada8..05a9de5586 100644 --- a/apps/docs/content/guides/devpass-code.mdx +++ b/apps/docs/content/guides/devpass-code.mdx @@ -13,24 +13,24 @@ Log in once from your terminal with a single click in the browser — no copy-pa ## Install -DevPass Code runs on [Bun](https://bun.sh). Clone the repository and install dependencies: +Install DevPass Code globally from npm: ```bash -git clone https://github.com/theopenco/devpass-code.git -cd devpass-code -bun install +npm i -g devpass-code ``` -Run it from source: +Or with Homebrew: ```bash -bun run packages/devpass-code/src/index.ts --help +brew install theopenco/tap/devpass-code ``` -Or use the dev script: +Other options: an install script (`curl -fsSL https://raw.githubusercontent.com/theopenco/devpass-code/main/install | bash`), an AUR package (`devpass-code-bin`), a Docker image (`ghcr.io/theopenco/devpass-code`), and Windows binaries on [GitHub releases](https://github.com/theopenco/devpass-code/releases). + +To run from source instead, clone the repository, `bun install`, then: ```bash -bun dev +bun run packages/devpass-code/src/index.ts --help ``` ## Authenticate diff --git a/apps/docs/content/learn/member-analytics.mdx b/apps/docs/content/learn/member-analytics.mdx index 38b34e5709..535ce98eb0 100644 --- a/apps/docs/content/learn/member-analytics.mdx +++ b/apps/docs/content/learn/member-analytics.mdx @@ -7,7 +7,7 @@ icon: ChartPie import { Callout } from "fumadocs-ui/components/callout"; import { ThemedImage } from "@/components/themed-image"; -Member Analytics breaks your organization's usage down by person, so you can see who is spending what across every project. It lives on the **Members** page and is available on the **Enterprise** plan. +Member Analytics breaks your organization's usage down by person, so you can see who is spending what across every project. It lives on the **Team** page and is available on the **Enterprise** plan. @@ -19,7 +19,7 @@ Member Analytics breaks your organization's usage down by person, so you can see ## Members Table -The Members page adds a usage table sorted by spend, so the heaviest users surface first. Each row shows that member's totals for the selected date range: +The Team page adds a usage table sorted by spend, so the heaviest users surface first. Each row shows that member's totals for the selected date range: | Column | Description | | -------------- | -------------------------------------------- | diff --git a/apps/ui/public/changelog/team-budgets-product-roundup.png b/apps/ui/public/changelog/team-budgets-product-roundup.png new file mode 100644 index 0000000000..be099e7808 Binary files /dev/null and b/apps/ui/public/changelog/team-budgets-product-roundup.png differ diff --git a/apps/ui/src/components/integrations/integration-cards.tsx b/apps/ui/src/components/integrations/integration-cards.tsx index 8ec67f9357..0bca63f1f6 100644 --- a/apps/ui/src/components/integrations/integration-cards.tsx +++ b/apps/ui/src/components/integrations/integration-cards.tsx @@ -13,6 +13,7 @@ import { OpenClawIcon, ClineIcon, CursorIcon, + DevPassCodeIcon, HermesIcon, KiloCodeIcon, KimiIcon, @@ -37,6 +38,14 @@ interface Integration { } const integrations: Integration[] = [ + { + name: "DevPass Code", + description: + "Our open-source terminal coding agent built for LLM Gateway. One browser login, every model, no per-provider keys.", + href: "/guides/devpass-code", + icon: DevPassCodeIcon, + comingSoon: false, + }, { name: "Autohand Code", description: diff --git a/apps/ui/src/content/blog/2026-07-01-devpass-code.md b/apps/ui/src/content/blog/2026-07-01-devpass-code.md index ced0a72476..606f40123b 100644 --- a/apps/ui/src/content/blog/2026-07-01-devpass-code.md +++ b/apps/ui/src/content/blog/2026-07-01-devpass-code.md @@ -48,15 +48,20 @@ It sends an `x-source: devpass-code` header on every request, so if you're on De ## Install it -DevPass Code runs on [Bun](https://bun.sh). Clone the repo and go: +DevPass Code is one command away. From npm: ```bash -git clone https://github.com/theopenco/devpass-code -cd devpass-code -bun install -bun run packages/devpass-code/src/index.ts --help +npm i -g devpass-code ``` +Or with Homebrew: + +```bash +brew install theopenco/tap/devpass-code +``` + +Prefer something else? There's an install script (`curl -fsSL https://raw.githubusercontent.com/theopenco/devpass-code/main/install | bash`), an AUR package (`devpass-code-bin`), a Docker image (`ghcr.io/theopenco/devpass-code`), and Windows binaries on [GitHub releases](https://github.com/theopenco/devpass-code/releases). + Then authenticate and start a session: ```bash @@ -72,6 +77,10 @@ If you'd rather not log in interactively, set `LLMGATEWAY_API_KEY` in your envir The tool is open source (MIT) and free to run. You pay only for the models you use through LLM Gateway — either pay-as-you-go credits or a DevPass subscription. There's no separate charge for the agent itself. +### How do I install DevPass Code? + +`npm i -g devpass-code` on any platform with Node, or `brew install theopenco/tap/devpass-code` on macOS and Linux. An install script, an AUR package (`devpass-code-bin`), a Docker image, and Windows binaries are also available on [GitHub](https://github.com/theopenco/devpass-code). + ### Do I need a DevPass subscription to use it? No. Pick the **LLM Gateway** provider and you're on pay-as-you-go with your own key or credits. The **LLM Gateway DevPass** provider is there for subscribers who want flat-rate coding usage. @@ -87,5 +96,5 @@ opencode supports dozens of providers and needs per-provider setup. DevPass Code ## Get started - **[Try LLM Gateway free](https://llmgateway.io/signup)** and grab an API key -- **[DevPass Code on GitHub](https://github.com/theopenco/devpass-code)** — clone, install, and log in +- Run `npm i -g devpass-code` — or browse the source on [GitHub](https://github.com/theopenco/devpass-code) - Read the [coding agents guide](https://docs.llmgateway.io/guides/devpass-code) to connect it to your workflow diff --git a/apps/ui/src/content/changelog/2026-07-03-team-budgets-product-roundup.md b/apps/ui/src/content/changelog/2026-07-03-team-budgets-product-roundup.md new file mode 100644 index 0000000000..f6b9c724f9 --- /dev/null +++ b/apps/ui/src/content/changelog/2026-07-03-team-budgets-product-roundup.md @@ -0,0 +1,86 @@ +--- +id: "63" +slug: "team-budgets-product-roundup" +date: "2026-07-03" +title: "Per-Member Budgets, Developer Role & PDF Invoices" +summary: "Cap any teammate's spend and API keys with per-member budgets, give contractors project-scoped developer access on Enterprise, download a PDF invoice for any purchase, and see analytics bucketed in your own timezone. Plus Claude Sonnet 5 at introductory pricing, Claude Fable 5 back online, and DevPass Code on npm." +image: + src: "/changelog/team-budgets-product-roundup.png" + alt: "Product roundup: per-member budgets, developer role, PDF invoices, and timezone-aware analytics on LLM Gateway" + width: 1536 + height: 1024 +--- + +Everyone in an organization used to draw from one pool of credits with no per-person guard rails — one over-eager script could spend the whole team's budget. This roundup is about per-member control: budgets, a scoped developer role, clearer billing, and steadier streams. + +## One Team Page for People and Spend + +**Team** and **Members** are now a single page. **Organization → Team** handles invites, roles, and budgets, and — for admins on the **Enterprise plan** — adds per-member cost, tokens, requests, and API-key columns. Open a member's detail page for their spend against each cap, a usage-over-time chart by model, and their top models and providers. An info card next to the role picker spells out exactly what Owner, Admin, and Developer can do. + +## Per-Member Budgets + +Give each member their own guard rails from **Manage budget** on any Team row: + +| Limit | What it caps | +| ----------------------- | ------------------------------------------------ | +| **Max active API keys** | How many keys the member can have active at once | +| **Total spend limit** | Lifetime spend across all of the member's keys | +| **Period spend limit** | Spend per rolling hour, day, week, or month | + +The gateway enforces spend caps at request time across chat, embeddings, OCR, speech, and video — an over-budget request is rejected with `403` ("Member has reached their total spend budget.") before it reaches a provider, and key creation past the cap fails with a clear `400`. You can also set org-wide **default developer limits** that cover every developer without a personal override, and each member sees their remaining allowance on their own dashboard. Budgets are available to admins on every plan. + +## Project-Scoped Developer Role + +The new **Developer** role grants access to exactly the projects you pick — nothing else. Developers get a minimal dashboard with their own usage and API keys, and the rest of the org UI stays out of reach. Pair it with default developer limits and a contractor is productive, and capped, in one invite. Available on the **Enterprise plan**. + +## PDF Invoices for Every Purchase + +Every completed charge in **Organization → Transactions** now has a download button — an **Invoice** for charges, a **Credit note** for refunds: + +``` +GET /orgs/{orgId}/transactions/{transactionId}/invoice +``` + +The same download is available for DevPass invoices and from the chat billing history. + +## Analytics in Your Timezone + +Daily charts used to bucket by UTC midnight, so late-evening traffic landed on "tomorrow". Every analytics endpoint now accepts an IANA `timezone` parameter and buckets by your local day — the dashboard passes your browser's timezone automatically, so charts line up with your wall clock: + +``` +GET /analytics/activity?organizationId=&groupBy=model&timezone=Europe/Paris +``` + +## Key Usage and Reset Times in the API + +The Master Keys API and the payments SDK's `getBalance()` now report consumed usage next to the configured limits — including when the current window resets — so platforms can show end users exactly how much headroom a key has left: + +```json +{ + "usageLimit": "100", + "usage": "42.13", + "periodUsageLimit": "10", + "currentPeriodUsage": "3.20", + "currentPeriodResetAt": "2026-07-04T00:00:00.000Z" +} +``` + +## Streams That Don't Drop + +Long streaming responses — extended thinking especially — could sit quiet long enough for a proxy or client to time out. The gateway now sends an SSE keepalive comment (`: ping`) every 15 seconds on the Anthropic and Responses endpoints, and a mid-stream failure ends with a proper terminal event (`error` + `message_stop`, or `response.failed`) instead of a silently truncated response. + +## New Models + +- **Claude Sonnet 5** — a 1M-token context window, adaptive reasoning, and 128k output, at introductory pricing of **$2 / $10 per million input/output tokens through August 31** (then $3 / $15). Available via Anthropic, Google Vertex, and AWS Bedrock. +- **Claude Fable 5 is back** — reactivated on Anthropic and AWS Bedrock (global and US regions) after [June's suspension](https://llmgateway.io/blog/claude-fable-5-access-suspended). +- **Gemini 3.1 Flash Lite Image** — Google's smallest image generation and editing model, built for at-scale usage, on AI Studio and Vertex. +- **Gemma 4 31B on Cerebras** — a new high-speed mapping at $0.99 / $1.49 per million tokens. + +## Product Polish + +- **Support widget redesign** — suggested starter questions, one-click "Talk to a human" escalation with email follow-up, and conversation ratings. +- **DevPass Code on npm** — the [terminal coding agent](https://llmgateway.io/blog/devpass-code) now installs with `npm i -g devpass-code`. + +--- + +**[Team & budgets docs →](https://docs.llmgateway.io/learn/team)** | **[Open your dashboard →](https://llmgateway.io/dashboard)** diff --git a/apps/ui/src/content/guides/devpass-code.md b/apps/ui/src/content/guides/devpass-code.md new file mode 100644 index 0000000000..36da620d8a --- /dev/null +++ b/apps/ui/src/content/guides/devpass-code.md @@ -0,0 +1,76 @@ +--- +id: devpass-code +slug: devpass-code +title: DevPass Code Integration +description: Set up DevPass Code, the open-source terminal coding agent built for LLM Gateway. Install from npm, log in once from your browser, and code with every model on the gateway. +date: 2026-07-03 +--- + +DevPass Code is an open-source terminal coding agent that talks only to LLM Gateway. It's a fork of opencode (MIT) trimmed down to a single upstream: one browser login, roughly 190 text models, and no per-provider API keys to juggle. Every request is tagged with `x-source: devpass-code`, so usage is attributed correctly in your dashboard and on your DevPass plan. + +## Install + +Install DevPass Code globally from npm: + +```bash +npm i -g devpass-code +``` + +Or with Homebrew: + +```bash +brew install theopenco/tap/devpass-code +``` + +Other options: an install script (`curl -fsSL https://raw.githubusercontent.com/theopenco/devpass-code/main/install | bash`), an AUR package (`devpass-code-bin`), a Docker image (`ghcr.io/theopenco/devpass-code`), and Windows binaries on [GitHub releases](https://github.com/theopenco/devpass-code/releases). + +## Setup + +### Step 1: Start the login flow + +DevPass Code supports one-click browser login, just like Claude Code: + +```bash +devpass-code auth login +``` + +### Step 2: Pick a provider + +Choose how your usage is billed. Both providers hit `https://api.llmgateway.io/v1` and expose the same models: + +| Provider | Billing | +| ----------------------- | --------------------------------------------------------------------------- | +| **LLM Gateway** | Pay-as-you-go with credits or your own API key | +| **LLM Gateway DevPass** | The [DevPass](/code) coding subscription — billing is handled automatically | + +### Step 3: Log in with your browser + +Select **"Log in with browser."** DevPass Code opens [llmgateway.io/connect/cli](https://llmgateway.io/connect/cli) and starts a local loopback server. Approve the request in the browser, and the API key is delivered straight back to your machine — nothing to copy or paste. Credentials are saved to `~/.local/share/devpass-code/auth.json`. + +Prefer to paste a key? Choose **"Paste an API key"** instead and use a key from your [dashboard](https://llmgateway.io/dashboard), or set the `LLMGATEWAY_API_KEY` environment variable to skip the prompt entirely. + +### Step 4: Start coding + +Launch the TUI in any project directory: + +```bash +devpass-code +``` + +Every text model on the gateway shows up in the model picker, and switching is a keystroke — no config change. All requests and their costs appear in your [dashboard](https://llmgateway.io/dashboard). + +## Configuration + +- **Config file** — Place a `devpass-code.json` in your project (or global config directory) to customize models and behavior. +- **`LLMGATEWAY_API_KEY`** — Provide your LLM Gateway API key without running the login flow. +- **`DEVPASS_APP_URL`** — Override the app URL used for browser login (defaults to `https://llmgateway.io`). + +## Why Use DevPass Code + +- **~190 text models** — Claude, GPT, Gemini, Grok, DeepSeek, and more, all through one endpoint +- **One-click login** — Approve in the browser, key delivered automatically +- **DevPass billing** — A [DevPass subscription](/code) is applied automatically, with usage attributed per agent +- **Cost tracking** — See exactly what each coding session costs +- **Open source** — MIT licensed, on [GitHub](https://github.com/theopenco/devpass-code) + +Read the [announcement post](/blog/devpass-code) for the full story, or the [docs guide](https://docs.llmgateway.io/guides/devpass-code) for reference details. diff --git a/packages/shared/src/components/integration-guides-grid.tsx b/packages/shared/src/components/integration-guides-grid.tsx index eb1f015748..d512cedbdc 100644 --- a/packages/shared/src/components/integration-guides-grid.tsx +++ b/packages/shared/src/components/integration-guides-grid.tsx @@ -9,6 +9,7 @@ import { CodexIcon, ContinueIcon, CursorIcon, + DevPassCodeIcon, HermesIcon, KiloCodeIcon, KimiIcon, @@ -34,6 +35,14 @@ export interface IntegrationGuide { } export const DEFAULT_INTEGRATION_GUIDES: IntegrationGuide[] = [ + { + name: "DevPass Code", + description: + "Our open-source terminal coding agent built for LLM Gateway. One browser login, every model, no per-provider keys.", + href: "/guides/devpass-code", + icon: DevPassCodeIcon, + comingSoon: false, + }, { name: "Autohand Code", description: