@comergehq/studio 0.1.7 → 0.1.8

package/dist/index.mjs

@@ -6,7 +6,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 });
 
 // src/studio/ComergeStudio.tsx
-import * as React38 from "react";
+import * as React39 from "react";
 import { Platform as RNPlatform, View as View45 } from "react-native";
 import { BottomSheetModalProvider } from "@gorhom/bottom-sheet";
 
@@ -363,7 +363,7 @@ function StudioBootstrap({ children, fallback, renderError, apiKey }) {
 }
 
 // src/studio/hooks/useApp.ts
-import * as React2 from "react";
+import * as React3 from "react";
 
 // src/core/services/http/index.ts
 import axios2 from "axios";
@@ -662,13 +662,40 @@ var AppsRepositoryImpl = class extends BaseRepository {
 };
 var appsRepository = new AppsRepositoryImpl(appsRemoteDataSource);
 
+// src/studio/hooks/useForegroundSignal.ts
+import * as React2 from "react";
+import { AppState } from "react-native";
+function useForegroundSignal(enabled = true) {
+  const [signal, setSignal] = React2.useState(0);
+  const lastStateRef = React2.useRef(AppState.currentState);
+  React2.useEffect(() => {
+    if (!enabled) return;
+    const sub = AppState.addEventListener("change", (nextState) => {
+      var _a, _b;
+      const prevState = lastStateRef.current;
+      lastStateRef.current = nextState;
+      const didResume = (prevState === "background" || prevState === "inactive") && nextState === "active";
+      if (!didResume) return;
+      try {
+        const supabase = getSupabaseClient();
+        (_b = (_a = supabase == null ? void 0 : supabase.realtime) == null ? void 0 : _a.connect) == null ? void 0 : _b.call(_a);
+      } catch {
+      }
+      setSignal((s) => s + 1);
+    });
+    return () => sub.remove();
+  }, [enabled]);
+  return signal;
+}
+
 // src/studio/hooks/useApp.ts
 function useApp(appId, options) {
   const enabled = (options == null ? void 0 : options.enabled) ?? true;
-  const [app, setApp] = React2.useState(null);
-  const [loading, setLoading] = React2.useState(false);
-  const [error, setError] = React2.useState(null);
-  const mergeApp = React2.useCallback((prev, next) => {
+  const [app, setApp] = React3.useState(null);
+  const [loading, setLoading] = React3.useState(false);
+  const [error, setError] = React3.useState(null);
+  const foregroundSignal = useForegroundSignal(enabled && Boolean(appId));
+  const mergeApp = React3.useCallback((prev, next) => {
     const merged = {
       ...prev ?? {},
       ...next,
@@ -677,7 +704,7 @@ function useApp(appId, options) {
     };
     return merged;
   }, []);
-  const fetchOnce = React2.useCallback(async () => {
+  const fetchOnce = React3.useCallback(async () => {
     if (!enabled) return;
     if (!appId) return;
     setLoading(true);
@@ -692,34 +719,37 @@ function useApp(appId, options) {
       setLoading(false);
     }
   }, [appId, enabled]);
-  React2.useEffect(() => {
+  React3.useEffect(() => {
     if (!enabled) return;
     void fetchOnce();
   }, [enabled, fetchOnce]);
-  React2.useEffect(() => {
+  React3.useEffect(() => {
     if (!enabled) return;
     if (!appId) return;
     const unsubscribe = appsRepository.subscribeApp(appId, {
       onInsert: (a) => {
-        console.log("[useApp] onInsert", a);
         setApp((prev) => mergeApp(prev, a));
       },
       onUpdate: (a) => {
-        console.log("[useApp] onUpdate", a);
         setApp((prev) => mergeApp(prev, a));
       },
       onDelete: () => {
-        console.log("[useApp] onDelete");
         setApp(null);
       }
     });
     return unsubscribe;
-  }, [appId, enabled, mergeApp]);
+  }, [appId, enabled, mergeApp, foregroundSignal]);
+  React3.useEffect(() => {
+    if (!enabled) return;
+    if (!appId) return;
+    if (foregroundSignal <= 0) return;
+    void fetchOnce();
+  }, [appId, enabled, fetchOnce, foregroundSignal]);
   return { app, loading, error, refetch: fetchOnce };
 }
 
 // src/studio/hooks/useThreadMessages.ts
-import * as React3 from "react";
+import * as React4 from "react";
 
 // src/data/messages/remote.ts
 var MessagesRemoteDataSourceImpl = class extends BaseRemote {
@@ -820,44 +850,59 @@ function mapMessageToChatMessage(m) {
   };
 }
 function useThreadMessages(threadId) {
-  const [raw, setRaw] = React3.useState([]);
-  const [loading, setLoading] = React3.useState(false);
-  const [error, setError] = React3.useState(null);
-  const refetch = React3.useCallback(async () => {
+  const [raw, setRaw] = React4.useState([]);
+  const [loading, setLoading] = React4.useState(false);
+  const [error, setError] = React4.useState(null);
+  const activeRequestIdRef = React4.useRef(0);
+  const foregroundSignal = useForegroundSignal(Boolean(threadId));
+  const upsertSorted = React4.useCallback((prev, m) => {
+    const next = prev.some((x) => x.id === m.id) ? prev.map((x) => x.id === m.id ? m : x) : [...prev, m];
+    next.sort((a, b) => String(a.createdAt).localeCompare(String(b.createdAt)));
+    return next;
+  }, []);
+  const refetch = React4.useCallback(async () => {
     if (!threadId) {
       setRaw([]);
       return;
     }
+    const requestId = ++activeRequestIdRef.current;
     setLoading(true);
     setError(null);
     try {
       const list = await messagesRepository.list(threadId);
-      setRaw(list);
+      if (activeRequestIdRef.current !== requestId) return;
+      setRaw([...list].sort((a, b) => String(a.createdAt).localeCompare(String(b.createdAt))));
     } catch (e) {
+      if (activeRequestIdRef.current !== requestId) return;
       setError(e instanceof Error ? e : new Error(String(e)));
       setRaw([]);
     } finally {
-      setLoading(false);
+      if (activeRequestIdRef.current === requestId) setLoading(false);
     }
   }, [threadId]);
-  React3.useEffect(() => {
+  React4.useEffect(() => {
     void refetch();
   }, [refetch]);
-  React3.useEffect(() => {
+  React4.useEffect(() => {
     if (!threadId) return;
     const unsubscribe = messagesRepository.subscribeThread(threadId, {
-      onInsert: (m) => setRaw((prev) => [...prev, m]),
-      onUpdate: (m) => setRaw((prev) => prev.map((x) => x.id === m.id ? m : x)),
+      onInsert: (m) => setRaw((prev) => upsertSorted(prev, m)),
+      onUpdate: (m) => setRaw((prev) => upsertSorted(prev, m)),
       onDelete: (m) => setRaw((prev) => prev.filter((x) => x.id !== m.id))
     });
     return unsubscribe;
-  }, [threadId]);
-  const messages = React3.useMemo(() => raw.map(mapMessageToChatMessage), [raw]);
+  }, [threadId, upsertSorted, foregroundSignal]);
+  React4.useEffect(() => {
+    if (!threadId) return;
+    if (foregroundSignal <= 0) return;
+    void refetch();
+  }, [foregroundSignal, refetch, threadId]);
+  const messages = React4.useMemo(() => raw.map(mapMessageToChatMessage), [raw]);
   return { raw, messages, loading, error, refetch };
 }
 
 // src/studio/hooks/useBundleManager.ts
-import * as React4 from "react";
+import * as React5 from "react";
 import * as FileSystem from "expo-file-system/legacy";
 
 // src/data/apps/bundles/remote.ts
@@ -1030,19 +1075,19 @@ function useBundleManager({
   platform,
   canRequestLatest = true
 }) {
-  const [bundlePath, setBundlePath] = React4.useState(null);
-  const [renderToken, setRenderToken] = React4.useState(0);
-  const [loading, setLoading] = React4.useState(false);
-  const [statusLabel, setStatusLabel] = React4.useState(null);
-  const [error, setError] = React4.useState(null);
-  const [isTesting, setIsTesting] = React4.useState(false);
-  const baseRef = React4.useRef(base);
+  const [bundlePath, setBundlePath] = React5.useState(null);
+  const [renderToken, setRenderToken] = React5.useState(0);
+  const [loading, setLoading] = React5.useState(false);
+  const [statusLabel, setStatusLabel] = React5.useState(null);
+  const [error, setError] = React5.useState(null);
+  const [isTesting, setIsTesting] = React5.useState(false);
+  const baseRef = React5.useRef(base);
   baseRef.current = base;
-  const baseOpIdRef = React4.useRef(0);
-  const testOpIdRef = React4.useRef(0);
-  const activeLoadModeRef = React4.useRef(null);
-  const canRequestLatestRef = React4.useRef(canRequestLatest);
-  React4.useEffect(() => {
+  const baseOpIdRef = React5.useRef(0);
+  const testOpIdRef = React5.useRef(0);
+  const activeLoadModeRef = React5.useRef(null);
+  const canRequestLatestRef = React5.useRef(canRequestLatest);
+  React5.useEffect(() => {
     canRequestLatestRef.current = canRequestLatest;
     if (!canRequestLatest) {
       baseOpIdRef.current += 1;
@@ -1053,11 +1098,11 @@ function useBundleManager({
       }
     }
   }, [canRequestLatest]);
-  const lastBaseBundlePathRef = React4.useRef(null);
-  const lastBaseFingerprintRef = React4.useRef(null);
-  const initialHydratedBaseFromDiskRef = React4.useRef(false);
-  const hasCompletedFirstNetworkBaseLoadRef = React4.useRef(false);
-  const hydrateBaseFromDisk = React4.useCallback(
+  const lastBaseBundlePathRef = React5.useRef(null);
+  const lastBaseFingerprintRef = React5.useRef(null);
+  const initialHydratedBaseFromDiskRef = React5.useRef(false);
+  const hasCompletedFirstNetworkBaseLoadRef = React5.useRef(false);
+  const hydrateBaseFromDisk = React5.useCallback(
     async (appId, reason) => {
       try {
         const dir = bundlesCacheDir();
@@ -1082,13 +1127,13 @@ function useBundleManager({
     },
     [platform]
   );
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     if (!base.appId) return;
     initialHydratedBaseFromDiskRef.current = false;
     hasCompletedFirstNetworkBaseLoadRef.current = false;
     void hydrateBaseFromDisk(base.appId, "initial");
   }, [base.appId, platform, hydrateBaseFromDisk]);
-  const activateCachedBase = React4.useCallback(
+  const activateCachedBase = React5.useCallback(
     async (appId) => {
       setIsTesting(false);
       setStatusLabel(null);
@@ -1102,7 +1147,7 @@ function useBundleManager({
     },
     [hydrateBaseFromDisk]
   );
-  const load = React4.useCallback(async (src, mode) => {
+  const load = React5.useCallback(async (src, mode) => {
     if (!src.appId) return;
     const canRequestLatest2 = canRequestLatestRef.current;
     if (mode === "base" && !canRequestLatest2) {
@@ -1157,13 +1202,13 @@ function useBundleManager({
       if (activeLoadModeRef.current === mode) activeLoadModeRef.current = null;
     }
   }, [activateCachedBase, platform]);
-  const loadBase = React4.useCallback(async () => {
+  const loadBase = React5.useCallback(async () => {
     await load(baseRef.current, "base");
   }, [load]);
-  const loadTest = React4.useCallback(async (src) => {
+  const loadTest = React5.useCallback(async (src) => {
     await load(src, "test");
   }, [load]);
-  const restoreBase = React4.useCallback(async () => {
+  const restoreBase = React5.useCallback(async () => {
     const src = baseRef.current;
     if (!src.appId) return;
     await activateCachedBase(src.appId);
@@ -1171,7 +1216,7 @@ function useBundleManager({
       await load(src, "base");
     }
   }, [activateCachedBase, load]);
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     if (!canRequestLatest) return;
     void loadBase();
   }, [base.appId, base.commitId, platform, canRequestLatest, loadBase]);
@@ -1179,7 +1224,7 @@ function useBundleManager({
 }
 
 // src/studio/hooks/useMergeRequests.ts
-import * as React5 from "react";
+import * as React6 from "react";
 
 // src/data/merge-requests/remote.ts
 var MergeRequestsRemoteDataSourceImpl = class extends BaseRemote {
@@ -1325,12 +1370,12 @@ function toUiStatus(status) {
 }
 function useMergeRequests(params) {
   const { appId } = params;
-  const [incoming, setIncoming] = React5.useState([]);
-  const [outgoing, setOutgoing] = React5.useState([]);
-  const [loading, setLoading] = React5.useState(false);
-  const [error, setError] = React5.useState(null);
-  const [creatorStatsById, setCreatorStatsById] = React5.useState({});
-  const pollUntilMerged = React5.useCallback(async (mrId) => {
+  const [incoming, setIncoming] = React6.useState([]);
+  const [outgoing, setOutgoing] = React6.useState([]);
+  const [loading, setLoading] = React6.useState(false);
+  const [error, setError] = React6.useState(null);
+  const [creatorStatsById, setCreatorStatsById] = React6.useState({});
+  const pollUntilMerged = React6.useCallback(async (mrId) => {
     const startedAt = Date.now();
     const timeoutMs = 2 * 60 * 1e3;
     for (; ; ) {
@@ -1340,7 +1385,7 @@ function useMergeRequests(params) {
       await new Promise((r) => setTimeout(r, 1500));
     }
   }, []);
-  const refresh = React5.useCallback(async () => {
+  const refresh = React6.useCallback(async () => {
     if (!appId) {
       setIncoming([]);
       setOutgoing([]);
@@ -1379,27 +1424,27 @@ function useMergeRequests(params) {
       setLoading(false);
     }
   }, [appId]);
-  React5.useEffect(() => {
+  React6.useEffect(() => {
     void refresh();
   }, [refresh]);
-  const openMergeRequest = React5.useCallback(async (sourceAppId) => {
+  const openMergeRequest = React6.useCallback(async (sourceAppId) => {
     const mr = await mergeRequestsRepository.open({ sourceAppId });
     await refresh();
     return mr;
   }, [refresh]);
-  const approve = React5.useCallback(async (mrId) => {
+  const approve = React6.useCallback(async (mrId) => {
     const mr = await mergeRequestsRepository.update(mrId, { status: "approved" });
     await refresh();
     const merged = await pollUntilMerged(mrId);
     await refresh();
     return merged ?? mr;
   }, [pollUntilMerged, refresh]);
-  const reject = React5.useCallback(async (mrId) => {
+  const reject = React6.useCallback(async (mrId) => {
     const mr = await mergeRequestsRepository.update(mrId, { status: "rejected" });
     await refresh();
     return mr;
   }, [refresh]);
-  const toSummary = React5.useCallback((mr) => {
+  const toSummary = React6.useCallback((mr) => {
     const stats = creatorStatsById[mr.createdBy];
     return {
       id: mr.id,
@@ -1415,7 +1460,7 @@ function useMergeRequests(params) {
       updatedAt: mr.updatedAt
     };
   }, [creatorStatsById]);
-  const byId = React5.useMemo(() => {
+  const byId = React6.useMemo(() => {
     const all = [...incoming, ...outgoing];
     const map = {};
     for (const mr of all) map[mr.id] = mr;
@@ -1433,7 +1478,7 @@ function useMergeRequests(params) {
 }
 
 // src/studio/hooks/useAttachmentUpload.ts
-import * as React6 from "react";
+import * as React7 from "react";
 
 // src/data/attachment/remote.ts
 var AttachmentRemoteDataSourceImpl = class extends BaseRemote {
@@ -1474,9 +1519,9 @@ var attachmentRepository = new AttachmentRepositoryImpl(
 
 // src/studio/hooks/useAttachmentUpload.ts
 function useAttachmentUpload() {
-  const [uploading, setUploading] = React6.useState(false);
-  const [error, setError] = React6.useState(null);
-  const uploadBase64Images = React6.useCallback(async ({ threadId, appId, dataUrls }) => {
+  const [uploading, setUploading] = React7.useState(false);
+  const [error, setError] = React7.useState(null);
+  const uploadBase64Images = React7.useCallback(async ({ threadId, appId, dataUrls }) => {
     if (!threadId || !appId) return [];
     if (!dataUrls || dataUrls.length === 0) return [];
     setUploading(true);
@@ -1510,7 +1555,7 @@ function useAttachmentUpload() {
 }
 
 // src/studio/hooks/useStudioActions.ts
-import * as React7 from "react";
+import * as React8 from "react";
 
 // src/data/agent/remote.ts
 var AgentRemoteDataSourceImpl = class extends BaseRemote {
@@ -1549,12 +1594,12 @@ function useStudioActions({
   onForkedApp,
   uploadAttachments
 }) {
-  const [forking, setForking] = React7.useState(false);
-  const [sending, setSending] = React7.useState(false);
-  const [error, setError] = React7.useState(null);
+  const [forking, setForking] = React8.useState(false);
+  const [sending, setSending] = React8.useState(false);
+  const [error, setError] = React8.useState(null);
   const isOwner = Boolean(userId && (app == null ? void 0 : app.createdBy) && userId === app.createdBy);
   const shouldForkOnEdit = Boolean(userId && app && app.createdBy !== userId);
-  const sendEdit = React7.useCallback(
+  const sendEdit = React8.useCallback(
     async ({ prompt, attachments }) => {
       if (!userId || !app) return;
       if (!prompt.trim()) return;
@@ -1636,12 +1681,12 @@ function RuntimeRenderer({ appKey, bundlePath, renderToken, style }) {
 }
 
 // src/studio/ui/StudioOverlay.tsx
-import * as React37 from "react";
+import * as React38 from "react";
 import { Keyboard as Keyboard5, Platform as Platform7, View as View44, useWindowDimensions as useWindowDimensions4 } from "react-native";
 
 // src/components/studio-sheet/StudioBottomSheet.tsx
-import * as React8 from "react";
-import { Keyboard, Platform as Platform2, View as View4 } from "react-native";
+import * as React9 from "react";
+import { AppState as AppState2, Keyboard, Platform as Platform2, View as View4 } from "react-native";
 import BottomSheet from "@gorhom/bottom-sheet";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 
@@ -1708,19 +1753,43 @@ function StudioBottomSheet({
 }) {
   const theme = useTheme();
   const insets = useSafeAreaInsets();
-  const internalSheetRef = React8.useRef(null);
+  const internalSheetRef = React9.useRef(null);
   const resolvedSheetRef = sheetRef ?? internalSheetRef;
-  React8.useEffect(() => {
+  const currentIndexRef = React9.useRef(open ? snapPoints.length - 1 : -1);
+  const lastAppStateRef = React9.useRef(AppState2.currentState);
+  React9.useEffect(() => {
+    const sub = AppState2.addEventListener("change", (state) => {
+      const prev = lastAppStateRef.current;
+      lastAppStateRef.current = state;
+      if (state === "background" || state === "inactive") {
+        Keyboard.dismiss();
+        return;
+      }
+      if (state !== "active") return;
+      const sheet = resolvedSheetRef.current;
+      if (!sheet) return;
+      const idx = currentIndexRef.current;
+      if (open && idx >= 0) {
+        Keyboard.dismiss();
+        requestAnimationFrame(() => sheet.snapToIndex(idx));
+        setTimeout(() => sheet.snapToIndex(idx), 120);
+      }
+    });
+    return () => sub.remove();
+  }, [open, resolvedSheetRef]);
+  React9.useEffect(() => {
     if (Platform2.OS !== "ios") return;
     const sub = Keyboard.addListener("keyboardDidHide", () => {
       const sheet = resolvedSheetRef.current;
       if (!sheet || !open) return;
       const targetIndex = snapPoints.length - 1;
-      setTimeout(() => sheet.snapToIndex(targetIndex), 10);
+      if (currentIndexRef.current === targetIndex) {
+        setTimeout(() => sheet.snapToIndex(targetIndex), 10);
+      }
     });
     return () => sub.remove();
   }, [open, resolvedSheetRef, snapPoints.length]);
-  React8.useEffect(() => {
+  React9.useEffect(() => {
     const sheet = resolvedSheetRef.current;
     if (!sheet) return;
     if (open) {
@@ -1729,8 +1798,9 @@ function StudioBottomSheet({
       sheet.close();
     }
   }, [open, resolvedSheetRef, snapPoints.length]);
-  const handleChange = React8.useCallback(
+  const handleChange = React9.useCallback(
     (index) => {
+      currentIndexRef.current = index;
       onOpenChange == null ? void 0 : onOpenChange(index >= 0);
     },
     [onOpenChange]
@@ -1742,7 +1812,7 @@ function StudioBottomSheet({
       index: open ? snapPoints.length - 1 : -1,
       snapPoints,
       enablePanDownToClose: true,
-      keyboardBehavior: "extend",
+      keyboardBehavior: "interactive",
       keyboardBlurBehavior: "restore",
       android_keyboardInputMode: "adjustResize",
       backgroundComponent: (props) => /* @__PURE__ */ jsx5(StudioSheetBackground, { ...props, renderBackground: background == null ? void 0 : background.renderBackground }),
@@ -1757,12 +1827,12 @@ function StudioBottomSheet({
 }
 
 // src/components/studio-sheet/StudioSheetPager.tsx
-import * as React9 from "react";
+import * as React10 from "react";
 import { Animated } from "react-native";
 import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
 function StudioSheetPager({ activePage, width, preview, chat, style }) {
-  const anim = React9.useRef(new Animated.Value(activePage === "chat" ? 1 : 0)).current;
-  React9.useEffect(() => {
+  const anim = React10.useRef(new Animated.Value(activePage === "chat" ? 1 : 0)).current;
+  React10.useEffect(() => {
     Animated.spring(anim, {
       toValue: activePage === "chat" ? 1 : 0,
       useNativeDriver: true,
@@ -1811,7 +1881,7 @@ function StudioSheetPager({ activePage, width, preview, chat, style }) {
 }
 
 // src/components/floating-draggable-button/FloatingDraggableButton.tsx
-import { useCallback as useCallback8, useEffect as useEffect8, useMemo as useMemo3, useRef as useRef4 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect9, useMemo as useMemo3, useRef as useRef6 } from "react";
 import {
   PanResponder,
   Pressable,
@@ -1890,8 +1960,8 @@ function FloatingDraggableButton({
   const theme = useTheme();
   const { width, height } = useWindowDimensions();
   const isDanger = variant === "danger";
-  const onPressRef = useRef4(onPress);
-  useEffect8(() => {
+  const onPressRef = useRef6(onPress);
+  useEffect9(() => {
     onPressRef.current = onPress;
   }, [onPress]);
   const fallbackBgColor = useMemo3(() => {
@@ -1905,8 +1975,8 @@ function FloatingDraggableButton({
   const rotation = useSharedValue(ENTER_ROTATION_FROM_DEG);
   const opacity = useSharedValue(1);
   const borderPulse = useSharedValue(0);
-  const startPos = useRef4({ x: 0, y: 0 });
-  const isAnimatingOut = useRef4(false);
+  const startPos = useRef6({ x: 0, y: 0 });
+  const isAnimatingOut = useRef6(false);
   const animateToHidden = useCallback8(
     (options) => {
       translateX.value = withSpring(getHiddenTranslateX(size), SPRING_POSITION);
@@ -1942,7 +2012,7 @@ function FloatingDraggableButton({
       }
     });
   }, [animateToHidden]);
-  useEffect8(() => {
+  useEffect9(() => {
     if (isLoading) {
       borderPulse.value = withRepeat(
         withSequence(
@@ -1968,7 +2038,7 @@ function FloatingDraggableButton({
     rotation.value = withSpring(0, SPRING_ROTATION_IN);
     opacity.value = withTiming(1, TIMING_OPACITY_IN);
   }, [height, offset.bottom, offset.left, opacity, rotation, scale, size, translateX, translateY]);
-  useEffect8(() => {
+  useEffect9(() => {
     const timer = setTimeout(() => {
       if (visible) {
         animateIn();
@@ -1976,7 +2046,7 @@ function FloatingDraggableButton({
     }, 100);
     return () => clearTimeout(timer);
   }, []);
-  useEffect8(() => {
+  useEffect9(() => {
     if (visible && isAnimatingOut.current) {
       animateIn();
     } else if (!visible && !isAnimatingOut.current) {
@@ -1984,13 +2054,13 @@ function FloatingDraggableButton({
       isAnimatingOut.current = true;
     }
   }, [visible, animateIn, animateToHidden]);
-  useEffect8(() => {
+  useEffect9(() => {
     if (forceShowTrigger > 0 && visible) {
       isAnimatingOut.current = false;
       animateIn();
     }
   }, [forceShowTrigger, visible, animateIn]);
-  const panResponder = useRef4(
+  const panResponder = useRef6(
     PanResponder.create({
       onStartShouldSetPanResponder: () => true,
       onMoveShouldSetPanResponder: () => true,
@@ -2107,7 +2177,7 @@ var styles = StyleSheet.create({
 });
 
 // src/components/overlays/EdgeGlowFrame.tsx
-import * as React10 from "react";
+import * as React11 from "react";
 import { Animated as Animated3, View as View6 } from "react-native";
 import { LinearGradient } from "expo-linear-gradient";
 
@@ -2150,8 +2220,8 @@ function EdgeGlowFrame({
 }) {
   const theme = useTheme();
   const alpha = Math.max(0, Math.min(1, intensity));
-  const anim = React10.useRef(new Animated3.Value(visible ? 1 : 0)).current;
-  React10.useEffect(() => {
+  const anim = React11.useRef(new Animated3.Value(visible ? 1 : 0)).current;
+  React11.useEffect(() => {
     Animated3.timing(anim, {
       toValue: visible ? 1 : 0,
       duration: 300,
@@ -2202,12 +2272,12 @@ function EdgeGlowFrame({
 }
 
 // src/components/draw/DrawModeOverlay.tsx
-import * as React13 from "react";
+import * as React14 from "react";
 import { StyleSheet as StyleSheet3, View as View10 } from "react-native";
 import { captureRef } from "react-native-view-shot";
 
 // src/components/draw/DrawSurface.tsx
-import * as React11 from "react";
+import * as React12 from "react";
 import { PanResponder as PanResponder2, StyleSheet as StyleSheet2, View as View7 } from "react-native";
 import Svg, { Path } from "react-native-svg";
 
@@ -2239,25 +2309,25 @@ function DrawSurface({
   style,
   minDistance = 1
 }) {
-  const [renderTick, setRenderTick] = React11.useState(0);
-  const currentPointsRef = React11.useRef([]);
-  const rafRef = React11.useRef(null);
-  const triggerRender = React11.useCallback(() => {
+  const [renderTick, setRenderTick] = React12.useState(0);
+  const currentPointsRef = React12.useRef([]);
+  const rafRef = React12.useRef(null);
+  const triggerRender = React12.useCallback(() => {
     if (rafRef.current !== null) return;
     rafRef.current = requestAnimationFrame(() => {
       rafRef.current = null;
       setRenderTick((n) => n + 1);
     });
   }, []);
-  React11.useEffect(() => () => {
+  React12.useEffect(() => () => {
     if (rafRef.current !== null) cancelAnimationFrame(rafRef.current);
   }, []);
-  const onStart = React11.useCallback((e) => {
+  const onStart = React12.useCallback((e) => {
     const { locationX, locationY } = e.nativeEvent;
     currentPointsRef.current = [{ x: locationX, y: locationY }];
     triggerRender();
   }, [triggerRender]);
-  const onMove = React11.useCallback((e, _g) => {
+  const onMove = React12.useCallback((e, _g) => {
     const { locationX, locationY } = e.nativeEvent;
     const pts = currentPointsRef.current;
     if (pts.length > 0) {
@@ -2270,7 +2340,7 @@ function DrawSurface({
     currentPointsRef.current = [...pts, { x: locationX, y: locationY }];
     triggerRender();
   }, [minDistance, triggerRender]);
-  const onEnd = React11.useCallback(() => {
+  const onEnd = React12.useCallback(() => {
     const points = currentPointsRef.current;
     if (points.length > 0) {
       onAddStroke({ points, color, width: strokeWidth });
@@ -2278,7 +2348,7 @@ function DrawSurface({
     currentPointsRef.current = [];
     triggerRender();
   }, [color, onAddStroke, strokeWidth, triggerRender]);
-  const panResponder = React11.useMemo(
+  const panResponder = React12.useMemo(
     () => PanResponder2.create({
       onStartShouldSetPanResponder: () => true,
       onMoveShouldSetPanResponder: () => true,
@@ -2328,7 +2398,7 @@ var styles2 = StyleSheet2.create({
 });
 
 // src/components/draw/DrawToolbar.tsx
-import * as React12 from "react";
+import * as React13 from "react";
 import {
   ActivityIndicator,
   Animated as Animated4,
@@ -2425,11 +2495,11 @@ function DrawToolbar({
 }) {
   const insets = useSafeAreaInsets2();
   const { width: screenWidth, height: screenHeight } = useWindowDimensions2();
-  const [expanded, setExpanded] = React12.useState(false);
-  const pos = React12.useRef(new Animated4.ValueXY({ x: screenWidth / 2 - 110, y: -140 })).current;
-  const start = React12.useRef({ x: 0, y: 0 });
-  const currentPos = React12.useRef({ x: 0, y: 0 });
-  React12.useEffect(() => {
+  const [expanded, setExpanded] = React13.useState(false);
+  const pos = React13.useRef(new Animated4.ValueXY({ x: screenWidth / 2 - 110, y: -140 })).current;
+  const start = React13.useRef({ x: 0, y: 0 });
+  const currentPos = React13.useRef({ x: 0, y: 0 });
+  React13.useEffect(() => {
     if (hidden) return;
     Animated4.spring(pos.y, {
       toValue: insets.top + 60,
@@ -2439,7 +2509,7 @@ function DrawToolbar({
       mass: 0.8
     }).start();
   }, [hidden, insets.top, pos.y]);
-  React12.useEffect(() => {
+  React13.useEffect(() => {
     const id = pos.addListener((v) => {
       currentPos.current = { x: v.x ?? 0, y: v.y ?? 0 };
     });
@@ -2447,7 +2517,7 @@ function DrawToolbar({
       pos.removeListener(id);
     };
   }, [pos]);
-  const clamp2 = React12.useCallback(
+  const clamp2 = React13.useCallback(
     (x, y) => {
       const minX = 10;
       const maxX = Math.max(10, screenWidth - 230);
@@ -2457,7 +2527,7 @@ function DrawToolbar({
     },
     [insets.top, screenHeight, screenWidth]
   );
-  const panResponder = React12.useMemo(
+  const panResponder = React13.useMemo(
     () => PanResponder3.create({
       onStartShouldSetPanResponder: () => false,
       onMoveShouldSetPanResponder: (_e, g) => Math.abs(g.dx) > 5 || Math.abs(g.dy) > 5,
@@ -2485,7 +2555,7 @@ function DrawToolbar({
     children
   }) {
     const isDisabled = Boolean(disabled) || Boolean(capturingDisabled);
-    const [pressed, setPressed] = React12.useState(false);
+    const [pressed, setPressed] = React13.useState(false);
     return /* @__PURE__ */ jsx11(
       View9,
       {
@@ -2623,7 +2693,7 @@ function DrawModeOverlay({
   renderDragHandle
 }) {
   const theme = useTheme();
-  const defaultPalette = React13.useMemo(
+  const defaultPalette = React14.useMemo(
     () => [
       "#EF4444",
       // Red
@@ -2641,11 +2711,11 @@ function DrawModeOverlay({
     []
   );
   const colors = palette && palette.length > 0 ? palette : defaultPalette;
-  const [selectedColor, setSelectedColor] = React13.useState(colors[0] ?? "#EF4444");
-  const [strokes, setStrokes] = React13.useState([]);
-  const [capturing, setCapturing] = React13.useState(false);
-  const [hideUi, setHideUi] = React13.useState(false);
-  React13.useEffect(() => {
+  const [selectedColor, setSelectedColor] = React14.useState(colors[0] ?? "#EF4444");
+  const [strokes, setStrokes] = React14.useState([]);
+  const [capturing, setCapturing] = React14.useState(false);
+  const [hideUi, setHideUi] = React14.useState(false);
+  React14.useEffect(() => {
     if (!visible) return;
     setStrokes([]);
     setSelectedColor(colors[0] ?? "#EF4444");
@@ -2653,14 +2723,14 @@ function DrawModeOverlay({
     setHideUi(false);
   }, [colors, visible]);
   const canUndo = strokes.length > 0;
-  const handleUndo = React13.useCallback(() => {
+  const handleUndo = React14.useCallback(() => {
     setStrokes((prev) => prev.slice(0, -1));
   }, []);
-  const handleCancel = React13.useCallback(() => {
+  const handleCancel = React14.useCallback(() => {
     setStrokes([]);
     onCancel();
   }, [onCancel]);
-  const handleDone = React13.useCallback(async () => {
+  const handleDone = React14.useCallback(async () => {
     if (!captureTargetRef.current || capturing) return;
     try {
       setCapturing(true);
@@ -2720,7 +2790,7 @@ var styles3 = StyleSheet3.create({
 });
 
 // src/components/comments/AppCommentsSheet.tsx
-import * as React20 from "react";
+import * as React21 from "react";
 import { ActivityIndicator as ActivityIndicator3, Keyboard as Keyboard3, Platform as Platform4, Pressable as Pressable5, View as View14 } from "react-native";
 import {
   BottomSheetBackdrop,
@@ -2732,7 +2802,7 @@ import { LiquidGlassView as LiquidGlassView4, isLiquidGlassSupported as isLiquid
 import { Play as Play2 } from "lucide-react-native";
 
 // src/components/chat/ChatComposer.tsx
-import * as React15 from "react";
+import * as React16 from "react";
 import {
   ActivityIndicator as ActivityIndicator2,
   Animated as Animated5,
@@ -2746,11 +2816,11 @@ import { LiquidGlassView as LiquidGlassView3, isLiquidGlassSupported as isLiquid
 import { Plus } from "lucide-react-native";
 
 // src/components/chat/MultilineTextInput.tsx
-import * as React14 from "react";
+import * as React15 from "react";
 import { TextInput } from "react-native";
 import { BottomSheetTextInput } from "@gorhom/bottom-sheet";
 import { jsx as jsx13 } from "react/jsx-runtime";
-var MultilineTextInput = React14.forwardRef(function MultilineTextInput2({ useBottomSheetTextInput = false, placeholder, placeholderTextColor, style, ...props }, ref) {
+var MultilineTextInput = React15.forwardRef(function MultilineTextInput2({ useBottomSheetTextInput = false, placeholder, placeholderTextColor, style, ...props }, ref) {
   const theme = useTheme();
   const baseStyle = {
     minHeight: 44,
@@ -2834,7 +2904,7 @@ function AspectRatioThumbnail({
   onRemove,
   renderRemoveIcon
 }) {
-  const [aspectRatio, setAspectRatio] = React15.useState(1);
+  const [aspectRatio, setAspectRatio] = React16.useState(1);
   return /* @__PURE__ */ jsxs8(View11, { style: { height: THUMBNAIL_HEIGHT, aspectRatio, position: "relative" }, children: [
     /* @__PURE__ */ jsx15(View11, { style: { flex: 1, borderRadius: 8, overflow: "hidden" }, children: /* @__PURE__ */ jsx15(
       Image,
@@ -2876,6 +2946,7 @@ function ChatComposer({
   onChangeValue,
   placeholder = "Describe the idea you want to build",
   disabled = false,
+  sendDisabled = false,
   sending = false,
   autoFocus = false,
   onSend,
@@ -2890,19 +2961,19 @@ function ChatComposer({
   style
 }) {
   const theme = useTheme();
-  const [internal, setInternal] = React15.useState("");
+  const [internal, setInternal] = React16.useState("");
   const text = value ?? internal;
   const setText = onChangeValue ?? setInternal;
   const hasAttachments = attachments.length > 0;
   const hasText = text.trim().length > 0;
   const composerMinHeight = hasAttachments ? THUMBNAIL_HEIGHT + 44 + 24 : 44;
-  const isButtonDisabled = sending || disabled;
-  const maxInputHeight = React15.useMemo(() => Dimensions.get("window").height * 0.5, []);
-  const shakeAnim = React15.useRef(new Animated5.Value(0)).current;
-  const [sendPressed, setSendPressed] = React15.useState(false);
-  const inputRef = React15.useRef(null);
-  const prevAutoFocusRef = React15.useRef(false);
-  React15.useEffect(() => {
+  const isButtonDisabled = sending || disabled || sendDisabled;
+  const maxInputHeight = React16.useMemo(() => Dimensions.get("window").height * 0.5, []);
+  const shakeAnim = React16.useRef(new Animated5.Value(0)).current;
+  const [sendPressed, setSendPressed] = React16.useState(false);
+  const inputRef = React16.useRef(null);
+  const prevAutoFocusRef = React16.useRef(false);
+  React16.useEffect(() => {
     const shouldFocus = autoFocus && !prevAutoFocusRef.current && !disabled && !sending;
     prevAutoFocusRef.current = autoFocus;
     if (!shouldFocus) return;
@@ -2912,7 +2983,7 @@ function ChatComposer({
     }, 75);
     return () => clearTimeout(t);
   }, [autoFocus, disabled, sending]);
-  const triggerShake = React15.useCallback(() => {
+  const triggerShake = React16.useCallback(() => {
     shakeAnim.setValue(0);
     Animated5.sequence([
       Animated5.timing(shakeAnim, { toValue: 10, duration: 50, useNativeDriver: true }),
@@ -2922,7 +2993,7 @@ function ChatComposer({
       Animated5.timing(shakeAnim, { toValue: 0, duration: 50, useNativeDriver: true })
     ]).start();
   }, [shakeAnim]);
-  const handleSend = React15.useCallback(async () => {
+  const handleSend = React16.useCallback(async () => {
     if (isButtonDisabled) return;
     if (!hasText) {
       triggerShake();
@@ -3055,7 +3126,7 @@ function ChatComposer({
 }
 
 // src/components/comments/CommentRow.tsx
-import * as React16 from "react";
+import * as React17 from "react";
 import { View as View13 } from "react-native";
 
 // src/components/primitives/Avatar.tsx
@@ -3127,9 +3198,9 @@ function formatTimeAgo(iso) {
 import { jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
 function CommentRow({ comment, showDivider }) {
   const theme = useTheme();
-  const [authorName, setAuthorName] = React16.useState(null);
-  const [authorAvatar, setAuthorAvatar] = React16.useState(null);
-  React16.useEffect(() => {
+  const [authorName, setAuthorName] = React17.useState(null);
+  const [authorAvatar, setAuthorAvatar] = React17.useState(null);
+  React17.useEffect(() => {
     let cancelled = false;
     (async () => {
       try {
@@ -3169,7 +3240,7 @@ function CommentRow({ comment, showDivider }) {
 }
 
 // src/components/comments/useAppComments.ts
-import * as React17 from "react";
+import * as React18 from "react";
 
 // src/data/comments/remote.ts
 var AppCommentsRemoteDataSourceImpl = class extends BaseRemote {
@@ -3241,18 +3312,18 @@ var appCommentsRepository = new AppCommentsRepositoryImpl(appCommentsRemoteDataS
 
 // src/components/comments/useAppComments.ts
 function useAppComments(appId) {
-  const [comments, setComments] = React17.useState([]);
-  const [loading, setLoading] = React17.useState(false);
-  const [sending, setSending] = React17.useState(false);
-  const [error, setError] = React17.useState(null);
-  const sortByCreatedAtAsc = React17.useCallback((items) => {
+  const [comments, setComments] = React18.useState([]);
+  const [loading, setLoading] = React18.useState(false);
+  const [sending, setSending] = React18.useState(false);
+  const [error, setError] = React18.useState(null);
+  const sortByCreatedAtAsc = React18.useCallback((items) => {
     return [...items].sort((a, b) => {
       const at = a.createdAt ? new Date(a.createdAt).getTime() : 0;
       const bt = b.createdAt ? new Date(b.createdAt).getTime() : 0;
       return at - bt;
     });
   }, []);
-  const refresh = React17.useCallback(async () => {
+  const refresh = React18.useCallback(async () => {
     if (!appId) {
       setComments([]);
       return;
@@ -3269,10 +3340,10 @@ function useAppComments(appId) {
       setLoading(false);
     }
   }, [appId, sortByCreatedAtAsc]);
-  React17.useEffect(() => {
+  React18.useEffect(() => {
     void refresh();
   }, [refresh]);
-  const create = React17.useCallback(
+  const create = React18.useCallback(
     async (text) => {
       if (!appId) return;
       const trimmed = text.trim();
@@ -3295,11 +3366,11 @@ function useAppComments(appId) {
 }
 
 // src/components/comments/useAppDetails.ts
-import * as React18 from "react";
+import * as React19 from "react";
 function useAppDetails(appId) {
-  const [app, setApp] = React18.useState(null);
-  const [loading, setLoading] = React18.useState(false);
-  React18.useEffect(() => {
+  const [app, setApp] = React19.useState(null);
+  const [loading, setLoading] = React19.useState(false);
+  React19.useEffect(() => {
     if (!appId) {
       setApp(null);
       return;
@@ -3324,25 +3395,30 @@ function useAppDetails(appId) {
 }
 
 // src/components/comments/useIosKeyboardSnapFix.ts
-import * as React19 from "react";
+import * as React20 from "react";
 import { Keyboard as Keyboard2, Platform as Platform3 } from "react-native";
-function useIosKeyboardSnapFix(sheetRef) {
-  const [keyboardVisible, setKeyboardVisible] = React19.useState(false);
-  React19.useEffect(() => {
+function useIosKeyboardSnapFix(sheetRef, options) {
+  const [keyboardVisible, setKeyboardVisible] = React20.useState(false);
+  React20.useEffect(() => {
     if (Platform3.OS !== "ios") return;
     const show = Keyboard2.addListener("keyboardWillShow", () => setKeyboardVisible(true));
     const hide = Keyboard2.addListener("keyboardWillHide", () => {
+      var _a;
       setKeyboardVisible(false);
-      setTimeout(() => {
-        var _a, _b;
-        return (_b = (_a = sheetRef.current) == null ? void 0 : _a.snapToIndex) == null ? void 0 : _b.call(_a, 1);
-      }, 10);
+      const target = (options == null ? void 0 : options.targetIndex) ?? 1;
+      const current = ((_a = options == null ? void 0 : options.getCurrentIndex) == null ? void 0 : _a.call(options)) ?? null;
+      if (current === target) {
+        setTimeout(() => {
+          var _a2, _b;
+          return (_b = (_a2 = sheetRef.current) == null ? void 0 : _a2.snapToIndex) == null ? void 0 : _b.call(_a2, target);
+        }, 10);
+      }
     });
     return () => {
       show.remove();
       hide.remove();
     };
-  }, [sheetRef]);
+  }, [options == null ? void 0 : options.getCurrentIndex, options == null ? void 0 : options.targetIndex, sheetRef]);
   return { keyboardVisible };
 }
 
@@ -3351,12 +3427,16 @@ import { jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
 function AppCommentsSheet({ appId, onClose, onCountChange, onPlayApp }) {
   const theme = useTheme();
   const insets = useSafeAreaInsets3();
-  const sheetRef = React20.useRef(null);
-  const snapPoints = React20.useMemo(() => ["50%", "90%"], []);
+  const sheetRef = React21.useRef(null);
+  const snapPoints = React21.useMemo(() => ["50%", "90%"], []);
+  const currentIndexRef = React21.useRef(1);
   const { comments, loading, sending, error, create, refresh } = useAppComments(appId);
   const { app, loading: loadingApp } = useAppDetails(appId);
-  const { keyboardVisible } = useIosKeyboardSnapFix(sheetRef);
-  React20.useEffect(() => {
+  const { keyboardVisible } = useIosKeyboardSnapFix(sheetRef, {
+    getCurrentIndex: () => currentIndexRef.current,
+    targetIndex: 1
+  });
+  React21.useEffect(() => {
     var _a, _b;
     if (appId) {
       (_a = sheetRef.current) == null ? void 0 : _a.present();
@@ -3365,21 +3445,22 @@ function AppCommentsSheet({ appId, onClose, onCountChange, onPlayApp }) {
       (_b = sheetRef.current) == null ? void 0 : _b.dismiss();
     }
   }, [appId, refresh]);
-  React20.useEffect(() => {
+  React21.useEffect(() => {
     if (!appId) return;
     onCountChange == null ? void 0 : onCountChange(comments.length);
   }, [appId, comments.length, onCountChange]);
-  const renderBackdrop = React20.useCallback(
+  const renderBackdrop = React21.useCallback(
     (props) => /* @__PURE__ */ jsx18(BottomSheetBackdrop, { ...props, disappearsOnIndex: -1, appearsOnIndex: 0, opacity: 0.5 }),
     []
   );
-  const handleChange = React20.useCallback(
+  const handleChange = React21.useCallback(
     (index) => {
+      currentIndexRef.current = index;
       if (index === -1) onClose();
     },
     [onClose]
   );
-  const handlePlay = React20.useCallback(async () => {
+  const handlePlay = React21.useCallback(async () => {
     var _a;
     if (!appId) return;
     (_a = sheetRef.current) == null ? void 0 : _a.dismiss();
@@ -3590,7 +3671,7 @@ function StudioSheetHeader({ left, center, right, style }) {
 }
 
 // src/components/studio-sheet/StudioSheetHeaderIconButton.tsx
-import * as React21 from "react";
+import * as React22 from "react";
 import { Pressable as Pressable6, View as View17 } from "react-native";
 import { LiquidGlassView as LiquidGlassView5, isLiquidGlassSupported as isLiquidGlassSupported5 } from "@callstack/liquid-glass";
 import { jsx as jsx21 } from "react/jsx-runtime";
@@ -3605,7 +3686,7 @@ function StudioSheetHeaderIconButton({
 }) {
   const theme = useTheme();
   const size = 44;
-  const [pressed, setPressed] = React21.useState(false);
+  const [pressed, setPressed] = React22.useState(false);
   const solidBg = intent === "danger" ? theme.colors.danger : intent === "primary" ? theme.colors.primary : theme.colors.neutral;
   const glassFallbackBg = theme.scheme === "dark" ? "#18181B" : "#F6F6F6";
   const glassInnerBg = intent === "danger" ? theme.colors.danger : theme.colors.primary;
@@ -3795,14 +3876,14 @@ function PreviewHeroCard({
 }
 
 // src/components/preview/PreviewPlaceholder.tsx
-import * as React22 from "react";
+import * as React23 from "react";
 import { Animated as Animated6 } from "react-native";
 import { LinearGradient as LinearGradient2 } from "expo-linear-gradient";
 import { Fragment as Fragment3, jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime";
 function PreviewPlaceholder({ visible, style }) {
   if (!visible) return null;
-  const opacityAnim = React22.useRef(new Animated6.Value(0)).current;
-  React22.useEffect(() => {
+  const opacityAnim = React23.useRef(new Animated6.Value(0)).current;
+  React23.useEffect(() => {
     if (!visible) return;
     const animation = Animated6.loop(
       Animated6.sequence([
@@ -4394,12 +4475,12 @@ function PreviewCustomizeSection({
 }
 
 // src/studio/ui/preview-panel/PreviewCollaborateSection.tsx
-import * as React28 from "react";
+import * as React29 from "react";
 import { ActivityIndicator as ActivityIndicator6, Alert, View as View32 } from "react-native";
 import { Send as Send2 } from "lucide-react-native";
 
 // src/components/merge-requests/MergeRequestStatusCard.tsx
-import * as React24 from "react";
+import * as React25 from "react";
 import { Animated as Animated7, Pressable as Pressable9, View as View28 } from "react-native";
 import { Ban, Check as Check3, CheckCheck, ChevronDown as ChevronDown2 } from "lucide-react-native";
 
@@ -4481,11 +4562,11 @@ function toIsoString(input) {
 }
 
 // src/components/merge-requests/useControlledExpansion.ts
-import * as React23 from "react";
+import * as React24 from "react";
 function useControlledExpansion(props) {
-  const [uncontrolled, setUncontrolled] = React23.useState(false);
+  const [uncontrolled, setUncontrolled] = React24.useState(false);
   const expanded = props.expanded ?? uncontrolled;
-  const setExpanded = React23.useCallback(
+  const setExpanded = React24.useCallback(
     (next) => {
       var _a;
       (_a = props.onExpandedChange) == null ? void 0 : _a.call(props, next);
@@ -4510,8 +4591,8 @@ function MergeRequestStatusCard({
   const isDark = theme.scheme === "dark";
   const textColor = isDark ? "#FFFFFF" : "#000000";
   const subTextColor = isDark ? "#A1A1AA" : "#71717A";
-  const status = React24.useMemo(() => getMergeRequestStatusDisplay(String(mergeRequest.status)), [mergeRequest.status]);
-  const { StatusIcon, iconColor, bgColor, statusText } = React24.useMemo(() => {
+  const status = React25.useMemo(() => getMergeRequestStatusDisplay(String(mergeRequest.status)), [mergeRequest.status]);
+  const { StatusIcon, iconColor, bgColor, statusText } = React25.useMemo(() => {
     switch (mergeRequest.status) {
       case "approved":
       case "merged":
@@ -4542,8 +4623,8 @@ function MergeRequestStatusCard({
   const createdIso = toIsoString(mergeRequest.createdAt ?? null);
   const headerTimeAgo = updatedIso ? formatTimeAgo(updatedIso) : "";
   const createdTimeAgo = createdIso ? formatTimeAgo(createdIso) : "";
-  const rotate = React24.useRef(new Animated7.Value(expanded ? 1 : 0)).current;
-  React24.useEffect(() => {
+  const rotate = React25.useRef(new Animated7.Value(expanded ? 1 : 0)).current;
+  React25.useEffect(() => {
     Animated7.timing(rotate, {
       toValue: expanded ? 1 : 0,
       duration: 200,
@@ -4634,16 +4715,16 @@ function MergeRequestStatusCard({
 }
 
 // src/components/merge-requests/ReviewMergeRequestCarousel.tsx
-import * as React27 from "react";
+import * as React28 from "react";
 import { Animated as Animated9, FlatList, View as View31, useWindowDimensions as useWindowDimensions3 } from "react-native";
 
 // src/components/merge-requests/ReviewMergeRequestCard.tsx
-import * as React26 from "react";
+import * as React27 from "react";
 import { ActivityIndicator as ActivityIndicator5, Animated as Animated8, Pressable as Pressable11, View as View30 } from "react-native";
 import { Check as Check4, ChevronDown as ChevronDown3, Play as Play3, X as X3 } from "lucide-react-native";
 
 // src/components/merge-requests/ReviewMergeRequestActionButton.tsx
-import * as React25 from "react";
+import * as React26 from "react";
 import { Pressable as Pressable10, View as View29 } from "react-native";
 import { jsx as jsx39 } from "react/jsx-runtime";
 function ReviewMergeRequestActionButton({
@@ -4654,7 +4735,7 @@ function ReviewMergeRequestActionButton({
   children,
   iconOnly
 }) {
-  const [pressed, setPressed] = React25.useState(false);
+  const [pressed, setPressed] = React26.useState(false);
   const height = iconOnly ? 36 : 40;
   const width = iconOnly ? 36 : void 0;
   const paddingHorizontal = iconOnly ? 0 : 16;
@@ -4716,10 +4797,10 @@ function ReviewMergeRequestCard({
   onTest
 }) {
   const theme = useTheme();
-  const status = React26.useMemo(() => getMergeRequestStatusDisplay(mr.status), [mr.status]);
+  const status = React27.useMemo(() => getMergeRequestStatusDisplay(mr.status), [mr.status]);
   const canAct = mr.status === "open";
-  const rotate = React26.useRef(new Animated8.Value(isExpanded ? 1 : 0)).current;
-  React26.useEffect(() => {
+  const rotate = React27.useRef(new Animated8.Value(isExpanded ? 1 : 0)).current;
+  React27.useEffect(() => {
     Animated8.timing(rotate, { toValue: isExpanded ? 1 : 0, duration: 200, useNativeDriver: true }).start();
   }, [isExpanded, rotate]);
   const position = total > 1 ? `${index + 1}/${total}` : "Merge request";
@@ -4851,11 +4932,11 @@ function ReviewMergeRequestCarousel({
 }) {
   const theme = useTheme();
   const { width } = useWindowDimensions3();
-  const [expanded, setExpanded] = React27.useState({});
-  const carouselScrollX = React27.useRef(new Animated9.Value(0)).current;
+  const [expanded, setExpanded] = React28.useState({});
+  const carouselScrollX = React28.useRef(new Animated9.Value(0)).current;
   const peekAmount = 24;
   const gap = 16;
-  const cardWidth = React27.useMemo(() => Math.max(1, width - theme.spacing.lg * 2 - peekAmount), [peekAmount, theme.spacing.lg, width]);
+  const cardWidth = React28.useMemo(() => Math.max(1, width - theme.spacing.lg * 2 - peekAmount), [peekAmount, theme.spacing.lg, width]);
   const snapInterval = cardWidth + gap;
   const dotColor = theme.scheme === "dark" ? "#FFFFFF" : "#000000";
   if (mergeRequests.length === 0) return null;
@@ -4954,7 +5035,7 @@ function PreviewCollaborateSection({
   onTestMr
 }) {
   const theme = useTheme();
-  const [submittingMr, setSubmittingMr] = React28.useState(false);
+  const [submittingMr, setSubmittingMr] = React29.useState(false);
   const hasSection = canSubmitMergeRequest || incomingMergeRequests.length > 0 || outgoingMergeRequests.length > 0;
   if (!hasSection) return null;
   const showActionsSubtitle = canSubmitMergeRequest && onSubmitMergeRequest || onTestMr && incomingMergeRequests.length > 0;
@@ -5062,7 +5143,7 @@ function PreviewCollaborateSection({
 }
 
 // src/studio/ui/preview-panel/usePreviewPanelData.ts
-import * as React30 from "react";
+import * as React31 from "react";
 
 // src/data/apps/images/remote.ts
 var AppImagesRemoteDataSourceImpl = class extends BaseRemote {
@@ -5113,7 +5194,7 @@ var AppImagesRepositoryImpl = class extends BaseRepository {
 var appImagesRepository = new AppImagesRepositoryImpl(appImagesRemoteDataSource);
 
 // src/studio/hooks/useAppStats.ts
-import * as React29 from "react";
+import * as React30 from "react";
 import * as Haptics2 from "expo-haptics";
 
 // src/data/likes/remote.ts
@@ -5182,34 +5263,34 @@ function useAppStats({
   initialIsLiked = false,
   onOpenComments
 }) {
-  const [likeCount, setLikeCount] = React29.useState(initialLikes);
-  const [commentCount, setCommentCount] = React29.useState(initialComments);
-  const [forkCount, setForkCount] = React29.useState(initialForks);
-  const [isLiked, setIsLiked] = React29.useState(initialIsLiked);
-  const didMutateRef = React29.useRef(false);
-  const lastAppIdRef = React29.useRef("");
-  React29.useEffect(() => {
+  const [likeCount, setLikeCount] = React30.useState(initialLikes);
+  const [commentCount, setCommentCount] = React30.useState(initialComments);
+  const [forkCount, setForkCount] = React30.useState(initialForks);
+  const [isLiked, setIsLiked] = React30.useState(initialIsLiked);
+  const didMutateRef = React30.useRef(false);
+  const lastAppIdRef = React30.useRef("");
+  React30.useEffect(() => {
     if (lastAppIdRef.current === appId) return;
     lastAppIdRef.current = appId;
     didMutateRef.current = false;
   }, [appId]);
-  React29.useEffect(() => {
+  React30.useEffect(() => {
     if (didMutateRef.current) return;
     setLikeCount(initialLikes);
   }, [appId, initialLikes]);
-  React29.useEffect(() => {
+  React30.useEffect(() => {
     if (didMutateRef.current) return;
     setCommentCount(initialComments);
   }, [appId, initialComments]);
-  React29.useEffect(() => {
+  React30.useEffect(() => {
     if (didMutateRef.current) return;
     setForkCount(initialForks);
   }, [appId, initialForks]);
-  React29.useEffect(() => {
+  React30.useEffect(() => {
     if (didMutateRef.current) return;
     setIsLiked(initialIsLiked);
   }, [appId, initialIsLiked]);
-  const handleLike = React29.useCallback(async () => {
+  const handleLike = React30.useCallback(async () => {
     var _a, _b;
     if (!appId) return;
     didMutateRef.current = true;
@@ -5233,7 +5314,7 @@ function useAppStats({
       setLikeCount((prev) => Math.max(0, prev + (newIsLiked ? -1 : 1)));
     }
   }, [appId, isLiked, likeCount]);
-  const handleOpenComments = React29.useCallback(() => {
+  const handleOpenComments = React30.useCallback(() => {
     if (!appId) return;
     try {
       void Haptics2.impactAsync(Haptics2.ImpactFeedbackStyle.Light);
@@ -5248,11 +5329,11 @@ function useAppStats({
 var LIKE_DEBUG_PREFIX = "[COMERGE_LIKE_DEBUG]";
 function usePreviewPanelData(params) {
   const { app, isOwner, outgoingMergeRequests, onOpenComments, commentCountOverride } = params;
-  const [imageUrl, setImageUrl] = React30.useState(null);
-  const [imageLoaded, setImageLoaded] = React30.useState(false);
-  const [insights, setInsights] = React30.useState({ likes: 0, comments: 0, forks: 0, downloads: 0 });
-  const [creator, setCreator] = React30.useState(null);
-  React30.useEffect(() => {
+  const [imageUrl, setImageUrl] = React31.useState(null);
+  const [imageLoaded, setImageLoaded] = React31.useState(false);
+  const [insights, setInsights] = React31.useState({ likes: 0, comments: 0, forks: 0, downloads: 0 });
+  const [creator, setCreator] = React31.useState(null);
+  React31.useEffect(() => {
     if (!(app == null ? void 0 : app.id)) return;
     let cancelled = false;
     (async () => {
@@ -5267,7 +5348,7 @@ function usePreviewPanelData(params) {
       cancelled = true;
     };
   }, [app == null ? void 0 : app.id]);
-  React30.useEffect(() => {
+  React31.useEffect(() => {
     if (!(app == null ? void 0 : app.createdBy)) return;
     let cancelled = false;
     (async () => {
@@ -5283,10 +5364,10 @@ function usePreviewPanelData(params) {
       cancelled = true;
     };
   }, [app == null ? void 0 : app.createdBy]);
-  React30.useEffect(() => {
+  React31.useEffect(() => {
     setImageLoaded(false);
   }, [app == null ? void 0 : app.id]);
-  React30.useEffect(() => {
+  React31.useEffect(() => {
     if (!(app == null ? void 0 : app.id)) return;
     let cancelled = false;
     (async () => {
@@ -5311,7 +5392,7 @@ function usePreviewPanelData(params) {
       cancelled = true;
     };
   }, [app == null ? void 0 : app.id]);
-  React30.useEffect(() => {
+  React31.useEffect(() => {
     if (!(app == null ? void 0 : app.id)) return;
     log.debug(
       `${LIKE_DEBUG_PREFIX} usePreviewPanelData.appChanged appId=${app.id} app.isLiked=${String(app.isLiked)}`
@@ -5325,7 +5406,7 @@ function usePreviewPanelData(params) {
     initialIsLiked: Boolean(app == null ? void 0 : app.isLiked),
     onOpenComments
   });
-  const canSubmitMergeRequest = React30.useMemo(() => {
+  const canSubmitMergeRequest = React31.useMemo(() => {
     if (!isOwner) return false;
     if (!app) return false;
     if (!app.forkedFromAppId) return false;
@@ -5438,17 +5519,17 @@ function PreviewPanel({
 }
 
 // src/studio/ui/ChatPanel.tsx
-import * as React35 from "react";
+import * as React36 from "react";
 import { ActivityIndicator as ActivityIndicator8, View as View41 } from "react-native";
 
 // src/components/chat/ChatPage.tsx
-import * as React33 from "react";
+import * as React34 from "react";
 import { Keyboard as Keyboard4, Platform as Platform6, View as View37 } from "react-native";
 import { useSafeAreaInsets as useSafeAreaInsets4 } from "react-native-safe-area-context";
 import Animated11, { useAnimatedKeyboard, useAnimatedStyle as useAnimatedStyle2 } from "react-native-reanimated";
 
 // src/components/chat/ChatMessageList.tsx
-import * as React32 from "react";
+import * as React33 from "react";
 import { View as View36 } from "react-native";
 import { BottomSheetFlatList } from "@gorhom/bottom-sheet";
 
@@ -5494,17 +5575,17 @@ function ChatMessageBubble({ message, renderContent, style }) {
 }
 
 // src/components/chat/TypingIndicator.tsx
-import * as React31 from "react";
+import * as React32 from "react";
 import { Animated as Animated10, View as View35 } from "react-native";
 import { jsx as jsx45 } from "react/jsx-runtime";
 function TypingIndicator({ style }) {
   const theme = useTheme();
   const dotColor = theme.colors.textSubtle;
-  const anims = React31.useMemo(
+  const anims = React32.useMemo(
     () => [new Animated10.Value(0.3), new Animated10.Value(0.3), new Animated10.Value(0.3)],
     []
   );
-  React31.useEffect(() => {
+  React32.useEffect(() => {
     const loops = [];
     anims.forEach((a, idx) => {
       const seq = Animated10.sequence([
@@ -5537,40 +5618,44 @@ function TypingIndicator({ style }) {
 }
 
 // src/components/chat/ChatMessageList.tsx
-import { jsx as jsx46 } from "react/jsx-runtime";
-var ChatMessageList = React32.forwardRef(
+import { jsx as jsx46, jsxs as jsxs28 } from "react/jsx-runtime";
+var ChatMessageList = React33.forwardRef(
   ({
     messages,
     showTypingIndicator = false,
     renderMessageContent,
     contentStyle,
+    bottomInset = 0,
     onNearBottomChange,
     nearBottomThreshold = 200
   }, ref) => {
     const theme = useTheme();
-    const listRef = React32.useRef(null);
-    const nearBottomRef = React32.useRef(true);
-    const initialScrollDoneRef = React32.useRef(false);
-    const lastMessageIdRef = React32.useRef(null);
-    const scrollToBottom = React32.useCallback((options) => {
+    const listRef = React33.useRef(null);
+    const nearBottomRef = React33.useRef(true);
+    const initialScrollDoneRef = React33.useRef(false);
+    const lastMessageIdRef = React33.useRef(null);
+    const scrollToBottom = React33.useCallback((options) => {
       var _a;
       const animated = (options == null ? void 0 : options.animated) ?? true;
       (_a = listRef.current) == null ? void 0 : _a.scrollToEnd({ animated });
     }, []);
-    React32.useImperativeHandle(ref, () => ({ scrollToBottom }), [scrollToBottom]);
-    const handleScroll = React32.useCallback(
+    React33.useImperativeHandle(ref, () => ({ scrollToBottom }), [scrollToBottom]);
+    const handleScroll = React33.useCallback(
       (e) => {
         const { contentOffset, contentSize, layoutMeasurement } = e.nativeEvent;
-        const distanceFromBottom = Math.max(contentSize.height - (contentOffset.y + layoutMeasurement.height), 0);
+        const distanceFromBottom = Math.max(
+          contentSize.height - Math.max(bottomInset, 0) - (contentOffset.y + layoutMeasurement.height),
+          0
+        );
         const isNear = distanceFromBottom <= nearBottomThreshold;
         if (nearBottomRef.current !== isNear) {
           nearBottomRef.current = isNear;
           onNearBottomChange == null ? void 0 : onNearBottomChange(isNear);
         }
       },
-      [nearBottomThreshold, onNearBottomChange]
+      [bottomInset, nearBottomThreshold, onNearBottomChange]
     );
-    React32.useEffect(() => {
+    React33.useEffect(() => {
       var _a;
       if (initialScrollDoneRef.current) return;
       if (messages.length === 0) return;
@@ -5579,7 +5664,7 @@ var ChatMessageList = React32.forwardRef(
       const id = requestAnimationFrame(() => scrollToBottom({ animated: false }));
       return () => cancelAnimationFrame(id);
     }, [messages, scrollToBottom]);
-    React32.useEffect(() => {
+    React33.useEffect(() => {
       if (!initialScrollDoneRef.current) return;
       const lastId = messages.length > 0 ? messages[messages.length - 1].id : null;
       const prevLastId = lastMessageIdRef.current;
@@ -5589,13 +5674,19 @@ var ChatMessageList = React32.forwardRef(
       const id = requestAnimationFrame(() => scrollToBottom({ animated: true }));
       return () => cancelAnimationFrame(id);
     }, [messages, scrollToBottom]);
-    React32.useEffect(() => {
+    React33.useEffect(() => {
       if (showTypingIndicator && nearBottomRef.current) {
         const id = requestAnimationFrame(() => scrollToBottom({ animated: true }));
         return () => cancelAnimationFrame(id);
       }
       return void 0;
     }, [showTypingIndicator, scrollToBottom]);
+    React33.useEffect(() => {
+      if (!initialScrollDoneRef.current) return;
+      if (!nearBottomRef.current) return;
+      const id = requestAnimationFrame(() => scrollToBottom({ animated: false }));
+      return () => cancelAnimationFrame(id);
+    }, [bottomInset, scrollToBottom]);
     return /* @__PURE__ */ jsx46(
       BottomSheetFlatList,
       {
@@ -5609,13 +5700,15 @@ var ChatMessageList = React32.forwardRef(
           {
             paddingHorizontal: theme.spacing.lg,
             paddingTop: theme.spacing.sm,
-            paddingBottom: theme.spacing.xl
+            paddingBottom: theme.spacing.sm
           },
           contentStyle
         ],
         renderItem: ({ item, index }) => /* @__PURE__ */ jsx46(View36, { style: { marginTop: index === 0 ? 0 : theme.spacing.sm }, children: /* @__PURE__ */ jsx46(ChatMessageBubble, { message: item, renderContent: renderMessageContent }) }),
-        ListFooterComponent: showTypingIndicator ? /* @__PURE__ */ jsx46(View36, { style: { marginTop: theme.spacing.sm, alignSelf: "flex-start", paddingHorizontal: theme.spacing.lg }, children: /* @__PURE__ */ jsx46(TypingIndicator, {}) }) : null,
-        maintainVisibleContentPosition: { minIndexForVisible: 0, autoscrollToTopThreshold: nearBottomThreshold }
+        ListFooterComponent: /* @__PURE__ */ jsxs28(View36, { children: [
+          showTypingIndicator ? /* @__PURE__ */ jsx46(View36, { style: { marginTop: theme.spacing.sm, alignSelf: "flex-start", paddingHorizontal: theme.spacing.lg }, children: /* @__PURE__ */ jsx46(TypingIndicator, {}) }) : null,
+          bottomInset > 0 ? /* @__PURE__ */ jsx46(View36, { style: { height: bottomInset } }) : null
+        ] })
       }
     );
   }
@@ -5623,7 +5716,7 @@ var ChatMessageList = React32.forwardRef(
 ChatMessageList.displayName = "ChatMessageList";
 
 // src/components/chat/ChatPage.tsx
-import { jsx as jsx47, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs29 } from "react/jsx-runtime";
 function ChatPage({
   header,
   messages,
@@ -5638,10 +5731,10 @@ function ChatPage({
 }) {
   const theme = useTheme();
   const insets = useSafeAreaInsets4();
-  const [composerHeight, setComposerHeight] = React33.useState(0);
-  const [keyboardVisible, setKeyboardVisible] = React33.useState(false);
+  const [composerHeight, setComposerHeight] = React34.useState(0);
+  const [keyboardVisible, setKeyboardVisible] = React34.useState(false);
   const animatedKeyboard = useAnimatedKeyboard();
-  React33.useEffect(() => {
+  React34.useEffect(() => {
     if (Platform6.OS !== "ios") return;
     const show = Keyboard4.addListener("keyboardWillShow", () => setKeyboardVisible(true));
     const hide = Keyboard4.addListener("keyboardWillHide", () => setKeyboardVisible(false));
@@ -5656,19 +5749,20 @@ function ChatPage({
     return { paddingBottom: animatedKeyboard.height.value > 0 ? 0 : insets.bottom };
   });
   const overlayBottom = composerHeight + footerBottomPadding + theme.spacing.lg;
-  const resolvedOverlay = React33.useMemo(() => {
+  const bottomInset = composerHeight + footerBottomPadding + theme.spacing.xl;
+  const resolvedOverlay = React34.useMemo(() => {
     var _a;
     if (!overlay) return null;
-    if (!React33.isValidElement(overlay)) return overlay;
+    if (!React34.isValidElement(overlay)) return overlay;
     const prevStyle = (_a = overlay.props) == null ? void 0 : _a.style;
-    return React33.cloneElement(overlay, {
+    return React34.cloneElement(overlay, {
       style: [prevStyle, { bottom: overlayBottom }]
     });
   }, [overlay, overlayBottom]);
-  return /* @__PURE__ */ jsxs28(View37, { style: [{ flex: 1 }, style], children: [
+  return /* @__PURE__ */ jsxs29(View37, { style: [{ flex: 1 }, style], children: [
     header ? /* @__PURE__ */ jsx47(View37, { children: header }) : null,
     topBanner ? /* @__PURE__ */ jsx47(View37, { style: { paddingHorizontal: theme.spacing.lg, paddingTop: theme.spacing.sm }, children: topBanner }) : null,
-    /* @__PURE__ */ jsxs28(View37, { style: { flex: 1 }, children: [
+    /* @__PURE__ */ jsxs29(View37, { style: { flex: 1 }, children: [
       /* @__PURE__ */ jsx47(
         ChatMessageList,
         {
@@ -5677,7 +5771,7 @@ function ChatPage({
           showTypingIndicator,
           renderMessageContent,
           onNearBottomChange,
-          contentStyle: { paddingBottom: theme.spacing.xl + composerHeight + footerBottomPadding }
+          bottomInset
         }
       ),
       resolvedOverlay,
@@ -5710,15 +5804,15 @@ function ChatPage({
 }
 
 // src/components/chat/ScrollToBottomButton.tsx
-import * as React34 from "react";
+import * as React35 from "react";
 import { Pressable as Pressable12, View as View38 } from "react-native";
 import Animated12, { Easing as Easing2, useAnimatedStyle as useAnimatedStyle3, useSharedValue as useSharedValue2, withTiming as withTiming2 } from "react-native-reanimated";
 import { jsx as jsx48 } from "react/jsx-runtime";
 function ScrollToBottomButton({ visible, onPress, children, style }) {
   const theme = useTheme();
   const progress = useSharedValue2(visible ? 1 : 0);
-  const [pressed, setPressed] = React34.useState(false);
-  React34.useEffect(() => {
+  const [pressed, setPressed] = React35.useState(false);
+  React35.useEffect(() => {
     progress.value = withTiming2(visible ? 1 : 0, { duration: 200, easing: Easing2.out(Easing2.ease) });
   }, [progress, visible]);
   const animStyle = useAnimatedStyle3(() => ({
@@ -5800,7 +5894,7 @@ function ChatHeader({ left, right, center, style }) {
 
 // src/components/chat/ForkNoticeBanner.tsx
 import { View as View40 } from "react-native";
-import { jsx as jsx50, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs30 } from "react/jsx-runtime";
 function ForkNoticeBanner({ isOwner = true, title, description, style }) {
   const theme = useTheme();
   const resolvedTitle = title ?? (isOwner ? "Remixed app" : "Remix app");
@@ -5820,7 +5914,7 @@ function ForkNoticeBanner({ isOwner = true, title, description, style }) {
         },
         style
       ],
-      children: /* @__PURE__ */ jsxs29(View40, { style: { minWidth: 0 }, children: [
+      children: /* @__PURE__ */ jsxs30(View40, { style: { minWidth: 0 }, children: [
         /* @__PURE__ */ jsx50(
           Text,
           {
@@ -5853,7 +5947,7 @@ function ForkNoticeBanner({ isOwner = true, title, description, style }) {
 }
 
 // src/studio/ui/ChatPanel.tsx
-import { jsx as jsx51, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs31 } from "react/jsx-runtime";
 function ChatPanel({
   title = "Chat",
   autoFocusComposer = false,
@@ -5873,32 +5967,34 @@ function ChatPanel({
   onStartDraw,
   onSend
 }) {
-  const listRef = React35.useRef(null);
-  const [nearBottom, setNearBottom] = React35.useState(true);
-  const handleSend = React35.useCallback(
+  const listRef = React36.useRef(null);
+  const [nearBottom, setNearBottom] = React36.useState(true);
+  const handleSend = React36.useCallback(
     async (text, composerAttachments) => {
       const all = composerAttachments ?? attachments;
       await onSend(text, all.length > 0 ? all : void 0);
       onClearAttachments == null ? void 0 : onClearAttachments();
-      requestAnimationFrame(() => {
-        var _a;
-        return (_a = listRef.current) == null ? void 0 : _a.scrollToBottom({ animated: true });
-      });
+      if (!nearBottom) {
+        requestAnimationFrame(() => {
+          var _a;
+          return (_a = listRef.current) == null ? void 0 : _a.scrollToBottom({ animated: true });
+        });
+      }
     },
-    [attachments, onClearAttachments, onSend]
+    [attachments, nearBottom, onClearAttachments, onSend]
   );
-  const handleScrollToBottom = React35.useCallback(() => {
+  const handleScrollToBottom = React36.useCallback(() => {
     var _a;
     (_a = listRef.current) == null ? void 0 : _a.scrollToBottom({ animated: true });
   }, []);
   const header = /* @__PURE__ */ jsx51(
     ChatHeader,
     {
-      left: /* @__PURE__ */ jsxs30(View41, { style: { flexDirection: "row", alignItems: "center" }, children: [
+      left: /* @__PURE__ */ jsxs31(View41, { style: { flexDirection: "row", alignItems: "center" }, children: [
         /* @__PURE__ */ jsx51(StudioSheetHeaderIconButton, { onPress: onBack, accessibilityLabel: "Back", style: { marginRight: 8 }, children: /* @__PURE__ */ jsx51(IconBack, { size: 20, colorToken: "floatingContent" }) }),
         onNavigateHome ? /* @__PURE__ */ jsx51(StudioSheetHeaderIconButton, { onPress: onNavigateHome, accessibilityLabel: "Home", children: /* @__PURE__ */ jsx51(IconHome, { size: 20, colorToken: "floatingContent" }) }) : null
       ] }),
-      right: /* @__PURE__ */ jsxs30(View41, { style: { flexDirection: "row", alignItems: "center" }, children: [
+      right: /* @__PURE__ */ jsxs31(View41, { style: { flexDirection: "row", alignItems: "center" }, children: [
         onStartDraw ? /* @__PURE__ */ jsx51(StudioSheetHeaderIconButton, { onPress: onStartDraw, accessibilityLabel: "Draw", intent: "danger", style: { marginRight: 8 }, children: /* @__PURE__ */ jsx51(IconDraw, { size: 20, colorToken: "onDanger" }) }) : null,
         /* @__PURE__ */ jsx51(StudioSheetHeaderIconButton, { onPress: onClose, accessibilityLabel: "Close", children: /* @__PURE__ */ jsx51(IconClose, { size: 20, colorToken: "floatingContent" }) })
       ] }),
@@ -5914,10 +6010,10 @@ function ChatPanel({
   ) : null;
   const showMessagesLoading = Boolean(loading) && messages.length === 0 || forking;
   if (showMessagesLoading) {
-    return /* @__PURE__ */ jsxs30(View41, { style: { flex: 1 }, children: [
+    return /* @__PURE__ */ jsxs31(View41, { style: { flex: 1 }, children: [
       /* @__PURE__ */ jsx51(View41, { children: header }),
       topBanner ? /* @__PURE__ */ jsx51(View41, { style: { paddingHorizontal: 16, paddingTop: 8 }, children: topBanner }) : null,
-      /* @__PURE__ */ jsxs30(View41, { style: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 24, paddingVertical: 12 }, children: [
+      /* @__PURE__ */ jsxs31(View41, { style: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 24, paddingVertical: 12 }, children: [
         /* @__PURE__ */ jsx51(ActivityIndicator8, {}),
         /* @__PURE__ */ jsx51(View41, { style: { height: 12 } }),
         /* @__PURE__ */ jsx51(Text, { variant: "bodyMuted", children: forking ? "Creating your copy\u2026" : "Loading messages\u2026" })
@@ -5943,7 +6039,10 @@ function ChatPanel({
         }
       ),
       composer: {
-        disabled: Boolean(loading) || Boolean(sendDisabled) || Boolean(forking),
+        // Keep the input editable even when sending is disallowed (e.g. agent still working),
+        // otherwise iOS will drop focus/keyboard and BottomSheet can get "stuck" with a keyboard-sized gap.
+        disabled: Boolean(loading) || Boolean(forking),
+        sendDisabled: Boolean(sendDisabled) || Boolean(loading) || Boolean(forking),
         sending: Boolean(sending),
         autoFocus: autoFocusComposer,
         onSend: handleSend,
@@ -5957,7 +6056,7 @@ function ChatPanel({
 }
 
 // src/components/dialogs/ConfirmMergeRequestDialog.tsx
-import * as React36 from "react";
+import * as React37 from "react";
 import { Pressable as Pressable14, View as View43 } from "react-native";
 
 // src/components/primitives/Modal.tsx
@@ -5966,7 +6065,7 @@ import {
   Pressable as Pressable13,
   View as View42
 } from "react-native";
-import { jsx as jsx52, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs32 } from "react/jsx-runtime";
 function Modal({
   visible,
   onRequestClose,
@@ -5982,7 +6081,7 @@ function Modal({
       transparent: true,
       animationType: "fade",
       onRequestClose,
-      children: /* @__PURE__ */ jsxs31(View42, { style: { flex: 1, backgroundColor: theme.colors.backdrop, justifyContent: "center", padding: theme.spacing.lg }, children: [
+      children: /* @__PURE__ */ jsxs32(View42, { style: { flex: 1, backgroundColor: theme.colors.backdrop, justifyContent: "center", padding: theme.spacing.lg }, children: [
         /* @__PURE__ */ jsx52(
           Pressable13,
           {
@@ -5998,7 +6097,7 @@ function Modal({
 }
 
 // src/components/dialogs/ConfirmMergeRequestDialog.tsx
-import { jsx as jsx53, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs33 } from "react/jsx-runtime";
 function ConfirmMergeRequestDialog({
   visible,
   onOpenChange,
@@ -6009,14 +6108,14 @@ function ConfirmMergeRequestDialog({
   onTestFirst
 }) {
   const theme = useTheme();
-  const close = React36.useCallback(() => onOpenChange(false), [onOpenChange]);
+  const close = React37.useCallback(() => onOpenChange(false), [onOpenChange]);
   const canConfirm = Boolean(mergeRequest) && !approveDisabled;
-  const handleConfirm = React36.useCallback(() => {
+  const handleConfirm = React37.useCallback(() => {
     if (!mergeRequest) return;
     onOpenChange(false);
     void onConfirm();
   }, [mergeRequest, onConfirm, onOpenChange]);
-  const handleTestFirst = React36.useCallback(() => {
+  const handleTestFirst = React37.useCallback(() => {
     if (!mergeRequest) return;
     onOpenChange(false);
     void onTestFirst(mergeRequest);
@@ -6028,7 +6127,7 @@ function ConfirmMergeRequestDialog({
     justifyContent: "center",
     alignSelf: "stretch"
   };
-  return /* @__PURE__ */ jsxs32(
+  return /* @__PURE__ */ jsxs33(
     Modal,
     {
       visible,
@@ -6051,7 +6150,7 @@ function ConfirmMergeRequestDialog({
             children: "Are you sure you want to approve this merge request?"
           }
         ) }),
-        /* @__PURE__ */ jsxs32(View43, { style: { marginTop: 16 }, children: [
+        /* @__PURE__ */ jsxs33(View43, { style: { marginTop: 16 }, children: [
           /* @__PURE__ */ jsx53(
             View43,
             {
@@ -6165,7 +6264,7 @@ function ConfirmMergeFlow({
 }
 
 // src/studio/ui/StudioOverlay.tsx
-import { Fragment as Fragment6, jsx as jsx55, jsxs as jsxs33 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx55, jsxs as jsxs34 } from "react/jsx-runtime";
 function StudioOverlay({
   captureTargetRef,
   app,
@@ -6196,27 +6295,27 @@ function StudioOverlay({
 }) {
   const theme = useTheme();
   const { width } = useWindowDimensions4();
-  const [sheetOpen, setSheetOpen] = React37.useState(false);
-  const [activePage, setActivePage] = React37.useState("preview");
-  const [drawing, setDrawing] = React37.useState(false);
-  const [chatAttachments, setChatAttachments] = React37.useState([]);
-  const [commentsAppId, setCommentsAppId] = React37.useState(null);
-  const [commentsCount, setCommentsCount] = React37.useState(null);
-  const [confirmMrId, setConfirmMrId] = React37.useState(null);
-  const confirmMr = React37.useMemo(
+  const [sheetOpen, setSheetOpen] = React38.useState(false);
+  const [activePage, setActivePage] = React38.useState("preview");
+  const [drawing, setDrawing] = React38.useState(false);
+  const [chatAttachments, setChatAttachments] = React38.useState([]);
+  const [commentsAppId, setCommentsAppId] = React38.useState(null);
+  const [commentsCount, setCommentsCount] = React38.useState(null);
+  const [confirmMrId, setConfirmMrId] = React38.useState(null);
+  const confirmMr = React38.useMemo(
     () => confirmMrId ? incomingMergeRequests.find((m) => m.id === confirmMrId) ?? null : null,
     [confirmMrId, incomingMergeRequests]
   );
-  const closeSheet = React37.useCallback(() => {
+  const closeSheet = React38.useCallback(() => {
     setSheetOpen(false);
     Keyboard5.dismiss();
   }, []);
-  const openSheet = React37.useCallback(() => setSheetOpen(true), []);
-  const goToChat = React37.useCallback(() => {
+  const openSheet = React38.useCallback(() => setSheetOpen(true), []);
+  const goToChat = React38.useCallback(() => {
     setActivePage("chat");
     openSheet();
   }, [openSheet]);
-  const backToPreview = React37.useCallback(() => {
+  const backToPreview = React38.useCallback(() => {
     if (Platform7.OS !== "ios") {
       Keyboard5.dismiss();
       setActivePage("preview");
@@ -6234,11 +6333,11 @@ function StudioOverlay({
     const t = setTimeout(finalize, 350);
     Keyboard5.dismiss();
   }, []);
-  const startDraw = React37.useCallback(() => {
+  const startDraw = React38.useCallback(() => {
     setDrawing(true);
     closeSheet();
   }, [closeSheet]);
-  const handleDrawCapture = React37.useCallback(
+  const handleDrawCapture = React38.useCallback(
     (dataUrl) => {
       setChatAttachments((prev) => [...prev, dataUrl]);
       setDrawing(false);
@@ -6247,7 +6346,7 @@ function StudioOverlay({
     },
     [openSheet]
   );
-  const toggleSheet = React37.useCallback(async () => {
+  const toggleSheet = React38.useCallback(async () => {
     if (!sheetOpen) {
       const shouldExitTest = Boolean(testingMrId) || isTesting;
       if (shouldExitTest) {
@@ -6259,7 +6358,7 @@ function StudioOverlay({
       closeSheet();
     }
   }, [closeSheet, isTesting, onRestoreBase, sheetOpen, testingMrId]);
-  const handleTestMr = React37.useCallback(
+  const handleTestMr = React38.useCallback(
     async (mr) => {
       if (!onTestMr) return;
       await onTestMr(mr);
@@ -6267,7 +6366,7 @@ function StudioOverlay({
     },
     [closeSheet, onTestMr]
   );
-  return /* @__PURE__ */ jsxs33(Fragment6, { children: [
+  return /* @__PURE__ */ jsxs34(Fragment6, { children: [
     /* @__PURE__ */ jsx55(EdgeGlowFrame, { visible: isTesting, role: "accent", thickness: 40, intensity: 1 }),
     /* @__PURE__ */ jsx55(StudioBottomSheet, { open: sheetOpen, onOpenChange: setSheetOpen, children: /* @__PURE__ */ jsx55(
       StudioSheetPager,
@@ -6369,7 +6468,7 @@ function StudioOverlay({
 }
 
 // src/studio/ComergeStudio.tsx
-import { jsx as jsx56, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx56, jsxs as jsxs35 } from "react/jsx-runtime";
 function ComergeStudio({
   appId,
   apiKey,
@@ -6377,16 +6476,16 @@ function ComergeStudio({
   onNavigateHome,
   style
 }) {
-  const [activeAppId, setActiveAppId] = React38.useState(appId);
-  const [runtimeAppId, setRuntimeAppId] = React38.useState(appId);
-  const [pendingRuntimeTargetAppId, setPendingRuntimeTargetAppId] = React38.useState(null);
-  const platform = React38.useMemo(() => RNPlatform.OS === "ios" ? "ios" : "android", []);
-  React38.useEffect(() => {
+  const [activeAppId, setActiveAppId] = React39.useState(appId);
+  const [runtimeAppId, setRuntimeAppId] = React39.useState(appId);
+  const [pendingRuntimeTargetAppId, setPendingRuntimeTargetAppId] = React39.useState(null);
+  const platform = React39.useMemo(() => RNPlatform.OS === "ios" ? "ios" : "android", []);
+  React39.useEffect(() => {
     setActiveAppId(appId);
     setRuntimeAppId(appId);
     setPendingRuntimeTargetAppId(null);
   }, [appId]);
-  const captureTargetRef = React38.useRef(null);
+  const captureTargetRef = React39.useRef(null);
   return /* @__PURE__ */ jsx56(StudioBootstrap, { apiKey, children: ({ userId }) => /* @__PURE__ */ jsx56(BottomSheetModalProvider, { children: /* @__PURE__ */ jsx56(
     ComergeStudioInner,
     {
@@ -6422,11 +6521,11 @@ function ComergeStudioInner({
   const { app, loading: appLoading } = useApp(activeAppId);
   const { app: runtimeAppFromHook } = useApp(runtimeAppId, { enabled: runtimeAppId !== activeAppId });
   const runtimeApp = runtimeAppId === activeAppId ? app : runtimeAppFromHook;
-  const sawEditingOnPendingTargetRef = React38.useRef(false);
-  React38.useEffect(() => {
+  const sawEditingOnPendingTargetRef = React39.useRef(false);
+  React39.useEffect(() => {
     sawEditingOnPendingTargetRef.current = false;
   }, [pendingRuntimeTargetAppId]);
-  React38.useEffect(() => {
+  React39.useEffect(() => {
     if (!pendingRuntimeTargetAppId) return;
     if (activeAppId !== pendingRuntimeTargetAppId) return;
     if ((app == null ? void 0 : app.status) === "editing") {
@@ -6446,10 +6545,10 @@ function ComergeStudioInner({
   const threadId = (app == null ? void 0 : app.threadId) ?? "";
   const thread = useThreadMessages(threadId);
   const mergeRequests = useMergeRequests({ appId: activeAppId });
-  const hasOpenOutgoingMr = React38.useMemo(() => {
+  const hasOpenOutgoingMr = React39.useMemo(() => {
     return mergeRequests.lists.outgoing.some((mr) => mr.status === "open");
   }, [mergeRequests.lists.outgoing]);
-  const incomingReviewMrs = React38.useMemo(() => {
+  const incomingReviewMrs = React39.useMemo(() => {
     if (!userId) return mergeRequests.lists.incoming;
     return mergeRequests.lists.incoming.filter((mr) => mr.createdBy !== userId);
   }, [mergeRequests.lists.incoming, userId]);
@@ -6471,16 +6570,16 @@ function ComergeStudioInner({
     uploadAttachments: uploader.uploadBase64Images
   });
   const chatSendDisabled = hasNoOutcomeAfterLastHuman(thread.raw);
-  const [processingMrId, setProcessingMrId] = React38.useState(null);
-  const [testingMrId, setTestingMrId] = React38.useState(null);
-  const chatShowTypingIndicator = React38.useMemo(() => {
+  const [processingMrId, setProcessingMrId] = React39.useState(null);
+  const [testingMrId, setTestingMrId] = React39.useState(null);
+  const chatShowTypingIndicator = React39.useMemo(() => {
     var _a;
     if (!thread.raw || thread.raw.length === 0) return false;
     const last = thread.raw[thread.raw.length - 1];
     const payloadType = typeof ((_a = last.payload) == null ? void 0 : _a.type) === "string" ? String(last.payload.type) : void 0;
     return payloadType !== "outcome";
   }, [thread.raw]);
-  return /* @__PURE__ */ jsx56(View45, { style: [{ flex: 1 }, style], children: /* @__PURE__ */ jsxs34(View45, { ref: captureTargetRef, style: { flex: 1 }, collapsable: false, children: [
+  return /* @__PURE__ */ jsx56(View45, { style: [{ flex: 1 }, style], children: /* @__PURE__ */ jsxs35(View45, { ref: captureTargetRef, style: { flex: 1 }, collapsable: false, children: [
     /* @__PURE__ */ jsx56(RuntimeRenderer, { appKey, bundlePath: bundle.bundlePath, renderToken: bundle.renderToken }),
     /* @__PURE__ */ jsx56(
       StudioOverlay,