@comergehq/studio 0.1.15 → 0.1.17

package/dist/index.js

@@ -36,8 +36,8 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/studio/ComergeStudio.tsx
-var React43 = __toESM(require("react"));
-var import_react_native55 = require("react-native");
+var React46 = __toESM(require("react"));
+var import_react_native56 = require("react-native");
 var import_bottom_sheet6 = require("@gorhom/bottom-sheet");
 
 // src/studio/bootstrap/StudioBootstrap.tsx
@@ -846,6 +846,35 @@ function extractMeta(payload) {
     threadId: typeof obj.threadId === "string" ? obj.threadId : void 0
   };
 }
+function getPayloadMeta(payload) {
+  const meta = payload == null ? void 0 : payload.meta;
+  if (!meta || typeof meta !== "object") return null;
+  return meta;
+}
+function isQueuedHiddenMessage(m) {
+  if (m.authorType !== "human") return false;
+  const meta = getPayloadMeta(m.payload);
+  return (meta == null ? void 0 : meta.visibility) === "queued";
+}
+function toEpochMs(value) {
+  if (value == null) return 0;
+  if (typeof value === "number") return value;
+  if (value instanceof Date) return value.getTime();
+  const parsed = Date.parse(String(value));
+  return Number.isFinite(parsed) ? parsed : 0;
+}
+function getEffectiveSortMs(m) {
+  const meta = getPayloadMeta(m.payload);
+  const runStartedAt = meta == null ? void 0 : meta.runStartedAt;
+  const runMs = toEpochMs(runStartedAt);
+  return runMs > 0 ? runMs : toEpochMs(m.createdAt);
+}
+function compareMessages(a, b) {
+  const aMs = getEffectiveSortMs(a);
+  const bMs = getEffectiveSortMs(b);
+  if (aMs !== bMs) return aMs - bMs;
+  return String(a.createdAt).localeCompare(String(b.createdAt));
+}
 function mapMessageToChatMessage(m) {
   var _a, _b;
   const kind = typeof ((_a = m.payload) == null ? void 0 : _a.type) === "string" ? String(m.payload.type) : null;
@@ -865,8 +894,9 @@ function useThreadMessages(threadId) {
   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)));
