fix(ui): disable accordion items for binary files and improve disabled state styling (#22577)

This commit is contained in:
Brendan Allan
2026-04-15 15:03:00 +08:00
committed by opencode
parent 7659321990
commit 5069cd9798
2 changed files with 13 additions and 8 deletions

View File

@@ -51,10 +51,10 @@
line-height: var(--line-height-large); /* 166.667% */
letter-spacing: var(--letter-spacing-normal);
&:hover {
&:hover:not([data-disabled]) {
background-color: var(--surface-base-hover);
}
&:active {
&:active:not([data-disabled]) {
background-color: var(--surface-base-active);
}
&:focus-visible {

View File

@@ -388,6 +388,9 @@ export const SessionReview = (props: SessionReviewProps) => {
let wrapper: HTMLDivElement | undefined
const file = diff.file
// binary files have empty diffs that we can't render
const diffCanRender = () => diff.additions !== 0 && diff.deletions !== 0
const expanded = createMemo(() => open().includes(file))
const mounted = createMemo(() => expanded() && (!!store.visible[file] || pinned(file)))
const force = () => !!store.force[file]
@@ -496,14 +499,14 @@ export const SessionReview = (props: SessionReviewProps) => {
return (
<Accordion.Item
value={file}
value={diffCanRender() ? file : null!}
id={diffId(file)}
data-file={file}
data-slot="session-review-accordion-item"
data-selected={props.focusedFile === file ? "" : undefined}
>
<StickyAccordionHeader>
<Accordion.Trigger>
<Accordion.Trigger disabled={!diffCanRender()} class="cursor-default">
<div data-slot="session-review-trigger-content">
<div data-slot="session-review-file-info">
<FileIcon node={{ path: file, type: "file" }} />
@@ -512,7 +515,7 @@ export const SessionReview = (props: SessionReviewProps) => {
<span data-slot="session-review-directory">{`\u202A${getDirectory(file)}\u202C`}</span>
</Show>
<span data-slot="session-review-filename">{getFilename(file)}</span>
<Show when={props.onViewFile}>
<Show when={props.onViewFile && diffCanRender()}>
<Tooltip value={openFileLabel()} placement="top" gutter={4}>
<button
data-slot="session-review-view-button"
@@ -553,9 +556,11 @@ export const SessionReview = (props: SessionReviewProps) => {
<DiffChanges changes={diff} />
</Match>
</Switch>
<span data-slot="session-review-diff-chevron">
<Icon name="chevron-down" size="small" />
</span>
<Show when={diffCanRender()}>
<span data-slot="session-review-diff-chevron">
<Icon name="chevron-down" size="small" />
</span>
</Show>
</div>
</div>
</Accordion.Trigger>