opencode-tweaks 0.6.0 → 0.7.0

package/README.md

@@ -100,6 +100,7 @@ Resetting a setting drops the local value, so the option or default applies agai
 | `quota`  | Provider quota, reset times, and a daily spending budget. | On      |
 | `tokens` | Token usage per turn, plus session totals at the bottom.  | On      |
 | `cost`   | Cost per turn, plus session totals at the bottom.         | On      |
+| `model`  | Current model list price and peak state in the sidebar.   | On      |
 
 ### Quota
 
@@ -179,11 +180,12 @@ Costs come from what the provider reports, so a free plan shows `$0.00`. `Cost d
 `Auto` keeps two decimals and grows until the first significant digit shows (`$0.004`), while a fixed choice always
 keeps that many (`$0.0042`).
 
-`Price windows` marks the provider's higher rate beside the cost. DeepSeek doubles its listed prices from 01:00 to
+`Price windows` marks rounds billed above the catalog price. DeepSeek doubles its listed prices from 01:00 to
 04:00 and from 06:00 to 10:00 UTC, Monday to Friday, and bills Chinese public holidays at the off-peak rate; OpenCode
-Go publishes the same DeepSeek rates. The badge reads `peak ×2` while that rate applies. The catalog already holds the
-off-peak price, so the figures themselves stay the listed rate. The 2026 and 2027 holidays are built in; update
-`src/usage/price-window.ts` when the next calendar is published.
+Go publishes the same DeepSeek rates. The badge reads `peak ×2` beside the turn cost when that round started in a peak
+window, so it stays on screen after the window closes. The catalog already holds the off-peak price, so the figures
+themselves stay the listed rate. The 2026 and 2027 holidays are built in; update `src/usage/price-window.ts` when the
+next calendar is published.
 
 `Estimate cost` fills in a price the provider did not report, using the model's list price from the same catalog
 OpenCode already synced: prompt, completion, reasoning billed as output, and cache traffic, each at its own rate. A
@@ -193,6 +195,19 @@ per turn, and the estimate follows the API rates instead. Costs use the raw coun
 
 The cost settings used to live in the Tokens entry. A choice saved there before the split keeps applying.
 
+### Model
+
+Model shows the model the session is using and its list price in the sidebar, under the quota. The name, provider,
+and reasoning variant come from the session, so the card follows `/models`.
+
+`Input price`, `Output price`, and `Cache read price` choose the rates, all in dollars per million tokens. The card
+uses the catalog price that applies to the session's context, so a long-context tier shows the higher rate with its
+threshold (`>512K`).
+
+`Peak state` adds the provider's live peak marker for schedules the plugin knows, such as DeepSeek and OpenCode Go:
+`peak ×2 now` during the higher window and `off-peak` otherwise. The badge on the turn cost still records the window
+each round started in.
+
 ## Development
 
 ```sh
@@ -231,6 +246,8 @@ src/
     quota-panel.tsx sidebar quota panel
     tokens.ts       token tweak definition
     cost.ts         cost tweak definition
