wip(desktop): progress

1 files changed, 13 insertions, 10 deletions

diff --git a/packages/ui/src/components/session-review.tsx b/packages/ui/src/components/session-review.tsx
index 9e6c633f4..e6d40341f 100644
--- a/packages/ui/src/components/session-review.tsx
+++ b/packages/ui/src/components/session-review.tsx
@@ -20,6 +20,10 @@ export interface SessionReviewProps {
   split?: boolean
   diffStyle?: SessionReviewDiffStyle
   onDiffStyleChange?: (diffStyle: SessionReviewDiffStyle) => void
+  open?: string[]
+  onOpenChange?: (open: string[]) => void
+  scrollRef?: (el: HTMLDivElement) => void
+  onScroll?: JSX.EventHandlerUnion<HTMLDivElement, Event>
   class?: string
   classList?: Record<string, boolean | undefined>
   classes?: { root?: string; header?: string; container?: string }
@@ -33,26 +37,25 @@ export const SessionReview = (props: SessionReviewProps) => {
     open: props.diffs.length > 10 ? [] : props.diffs.map((d) => d.file),
   })
 
+  const open = () => props.open ?? store.open
   const diffStyle = () => props.diffStyle ?? (props.split ? "split" : "unified")
 
   const handleChange = (open: string[]) => {
+    props.onOpenChange?.(open)
+    if (props.open !== undefined) return
     setStore("open", open)
   }
 
   const handleExpandOrCollapseAll = () => {
-    if (store.open.length > 0) {
-      setStore("open", [])
-    } else {
-      setStore(
-        "open",
-        props.diffs.map((d) => d.file),
-      )
-    }
+    const next = open().length > 0 ? [] : props.diffs.map((d) => d.file)
+    handleChange(next)
   }
 
   return (
     <div
       data-component="session-review"
+      ref={props.scrollRef}
+      onScroll={props.onScroll}
       classList={{
         ...(props.classList ?? {}),
         [props.classes?.root ?? ""]: !!props.classes?.root,
@@ -78,7 +81,7 @@ export const SessionReview = (props: SessionReviewProps) => {
           </Show>
           <Button size="normal" icon="chevron-grabber-vertical" onClick={handleExpandOrCollapseAll}>
             <Switch>
-              <Match when={store.open.length > 0}>Collapse all</Match>
+              <Match when={open().length > 0}>Collapse all</Match>
               <Match when={true}>Expand all</Match>
             </Switch>
           </Button>
@@ -91,7 +94,7 @@ export const SessionReview = (props: SessionReviewProps) => {
           [props.classes?.container ?? ""]: !!props.classes?.container,
         }}
       >
-        <Accordion multiple value={store.open} onChange={handleChange}>
+        <Accordion multiple value={open()} onChange={handleChange}>
           <For each={props.diffs}>
             {(diff) => (
               <Accordion.Item value={diff.file} data-slot="session-review-accordion-item">