fix(app): suppress review sidebar hydration motion

packages/app/src/pages/session/v2/review-panel-v2-state.ts

@@ -9,7 +9,7 @@ import { createStore } from "solid-js/store"
 import { Persist, persisted } from "@/utils/persist"
 
 export function createReviewPanelV2State() {
-  const [store, setStore] = persisted(
+  const [store, setStore, , ready] = persisted(
     Persist.global("review-panel-v2"),
     createStore({
       sidebarOpened: true,
@@ -24,6 +24,7 @@ export function createReviewPanelV2State() {
   return {
     sidebarOpened: () => store.sidebarOpened,
     sidebarWidth: () => store.sidebarWidth,
+    sidebarTransition: ready,
     filter,
     setFilter,
     expandMode: () => store.expandMode,

packages/app/src/pages/session/v2/review-panel-v2.tsx

@@ -180,6 +180,7 @@ function ReviewPanelV2Sidebar(props: {
   return (
     <SessionReviewV2Sidebar
       open={props.state.sidebarOpened()}
+      transition={props.state.sidebarTransition()}
       title={props.title}
       stats={<DiffChanges changes={props.diffs()} />}
       filter={props.state.filter()}

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

@@ -38,7 +38,8 @@
   border-right-width: 0;
 }
 
-[data-component="session-review-v2-sidebar-root"] [data-slot="session-review-v2-sidebar"]:not([data-resizing]) {
+[data-component="session-review-v2-sidebar-root"]
+  [data-slot="session-review-v2-sidebar"][data-transition]:not([data-resizing]) {
   transition:
     width 200ms cubic-bezier(0.22, 1, 0.36, 1),
     border-right-width 200ms cubic-bezier(0.22, 1, 0.36, 1);

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

@@ -39,6 +39,7 @@ export type SessionReviewV2Props = {
 
 export type SessionReviewV2SidebarProps = {
   open: boolean
+  transition: boolean
   title?: JSX.Element
   stats?: JSX.Element
   filter: string
@@ -69,6 +70,7 @@ export function SessionReviewV2Sidebar(props: SessionReviewV2SidebarProps) {
     <div data-component="session-review-v2-sidebar-root">
       <aside
         data-slot="session-review-v2-sidebar"
+        data-transition={props.transition ? "" : undefined}
         data-resizing={resizing() ? "" : undefined}
         aria-hidden={!props.open}
         inert={!props.open}