lmin/zmo-cli
1
0
Fork 0
Code Issues Pull Requests Actions 91 Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Brendan Allan
2026-04-15 07:26:34 +00:00
committed by opencode
parent 7659321990
commit 5069cd9798
2 changed files with 13 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/components/accordion.css
+2 -2
View File
@@ -51,10 +51,10 @@
line-height: var(--line-height-large); /* 166.667% */ line-height: var(--line-height-large); /* 166.667% */
letter-spacing: var(--letter-spacing-normal); letter-spacing: var(--letter-spacing-normal);
&:hover { &:hover:not([data-disabled]) {
background-color: var(--surface-base-hover); background-color: var(--surface-base-hover);
} }
&:active { &:active:not([data-disabled]) {
background-color: var(--surface-base-active); background-color: var(--surface-base-active);
} }
&:focus-visible { &:focus-visible {
packages/ui/src/components/session-review.tsx
+11 -6
View File
@@ -388,6 +388,9 @@ export const SessionReview = (props: SessionReviewProps) => {
let wrapper: HTMLDivElement | undefined let wrapper: HTMLDivElement | undefined
const file = diff.file 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 expanded = createMemo(() => open().includes(file))
const mounted = createMemo(() => expanded() && (!!store.visible[file] || pinned(file))) const mounted = createMemo(() => expanded() && (!!store.visible[file] || pinned(file)))
const force = () => !!store.force[file] const force = () => !!store.force[file]
@@ -496,14 +499,14 @@ export const SessionReview = (props: SessionReviewProps) => {
return ( return (
<Accordion.Item <Accordion.Item
value={file} value={diffCanRender() ? file : null!}
id={diffId(file)} id={diffId(file)}
data-file={file} data-file={file}
data-slot="session-review-accordion-item" data-slot="session-review-accordion-item"
data-selected={props.focusedFile === file ? "" : undefined} data-selected={props.focusedFile === file ? "" : undefined}
> >
<StickyAccordionHeader> <StickyAccordionHeader>
<Accordion.Trigger> <Accordion.Trigger disabled={!diffCanRender()} class="cursor-default">
<div data-slot="session-review-trigger-content"> <div data-slot="session-review-trigger-content">
<div data-slot="session-review-file-info"> <div data-slot="session-review-file-info">
<FileIcon node={{ path: file, type: "file" }} /> <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> <span data-slot="session-review-directory">{`\u202A${getDirectory(file)}\u202C`}</span>
</Show> </Show>
<span data-slot="session-review-filename">{getFilename(file)}</span> <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}> <Tooltip value={openFileLabel()} placement="top" gutter={4}>
<button <button
data-slot="session-review-view-button" data-slot="session-review-view-button"
@@ -553,9 +556,11 @@ export const SessionReview = (props: SessionReviewProps) => {
<DiffChanges changes={diff} /> <DiffChanges changes={diff} />
</Match> </Match>
</Switch> </Switch>
<span data-slot="session-review-diff-chevron"> <Show when={diffCanRender()}>
<Icon name="chevron-down" size="small" /> <span data-slot="session-review-diff-chevron">
</span> <Icon name="chevron-down" size="small" />
</span>
</Show>
</div> </div>
</div> </div>
</Accordion.Trigger> </Accordion.Trigger>