Merge pull request #206 from Latitudes-Dev/shuvcode-dev

Merge shuvcode-dev into integration

Author: shuv1337

.github/last-synced-tag

@@ -1 +1 @@
-v1.0.201
+v1.0.203

CONTEXT/PLAN-202-web-app-askquestion-ui-2025-12-24.md

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/app",
-  "version": "1.0.201",
+  "version": "1.0.203",
   "description": "",
   "type": "module",
   "exports": {

CONTEXT/PLAN-5638-fix-worktree-project-id-collision-2025-12-22.md

@@ -1009,18 +1009,21 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
             onInput={handleInput}
             onKeyDown={handleKeyDown}
             classList={{
-              "w-full px-5 py-3 text-14-regular text-text-strong focus:outline-none whitespace-pre-wrap": true,
+              "w-full px-5 py-3 pr-12 text-14-regular text-text-strong focus:outline-none whitespace-pre-wrap": true,
               "[&_[data-type=file]]:text-icon-info-active": true,
               "font-mono!": store.mode === "shell",
             }}
           />
           <Show when={!prompt.dirty() && store.imageAttachments.length === 0}>
-            <div class="absolute top-0 inset-x-0 px-5 py-3 text-14-regular text-text-weak pointer-events-none whitespace-nowrap truncate">
+            <div class="absolute top-0 inset-x-0 px-5 py-3 pr-12 text-14-regular text-text-weak pointer-events-none whitespace-nowrap truncate">
               {store.mode === "shell"
                 ? "Enter shell command..."
                 : `Ask anything... "${PLACEHOLDERS[store.placeholder]}"`}
             </div>
           </Show>
+          <div class="absolute top-4.5 right-4">
+            <SessionContextUsage />
+          </div>
         </div>
         <div class="relative p-3 flex items-center justify-between">
           <div class="flex items-center justify-start gap-1">
@@ -1077,7 +1080,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                 </Tooltip>
               </Match>
             </Switch>
-            <SessionContextUsage />
           </div>
           <div class="flex items-center gap-1 absolute right-2 bottom-2">
             <input

bun.lock

@@ -34,28 +34,27 @@ export function SessionContextUsage() {
     <Show when={context?.()}>
       {(ctx) => (
         <Tooltip
-          openDelay={300}
           value={
-            <div class="flex flex-col gap-1 p-2">
-              <div class="flex justify-between gap-4">
-                <span class="text-text-weaker">Tokens</span>
-                <span class="text-text-strong">{ctx().tokens}</span>
+            <div class="flex flex-col gap-1">
+              <div class="flex gap-3">
+                <span class="opacity-70 text-right flex-1">Tokens</span>
+                <span class="text-left flex-1">{ctx().tokens}</span>
               </div>
-              <div class="flex justify-between gap-4">
-                <span class="text-text-weaker">Usage</span>
-                <span class="text-text-strong">{ctx().percentage ?? 0}%</span>
+              <div class="flex gap-3">
+                <span class="opacity-70 text-right flex-1">Usage</span>
+                <span class="text-left flex-1">{ctx().percentage ?? 0}%</span>
               </div>
-              <div class="flex justify-between gap-4">
-                <span class="text-text-weaker">Cost</span>
-                <span class="text-text-strong">{cost()}</span>
+              <div class="flex gap-3">
+                <span class="opacity-70 text-right flex-1">Cost</span>
+                <span class="text-left flex-1">{cost()}</span>
               </div>
             </div>
           }
           placement="top"
         >
-          <div class="flex items-center gap-1">
-            <span class="text-12-medium text-text-weak">{`${ctx().percentage ?? 0}%`}</span>
+          <div class="flex items-center gap-1.5">
             <ProgressCircle size={16} strokeWidth={2} percentage={ctx().percentage ?? 0} />
+            {/* <span class="text-12-medium text-text-weak">{`${ctx().percentage ?? 0}%`}</span> */}
           </div>
         </Tooltip>
       )}

packages/app/package.json

@@ -1,4 +1,4 @@
-import { createEffect, createMemo, For, Match, onMount, ParentProps, Show, Switch, type JSX } from "solid-js"
+import { createEffect, createMemo, For, Match, onMount, ParentProps, Show, Switch, untrack, type JSX } from "solid-js"
 import { DateTime } from "luxon"
 import { A, useNavigate, useParams } from "@solidjs/router"
 import { useLayout, getAvatarColors, LocalProject } from "@/context/layout"
@@ -319,8 +319,11 @@ export default function Layout(props: ParentProps) {
   createEffect(() => {
     if (!params.dir || !params.id) return
     const directory = base64Decode(params.dir)
-    setStore("lastSession", directory, params.id)
-    notification.session.markViewed(params.id)
+    const id = params.id
+    setStore("lastSession", directory, id)
+    notification.session.markViewed(id)
+    untrack(() => layout.projects.expand(directory))
+    requestAnimationFrame(() => scrollToSession(id))
   })
 
   createEffect(() => {
@@ -467,7 +470,12 @@ export default function Layout(props: ParentProps) {
               class="flex flex-col min-w-0 text-left w-full focus:outline-none"
             >
               <div class="flex items-center self-stretch gap-6 justify-between transition-[padding] group-hover/session:pr-7 group-focus-within/session:pr-7 group-active/session:pr-7">
-                <span class="text-14-regular text-text-strong overflow-hidden text-ellipsis truncate">
+                <span
+                  classList={{
+                    "text-14-regular text-text-strong overflow-hidden text-ellipsis truncate": true,
+                    "animate-pulse": isWorking(),
+                  }}
+                >
                   {props.session.title}
                 </span>
                 <div class="shrink-0 group-hover/session:hidden group-active/session:hidden group-focus-within/session:hidden">
@@ -515,7 +523,15 @@ export default function Layout(props: ParentProps) {
                 onClick={() => dialog.show(() => <DialogSessionRenameGlobal session={props.session} />)}
               />
             </Tooltip>
-            <Tooltip placement="right" value="Archive session">
+            <Tooltip
+              placement="right"
+              value={
+                <div class="flex items-center gap-2">
+                  <span>Archive session</span>
+                  <span class="text-icon-base text-12-medium">{command.keybind("session.archive")}</span>
+                </div>
+              }
+            >
               <IconButton icon="archive" variant="ghost" onClick={() => archiveSession(props.session)} />
             </Tooltip>
           </div>
@@ -600,7 +616,15 @@ export default function Layout(props: ParentProps) {
                       </DropdownMenu.Content>
                     </DropdownMenu.Portal>
                   </DropdownMenu>
-                  <Tooltip placement="top" value="New session">
+                  <Tooltip
+                    placement="top"
+                    value={
+                      <div class="flex items-center gap-2">
+                        <span>New session</span>
+                        <span class="text-icon-base text-12-medium">{command.keybind("session.new")}</span>
+                      </div>
+                    }
+                  >
                     <IconButton as={A} href={`${slug()}/session`} icon="plus-small" variant="ghost" />
                   </Tooltip>
                 </div>

packages/app/src/components/prompt-input.tsx

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/console-app",
-  "version": "1.0.201",
+  "version": "1.0.203",
   "type": "module",
   "scripts": {
     "typecheck": "tsgo --noEmit",

packages/app/src/components/session-context-usage.tsx

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "@opencode-ai/console-core",
-  "version": "1.0.201",
+  "version": "1.0.203",
   "private": true,
   "type": "module",
   "dependencies": {