tui: improve prompt submission and token display formatting

packages/opencode/src/cli/cmd/tui/component/prompt.tsx

@@ -18,6 +18,7 @@ import { Clipboard } from "@/util/clipboard"
 
 export type PromptProps = {
   sessionID?: string
+  onSubmit?: () => void
 }
 
 type Prompt = {
@@ -164,6 +165,7 @@ export function Prompt(props: PromptProps) {
                     input: "",
                     parts: [],
                   })
+                  props.onSubmit?.()
                   return
                 }
                 const parts = store.parts
@@ -193,6 +195,7 @@ export function Prompt(props: PromptProps) {
                     ],
                   },
                 })
+                props.onSubmit?.()
               }}
               ref={(r) => (input = r)}
               onMouseDown={(r) => r.target?.focus()}

packages/opencode/src/cli/cmd/tui/routes/session/header.tsx

@@ -30,10 +30,11 @@ export function Header() {
     const total =
       last.tokens.input + last.tokens.output + last.tokens.reasoning + last.tokens.cache.read + last.tokens.cache.write
     const model = sync.data.provider.find((x) => x.id === last.providerID)?.models[last.modelID]
-    return {
-      total: Locale.number(total),
-      percentage: (model ? Locale.number(Math.round((total / model.limit.context) * 100)) : "0") + "%",
+    let result = Locale.number(total)
+    if (model?.limit.context) {
+      result += "/" + Math.round((total / model.limit.context) * 100) + "%"
     }
+    return result
   })
 
   return (
@@ -54,7 +55,7 @@ export function Header() {
         </Switch>
         <Show when={context()}>
           <text fg={Theme.textMuted} wrap={false}>
-            {context()!.total}/{context()!.percentage} ({cost()})
+            {context()} ({cost()})
           </text>
         </Show>
       </box>

packages/opencode/src/cli/cmd/tui/routes/session/index.tsx

@@ -35,12 +35,14 @@ export function Session() {
   const session = createMemo(() => sync.session.get(route.sessionID)!)
   const messages = createMemo(() => sync.data.message[route.sessionID] ?? [])
   const todo = createMemo(() => sync.data.todo[route.sessionID] ?? [])
-  let scroll: ScrollBoxRenderable
 
   createEffect(() => sync.session.sync(route.sessionID))
+
   const sdk = useSDK()
 
+  let scroll: ScrollBoxRenderable
   const keybind = useKeybind()
+
   useKeyboard((evt) => {
     if (keybind.match("messages_page_up", evt)) scroll.scrollBy(-scroll.height / 2)
     if (keybind.match("messages_page_down", evt)) scroll.scrollBy(scroll.height / 2)
@@ -142,7 +144,12 @@ export function Session() {
           </box>
         </Show>
         <box flexShrink={0}>
-          <Prompt sessionID={route.sessionID} />
+          <Prompt
+            onSubmit={() => {
+              scroll.scrollTo(scroll.scrollHeight)
+            }}
+            sessionID={route.sessionID}
+          />
         </box>
       </Show>
     </box>