fix: stabilize model and task UI hints

Keep thinking shortcut hint visible without layout shift
Restore JSON file icons across shared file lists
Use task status icons in the input status row
This commit is contained in:
Bohdan Triapitsyn
2026-04-26 14:27:06 +03:00
parent 7d7285655d
commit a2dc5021bc
9 changed files with 51 additions and 22 deletions
+9 -9
View File
@@ -33,7 +33,7 @@
"@ibm/plex": "^6.4.1",
"@lezer/highlight": "^1.2.3",
"@octokit/rest": "^22.0.1",
"@opencode-ai/sdk": "^1.4.19",
"@opencode-ai/sdk": "^1.4.25",
"@radix-ui/react-collapsible": "^1.1.12",
"@radix-ui/react-dialog": "^1.1.15",
"@radix-ui/react-dropdown-menu": "^2.1.16",
@@ -95,7 +95,7 @@
},
"packages/desktop": {
"name": "@openchamber/desktop",
"version": "1.9.6",
"version": "1.9.8",
"devDependencies": {
"@tauri-apps/cli": "^2",
"@types/node": "^24.3.1",
@@ -104,7 +104,7 @@
},
"packages/electron": {
"name": "@openchamber/electron",
"version": "1.9.6",
"version": "1.9.8",
"dependencies": {
"@openchamber/web": "workspace:*",
"electron-context-menu": "^4.1.2",
@@ -119,7 +119,7 @@
},
"packages/ui": {
"name": "@openchamber/ui",
"version": "1.9.6",
"version": "1.9.8",
"dependencies": {
"@base-ui/react": "^1.4.0",
"@codemirror/autocomplete": "^6.20.0",
@@ -150,7 +150,7 @@
"@fontsource/ibm-plex-sans": "^5.1.1",
"@ibm/plex": "^6.4.1",
"@lezer/highlight": "^1.2.3",
"@opencode-ai/sdk": "^1.4.19",
"@opencode-ai/sdk": "^1.4.25",
"@pierre/diffs": "1.1.0-beta.13",
"@remixicon/react": "^4.7.0",
"@simplewebauthn/browser": "13.3.0",
@@ -218,10 +218,10 @@
},
"packages/vscode": {
"name": "openchamber",
"version": "1.9.6",
"version": "1.9.8",
"dependencies": {
"@openchamber/ui": "workspace:*",
"@opencode-ai/sdk": "^1.4.19",
"@opencode-ai/sdk": "^1.4.25",
"adm-zip": "^0.5.16",
"jsonc-parser": "^3.3.1",
"react": "^19.1.1",
@@ -241,14 +241,14 @@
},
"packages/web": {
"name": "@openchamber/web",
"version": "1.9.6",
"version": "1.9.8",
"bin": {
"openchamber": "./bin/cli.js",
},
"dependencies": {
"@clack/prompts": "^1.1.0",
"@octokit/rest": "^22.0.1",
"@opencode-ai/sdk": "^1.4.19",
"@opencode-ai/sdk": "^1.4.25",
"@simplewebauthn/server": "13.3.0",
"adm-zip": "^0.5.16",
"better-sqlite3": "^11.7.0",
+1 -1
View File
@@ -94,7 +94,7 @@
"@ibm/plex": "^6.4.1",
"@lezer/highlight": "^1.2.3",
"@octokit/rest": "^22.0.1",
"@opencode-ai/sdk": "^1.4.19",
"@opencode-ai/sdk": "^1.4.25",
"@base-ui/react": "^1.4.0",
"@radix-ui/react-collapsible": "^1.1.12",
"@radix-ui/react-dialog": "^1.1.15",
+1 -1
View File
@@ -39,7 +39,7 @@
"@fontsource/ibm-plex-sans": "^5.1.1",
"@ibm/plex": "^6.4.1",
"@lezer/highlight": "^1.2.3",
"@opencode-ai/sdk": "^1.4.19",
"@opencode-ai/sdk": "^1.4.25",
"@pierre/diffs": "1.1.0-beta.13",
"@base-ui/react": "^1.4.0",
"@remixicon/react": "^4.7.0",
@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path fill="#f9a825" d="M560-160v-80h120q17 0 28.5-11.5T720-280v-80q0-38 22-69t58-44v-14q-36-13-58-44t-22-69v-80q0-17-11.5-28.5T680-720H560v-80h120q50 0 85 35t35 85v80q0 17 11.5 28.5T840-560h40v160h-40q-17 0-28.5 11.5T800-360v80q0 50-35 85t-85 35zm-280 0q-50 0-85-35t-35-85v-80q0-17-11.5-28.5T120-400H80v-160h40q17 0 28.5-11.5T160-600v-80q0-50 35-85t85-35h120v80H280q-17 0-28.5 11.5T240-680v80q0 38-22 69t-58 44v14q36 13 58 44t22 69v80q0 17 11.5 28.5T280-240h120v80z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 960 960"><path fill="#f9a825" transform="translate(0 960)" d="M560-160v-80h120q17 0 28.5-11.5T720-280v-80q0-38 22-69t58-44v-14q-36-13-58-44t-22-69v-80q0-17-11.5-28.5T680-720H560v-80h120q50 0 85 35t35 85v80q0 17 11.5 28.5T840-560h40v160h-40q-17 0-28.5 11.5T800-360v80q0 50-35 85t-85 35zm-280 0q-50 0-85-35t-35-85v-80q0-17-11.5-28.5T120-400H80v-160h40q17 0 28.5-11.5T160-600v-80q0-50 35-85t85-35h120v80H280q-17 0-28.5 11.5T240-680v80q0 38-22 69t-58 44v14q36 13 58 44t22 69v80q0 17 11.5 28.5T280-240h120v80z"/></svg>

Before

Width:  |  Height:  |  Size: 540 B

After

Width:  |  Height:  |  Size: 567 B

@@ -4533,10 +4533,10 @@
<symbol id="jsconfig_light" viewBox="0 0 32 32">
<use href="#jsconfig" />
</symbol>
<symbol id="json" viewBox="0 -960 960 960">
<path fill="#f9a825" d="M560-160v-80h120q17 0 28.5-11.5T720-280v-80q0-38 22-69t58-44v-14q-36-13-58-44t-22-69v-80q0-17-11.5-28.5T680-720H560v-80h120q50 0 85 35t35 85v80q0 17 11.5 28.5T840-560h40v160h-40q-17 0-28.5 11.5T800-360v80q0 50-35 85t-85 35zm-280 0q-50 0-85-35t-35-85v-80q0-17-11.5-28.5T120-400H80v-160h40q17 0 28.5-11.5T160-600v-80q0-50 35-85t85-35h120v80H280q-17 0-28.5 11.5T240-680v80q0 38-22 69t-58 44v14q36 13 58 44t22 69v80q0 17 11.5 28.5T280-240h120v80z"/>
<symbol id="json" viewBox="0 0 960 960">
<path fill="#f9a825" transform="translate(0 960)" d="M560-160v-80h120q17 0 28.5-11.5T720-280v-80q0-38 22-69t58-44v-14q-36-13-58-44t-22-69v-80q0-17-11.5-28.5T680-720H560v-80h120q50 0 85 35t35 85v80q0 17 11.5 28.5T840-560h40v160h-40q-17 0-28.5 11.5T800-360v80q0 50-35 85t-85 35zm-280 0q-50 0-85-35t-35-85v-80q0-17-11.5-28.5T120-400H80v-160h40q17 0 28.5-11.5T160-600v-80q0-50 35-85t85-35h120v80H280q-17 0-28.5 11.5T240-680v80q0 38-22 69t-58 44v14q36 13 58 44t22 69v80q0 17 11.5 28.5T280-240h120v80z"/>
</symbol>
<symbol id="json_light" viewBox="0 -960 960 960">
<symbol id="json_light" viewBox="0 0 960 960">
<use href="#json" />
</symbol>
<symbol id="jsr" viewBox="0 0 16 16">

Before

Width:  |  Height:  |  Size: 943 KiB

After

Width:  |  Height:  |  Size: 943 KiB

@@ -2409,9 +2409,24 @@ export const ModelControls: React.FC<ModelControlsProps> = ({
{/* Keyboard hints footer */}
<div className="px-3 pt-1 pb-1.5 border-t border-border/40 typography-micro text-muted-foreground">
{t('chat.modelControls.keyboardHint', {
thinking: highlightedSupportsThinking ? `${t('chat.modelControls.keyboardHintThinking')}` : '',
})}
{(() => {
const thinkingMarker = '__MODEL_THINKING_HINT__';
const thinkingHint = `${t('chat.modelControls.keyboardHintThinking')}`;
const hintParts = t('chat.modelControls.keyboardHint', { thinking: thinkingMarker }).split(thinkingMarker);
return (
<>
{hintParts[0]}
<span
aria-disabled={!highlightedSupportsThinking}
className={cn(!highlightedSupportsThinking && 'opacity-40')}
>
{thinkingHint}
</span>
{hintParts[1]}
</>
);
})()}
</div>
</DropdownMenuContent>
</DropdownMenu>
+16 -2
View File
@@ -233,6 +233,10 @@ export const StatusRow: React.FC<StatusRowProps> = ({
}, [isExpanded]);
const toggleExpanded = () => setIsExpanded((prev) => !prev);
const todoSummaryLabel = t('chat.statusRow.summary.activeLeft', {
active: statusSummary.active,
left: statusSummary.left,
});
// Abort button for mobile/vscode
const abortButton = showAbort && onAbort ? (
@@ -252,6 +256,8 @@ export const StatusRow: React.FC<StatusRowProps> = ({
type="button"
onClick={toggleExpanded}
className="flex items-center gap-1 flex-shrink-0 text-muted-foreground"
aria-label={todoSummaryLabel}
title={todoSummaryLabel}
>
{/* Desktop: show task text; Mobile/VSCode: just "Tasks" */}
{!isCompact && activeTodo ? (
@@ -261,8 +267,16 @@ export const StatusRow: React.FC<StatusRowProps> = ({
) : (
<span className="typography-ui-label">{t('chat.statusRow.tasksTitle')}</span>
)}
<span className="typography-meta">
{t('chat.statusRow.summary.activeLeft', { active: statusSummary.active, left: statusSummary.left })}
<span className="typography-meta flex items-center gap-1 tabular-nums" aria-hidden="true">
<span className="flex items-center gap-0.5">
<RiRecordCircleLine className="h-3.5 w-3.5 text-[var(--status-info)]" />
{statusSummary.active}
</span>
<span>·</span>
<span className="flex items-center gap-0.5">
<RiTimeLine className="h-3.5 w-3.5" />
{statusSummary.left}
</span>
</span>
{isExpanded ? (
<RiArrowUpSLine className="h-3.5 w-3.5" />
+1 -1
View File
@@ -243,7 +243,7 @@
},
"dependencies": {
"@openchamber/ui": "workspace:*",
"@opencode-ai/sdk": "^1.4.19",
"@opencode-ai/sdk": "^1.4.25",
"adm-zip": "^0.5.16",
"jsonc-parser": "^3.3.1",
"react": "^19.1.1",
+1 -1
View File
@@ -25,7 +25,7 @@
"dependencies": {
"@clack/prompts": "^1.1.0",
"@octokit/rest": "^22.0.1",
"@opencode-ai/sdk": "^1.4.19",
"@opencode-ai/sdk": "^1.4.25",
"@simplewebauthn/server": "13.3.0",
"adm-zip": "^0.5.16",
"better-sqlite3": "^11.7.0",