Revert "Make large diffs open quickly and scroll as one surface (#3212)"

This reverts commit b599d38a77.

packages/app/src/components/diff-scroll.tsx

@@ -1,75 +1,58 @@
-import { useState, useCallback, useEffect, useId } from "react";
-import { type LayoutChangeEvent, type StyleProp, type ViewStyle } from "react-native";
-import { ScrollView } from "react-native-gesture-handler";
+import { useState, useCallback, useEffect, useId, useRef } from "react";
 import {
-  createAnimatedComponent,
-  useAnimatedScrollHandler,
-  useSharedValue,
-  type SharedValue,
-} from "react-native-reanimated";
-import { scheduleOnRN } from "react-native-worklets";
+  type LayoutChangeEvent,
+  type NativeSyntheticEvent,
+  type NativeScrollEvent,
+  type StyleProp,
+  type ViewStyle,
+} from "react-native";
+import { ScrollView, type ScrollView as ScrollViewType } from "react-native-gesture-handler";
 import { useHorizontalScrollOptional } from "@/contexts/horizontal-scroll-context";
 import { useFileExplorerCloseGestureRef } from "@/mobile-panels/gestures";
 
-const AnimatedScrollView = createAnimatedComponent(ScrollView);
-
 interface DiffScrollProps {
   children: React.ReactNode;
+  scrollViewWidth: number;
   onScrollViewWidthChange: (width: number) => void;
   style?: StyleProp<ViewStyle>;
   contentContainerStyle?: StyleProp<ViewStyle>;
-  offset: SharedValue<number>;
-  testID?: string;
 }
 
 export function DiffScroll({
   children,
+  scrollViewWidth: _scrollViewWidth,
   onScrollViewWidthChange,
   style,
   contentContainerStyle,
-  offset,
-  testID,
 }: DiffScrollProps) {
+  const [isAtLeftEdge, setIsAtLeftEdge] = useState(true);
   const horizontalScroll = useHorizontalScrollOptional();
   const scrollId = useId();
-  const [isAtLeftEdge, setIsAtLeftEdge] = useState(true);
-  const isAtLeftEdgeValue = useSharedValue(true);
+  const scrollViewRef = useRef<ScrollViewType>(null);
 
   const closeGestureRef = useFileExplorerCloseGestureRef();
 
   // Register/unregister scroll offset tracking
   useEffect(() => {
     if (!horizontalScroll) return;
+    // Start at 0 (not scrolled)
     horizontalScroll.registerScrollOffset(scrollId, 0);
     return () => {
       horizontalScroll.unregisterScrollOffset(scrollId);
     };
   }, [horizontalScroll, scrollId]);
 
-  const recordScrollOffset = useCallback(
-    (offsetX: number) => {
+  const handleScroll = useCallback(
+    (event: NativeSyntheticEvent<NativeScrollEvent>) => {
+      const offsetX = event.nativeEvent.contentOffset.x;
+      // Track if we're at the left edge (with small threshold for float precision)
+      setIsAtLeftEdge(offsetX <= 1);
       if (horizontalScroll) {
         horizontalScroll.registerScrollOffset(scrollId, offsetX);
       }
     },
     [horizontalScroll, scrollId],
   );
-  const recordLeftEdge = useCallback((atLeftEdge: boolean) => {
-    setIsAtLeftEdge(atLeftEdge);
-  }, []);
-
-  const handleScroll = useAnimatedScrollHandler({
-    onScroll: (event) => {
-      const offsetX = event.contentOffset.x;
-      offset.value = offsetX;
-      const atLeftEdge = offsetX <= 1;
-      if (atLeftEdge !== isAtLeftEdgeValue.value) {
-        isAtLeftEdgeValue.value = atLeftEdge;
-        scheduleOnRN(recordLeftEdge, atLeftEdge);
-      }
-      scheduleOnRN(recordScrollOffset, offsetX);
-    },
-  });
 
   const handleLayout = useCallback(
     (e: LayoutChangeEvent) => onScrollViewWidthChange(e.nativeEvent.layout.width),
@@ -77,7 +60,8 @@ export function DiffScroll({
   );
 
   return (
-    <AnimatedScrollView
+    <ScrollView
+      ref={scrollViewRef}
       horizontal
       nestedScrollEnabled
       showsHorizontalScrollIndicator
@@ -87,7 +71,6 @@ export function DiffScroll({
       onScroll={handleScroll}
       scrollEventThrottle={16}
       onLayout={handleLayout}
-      testID={testID}
       // When at left edge, wait for close gesture to fail before scrolling.
       // The close gesture fails quickly on leftward swipes (failOffsetX=-10),
       // so scrolling left works normally. On rightward swipes, close gesture
@@ -95,6 +78,6 @@ export function DiffScroll({
       waitFor={isAtLeftEdge && closeGestureRef?.current ? closeGestureRef : undefined}
     >
       {children}
-    </AnimatedScrollView>
+    </ScrollView>
   );
 }