+    const next = prev.filter((x) => x.id !== m.id);
+    next.push(m);
+    next.sort(compareMessages);
     return next;
   }, []);
   const refetch = React4.useCallback(async () => {
@@ -880,7 +910,7 @@ function useThreadMessages(threadId) {
     try {
       const list = await messagesRepository.list(threadId);
       if (activeRequestIdRef.current !== requestId) return;
-      setRaw([...list].sort((a, b) => String(a.createdAt).localeCompare(String(b.createdAt))));
+      setRaw([...list].sort(compareMessages));
     } catch (e) {
       if (activeRequestIdRef.current !== requestId) return;
       setError(e instanceof Error ? e : new Error(String(e)));
@@ -906,7 +936,11 @@ function useThreadMessages(threadId) {
     if (foregroundSignal <= 0) return;
     void refetch();
   }, [foregroundSignal, refetch, threadId]);
-  const messages = React4.useMemo(() => raw.map(mapMessageToChatMessage), [raw]);
+  const messages = React4.useMemo(() => {
+    const visible = raw.filter((m) => !isQueuedHiddenMessage(m));
+    const resolved = visible.length > 0 ? visible : raw;
+    return resolved.map(mapMessageToChatMessage);
+  }, [raw]);
   return { raw, messages, loading, error, refetch };
 }
 
@@ -1932,6 +1966,9 @@ function useStudioActions({
   userId,
   app,
   onForkedApp,
+  onEditStart,
+  onEditQueued,
+  onEditFinished,
   uploadAttachments
 }) {
   const [forking, setForking] = React8.useState(false);
@@ -1958,16 +1995,21 @@ function useStudioActions({
         setForking(false);
         const threadId = targetApp.threadId;
         if (!threadId) throw new Error("No thread available for this app.");
+        onEditStart == null ? void 0 : onEditStart();
         let attachmentMetas;
         if (attachments && attachments.length > 0 && uploadAttachments) {
           attachmentMetas = await uploadAttachments({ threadId, appId: targetApp.id, dataUrls: attachments });
         }
-        await agentRepository.editApp({
+        const editResult = await agentRepository.editApp({
           prompt,
           thread_id: threadId,
           app_id: targetApp.id,
           attachments: attachmentMetas && attachmentMetas.length > 0 ? attachmentMetas : void 0
         });
+        onEditQueued == null ? void 0 : onEditQueued({
+          queueItemId: editResult.queueItemId ?? null,
+          queuePosition: editResult.queuePosition ?? null
+        });
       } catch (e) {
         const err = e instanceof Error ? e : new Error(String(e));
         setError(err);
@@ -1975,32 +2017,14 @@ function useStudioActions({
       } finally {
         setForking(false);
         setSending(false);
+        onEditFinished == null ? void 0 : onEditFinished();
       }
     },
-    [app, onForkedApp, sending, shouldForkOnEdit, uploadAttachments, userId]
+    [app, onEditFinished, onEditQueued, onEditStart, onForkedApp, sending, shouldForkOnEdit, uploadAttachments, userId]
   );
   return { isOwner, shouldForkOnEdit, forking, sending, error, sendEdit };
 }
 
-// src/studio/lib/chat.ts
-function hasNoOutcomeAfterLastHuman(messages) {
-  if (!messages || messages.length === 0) return false;
-  let lastHumanIndex = -1;
-  for (let i = messages.length - 1; i >= 0; i -= 1) {
-    if (messages[i].authorType === "human") {
-      lastHumanIndex = i;
-      break;
-    }
-  }
-  if (lastHumanIndex === -1) return false;
-  for (let i = lastHumanIndex + 1; i < messages.length; i += 1) {
-    const m = messages[i];
-    const payload = m.payload;
-    if (m.authorType === "ai" && (payload == null ? void 0 : payload.type) === "outcome") return false;
-  }
-  return true;
-}
-
 // src/studio/ui/RuntimeRenderer.tsx
 var React9 = __toESM(require("react"));
 var import_react_native6 = require("react-native");
@@ -2038,8 +2062,8 @@ function RuntimeRenderer({
 }
 
 // src/studio/ui/StudioOverlay.tsx
-var React42 = __toESM(require("react"));
-var import_react_native54 = require("react-native");
+var React43 = __toESM(require("react"));
+var import_react_native55 = require("react-native");
 
 // src/components/studio-sheet/StudioBottomSheet.tsx
 var React12 = __toESM(require("react"));
@@ -5843,8 +5867,8 @@ function PreviewPanel({
 }
 
 // src/studio/ui/ChatPanel.tsx
-var React39 = __toESM(require("react"));
-var import_react_native51 = require("react-native");
+var React40 = __toESM(require("react"));
+var import_react_native52 = require("react-native");
 
 // src/components/chat/ChatPage.tsx
 var React37 = __toESM(require("react"));
@@ -6041,6 +6065,7 @@ function ChatPage({
   showTypingIndicator,
   renderMessageContent,
   topBanner,
+  composerTop,
   composer,
   overlay,
   style,
@@ -6051,6 +6076,7 @@ function ChatPage({
   const theme = useTheme();
   const insets = (0, import_react_native_safe_area_context4.useSafeAreaInsets)();
   const [composerHeight, setComposerHeight] = React37.useState(0);
+  const [composerTopHeight, setComposerTopHeight] = React37.useState(0);
   const [keyboardVisible, setKeyboardVisible] = React37.useState(false);
   React37.useEffect(() => {
     if (import_react_native47.Platform.OS !== "ios") return;
@@ -6062,8 +6088,9 @@ function ChatPage({
     };
   }, []);
   const footerBottomPadding = import_react_native47.Platform.OS === "ios" ? keyboardVisible ? 0 : insets.bottom : insets.bottom + 10;
-  const overlayBottom = composerHeight + footerBottomPadding + theme.spacing.lg;
-  const bottomInset = composerHeight + footerBottomPadding + theme.spacing.xl;
+  const totalComposerHeight = composerHeight + composerTopHeight;
+  const overlayBottom = totalComposerHeight + footerBottomPadding + theme.spacing.lg;
+  const bottomInset = totalComposerHeight + footerBottomPadding + theme.spacing.xl;
   const resolvedOverlay = React37.useMemo(() => {
     var _a;
     if (!overlay) return null;
@@ -6073,6 +6100,10 @@ function ChatPage({
       style: [prevStyle, { bottom: overlayBottom }]
     });
   }, [overlay, overlayBottom]);
+  React37.useEffect(() => {
+    if (composerTop) return;
+    setComposerTopHeight(0);
+  }, [composerTop]);
   return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_react_native47.View, { style: [{ flex: 1 }, style], children: [
     header ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_react_native47.View, { children: header }) : null,
     topBanner ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_react_native47.View, { style: { paddingHorizontal: theme.spacing.lg, paddingTop: theme.spacing.sm }, children: topBanner }) : null,
@@ -6097,7 +6128,7 @@ function ChatPage({
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
         import_react_native47.View,
         {
           style: {
@@ -6109,14 +6140,24 @@ function ChatPage({
             paddingTop: theme.spacing.sm,
             paddingBottom: footerBottomPadding
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
-            ChatComposer,
-            {
-              ...composer,
-              attachments: composer.attachments ?? [],
-              onLayout: ({ height }) => setComposerHeight(height)
-            }
-          )
+          children: [
+            composerTop ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+              import_react_native47.View,
+              {
+                style: { marginBottom: theme.spacing.sm },
+                onLayout: (e) => setComposerTopHeight(e.nativeEvent.layout.height),
+                children: composerTop
+              }
+            ) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+              ChatComposer,
+              {
+                ...composer,
+                attachments: composer.attachments ?? [],
+                onLayout: ({ height }) => setComposerHeight(height)
+              }
+            )
+          ]
         }
       )
     ] })
@@ -6266,8 +6307,154 @@ function ForkNoticeBanner({ isOwner = true, title, description, style }) {
   );
 }
 
-// src/studio/ui/ChatPanel.tsx
+// src/components/chat/ChatQueue.tsx
+var React39 = __toESM(require("react"));
+var import_react_native51 = require("react-native");
 var import_jsx_runtime53 = require("react/jsx-runtime");
+function ChatQueue({ items, onRemove }) {
+  const theme = useTheme();
+  const [expanded, setExpanded] = React39.useState({});
+  const [canExpand, setCanExpand] = React39.useState({});
+  const [collapsedText, setCollapsedText] = React39.useState({});
+  const [removing, setRemoving] = React39.useState({});
+  const buildCollapsedText = React39.useCallback((lines) => {
+    var _a, _b;
+    const line1 = ((_a = lines[0]) == null ? void 0 : _a.text) ?? "";
+    const line2 = ((_b = lines[1]) == null ? void 0 : _b.text) ?? "";
+    const moreLabel = "more";
+    const reserve = `\u2026 ${moreLabel}`.length;
+    let trimmedLine2 = line2;
+    if (trimmedLine2.length > reserve) {
+      trimmedLine2 = trimmedLine2.slice(0, Math.max(0, trimmedLine2.length - reserve));
+    } else {
+      trimmedLine2 = "";
+    }
+    trimmedLine2 = trimmedLine2.replace(/\s+$/, "");
+    return `${line1}
+${trimmedLine2}\u2026 `;
+  }, []);
+  React39.useEffect(() => {
+    if (items.length === 0) return;
+    const ids = new Set(items.map((item) => item.id));
+    setExpanded((prev) => Object.fromEntries(Object.entries(prev).filter(([id]) => ids.has(id))));
+    setCanExpand((prev) => Object.fromEntries(Object.entries(prev).filter(([id]) => ids.has(id))));
+    setCollapsedText((prev) => Object.fromEntries(Object.entries(prev).filter(([id]) => ids.has(id))));
+    setRemoving((prev) => Object.fromEntries(Object.entries(prev).filter(([id]) => ids.has(id))));
+  }, [items]);
+  if (items.length === 0) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
+    import_react_native51.View,
+    {
+      style: {
+        borderWidth: 1,
+        borderColor: theme.colors.border,
+        borderRadius: theme.radii.lg,
+        marginHorizontal: theme.spacing.md,
+        padding: theme.spacing.md,
+        backgroundColor: "transparent"
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Text, { variant: "caption", style: { marginBottom: theme.spacing.sm }, children: "Queue" }),
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_native51.View, { style: { gap: theme.spacing.sm }, children: items.map((item) => {
+          const isExpanded = Boolean(expanded[item.id]);
+          const showToggle = Boolean(canExpand[item.id]);
+          const prompt = item.prompt ?? "";
+          const moreLabel = "more";
+          const displayPrompt = !isExpanded && showToggle && collapsedText[item.id] ? collapsedText[item.id] : prompt;
+          const isRemoving = Boolean(removing[item.id]);
+          return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
+            import_react_native51.View,
+            {
+              style: {
+                flexDirection: "row",
+                alignItems: "flex-start",
+                gap: theme.spacing.sm,
+                paddingHorizontal: theme.spacing.md,
+                paddingVertical: theme.spacing.sm,
+                borderRadius: theme.radii.md,
+                backgroundColor: withAlpha(theme.colors.surface, theme.scheme === "dark" ? 0.8 : 0.9)
+              },
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_react_native51.View, { style: { flex: 1 }, children: [
+                  !canExpand[item.id] ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+                    Text,
+                    {
+                      style: { position: "absolute", opacity: 0, zIndex: -1, width: "100%" },
+                      onTextLayout: (e) => {
+                        var _a;
+                        const lines = (_a = e.nativeEvent) == null ? void 0 : _a.lines;
+                        if (!lines) return;
+                        if (lines.length > 2) {
+                          setCanExpand((prev) => ({ ...prev, [item.id]: true }));
+                          setCollapsedText((prev) => ({
+                            ...prev,
+                            [item.id]: buildCollapsedText(lines)
+                          }));
+                        }
+                      },
+                      children: prompt
+                    }
+                  ) : null,
+                  /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
+                    Text,
+                    {
+                      variant: "bodyMuted",
+                      numberOfLines: isExpanded ? void 0 : 2,
+                      children: [
+                        displayPrompt,
+                        !isExpanded && showToggle ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+                          Text,
+                          {
+                            color: theme.colors.text,
+                            onPress: () => setExpanded((prev) => ({ ...prev, [item.id]: true })),
+                            suppressHighlighting: true,
+                            children: moreLabel
+                          }
+                        ) : null
+                      ]
+                    }
+                  ),
+                  showToggle && isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+                    import_react_native51.Pressable,
+                    {
+                      onPress: () => setExpanded((prev) => ({ ...prev, [item.id]: false })),
+                      hitSlop: 6,
+                      style: { alignSelf: "flex-start", marginTop: 4 },
+                      children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Text, { variant: "captionMuted", color: theme.colors.text, children: "less" })
+                    }
+                  ) : null
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+                  import_react_native51.Pressable,
+                  {
+                    onPress: () => {
+                      if (!onRemove || isRemoving) return;
+                      setRemoving((prev) => ({ ...prev, [item.id]: true }));
+                      Promise.resolve(onRemove(item.id)).finally(() => {
+                        setRemoving((prev) => {
+                          if (!prev[item.id]) return prev;
+                          const { [item.id]: _removed, ...rest } = prev;
+                          return rest;
+                        });
+                      });
+                    },
+                    hitSlop: 8,
+                    style: { alignSelf: "center" },
+                    children: isRemoving ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_native51.ActivityIndicator, { size: "small", color: theme.colors.text }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(IconClose, { size: 14, colorToken: "text" })
+                  }
+                )
+              ]
+            },
+            item.id
+          );
+        }) })
+      ]
+    }
+  );
+}
+
+// src/studio/ui/ChatPanel.tsx
+var import_jsx_runtime54 = require("react/jsx-runtime");
 function ChatPanel({
   title = "Chat",
   autoFocusComposer = false,
@@ -6285,11 +6472,13 @@ function ChatPanel({
   onClose,
   onNavigateHome,
   onStartDraw,
-  onSend
+  onSend,
+  queueItems = [],
+  onRemoveQueueItem
 }) {
-  const listRef = React39.useRef(null);
-  const [nearBottom, setNearBottom] = React39.useState(true);
-  const handleSend = React39.useCallback(
+  const listRef = React40.useRef(null);
+  const [nearBottom, setNearBottom] = React40.useState(true);
+  const handleSend = React40.useCallback(
     async (text, composerAttachments) => {
       const all = composerAttachments ?? attachments;
       await onSend(text, all.length > 0 ? all : void 0);
@@ -6303,25 +6492,25 @@ function ChatPanel({
     },
     [attachments, nearBottom, onClearAttachments, onSend]
   );
-  const handleScrollToBottom = React39.useCallback(() => {
+  const handleScrollToBottom = React40.useCallback(() => {
     var _a;
     (_a = listRef.current) == null ? void 0 : _a.scrollToBottom({ animated: true });
   }, []);
-  const header = /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+  const header = /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     ChatHeader,
     {
-      left: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_react_native51.View, { style: { flexDirection: "row", alignItems: "center" }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(StudioSheetHeaderIconButton, { onPress: onBack, accessibilityLabel: "Back", style: { marginRight: 8 }, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(IconBack, { size: 20, colorToken: "floatingContent" }) }),
-        onNavigateHome ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(StudioSheetHeaderIconButton, { onPress: onNavigateHome, accessibilityLabel: "Home", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(IconHome, { size: 20, colorToken: "floatingContent" }) }) : null
+      left: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_react_native52.View, { style: { flexDirection: "row", alignItems: "center" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(StudioSheetHeaderIconButton, { onPress: onBack, accessibilityLabel: "Back", style: { marginRight: 8 }, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(IconBack, { size: 20, colorToken: "floatingContent" }) }),
+        onNavigateHome ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(StudioSheetHeaderIconButton, { onPress: onNavigateHome, accessibilityLabel: "Home", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(IconHome, { size: 20, colorToken: "floatingContent" }) }) : null
       ] }),
-      right: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_react_native51.View, { style: { flexDirection: "row", alignItems: "center" }, children: [
-        onStartDraw ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(StudioSheetHeaderIconButton, { onPress: onStartDraw, accessibilityLabel: "Draw", intent: "danger", style: { marginRight: 8 }, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(IconDraw, { size: 20, colorToken: "onDanger" }) }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(StudioSheetHeaderIconButton, { onPress: onClose, accessibilityLabel: "Close", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(IconClose, { size: 20, colorToken: "floatingContent" }) })
+      right: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_react_native52.View, { style: { flexDirection: "row", alignItems: "center" }, children: [
+        onStartDraw ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(StudioSheetHeaderIconButton, { onPress: onStartDraw, accessibilityLabel: "Draw", intent: "danger", style: { marginRight: 8 }, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(IconDraw, { size: 20, colorToken: "onDanger" }) }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(StudioSheetHeaderIconButton, { onPress: onClose, accessibilityLabel: "Close", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(IconClose, { size: 20, colorToken: "floatingContent" }) })
       ] }),
       center: null
     }
   );
-  const topBanner = shouldForkOnEdit ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+  const topBanner = shouldForkOnEdit ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     ForkNoticeBanner,
     {
       isOwner: !shouldForkOnEdit,
@@ -6330,33 +6519,35 @@ function ChatPanel({
   ) : null;
   const showMessagesLoading = Boolean(loading) && messages.length === 0 || forking;
   if (showMessagesLoading) {
-    return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_react_native51.View, { style: { flex: 1 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_native51.View, { children: header }),
-      topBanner ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_native51.View, { style: { paddingHorizontal: 16, paddingTop: 8 }, children: topBanner }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_react_native51.View, { style: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 24, paddingVertical: 12 }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_native51.ActivityIndicator, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_native51.View, { style: { height: 12 } }),
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Text, { variant: "bodyMuted", children: forking ? "Creating your copy\u2026" : "Loading messages\u2026" })
+    return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_react_native52.View, { style: { flex: 1 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_native52.View, { children: header }),
+      topBanner ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_native52.View, { style: { paddingHorizontal: 16, paddingTop: 8 }, children: topBanner }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_react_native52.View, { style: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 24, paddingVertical: 12 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_native52.ActivityIndicator, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_native52.View, { style: { height: 12 } }),
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Text, { variant: "bodyMuted", children: forking ? "Creating your copy\u2026" : "Loading messages\u2026" })
       ] })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+  const queueTop = queueItems.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ChatQueue, { items: queueItems, onRemove: onRemoveQueueItem }) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     ChatPage,
     {
       header,
       messages,
       showTypingIndicator,
       topBanner,
+      composerTop: queueTop,
       composerHorizontalPadding: 0,
       listRef,
       onNearBottomChange: setNearBottom,
-      overlay: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+      overlay: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
         ScrollToBottomButton,
         {
           visible: !nearBottom,
           onPress: handleScrollToBottom,
           style: { bottom: 80 },
-          children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(IconArrowDown, { size: 20, colorToken: "floatingContent" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(IconArrowDown, { size: 20, colorToken: "floatingContent" })
         }
       ),
       composer: {
@@ -6377,12 +6568,12 @@ function ChatPanel({
 }
 
 // src/components/dialogs/ConfirmMergeRequestDialog.tsx
-var React40 = __toESM(require("react"));
-var import_react_native53 = require("react-native");
+var React41 = __toESM(require("react"));
+var import_react_native54 = require("react-native");
 
 // src/components/primitives/Modal.tsx
-var import_react_native52 = require("react-native");
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_react_native53 = require("react-native");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 function Modal({
   visible,
   onRequestClose,
@@ -6391,30 +6582,30 @@ function Modal({
   contentStyle
 }) {
   const theme = useTheme();
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
-    import_react_native52.Modal,
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    import_react_native53.Modal,
     {
       visible,
       transparent: true,
       animationType: "fade",
       onRequestClose,
-      children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_react_native52.View, { style: { flex: 1, backgroundColor: theme.colors.backdrop, justifyContent: "center", padding: theme.spacing.lg }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
-          import_react_native52.Pressable,
+      children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_react_native53.View, { style: { flex: 1, backgroundColor: theme.colors.backdrop, justifyContent: "center", padding: theme.spacing.lg }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+          import_react_native53.Pressable,
           {
             accessibilityRole: "button",
             onPress: dismissOnBackdropPress ? onRequestClose : void 0,
             style: { position: "absolute", inset: 0 }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Card, { variant: "surfaceRaised", padded: true, style: [{ borderRadius: theme.radii.xl }, contentStyle], children })
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Card, { variant: "surfaceRaised", padded: true, style: [{ borderRadius: theme.radii.xl }, contentStyle], children })
       ] })
     }
   );
 }
 
 // src/components/dialogs/ConfirmMergeRequestDialog.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 function ConfirmMergeRequestDialog({
   visible,
   onOpenChange,
@@ -6425,14 +6616,14 @@ function ConfirmMergeRequestDialog({
   onTestFirst
 }) {
   const theme = useTheme();
-  const close = React40.useCallback(() => onOpenChange(false), [onOpenChange]);
+  const close = React41.useCallback(() => onOpenChange(false), [onOpenChange]);
   const canConfirm = Boolean(mergeRequest) && !approveDisabled;
-  const handleConfirm = React40.useCallback(() => {
+  const handleConfirm = React41.useCallback(() => {
     if (!mergeRequest) return;
     onOpenChange(false);
     void onConfirm();
   }, [mergeRequest, onConfirm, onOpenChange]);
-  const handleTestFirst = React40.useCallback(() => {
+  const handleTestFirst = React41.useCallback(() => {
     if (!mergeRequest) return;
     onOpenChange(false);
     void onTestFirst(mergeRequest);
@@ -6444,7 +6635,7 @@ function ConfirmMergeRequestDialog({
     justifyContent: "center",
     alignSelf: "stretch"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
     Modal,
     {
       visible,
@@ -6455,7 +6646,7 @@ function ConfirmMergeRequestDialog({
         backgroundColor: theme.colors.background
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react_native53.View, { children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react_native54.View, { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
           Text,
           {
             style: {
@@ -6467,9 +6658,9 @@ function ConfirmMergeRequestDialog({
             children: "Are you sure you want to approve this merge request?"
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_react_native53.View, { style: { marginTop: 16 }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-            import_react_native53.View,
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_react_native54.View, { style: { marginTop: 16 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+            import_react_native54.View,
             {
               style: [
                 fullWidthButtonBase,
@@ -6478,22 +6669,22 @@ function ConfirmMergeRequestDialog({
                   opacity: canConfirm ? 1 : 0.5
                 }
               ],
-              children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-                import_react_native53.Pressable,
+              children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+                import_react_native54.Pressable,
                 {
                   accessibilityRole: "button",
                   accessibilityLabel: "Approve Merge",
                   disabled: !canConfirm,
                   onPress: handleConfirm,
                   style: [fullWidthButtonBase, { flex: 1 }],
-                  children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Text, { style: { textAlign: "center", color: theme.colors.onPrimary }, children: "Approve Merge" })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Text, { style: { textAlign: "center", color: theme.colors.onPrimary }, children: "Approve Merge" })
                 }
               )
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react_native53.View, { style: { height: 8 } }),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-            import_react_native53.View,
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react_native54.View, { style: { height: 8 } }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+            import_react_native54.View,
             {
               style: [
                 fullWidthButtonBase,
@@ -6504,22 +6695,22 @@ function ConfirmMergeRequestDialog({
                   opacity: isBuilding || !mergeRequest ? 0.5 : 1
                 }
               ],
-              children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-                import_react_native53.Pressable,
+              children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+                import_react_native54.Pressable,
                 {
                   accessibilityRole: "button",
                   accessibilityLabel: isBuilding ? "Preparing\u2026" : "Test edits first",
                   disabled: isBuilding || !mergeRequest,
                   onPress: handleTestFirst,
                   style: [fullWidthButtonBase, { flex: 1 }],
-                  children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Text, { style: { textAlign: "center", color: theme.colors.text }, children: isBuilding ? "Preparing\u2026" : "Test edits first" })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Text, { style: { textAlign: "center", color: theme.colors.text }, children: isBuilding ? "Preparing\u2026" : "Test edits first" })
                 }
               )
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react_native53.View, { style: { height: 8 } }),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-            import_react_native53.View,
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react_native54.View, { style: { height: 8 } }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+            import_react_native54.View,
             {
               style: [
                 fullWidthButtonBase,
@@ -6529,14 +6720,14 @@ function ConfirmMergeRequestDialog({
                   borderColor: theme.colors.border
                 }
               ],
-              children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-                import_react_native53.Pressable,
+              children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+                import_react_native54.Pressable,
                 {
                   accessibilityRole: "button",
                   accessibilityLabel: "Cancel",
                   onPress: close,
                   style: [fullWidthButtonBase, { flex: 1 }],
-                  children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Text, { style: { textAlign: "center", color: theme.colors.text }, children: "Cancel" })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Text, { style: { textAlign: "center", color: theme.colors.text }, children: "Cancel" })
                 }
               )
             }
@@ -6548,7 +6739,7 @@ function ConfirmMergeRequestDialog({
 }
 
 // src/studio/ui/ConfirmMergeFlow.tsx
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 function ConfirmMergeFlow({
   visible,
   onOpenChange,
@@ -6559,7 +6750,7 @@ function ConfirmMergeFlow({
   onConfirm,
   onTestFirst
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
     ConfirmMergeRequestDialog,
     {
       visible,
@@ -6581,11 +6772,11 @@ function ConfirmMergeFlow({
 }
 
 // src/studio/hooks/useOptimisticChatMessages.ts
-var React41 = __toESM(require("react"));
+var React42 = __toESM(require("react"));
 function makeOptimisticId() {
   return `optimistic:${Date.now().toString(36)}:${Math.random().toString(36).slice(2, 10)}`;
 }
-function toEpochMs(createdAt) {
+function toEpochMs2(createdAt) {
   if (createdAt == null) return 0;
   if (typeof createdAt === "number") return createdAt;
   if (createdAt instanceof Date) return createdAt.getTime();
@@ -6604,7 +6795,7 @@ function isOptimisticResolvedByServer(chatMessages, o) {
   for (const m of candidates) {
     if (m.author !== "human") continue;
     if (normalize(m.content) !== target) continue;
-    const serverMs = toEpochMs(m.createdAt);
+    const serverMs = toEpochMs2(m.createdAt);
     const optimisticMs = Date.parse(o.createdAtIso);
     if (Number.isFinite(optimisticMs) && optimisticMs > 0 && serverMs > 0) {
       if (serverMs + 12e4 < optimisticMs) continue;
@@ -6616,14 +6807,15 @@ function isOptimisticResolvedByServer(chatMessages, o) {
 function useOptimisticChatMessages({
   threadId,
   shouldForkOnEdit,
+  disableOptimistic = false,
   chatMessages,
   onSendChat
 }) {
-  const [optimisticChat, setOptimisticChat] = React41.useState([]);
-  React41.useEffect(() => {
+  const [optimisticChat, setOptimisticChat] = React42.useState([]);
+  React42.useEffect(() => {
     setOptimisticChat([]);
   }, [threadId]);
-  const messages = React41.useMemo(() => {
+  const messages = React42.useMemo(() => {
     if (!optimisticChat || optimisticChat.length === 0) return chatMessages;
     const unresolved = optimisticChat.filter((o) => !isOptimisticResolvedByServer(chatMessages, o));
     if (unresolved.length === 0) return chatMessages;
@@ -6639,7 +6831,7 @@ function useOptimisticChatMessages({
     merged.sort((a, b) => String(a.createdAt).localeCompare(String(b.createdAt)));
     return merged;
   }, [chatMessages, optimisticChat]);
-  React41.useEffect(() => {
+  React42.useEffect(() => {
     if (optimisticChat.length === 0) return;
     setOptimisticChat((prev) => {
       if (prev.length === 0) return prev;
@@ -6647,9 +6839,9 @@ function useOptimisticChatMessages({
       return next.length === prev.length ? prev : next;
     });
   }, [chatMessages, optimisticChat.length]);
-  const onSend = React41.useCallback(
+  const onSend = React42.useCallback(
     async (text, attachments) => {
-      if (shouldForkOnEdit) {
+      if (shouldForkOnEdit || disableOptimistic) {
         await onSendChat(text, attachments);
         return;
       }
@@ -6661,14 +6853,14 @@ function useOptimisticChatMessages({
         setOptimisticChat((prev) => prev.map((m) => m.id === id ? { ...m, failed: true } : m));
       });
     },
-    [chatMessages, onSendChat, shouldForkOnEdit]
+    [chatMessages, disableOptimistic, onSendChat, shouldForkOnEdit]
   );
   return { messages, onSend };
 }
 
 // src/studio/ui/StudioOverlay.tsx
 var import_studio_control = require("@comergehq/studio-control");
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 function StudioOverlay({
   captureTargetRef,
   app,
@@ -6695,46 +6887,52 @@ function StudioOverlay({
   chatSending,
   chatShowTypingIndicator,
   onSendChat,
+  chatQueueItems,
+  onRemoveQueueItem,
   onNavigateHome,
   showBubble,
   studioControlOptions
 }) {
   const theme = useTheme();
-  const { width } = (0, import_react_native54.useWindowDimensions)();
-  const [sheetOpen, setSheetOpen] = React42.useState(false);
-  const sheetOpenRef = React42.useRef(sheetOpen);
-  const [activePage, setActivePage] = React42.useState("preview");
-  const [drawing, setDrawing] = React42.useState(false);
-  const [chatAttachments, setChatAttachments] = React42.useState([]);
-  const [commentsAppId, setCommentsAppId] = React42.useState(null);
-  const [commentsCount, setCommentsCount] = React42.useState(null);
+  const { width } = (0, import_react_native55.useWindowDimensions)();
+  const [sheetOpen, setSheetOpen] = React43.useState(false);
+  const sheetOpenRef = React43.useRef(sheetOpen);
+  const [activePage, setActivePage] = React43.useState("preview");
+  const [drawing, setDrawing] = React43.useState(false);
+  const [chatAttachments, setChatAttachments] = React43.useState([]);
+  const [commentsAppId, setCommentsAppId] = React43.useState(null);
+  const [commentsCount, setCommentsCount] = React43.useState(null);
   const threadId = (app == null ? void 0 : app.threadId) ?? null;
+  const isForking = chatForking || (app == null ? void 0 : app.status) === "forking";
+  const queueItemsForChat = isForking ? [] : chatQueueItems;
+  const disableOptimistic = Boolean(queueItemsForChat && queueItemsForChat.length > 0) || (app == null ? void 0 : app.status) === "editing";
   const optimistic = useOptimisticChatMessages({
     threadId,
     shouldForkOnEdit,
+    disableOptimistic,
     chatMessages,
     onSendChat
   });
-  const [confirmMrId, setConfirmMrId] = React42.useState(null);
-  const confirmMr = React42.useMemo(
+  const [confirmMrId, setConfirmMrId] = React43.useState(null);
+  const confirmMr = React43.useMemo(
     () => confirmMrId ? incomingMergeRequests.find((m) => m.id === confirmMrId) ?? null : null,
     [confirmMrId, incomingMergeRequests]
   );
-  const handleSheetOpenChange = React42.useCallback((open) => {
+  const handleSheetOpenChange = React43.useCallback((open) => {
     setSheetOpen(open);
-    if (!open) import_react_native54.Keyboard.dismiss();
+    if (!open) import_react_native55.Keyboard.dismiss();
   }, []);
-  const closeSheet = React42.useCallback(() => {
+  const closeSheet = React43.useCallback(() => {
     handleSheetOpenChange(false);
   }, [handleSheetOpenChange]);
-  const openSheet = React42.useCallback(() => setSheetOpen(true), []);
-  const goToChat = React42.useCallback(() => {
+  const openSheet = React43.useCallback(() => setSheetOpen(true), []);
+  const goToChat = React43.useCallback(() => {
     setActivePage("chat");
     openSheet();
   }, [openSheet]);
-  const backToPreview = React42.useCallback(() => {
-    if (import_react_native54.Platform.OS !== "ios") {
-      import_react_native54.Keyboard.dismiss();
+  const backToPreview = React43.useCallback(() => {
+    if (import_react_native55.Platform.OS !== "ios") {
+      import_react_native55.Keyboard.dismiss();
       setActivePage("preview");
       return;
     }
@@ -6746,15 +6944,15 @@ function StudioOverlay({
       clearTimeout(t);
       setActivePage("preview");
     };
-    const sub = import_react_native54.Keyboard.addListener("keyboardDidHide", finalize);
+    const sub = import_react_native55.Keyboard.addListener("keyboardDidHide", finalize);
     const t = setTimeout(finalize, 350);
-    import_react_native54.Keyboard.dismiss();
+    import_react_native55.Keyboard.dismiss();
   }, []);
-  const startDraw = React42.useCallback(() => {
+  const startDraw = React43.useCallback(() => {
     setDrawing(true);
     closeSheet();
   }, [closeSheet]);
-  const handleDrawCapture = React42.useCallback(
+  const handleDrawCapture = React43.useCallback(
     (dataUrl) => {
       setChatAttachments((prev) => [...prev, dataUrl]);
       setDrawing(false);
@@ -6763,7 +6961,7 @@ function StudioOverlay({
     },
     [openSheet]
   );
-  const toggleSheet = React42.useCallback(async () => {
+  const toggleSheet = React43.useCallback(async () => {
     if (!sheetOpen) {
       const shouldExitTest = Boolean(testingMrId) || isTesting;
       if (shouldExitTest) {
@@ -6775,7 +6973,7 @@ function StudioOverlay({
       closeSheet();
     }
   }, [closeSheet, isTesting, onRestoreBase, sheetOpen, testingMrId]);
-  const handleTestMr = React42.useCallback(
+  const handleTestMr = React43.useCallback(
     async (mr) => {
       if (!onTestMr) return;
       await onTestMr(mr);
@@ -6783,10 +6981,10 @@ function StudioOverlay({
     },
     [closeSheet, onTestMr]
   );
-  React42.useEffect(() => {
+  React43.useEffect(() => {
     sheetOpenRef.current = sheetOpen;
   }, [sheetOpen]);
-  React42.useEffect(() => {
+  React43.useEffect(() => {
     const poller = (0, import_studio_control.startStudioControlPolling)((action) => {
       if (action === "show" && !sheetOpenRef.current) openSheet();
       if (action === "hide" && sheetOpenRef.current) closeSheet();
@@ -6794,17 +6992,17 @@ function StudioOverlay({
     }, studioControlOptions);
     return () => poller.stop();
   }, [closeSheet, openSheet, studioControlOptions, toggleSheet]);
-  React42.useEffect(() => {
+  React43.useEffect(() => {
     void (0, import_studio_control.publishComergeStudioUIState)(sheetOpen, studioControlOptions);
   }, [sheetOpen, studioControlOptions]);
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(EdgeGlowFrame, { visible: isTesting, role: "accent", thickness: 40, intensity: 1 }),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(StudioBottomSheet, { open: sheetOpen, onOpenChange: handleSheetOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_jsx_runtime58.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(EdgeGlowFrame, { visible: isTesting, role: "accent", thickness: 40, intensity: 1 }),
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(StudioBottomSheet, { open: sheetOpen, onOpenChange: handleSheetOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       StudioSheetPager,
       {
         activePage,
         width,
-        preview: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+        preview: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
           PreviewPanel,
           {
             app,
@@ -6830,7 +7028,7 @@ function StudioOverlay({
             commentCountOverride: commentsCount ?? void 0
           }
         ),
-        chat: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+        chat: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
           ChatPanel,
           {
             messages: optimistic.messages,
@@ -6848,12 +7046,14 @@ function StudioOverlay({
             onClose: closeSheet,
             onNavigateHome,
             onStartDraw: startDraw,
-            onSend: optimistic.onSend
+            onSend: optimistic.onSend,
+            queueItems: queueItemsForChat,
+            onRemoveQueueItem
           }
         )
       }
     ) }),
-    showBubble && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    showBubble && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       Bubble,
       {
         visible: !sheetOpen && !drawing,
@@ -6861,10 +7061,10 @@ function StudioOverlay({
         badgeCount: incomingMergeRequests.length,
         onPress: toggleSheet,
         isLoading: (app == null ? void 0 : app.status) === "editing",
-        children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_react_native54.View, { style: { width: 28, height: 28, alignItems: "center", justifyContent: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(MergeIcon, { width: 24, height: 24, color: theme.colors.floatingContent }) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react_native55.View, { style: { width: 28, height: 28, alignItems: "center", justifyContent: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(MergeIcon, { width: 24, height: 24, color: theme.colors.floatingContent }) })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       DrawModeOverlay,
       {
         visible: drawing,
@@ -6873,7 +7073,7 @@ function StudioOverlay({
         onCapture: handleDrawCapture
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       ConfirmMergeFlow,
       {
         visible: Boolean(confirmMr),
@@ -6886,7 +7086,7 @@ function StudioOverlay({
         onTestFirst: handleTestMr
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       AppCommentsSheet,
       {
         appId: commentsAppId,
@@ -6898,8 +7098,190 @@ function StudioOverlay({
   ] });
 }
 
+// src/studio/hooks/useEditQueue.ts
+var React44 = __toESM(require("react"));
+
+// src/data/apps/edit-queue/remote.ts
+var EditQueueRemoteDataSourceImpl = class extends BaseRemote {
+  async list(appId) {
+    const { data } = await api.get(
+      `/v1/apps/${encodeURIComponent(appId)}/edit-queue`
+    );
+    return data;
+  }
+  async update(appId, queueItemId, payload) {
+    const { data } = await api.patch(
+      `/v1/apps/${encodeURIComponent(appId)}/edit-queue/${encodeURIComponent(queueItemId)}`,
+      payload
+    );
+    return data;
+  }
+  async cancel(appId, queueItemId) {
+    const { data } = await api.delete(
+      `/v1/apps/${encodeURIComponent(appId)}/edit-queue/${encodeURIComponent(queueItemId)}`
+    );
+    return data;
+  }
+};
+var editQueueRemoteDataSource = new EditQueueRemoteDataSourceImpl();
+
+// src/data/apps/edit-queue/repository.ts
+var ACTIVE_STATUSES = ["pending"];
+function toString(value) {
+  return typeof value === "string" && value.trim().length > 0 ? value : null;
+}
+function toAttachments(value) {
+  return Array.isArray(value) ? value : [];
+}
+function mapQueueItem(row) {
+  const payload = row.payload ?? {};
+  return {
+    id: row.id,
+    status: row.status,
+    prompt: toString(payload.trimmedPrompt),
+    messageId: toString(payload.messageId),
+    attachments: toAttachments(payload.attachments),
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+    runAfter: row.run_after,
+    priority: row.priority
+  };
+}
+var EditQueueRepositoryImpl = class extends BaseRepository {
+  constructor(remote) {
+    super();
+    this.remote = remote;
+  }
+  async list(appId) {
+    const res = await this.remote.list(appId);
+    const data = this.unwrapOrThrow(res);
+    return data.items ?? [];
+  }
+  async update(appId, queueItemId, payload) {
+    const res = await this.remote.update(appId, queueItemId, payload);
+    return this.unwrapOrThrow(res);
+  }
+  async cancel(appId, queueItemId) {
+    const res = await this.remote.cancel(appId, queueItemId);
+    return this.unwrapOrThrow(res);
+  }
+  subscribeEditQueue(appId, handlers) {
+    const supabase = getSupabaseClient();
+    const channel = supabase.channel(`edit-queue:app:${appId}`).on(
+      "postgres_changes",
+      { event: "INSERT", schema: "public", table: "app_job_queue", filter: `app_id=eq.${appId}` },
+      (payload) => {
+        var _a;
+        const row = payload.new;
+        if (row.kind !== "edit") return;
+        const item = mapQueueItem(row);
+        if (!ACTIVE_STATUSES.includes(item.status)) return;
+        (_a = handlers.onInsert) == null ? void 0 : _a.call(handlers, item);
+      }
+    ).on(
+      "postgres_changes",
+      { event: "UPDATE", schema: "public", table: "app_job_queue", filter: `app_id=eq.${appId}` },
+      (payload) => {
+        var _a, _b;
+        const row = payload.new;
+        if (row.kind !== "edit") return;
+        const item = mapQueueItem(row);
+        if (ACTIVE_STATUSES.includes(item.status)) (_a = handlers.onUpdate) == null ? void 0 : _a.call(handlers, item);
+        else (_b = handlers.onDelete) == null ? void 0 : _b.call(handlers, item);
+      }
+    ).on(
+      "postgres_changes",
+      { event: "DELETE", schema: "public", table: "app_job_queue", filter: `app_id=eq.${appId}` },
+      (payload) => {
+        var _a;
+        const row = payload.old;
+        if (row.kind !== "edit") return;
+        (_a = handlers.onDelete) == null ? void 0 : _a.call(handlers, mapQueueItem(row));
+      }
+    ).subscribe();
+    return () => {
+      supabase.removeChannel(channel);
+    };
+  }
+};
+var editQueueRepository = new EditQueueRepositoryImpl(
+  editQueueRemoteDataSource
+);
+
+// src/studio/hooks/useEditQueue.ts
+function useEditQueue(appId) {
+  const [items, setItems] = React44.useState([]);
+  const [loading, setLoading] = React44.useState(false);
+  const [error, setError] = React44.useState(null);
+  const activeRequestIdRef = React44.useRef(0);
+  const foregroundSignal = useForegroundSignal(Boolean(appId));
+  const upsertSorted = React44.useCallback((prev, nextItem) => {
+    const next = prev.some((x) => x.id === nextItem.id) ? prev.map((x) => x.id === nextItem.id ? nextItem : x) : [...prev, nextItem];
+    next.sort((a, b) => String(a.createdAt).localeCompare(String(b.createdAt)));
+    return next;
+  }, []);
+  const refetch = React44.useCallback(async () => {
+    if (!appId) {
+      setItems([]);
+      return;
+    }
+    const requestId = ++activeRequestIdRef.current;
+    setLoading(true);
+    setError(null);
+    try {
+      const list = await editQueueRepository.list(appId);
+      if (activeRequestIdRef.current !== requestId) return;
+      setItems([...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)));
+      setItems([]);
+    } finally {
+      if (activeRequestIdRef.current === requestId) setLoading(false);
+    }
+  }, [appId]);
+  React44.useEffect(() => {
+    void refetch();
+  }, [refetch]);
+  React44.useEffect(() => {
+    if (!appId) return;
+    const unsubscribe = editQueueRepository.subscribeEditQueue(appId, {
+      onInsert: (item) => setItems((prev) => upsertSorted(prev, item)),
+      onUpdate: (item) => setItems((prev) => upsertSorted(prev, item)),
+      onDelete: (item) => setItems((prev) => prev.filter((x) => x.id !== item.id))
+    });
+    return unsubscribe;
+  }, [appId, upsertSorted, foregroundSignal]);
+  React44.useEffect(() => {
+    if (!appId) return;
+    if (foregroundSignal <= 0) return;
+    void refetch();
+  }, [appId, foregroundSignal, refetch]);
+  return { items, loading, error, refetch };
+}
+
+// src/studio/hooks/useEditQueueActions.ts
+var React45 = __toESM(require("react"));
+function useEditQueueActions(appId) {
+  const update = React45.useCallback(
+    async (queueItemId, payload) => {
+      if (!appId) return;
+      await editQueueRepository.update(appId, queueItemId, payload);
+    },
+    [appId]
+  );
+  const cancel = React45.useCallback(
+    async (queueItemId) => {
+      if (!appId) return;
+      await editQueueRepository.cancel(appId, queueItemId);
+    },
+    [appId]
+  );
+  return { update, cancel };
+}
+
 // src/studio/ComergeStudio.tsx
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 function ComergeStudio({
   appId,
   clientKey: clientKey2,
@@ -6910,17 +7292,17 @@ function ComergeStudio({
   studioControlOptions,
   embeddedBaseBundles
 }) {
-  const [activeAppId, setActiveAppId] = React43.useState(appId);
-  const [runtimeAppId, setRuntimeAppId] = React43.useState(appId);
-  const [pendingRuntimeTargetAppId, setPendingRuntimeTargetAppId] = React43.useState(null);
-  const platform = React43.useMemo(() => import_react_native55.Platform.OS === "ios" ? "ios" : "android", []);
-  React43.useEffect(() => {
+  const [activeAppId, setActiveAppId] = React46.useState(appId);
+  const [runtimeAppId, setRuntimeAppId] = React46.useState(appId);
+  const [pendingRuntimeTargetAppId, setPendingRuntimeTargetAppId] = React46.useState(null);
+  const platform = React46.useMemo(() => import_react_native56.Platform.OS === "ios" ? "ios" : "android", []);
+  React46.useEffect(() => {
     setActiveAppId(appId);
     setRuntimeAppId(appId);
     setPendingRuntimeTargetAppId(null);
   }, [appId]);
-  const captureTargetRef = React43.useRef(null);
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(StudioBootstrap, { clientKey: clientKey2, fallback: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react_native55.View, { style: { flex: 1 } }), children: ({ userId }) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_bottom_sheet6.BottomSheetModalProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(LiquidGlassResetProvider, { resetTriggers: [appId, activeAppId, runtimeAppId], children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+  const captureTargetRef = React46.useRef(null);
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(StudioBootstrap, { clientKey: clientKey2, fallback: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_react_native56.View, { style: { flex: 1 } }), children: ({ userId }) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_bottom_sheet6.BottomSheetModalProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(LiquidGlassResetProvider, { resetTriggers: [appId, activeAppId, runtimeAppId], children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
     ComergeStudioInner,
     {
       userId,
@@ -6961,11 +7343,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 = React43.useRef(false);
-  React43.useEffect(() => {
+  const sawEditingOnPendingTargetRef = React46.useRef(false);
+  React46.useEffect(() => {
     sawEditingOnPendingTargetRef.current = false;
   }, [pendingRuntimeTargetAppId]);
-  React43.useEffect(() => {
+  React46.useEffect(() => {
     if (!pendingRuntimeTargetAppId) return;
     if (activeAppId !== pendingRuntimeTargetAppId) return;
     if ((app == null ? void 0 : app.status) === "editing") {
@@ -6983,13 +7365,13 @@ function ComergeStudioInner({
     canRequestLatest: (runtimeApp == null ? void 0 : runtimeApp.status) === "ready",
     embeddedBaseBundles
   });
-  const sawEditingOnActiveAppRef = React43.useRef(false);
-  const [showPostEditPreparing, setShowPostEditPreparing] = React43.useState(false);
-  React43.useEffect(() => {
+  const sawEditingOnActiveAppRef = React46.useRef(false);
+  const [showPostEditPreparing, setShowPostEditPreparing] = React46.useState(false);
+  React46.useEffect(() => {
     sawEditingOnActiveAppRef.current = false;
     setShowPostEditPreparing(false);
   }, [activeAppId]);
-  React43.useEffect(() => {
+  React46.useEffect(() => {
     if (!(app == null ? void 0 : app.id)) return;
     if (app.status === "editing") {
       sawEditingOnActiveAppRef.current = true;
@@ -7001,7 +7383,7 @@ function ComergeStudioInner({
       sawEditingOnActiveAppRef.current = false;
     }
   }, [app == null ? void 0 : app.id, app == null ? void 0 : app.status]);
-  React43.useEffect(() => {
+  React46.useEffect(() => {
     if (!showPostEditPreparing) return;
     const stillProcessingBaseBundle = bundle.loading && bundle.loadingMode === "base" && !bundle.isTesting;
     if (!stillProcessingBaseBundle) {
@@ -7010,15 +7392,27 @@ function ComergeStudioInner({
   }, [showPostEditPreparing, bundle.loading, bundle.loadingMode, bundle.isTesting]);
   const threadId = (app == null ? void 0 : app.threadId) ?? "";
   const thread = useThreadMessages(threadId);
+  const editQueue = useEditQueue(activeAppId);
+  const editQueueActions = useEditQueueActions(activeAppId);
+  const [lastEditQueueInfo, setLastEditQueueInfo] = React46.useState(null);
+  const lastEditQueueInfoRef = React46.useRef(null);
+  const [suppressQueueUntilResponse, setSuppressQueueUntilResponse] = React46.useState(false);
   const mergeRequests = useMergeRequests({ appId: activeAppId });
-  const hasOpenOutgoingMr = React43.useMemo(() => {
+  const hasOpenOutgoingMr = React46.useMemo(() => {
     return mergeRequests.lists.outgoing.some((mr) => mr.status === "open");
   }, [mergeRequests.lists.outgoing]);
-  const incomingReviewMrs = React43.useMemo(() => {
+  const incomingReviewMrs = React46.useMemo(() => {
     if (!userId) return mergeRequests.lists.incoming;
     return mergeRequests.lists.incoming.filter((mr) => mr.createdBy !== userId);
   }, [mergeRequests.lists.incoming, userId]);
   const uploader = useAttachmentUpload();
+  const updateLastEditQueueInfo = React46.useCallback(
+    (info) => {
+      lastEditQueueInfoRef.current = info;
+      setLastEditQueueInfo(info);
+    },
+    []
+  );
   const actions = useStudioActions({
     userId,
     app,
@@ -7033,20 +7427,62 @@ function ComergeStudioInner({
         setPendingRuntimeTargetAppId(null);
       }
     },
-    uploadAttachments: uploader.uploadBase64Images
+    uploadAttachments: uploader.uploadBase64Images,
+    onEditStart: () => {
+      if (editQueue.items.length === 0) {
+        setSuppressQueueUntilResponse(true);
+      }
+    },
+    onEditQueued: (info) => {
+      updateLastEditQueueInfo(info);
+      if (info.queuePosition !== 1) {
+        setSuppressQueueUntilResponse(false);
+      }
+    },
+    onEditFinished: () => {
+      var _a;
+      if (((_a = lastEditQueueInfoRef.current) == null ? void 0 : _a.queuePosition) !== 1) {
+        setSuppressQueueUntilResponse(false);
+      }
+    }
   });
-  const chatSendDisabled = hasNoOutcomeAfterLastHuman(thread.raw);
-  const [processingMrId, setProcessingMrId] = React43.useState(null);
-  const [testingMrId, setTestingMrId] = React43.useState(null);
-  const chatShowTypingIndicator = React43.useMemo(() => {
+  const chatSendDisabled = false;
+  const [processingMrId, setProcessingMrId] = React46.useState(null);
+  const [testingMrId, setTestingMrId] = React46.useState(null);
+  const chatShowTypingIndicator = React46.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__ */ (0, import_jsx_runtime58.jsx)(import_react_native55.View, { style: [{ flex: 1 }, style], children: /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_react_native55.View, { ref: captureTargetRef, style: { flex: 1 }, collapsable: false, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+  React46.useEffect(() => {
+    updateLastEditQueueInfo(null);
+    setSuppressQueueUntilResponse(false);
+  }, [activeAppId, updateLastEditQueueInfo]);
+  React46.useEffect(() => {
+    if (!(lastEditQueueInfo == null ? void 0 : lastEditQueueInfo.queueItemId)) return;
+    const stillPresent = editQueue.items.some((item) => item.id === lastEditQueueInfo.queueItemId);
+    if (!stillPresent) {
+      updateLastEditQueueInfo(null);
+      setSuppressQueueUntilResponse(false);
+    }
+  }, [editQueue.items, lastEditQueueInfo == null ? void 0 : lastEditQueueInfo.queueItemId]);
+  const chatQueueItems = React46.useMemo(() => {
+    var _a;
+    if (suppressQueueUntilResponse && editQueue.items.length <= 1) {
+      return [];
+    }
+    if (!lastEditQueueInfo || lastEditQueueInfo.queuePosition !== 1 || !lastEditQueueInfo.queueItemId) {
+      return editQueue.items;
+    }
+    if (editQueue.items.length === 1 && ((_a = editQueue.items[0]) == null ? void 0 : _a.id) === lastEditQueueInfo.queueItemId) {
+      return [];
+    }
+    return editQueue.items;
+  }, [editQueue.items, lastEditQueueInfo, suppressQueueUntilResponse]);
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_react_native56.View, { style: [{ flex: 1 }, style], children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_react_native56.View, { ref: captureTargetRef, style: { flex: 1 }, collapsable: false, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       RuntimeRenderer,
       {
         appKey,
@@ -7056,7 +7492,7 @@ function ComergeStudioInner({
         allowInitialPreparing: !embeddedBaseBundles
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       StudioOverlay,
       {
         captureTargetRef,
@@ -7108,6 +7544,8 @@ function ComergeStudioInner({
         chatSending: actions.sending,
         chatShowTypingIndicator,
         onSendChat: (text, attachments) => actions.sendEdit({ prompt: text, attachments }),
+        chatQueueItems,
+        onRemoveQueueItem: (id) => editQueueActions.cancel(id),
         onNavigateHome,
         showBubble,
         studioControlOptions