fix(app): isolate bottom sheet modal scopes

packages/app/src/components/tool-call-sheet.tsx

@@ -3,13 +3,16 @@ import { View, Text, Pressable } from "react-native";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import Animated from "react-native-reanimated";
 import {
-  BottomSheetModal,
   BottomSheetScrollView,
   BottomSheetBackdrop,
   BottomSheetBackgroundProps,
 } from "@gorhom/bottom-sheet";
 import { X } from "lucide-react-native";
 import type { ToolCallDetail } from "@server/server/agent/agent-sdk-types";
+import {
+  IsolatedBottomSheetModal,
+  type IsolatedBottomSheetModalRef,
+} from "@/components/ui/isolated-bottom-sheet-modal";
 import { resolveToolCallIcon } from "@/utils/tool-call-icon";
 import { ToolCallDetailsContent } from "./tool-call-details";
 
@@ -60,18 +63,25 @@ interface ToolCallSheetProviderProps {
 
 export function ToolCallSheetProvider({ children }: ToolCallSheetProviderProps) {
   const { theme } = useUnistyles();
-  const bottomSheetRef = useRef<BottomSheetModal>(null);
+  const bottomSheetRef = useRef<IsolatedBottomSheetModalRef>(null);
+  const hasPresentedRef = useRef(false);
   const [sheetData, setSheetData] = React.useState<ToolCallSheetData | null>(null);
 
   const snapPoints = useMemo(() => ["60%", "95%"], []);
 
   const openToolCall = useCallback((data: ToolCallSheetData) => {
     setSheetData(data);
+    if (hasPresentedRef.current) {
+      requestAnimationFrame(() => bottomSheetRef.current?.snapToIndex(0));
+      return;
+    }
+
+    hasPresentedRef.current = true;
     bottomSheetRef.current?.present();
   }, []);
 
   const closeToolCall = useCallback(() => {
-    bottomSheetRef.current?.dismiss();
+    bottomSheetRef.current?.close();
   }, []);
 
   const handleSheetChange = useCallback((index: number) => {
@@ -95,11 +105,10 @@ export function ToolCallSheetProvider({ children }: ToolCallSheetProviderProps)
   return (
     <ToolCallSheetContext.Provider value={contextValue}>
       {children}
-      <BottomSheetModal
+      <IsolatedBottomSheetModal
         ref={bottomSheetRef}
         snapPoints={snapPoints}
         index={0}
-        stackBehavior="replace"
         enableDynamicSizing={false}
         onChange={handleSheetChange}
         backdropComponent={renderBackdrop}
@@ -108,7 +117,7 @@ export function ToolCallSheetProvider({ children }: ToolCallSheetProviderProps)
         handleIndicatorStyle={{ backgroundColor: theme.colors.palette.zinc[600] }}
       >
         {sheetData && <ToolCallSheetContent data={sheetData} onClose={closeToolCall} />}
-      </BottomSheetModal>
+      </IsolatedBottomSheetModal>
     </ToolCallSheetContext.Provider>
   );
 }