diff options
| author | Brendan Allan <[email protected]> | 2026-04-15 15:03:00 +0800 |
|---|---|---|
| committer | opencode <[email protected]> | 2026-04-15 07:26:34 +0000 |
| commit | 5069cd97982d5040710f5c442f9670538cb1dc72 (patch) | |
| tree | 702ff482e581234d3234db218adc3a19d19855b5 /packages/ui | |
| parent | 765932199021cf1dd7a813e37da744f391752bd1 (diff) | |
| download | opencode-5069cd97982d5040710f5c442f9670538cb1dc72.tar.gz opencode-5069cd97982d5040710f5c442f9670538cb1dc72.zip | |
fix(ui): disable accordion items for binary files and improve disabled state styling (#22577)
Diffstat (limited to 'packages/ui')
| -rw-r--r-- | packages/ui/src/components/accordion.css | 4 | ||||
| -rw-r--r-- | packages/ui/src/components/session-review.tsx | 17 |
2 files changed, 13 insertions, 8 deletions
diff --git a/packages/ui/src/components/accordion.css b/packages/ui/src/components/accordion.css index b4d6323d0..cebb887f1 100644 --- a/packages/ui/src/components/accordion.css +++ b/packages/ui/src/components/accordion.css @@ -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 { diff --git a/packages/ui/src/components/session-review.tsx b/packages/ui/src/components/session-review.tsx index 4a7205a5d..3223f5d08 100644 --- a/packages/ui/src/components/session-review.tsx +++ b/packages/ui/src/components/session-review.tsx @@ -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> |