@capagents/forgeqe 1.0.3 → 1.0.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@capagents/forgeqe",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "ForgeQE: a browser agent CLI that runs goals and test cases in Chrome and turns passing runs into tests in your repo",
   "license": "MIT",
   "type": "module",

package/src/tui/App.tsx

@@ -83,6 +83,9 @@ export const SPLIT_MIN = 120
 export function App({ options }: { options: TuiOptions }) {
   const renderer = useRenderer()
   const { width, height } = useTerminalDimensions()
+  /** The terminal's width when a request ends (callbacks outlive the render they were made in). */
+  const widthRef = useRef(width)
+  widthRef.current = width
   const scrollRef = useRef<ScrollBoxRenderable>(null)
   const activityScroll = useRef<ScrollBoxRenderable>(null)
   const submitRef = useRef<(value: string) => void>(() => {})
@@ -775,7 +778,8 @@ export function App({ options }: { options: TuiOptions }) {
     } finally {
       pushProduced()
       // What this request used and cost in total: ForgeQE's agent, browser runs, Scribe, and the reviewer.
-      const spent = requestLine(meterStart)
+      // The split view's session and tokens panels show this; only the one-pane view needs it in the chat.
+      const spent = widthRef.current < SPLIT_MIN ? requestLine(meterStart) : ""
       if (spent) push("sys", spent, "chat")
       finish(finalStatus)
     }
@@ -1071,17 +1075,11 @@ export function App({ options }: { options: TuiOptions }) {
   }
   const llm = cfgNow?.llm
   const sessionInfo: SessionInfo = {
-    profile,
-    model: model || (cfgNow ? modelLabel(cfgNow) : ""),
-    auth: !llm ? "–" : llm.auth === "entra" ? "Entra ID, no key" : llm.apiKeyEnv ? `API key in ${llm.apiKeyEnv}` : llm.provider === "mock" ? "offline demo" : llm.provider,
+    model: cfgNow ? `${llm?.provider === "mock" ? "offline demo" : llm?.deployment || llm?.model || "none"}${profile ? ` (${profile})` : ""}` : "…",
     cwd: shortCwd(),
-    tests: testsRef.current.on ? "written to this folder" : requests.current ? `not written (${testsRef.current.why || "off"})` : "set on the first request",
-    browser: `${headed ? "visible" : "headless"} · up to ${maxSteps} steps${options.url ? ` · ${hostOf(options.url)}` : ""}`,
     ...(cfgNow?.domain ? { domain: `${cfgNow.domain.industry}${cfgNow.domain.regulations.length ? ` (${cfgNow.domain.regulations.join(", ")})` : ""}` } : {}),
-    ...(llm?.priceWarning && llm.price ? { price: `${llm.price.input}/${llm.price.output} ${llm.price.currency} per M in/out from llms.json, not the list price` } : {}),
     started: sessionStarted.current,
     requests: requests.current,
-    total: spent.roles.length ? { usage: spent.total, cost: spent.cost } : undefined,
   }
   const contextPanel: ContextInfo = {
     tokens: insp.context,
@@ -1119,7 +1117,7 @@ export function App({ options }: { options: TuiOptions }) {
         <box style={{ flexDirection: "row", height: bottom, flexShrink: 0 }}>
           <FilesPanel s={insp} width={third} height={bottom} />
           <ContextPanel c={contextPanel} width={third} height={bottom} />
-          <TokensPanel roles={spent.roles} total={{ usage: spent.total, cost: spent.cost }} live={running ? tokens : 0} width={paneWidth - 2 * third} height={bottom} />
+          <TokensPanel total={spent.total} width={paneWidth - 2 * third} height={bottom} />
         </box>
       </box>
     )

package/src/tui/inspector.tsx

@@ -2,7 +2,6 @@ import type { ScrollBoxRenderable } from "@opentui/core"
 import type { ReactNode, RefObject } from "react"
 
 import type { Usage } from "../types.ts"
-import { formatCost, type Cost, type Role } from "../usage.ts"
 import { Spinner } from "./components.tsx"
 import { filesByUse, type FileUse, type Inspector, type Progress } from "./session.ts"
 import { clip, tailCut } from "./text.ts"
@@ -22,13 +21,6 @@ export const SECTION = {
   tokens: theme.ok,
 }
 
-const ROLE_COLOR: Record<Role, string> = {
-  "ForgeQE's agent": theme.accent,
-  "browser agent": theme.thought,
-  Scribe: theme.ok,
-  reviewer: theme.warn,
-  judge: theme.memory,
-}
 
 /** Rows a panel's border takes: top and bottom. */
 export const PANEL_CHROME = 2
@@ -57,47 +49,36 @@ export function Panel(props: { title: string; color: string; width?: number; hei
 }
 
 export type SessionInfo = {
-  profile: string
+  /** "gpt-5.4 (azure-gpt54)": the model, and the llms.json profile it comes from. */
   model: string
-  auth: string
   cwd: string
-  tests: string
-  browser: string
   domain?: string
-  /** The profile's price is set in llms.json and differs from the model's list price. */
-  price?: string
   started?: number
   requests: number
-  total?: { usage: Usage; cost?: Cost }
 }
 
 /** Rows SessionPanel takes, border included. */
 export function sessionRows(info: SessionInfo): number {
-  return 6 + (info.domain ? 1 : 0) + (info.price ? 1 : 0) + PANEL_CHROME
+  return 3 + (info.domain ? 1 : 0) + PANEL_CHROME
 }
 
-/** Top of the left pane: what this session runs with, and what it has used. */
+/** Top of the left pane: what the session works with, nothing more; tokens are in their own panel. */
 export function SessionPanel({ info, width }: { info: SessionInfo; width: number }) {
-  const room = Math.max(10, width - 14)
+  const room = Math.max(10, width - 15)
   const row = (label: string, value: string, color: string = theme.text) => (
     <text key={label}>
-      <span fg={theme.muted}>{label.padEnd(9)}</span>
+      <span fg={theme.muted}>{label.padEnd(10)}</span>
       <span fg={color}>{clip(value, room)}</span>
     </text>
   )
   const started = info.started ? new Date(info.started) : null
   const since = started ? ` · since ${String(started.getHours()).padStart(2, "0")}:${String(started.getMinutes()).padStart(2, "0")}` : ""
-  const used = info.total ? `${formatTokens(info.total.usage.input + info.total.usage.output)} tokens${info.total.cost ? ` · ${formatCost(info.total.cost)}` : ""}` : "nothing yet"
   return (
     <Panel title={`Session${since}`} color={SECTION.session} width={width}>
-      {row("Model", `${info.profile || "none"} · ${info.model || "…"}`)}
-      {row("Sign-in", info.auth, info.auth.startsWith("Entra") ? theme.ok : theme.text)}
+      {row("Model", info.model)}
       {row("Folder", tailCut(info.cwd, room))}
-      {row("Tests", info.tests, info.tests.startsWith("written") ? theme.ok : theme.muted)}
-      {row("Browser", info.browser)}
       {info.domain ? row("Domain", info.domain, theme.memory) : null}
-      {info.price ? row("Price", info.price, theme.warn) : null}
-      {row("Used", `${info.requests} request${info.requests === 1 ? "" : "s"} · ${used}`, theme.muted)}
+      {row("Requests", String(info.requests), theme.muted)}
     </Panel>
   )
 }
@@ -309,40 +290,21 @@ export function ContextPanel({ c, width, height }: { c: ContextInfo; width: numb
   )
 }
 
-export function TokensPanel(props: {
-  roles: { role: Role; usage: Usage; cost?: Cost }[]
-  total: { usage: Usage; cost?: Cost }
-  /** Tokens of the request in progress, counted as they stream; the roles above get them when each run ends. */
-  live?: number
-  width: number
-  height: number
-}) {
-  const { roles, total, width } = props
-  // The label takes what the token count (7) and, when priced, the cost (two spaces and up to 7) leave.
-  const priced = roles.some((r) => r.cost) || Boolean(total.cost)
-  const labelWidth = Math.max(6, width - 4 - 7 - (priced ? 9 : 0))
-  const line = (label: string, labelColor: string, u: Usage, c: Cost | undefined, valueColor: string = theme.text) => (
+/** What the session used, in tokens: the total and how it splits. Costs are left to reports and `forgeqe models`. */
+export function TokensPanel(props: { total: Usage; width: number; height: number }) {
+  const { total, width } = props
+  const line = (label: string, n: number, color: string = theme.text) => (
     <text key={label}>
-      <span fg={labelColor}>{clip(label, labelWidth).padEnd(labelWidth)}</span>
-      <span fg={valueColor}>{formatTokens(u.input + u.output).padStart(7)}</span>
-      {c ? <span fg={theme.muted}>{`  ${formatCost(c)}`}</span> : null}
+      <span fg={theme.muted}>{label.padEnd(10)}</span>
+      <span fg={color}>{formatTokens(n).padStart(Math.max(7, Math.min(10, width - 14)))}</span>
     </text>
   )
   return (
     <Panel title="Tokens" color={SECTION.tokens} width={width} height={props.height}>
-      {props.live ? (
-        <text>
-          <span fg={theme.warn}>{"This request".padEnd(labelWidth)}</span>
-          <span fg={theme.warn}>{formatTokens(props.live).padStart(7)}</span>
-        </text>
-      ) : null}
-      {roles.length ? roles.map((r) => line(r.role, ROLE_COLOR[r.role] || theme.text, r.usage, r.cost)) : props.live ? null : <text fg={theme.faint}>{"None used yet"}</text>}
-      {roles.length > 1 ? line("Total", theme.text, total.usage, total.cost, theme.ok) : null}
-      {roles.length ? (
-        <text fg={theme.faint}>
-          {clip(`in ${formatTokens(total.usage.input)} · out ${formatTokens(total.usage.output)}${total.usage.cached ? ` · ${formatTokens(total.usage.cached)} cached` : ""}`, Math.max(10, width - 4))}
-        </text>
-      ) : null}
+      {line("Total", total.input + total.output, theme.ok)}
+      {line("Input", total.input)}
+      {line("Output", total.output)}
+      {line("Cached", total.cached || 0, theme.muted)}
     </Panel>
   )
 }