+    model.ts        model tweak definition
+    model-panel.tsx sidebar model price card
     usage-slots.tsx inline and status line figures
     usage-inject.ts splice into the host's lines
 ```

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "opencode-tweaks",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "Opt-in settings and small interface improvements for OpenCode.",
   "type": "module",
   "license": "MIT",

package/src/tui.tsx

@@ -1,5 +1,6 @@
 import { Plugin } from "@opencode/plugin/tui"
 import { openTweaksMenu } from "./tweaks/menu"
+import { ModelPanel } from "./tweaks/model-panel"
 import { QuotaPanel } from "./tweaks/quota-panel"
 import { createSettingsStore } from "./tweaks/settings"
 import { createUsageInjector } from "./tweaks/usage-inject"
@@ -17,6 +18,11 @@ export default Plugin.define({
       render: () => <QuotaPanel context={context} store={store} />,
     })
 
+    context.ui.slot({
+      append: "sidebar.content",
+      render: (input) => <ModelPanel context={context} input={input} store={store} />,
+    })
+
     context.ui.slot({
       append: "session.composer.top",
       render: (input) => (

package/src/tweaks/cost.ts

@@ -60,8 +60,7 @@ export const costTweak = defineTweak({
     {
       id: "windows",
       title: "Price windows",
-      description:
-        "Mark when the provider charges more than the catalog price, such as DeepSeek peak hours.",
+      description: "Mark rounds billed above the catalog price, such as DeepSeek peak hours.",
       category: "Display",
       kind: "boolean",
       default: true,

package/src/tweaks/model-panel.tsx

@@ -0,0 +1,185 @@
+import type { Context, SlotMap } from "@opencode/plugin/tui/context"
+import { TextAttributes } from "@opentui/core"
+import { createEffect, createMemo, createSignal, onCleanup, Show } from "solid-js"
+import { formatRate, priceFor } from "../usage/cost"
+import { hasPriceSchedule, priceWindowFor } from "../usage/price-window"
+import { formatTokens } from "../usage/tokens"
+import { modelTweak } from "./model"
+import type { SettingsStore } from "./settings"
+import type { TweakSetting } from "./types"
+
+function setting(id: string): TweakSetting {
+  const found = modelTweak.settings.find((item) => item.id === id)
+  if (!found) throw new Error(`Model setting "${id}" is missing`)
+  return found
+}
+
+const ENABLED = setting("enabled")
+const INPUT = setting("input")
+const OUTPUT = setting("output")
+const CACHE = setting("cache")
+const VARIANT = setting("variant")
+const PEAK = setting("peak")
+
+/** The ref stored on a session or returned by the composer. */
+interface ModelRef {
+  readonly providerID: string
+  readonly id: string
+  readonly variant?: string
+}
+
+/**
+ * The model card is a companion to the cost figures: it names the model and
+ * lists its catalog rates, while the cost tweak counts what the session spent.
+ */
+export function ModelPanel(props: {
+  readonly context: Context
+  readonly input: SlotMap["sidebar.content"]
+  readonly store: SettingsStore
+}) {
+  const enabled = () => props.store.read(modelTweak, ENABLED).value === true
+
+  return (
+    <Show when={enabled()}>
+      <ModelBody context={props.context} input={props.input} store={props.store} />
+    </Show>
+  )
+}
+
+function ModelBody(props: {
+  readonly context: Context
+  readonly input: SlotMap["sidebar.content"]
+  readonly store: SettingsStore
+}) {
+  const theme = () => props.context.theme
+  const [now, setNow] = createSignal(Date.now())
+
+  const inputOn = () => props.store.read(modelTweak, INPUT).value === true
+  const outputOn = () => props.store.read(modelTweak, OUTPUT).value === true
+  const cacheOn = () => props.store.read(modelTweak, CACHE).value === true
+  const variantOn = () => props.store.read(modelTweak, VARIANT).value === true
+  const peakOn = () => props.store.read(modelTweak, PEAK).value === true
+
+  /** The session's model, or the composer's while the session has none yet. */
+  const model = createMemo<ModelRef | undefined>(() => {
+    const session = props.context.data.session.get(props.input.sessionID)
+    if (session?.model) return session.model
+
+    const current = props.context.ui.model.current()
+    return current
+      ? { providerID: current.providerID, id: current.modelID, variant: current.variant }
+      : undefined
+  })
+
+  /** The catalog entry for that model, with what the panel needs to show it. */
+  const entry = createMemo(() => {
+    const ref = model()
+    if (!ref) return undefined
+
+    const found = (props.context.data.location.model.list() ?? []).find(
+      (candidate) =>
+        candidate.providerID === ref.providerID &&
+        (candidate.modelID === ref.id || candidate.id === ref.id),
+    )
+    const provider = (props.context.data.location.provider.list() ?? []).find(
+      (candidate) => candidate.id === ref.providerID,
+    )
+
+    return {
+      ref,
+      name: found?.name ?? ref.id,
+      provider: provider?.name,
+      costs: found?.cost ?? [],
+    }
+  })
+
+  /** The context the session has read so far, which picks a long-context tier. */
+  const contextSize = createMemo(() => {
+    const tokens = props.context.data.session.get(props.input.sessionID)?.tokens
+    return tokens ? tokens.input + tokens.cache.read : 0
+  })
+
+  const price = createMemo(() => {
+    const costs = entry()?.costs
+    return costs?.length ? priceFor(costs, contextSize()) : undefined
+  })
+
+  const rates = createMemo(() => {
+    const value = price()
+    if (!value) return undefined
+
+    const parts: string[] = []
+    if (inputOn()) parts.push(`in ${formatRate(value.input)}`)
+    if (outputOn()) parts.push(`out ${formatRate(value.output)}`)
+    if (cacheOn()) parts.push(`cache ${formatRate(value.cache.read)}`)
+    if (parts.length > 0 && value.tier) {
+      parts.push(`>${formatTokens(value.tier.size, "compact")}`)
+    }
+
+    return parts.length > 0 ? parts.join(" · ") : undefined
+  })
+
+  const variant = () => (variantOn() ? entry()?.ref.variant : undefined)
+
+  const subtitle = () => {
+    const parts = [entry()?.provider, variant()].filter(
+      (part): part is string => typeof part === "string" && part.length > 0,
+    )
+    return parts.length > 0 ? parts.join(" · ") : undefined
+  }
+
+  const scheduled = () => {
+    const ref = entry()?.ref
+    return ref ? hasPriceSchedule(ref) : false
+  }
+
+  const peak = () => {
+    const ref = entry()?.ref
+    if (!ref || !peakOn() || !scheduled()) return undefined
+    return priceWindowFor(ref, new Date(now()))
+  }
+
+  const peakLabel = () => {
+    if (!peakOn() || !scheduled()) return undefined
+    const window = peak()
+    return window ? `${window.label} ×${window.multiplier} now` : "off-peak"
+  }
+
+  // The live peak marker follows the clock, so refresh it while the card can
+  // show one. Models without a schedule and a hidden peak row need no timer.
+  createEffect(() => {
+    if (!peakOn() || !scheduled()) return
+
+    setNow(Date.now())
+    const timer = setInterval(() => setNow(Date.now()), 30_000)
+    onCleanup(() => clearInterval(timer))
+  })
+
+  return (
+    <box flexDirection="column" marginTop={1}>
+      <text attributes={TextAttributes.BOLD} fg={theme().text.base}>
+        Model
+      </text>
+      <Show when={entry()} fallback={<text fg={theme().text.muted}>No model selected</text>}>
+        <text fg={theme().text.base} wrapMode="word">
+          {entry()?.name}
+        </text>
+        <Show when={subtitle()}>
+          <text fg={theme().text.muted} wrapMode="word">
+            {subtitle()}
+          </text>
+        </Show>
+        <Show when={rates()}>
+          <text fg={theme().text.muted} wrapMode="word">
+            {rates()}
+          </text>
+        </Show>
+        <Show when={peakLabel()}>
+          <text fg={peak() ? theme().text.feedback.warning.base : theme().text.muted}>
+            {peakLabel()}
+          </text>
+        </Show>
+      </Show>
+    </box>
+  )
+}

package/src/tweaks/model.ts

@@ -0,0 +1,63 @@
+import { defineTweak } from "./types"
+
+/**
+ * The sidebar card reads the same catalog as the cost figures, but stays its
+ * own tweak: it describes the model, while the cost tweak counts what it spent.
+ * Every rate is optional so the card fits a narrow sidebar.
+ */
+export const modelTweak = defineTweak({
+  id: "model",
+  title: "Model",
+  description: "Show the current model's list price and peak state in the sidebar.",
+  category: "Session",
+  settings: [
+    {
+      id: "enabled",
+      title: "Enabled",
+      description: "Show the model card in the sidebar.",
+      category: "General",
+      kind: "boolean",
+      default: true,
+    },
+    {
+      id: "input",
+      title: "Input price",
+      description: "Show the input rate per million tokens.",
+      category: "Rates",
+      kind: "boolean",
+      default: true,
+    },
+    {
+      id: "output",
+      title: "Output price",
+      description: "Show the output rate per million tokens.",
+      category: "Rates",
+      kind: "boolean",
+      default: true,
+    },
+    {
+      id: "cache",
+      title: "Cache read price",
+      description: "Show the cache read rate per million tokens.",
+      category: "Rates",
+      kind: "boolean",
+      default: true,
+    },
+    {
+      id: "variant",
+      title: "Variant",
+      description: "Show the reasoning variant selected for the model.",
+      category: "Display",
+      kind: "boolean",
+      default: true,
+    },
+    {
+      id: "peak",
+      title: "Peak state",
+      description: "Show whether the model is billed above its catalog price right now.",
+      category: "Display",
+      kind: "boolean",
+      default: true,
+    },
+  ],
+})

package/src/tweaks/registry.ts

@@ -1,10 +1,11 @@
 import { costTweak } from "./cost"
+import { modelTweak } from "./model"
 import { quotaTweak } from "./quota"
 import { tokensTweak } from "./tokens"
 import type { Tweak } from "./types"
 
 /** Every tweak shown by `/tweaks`. Add new definitions here. */
-export const tweaks: readonly Tweak[] = [quotaTweak, tokensTweak, costTweak]
+export const tweaks: readonly Tweak[] = [quotaTweak, tokensTweak, costTweak, modelTweak]
 
 export function findTweak(id: string): Tweak | undefined {
   return tweaks.find((tweak) => tweak.id === id)

package/src/tweaks/usage-slots.tsx

@@ -10,7 +10,7 @@ import {
   priceFor,
 } from "../usage/cost"
 import { footerMessage, replyTurnMessages, type UsageMessage } from "../usage/messages"
-import { formatPriceWindow, type PriceModel, priceWindowFor } from "../usage/price-window"
+import { formatPriceWindow, type PriceModel, turnPriceWindow } from "../usage/price-window"
 import { formatTokens, sessionTokens, type TokenCount, usageTokens } from "../usage/tokens"
 import { costTweak } from "./cost"
 import type { SettingsStore } from "./settings"
@@ -84,19 +84,6 @@ function useUsage(props: {
 
   const sessions = props.context.data.session
 
-  const [now, setNow] = createSignal(Date.now())
-
-  // The badge follows the clock, not the transcript: a line that stays on
-  // screen across a rate change has to update on its own. The timer exists
-  // only while the cost tweak and its price windows are on.
-  createEffect(() => {
-    if (!costOn() || !windowsOn() || (!promptCost() && !totalCost())) return
-
-    setNow(Date.now())
-    const timer = setInterval(() => setNow(Date.now()), 30_000)
-    onCleanup(() => clearInterval(timer))
-  })
-
   // List prices come from the model catalog the TUI already synced, so an
   // estimate costs nothing but a lookup.
   const prices = createMemo(() => {
@@ -205,27 +192,17 @@ function useUsage(props: {
     return sessions.get(sessionID)?.model ?? lastModel(messages(sessionID))
   }
 
-  /** The higher price that applies right now, when the cost figures are on. */
-  const windowFor = (model: PriceModel | undefined) =>
-    costOn() && windowsOn() ? priceWindowFor(model, new Date(now())) : undefined
-
   const promptCostLabel = () => {
     const value = cost()
     if (!costOn() || !promptCost() || value === undefined) return undefined
 
     const label = formatCost(value, costDigits())
-    const window = windowFor(lastModel(turn()) ?? sessionModel())
+    const window = windowsOn() ? turnPriceWindow(turn(), sessionModel()) : undefined
     return window ? `${label} · ${formatPriceWindow(window)}` : label
   }
 
-  const totalCostLabel = () => {
-    if (!costOn() || !totalCost()) return undefined
-
-    const value = sessionCost()
-    const label = formatCost(value, costDigits())
-    const window = value > 0 ? windowFor(sessionModel()) : undefined
-    return window ? `${label} · ${formatPriceWindow(window)}` : label
-  }
+  const totalCostLabel = () =>
+    costOn() && totalCost() ? formatCost(sessionCost(), costDigits()) : undefined
 
   return {
     enabled: () => tokensOn() || costOn(),

package/src/usage/cost.ts

@@ -85,6 +85,15 @@ export function isCostDigits(value: unknown): value is CostDigits {
   return value === "auto" || value === 2 || value === 3 || value === 4 || value === 5 || value === 6
 }
 
+/**
+ * A list rate per million tokens. Normal rates keep two decimals; sub-cent
+ * rates show up to six and drop trailing zeros, so `$0.003` stays readable.
+ */
+export function formatRate(value: number): string {
+  if (value >= 0.01) return `$${value.toFixed(2)}`
+  return `$${value.toFixed(6).replace(/0+$/, "").replace(/\.$/, "")}`
+}
+
 /** Normal amounts keep two decimals; smaller ones grow until a digit shows. */
 function autoDigits(cost: number): number {
   if (cost === 0 || cost >= 0.01) return 2

package/src/usage/messages.ts

@@ -13,6 +13,8 @@ export interface UsageMessage {
   readonly tokens?: MessageTokens
   readonly cost?: number
   readonly model?: { readonly providerID: string; readonly id: string }
+  /** When the step was created, which is when the provider started billing it. */
+  readonly time?: { readonly created?: number }
   /** How the step ended; the host only draws a footer for a finished one. */
   readonly finish?: string | null
   readonly error?: unknown

package/src/usage/price-window.ts

@@ -1,3 +1,5 @@
+import type { UsageMessage } from "./messages"
+
 /** The provider and model a message belongs to. */
 export interface PriceModel {
   readonly providerID: string
@@ -105,6 +107,19 @@ function utcMinutes(date: Date): number {
   return date.getUTCHours() * 60 + date.getUTCMinutes()
 }
 
+/** The schedule a model follows, when its provider publishes one. */
+function scheduleFor(model: PriceModel): PriceSchedule | undefined {
+  return schedules.find(
+    (candidate) =>
+      candidate.providers.includes(model.providerID) && model.id.startsWith(candidate.modelPrefix),
+  )
+}
+
+/** Whether the model follows a published peak schedule, even off-peak. */
+export function hasPriceSchedule(model: PriceModel | undefined): boolean {
+  return model ? scheduleFor(model) !== undefined : false
+}
+
 /**
  * The higher price that applies to a model at `at`, or `undefined` when the
  * catalog price is the one being charged. The check is deliberately narrow:
@@ -113,10 +128,7 @@ function utcMinutes(date: Date): number {
 export function priceWindowFor(model: PriceModel | undefined, at: Date): PriceWindow | undefined {
   if (!model) return undefined
 
-  const schedule = schedules.find(
-    (candidate) =>
-      candidate.providers.includes(model.providerID) && model.id.startsWith(candidate.modelPrefix),
-  )
+  const schedule = scheduleFor(model)
   if (!schedule) return undefined
 
   if (!schedule.peakDays.includes(weekday(at))) return undefined
@@ -134,3 +146,22 @@ export function priceWindowFor(model: PriceModel | undefined, at: Date): PriceWi
 export function formatPriceWindow(window: PriceWindow): string {
   return `${window.label} ×${window.multiplier}`
 }
+
+/**
+ * The window that applied to a round, from the step that started it. Each
+ * request is billed when it starts, so a round that ran during peak keeps its
+ * marker after the window closes. Only assistant steps carry a start time.
+ */
+export function turnPriceWindow(
+  messages: readonly UsageMessage[],
+  fallback?: PriceModel,
+): PriceWindow | undefined {
+  const step = messages.find(
+    (message) => message.type === "assistant" && message.time?.created !== undefined,
+  )
+  const created = step?.time?.created
+  const model = step?.model ?? fallback
+  if (!model || created === undefined) return undefined
+
+  return priceWindowFor(model, new Date(created))
+}