fix(app): highlight selected change

Track clicked file in the Changes tree and apply selection styling to the matching review diff.

packages/ui/src/components/button.css

@@ -43,6 +43,10 @@
     background-color: transparent;
     color: var(--text-strong);
 
+    [data-slot="icon-svg"] {
+      color: var(--icon-base);
+    }
+
     &:hover:not(:disabled) {
       background-color: var(--surface-raised-base-hover);
     }
@@ -54,8 +58,11 @@
     }
     &:disabled {
       color: var(--text-weak);
-      opacity: 0.7;
       cursor: not-allowed;
+
+      [data-slot="icon-svg"] {
+        color: var(--icon-disabled);
+      }
     }
     &[data-selected="true"]:not(:disabled) {
       background-color: var(--surface-raised-base-hover);

packages/ui/src/components/session-review.css

@@ -54,6 +54,13 @@
     background-color: var(--background-stronger) !important;
   }
 
+  [data-slot="session-review-accordion-item"][data-selected] {
+    [data-slot="session-review-accordion-content"] {
+      box-shadow: var(--shadow-xs-border-select);
+      border-radius: var(--radius-lg);
+    }
+  }
+
   [data-slot="accordion-item"] {
     [data-slot="accordion-content"] {
       display: none;

packages/ui/src/components/session-review.tsx

@@ -44,6 +44,7 @@ export interface SessionReviewProps {
   comments?: SessionReviewComment[]
   focusedComment?: SessionReviewFocus | null
   onFocusedCommentChange?: (focus: SessionReviewFocus | null) => void
+  focusedFile?: string
   open?: string[]
   onOpenChange?: (open: string[]) => void
   scrollRef?: (el: HTMLDivElement) => void
@@ -501,6 +502,7 @@ export const SessionReview = (props: SessionReviewProps) => {
                   id={diffId(diff.file)}
                   data-file={diff.file}
                   data-slot="session-review-accordion-item"
+                  data-selected={props.focusedFile === diff.file ? "" : undefined}
                 >
                   <StickyAccordionHeader>
                     <Accordion.Trigger>