feat: support creating worktrees from GitHub pull requests

packages/app/src/components/agent-input-submit.test.ts

@@ -59,6 +59,51 @@ describe("submitAgentInput", () => {
     expect(clearDraft).toHaveBeenCalledWith("sent");
   });
 
+  it("preserves the composer before an in-flight submit resolves when requested", async () => {
+    const deferred = createDeferredPromise<void>();
+    const attachments = [{ id: "img-1" }];
+    const queueMessage = vi.fn();
+    const submitMessage = vi.fn(async () => {
+      await deferred.promise;
+    });
+    const clearDraft = vi.fn();
+    const setUserInput = vi.fn();
+    const setAttachments = vi.fn();
+    const setSendError = vi.fn();
+    const setIsProcessing = vi.fn();
+
+    const submitPromise = submitAgentInput({
+      message: "  keep me  ",
+      attachments,
+      submitBehavior: "preserve-and-lock",
+      isAgentRunning: false,
+      canSubmit: true,
+      queueMessage,
+      submitMessage,
+      clearDraft,
+      setUserInput,
+      setAttachments,
+      setSendError,
+      setIsProcessing,
+    });
+
+    expect(queueMessage).not.toHaveBeenCalled();
+    expect(submitMessage).toHaveBeenCalledWith({
+      message: "keep me",
+      attachments,
+    });
+    expect(setUserInput).not.toHaveBeenCalled();
+    expect(setAttachments).not.toHaveBeenCalled();
+    expect(setSendError).toHaveBeenCalledWith(null);
+    expect(setIsProcessing).toHaveBeenCalledWith(true);
+    expect(clearDraft).not.toHaveBeenCalled();
+
+    deferred.resolve();
+
+    await expect(submitPromise).resolves.toBe("submitted");
+    expect(clearDraft).toHaveBeenCalledWith("sent");
+  });
+
   it("queues while the agent is running and clears the composer immediately", async () => {
     const queueMessage = vi.fn();
     const submitMessage = vi.fn();

packages/app/src/components/agent-input-submit.ts

@@ -5,6 +5,7 @@ export interface AgentInputSubmitActionInput<TAttachment> {
   attachments: TAttachment[];
   hasExternalContent?: boolean;
   allowEmptySubmit?: boolean;
+  submitBehavior?: "clear" | "preserve-and-lock";
   forceSend?: boolean;
   isAgentRunning: boolean;
   canSubmit: boolean;
@@ -23,6 +24,7 @@ export async function submitAgentInput<TAttachment>(
 ): Promise<AgentInputSubmitResult> {
   const trimmedMessage = input.message.trim();
   const attachments = input.attachments;
+  const shouldClearOnSubmit = input.submitBehavior !== "preserve-and-lock";
 
   if (
     !trimmedMessage &&
@@ -39,14 +41,18 @@ export async function submitAgentInput<TAttachment>(
 
   if (input.isAgentRunning && !input.forceSend) {
     input.queueMessage({ message: trimmedMessage, attachments });
-    input.setUserInput("");
-    input.setAttachments([]);
+    if (shouldClearOnSubmit) {
+      input.setUserInput("");
+      input.setAttachments([]);
+    }
     return "queued";
   }
 
   // Clear immediately so optimistic stream updates and composer state stay in sync.
-  input.setUserInput("");
-  input.setAttachments([]);
+  if (shouldClearOnSubmit) {
+    input.setUserInput("");
+    input.setAttachments([]);
+  }
   input.setSendError(null);
   input.setIsProcessing(true);
 
@@ -57,8 +63,10 @@ export async function submitAgentInput<TAttachment>(
     return "submitted";
   } catch (error) {
     input.onSubmitError?.(error);
-    input.setUserInput(trimmedMessage);
-    input.setAttachments(attachments);
+    if (shouldClearOnSubmit) {
+      input.setUserInput(trimmedMessage);
+      input.setAttachments(attachments);
+    }
     input.setSendError(error instanceof Error ? error.message : "Failed to send message");
     input.setIsProcessing(false);
     return "failed";

packages/app/src/components/attachment-pill.tsx

@@ -10,6 +10,7 @@ interface AttachmentPillProps {
   onRemove: () => void;
   openAccessibilityLabel: string;
   removeAccessibilityLabel: string;
+  disabled?: boolean;
   testID?: string;
   children: ReactNode;
 }
@@ -19,6 +20,7 @@ export function AttachmentPill({
   onRemove,
   openAccessibilityLabel,
   removeAccessibilityLabel,
+  disabled = false,
   testID,
   children,
 }: AttachmentPillProps) {
@@ -33,6 +35,7 @@ export function AttachmentPill({
       <Pressable
         testID={testID}
         onPress={onOpen}
+        disabled={disabled}
         onHoverIn={() => setIsBodyHovered(true)}
         onHoverOut={() => setIsBodyHovered(false)}
         accessibilityRole="button"
@@ -43,6 +46,7 @@ export function AttachmentPill({
       </Pressable>
       <Pressable
         onPress={onRemove}
+        disabled={disabled}
         onHoverIn={() => setIsCloseHovered(true)}
         onHoverOut={() => setIsCloseHovered(false)}
         hitSlop={8}

packages/app/src/components/composer.test.tsx

@@ -176,7 +176,7 @@ vi.mock("lucide-react-native", () => {
   const createIcon = (name: string) => (props: Record<string, unknown>) =>
     React.createElement("span", { ...props, "data-icon": name });
   return {
-    ArrowUp: createIcon("ArrowUp"),
+    CornerDownLeft: createIcon("CornerDownLeft"),
     Square: createIcon("Square"),
     Pencil: createIcon("Pencil"),
     AudioLines: createIcon("AudioLines"),
@@ -579,9 +579,13 @@ function imageAttachment(id: string): AttachmentMetadata {
 function ComposerHarness({
   initialText = "",
   initialAttachments = [],
+  isSubmitLoading = false,
+  submitBehavior,
 }: {
   initialText?: string;
   initialAttachments?: ComposerAttachment[];
+  isSubmitLoading?: boolean;
+  submitBehavior?: "clear" | "preserve-and-lock";
 }) {
   const [text, setText] = useState(initialText);
   const [attachments, setAttachments] = useState(initialAttachments);
@@ -603,6 +607,8 @@ function ComposerHarness({
             return next;
           });
         }}
+        isSubmitLoading={isSubmitLoading}
+        submitBehavior={submitBehavior}
         cwd="/repo"
         clearDraft={vi.fn()}
       />
@@ -611,7 +617,12 @@ function ComposerHarness({
 }
 
 function renderComposer(
-  input: { initialText?: string; initialAttachments?: ComposerAttachment[] } = {},
+  input: {
+    initialText?: string;
+    initialAttachments?: ComposerAttachment[];
+    isSubmitLoading?: boolean;
+    submitBehavior?: "clear" | "preserve-and-lock";
+  } = {},
 ) {
   act(() => {
     root?.render(<ComposerHarness {...input} />);
@@ -835,6 +846,32 @@ describe("Composer attachments", () => {
     expect(latestAttachments).toEqual([{ kind: "image", metadata: image }]);
   });
 
+  it("locks the preserved draft while submit loading", () => {
+    renderComposer({
+      initialText: "keep this prompt",
+      initialAttachments: [{ kind: "github_pr", item: prItem }],
+      isSubmitLoading: true,
+      submitBehavior: "preserve-and-lock",
+    });
+
+    const textInput = document.querySelector('[aria-label="Message agent..."]');
+    const attachButton = queryByTestId("message-input-attach-button");
+    const pill = queryByTestId("composer-github-attachment-pill");
+    const removeButton = document.querySelector(`[aria-label="Remove PR #${prItem.number}"]`);
+
+    expect(textInput).toHaveProperty("readOnly", true);
+    expect(textInput).toHaveProperty("value", "keep this prompt");
+    expect(attachButton).toHaveProperty("disabled", true);
+    expect(pill).not.toBeNull();
+    expect(removeButton).not.toBeNull();
+
+    click(pill!);
+    click(removeButton!);
+
+    expect(openExternalUrlMock).not.toHaveBeenCalled();
+    expect(latestAttachments).toEqual([{ kind: "github_pr", item: prItem }]);
+  });
+
   it("closes the image lightbox when its close button is pressed", () => {
     const image = imageAttachment("img-close");
     renderComposer({ initialAttachments: [{ kind: "image", metadata: image }] });

packages/app/src/components/composer.tsx

@@ -102,6 +102,7 @@ interface ComposerProps {
   submitButtonAccessibilityLabel?: string;
   /** Externally controlled loading state. When true, disables the submit button. */
   isSubmitLoading?: boolean;
+  submitBehavior?: "clear" | "preserve-and-lock";
   /** When true, blurs the input immediately when submitting. */
   blurOnSubmit?: boolean;
   value: string;
@@ -142,6 +143,7 @@ export function Composer({
   allowEmptySubmit = false,
   submitButtonAccessibilityLabel,
   isSubmitLoading = false,
+  submitBehavior = "clear",
   blurOnSubmit = false,
   value,
   onChangeText,
@@ -218,6 +220,7 @@ export function Composer({
   const [lightboxMetadata, setLightboxMetadata] = useState<AttachmentMetadata | null>(null);
   const attachButtonRef = useRef<View | null>(null);
   const messageInputRef = useRef<MessageInputRef>(null);
+  const isComposerLocked = submitBehavior === "preserve-and-lock" && isSubmitLoading;
   const keyboardHandlerIdRef = useRef(
     `message-input:${serverId}:${agentId}:${Math.random().toString(36).slice(2)}`,
   );
@@ -401,6 +404,7 @@ export function Composer({
       hasExternalContent,
       allowEmptySubmit,
       forceSend,
+      submitBehavior,
       isAgentRunning: agentState.status === "running",
       // Parent-managed submits are still valid submit paths even when the
       // transport is disconnected, because the parent decides the failure mode.
@@ -815,7 +819,7 @@ export function Composer({
     >
       <AttachmentLightbox metadata={lightboxMetadata} onClose={() => setLightboxMetadata(null)} />
       {/* Input area */}
-      <View style={styles.inputAreaContainer}>
+      <View style={[styles.inputAreaContainer, isComposerLocked && styles.inputAreaLocked]}>
         <View style={styles.inputAreaContent}>
           {/* Queue list */}
           {queuedMessages.length > 0 && (
@@ -874,6 +878,7 @@ export function Composer({
                         onRemove={() => handleRemoveAttachment(index)}
                         openAccessibilityLabel="Open image attachment"
                         removeAccessibilityLabel="Remove image attachment"
+                        disabled={isComposerLocked}
                       >
                         <ImageAttachmentThumbnail image={attachment.metadata} />
                       </AttachmentPill>
@@ -890,6 +895,7 @@ export function Composer({
                       onRemove={() => handleRemoveAttachment(index)}
                       openAccessibilityLabel={`Open ${kindLabel} #${item.number}`}
                       removeAccessibilityLabel={`Remove ${kindLabel} #${item.number}`}
+                      disabled={isComposerLocked}
                     >
                       <View style={styles.githubPillBody}>
                         <View style={styles.githubPillIcon}>
@@ -1043,6 +1049,9 @@ const styles = StyleSheet.create(((theme: Theme) => ({
     overflow: "visible",
     padding: theme.spacing[4],
   },
+  inputAreaLocked: {
+    opacity: 0.6,
+  },
   inputAreaContent: {
     width: "100%",
     maxWidth: MAX_CONTENT_WIDTH,

packages/app/src/components/message-input.test.tsx

@@ -51,7 +51,7 @@ vi.mock("lucide-react-native", () => {
   return {
     Mic: createIcon("Mic"),
     MicOff: createIcon("MicOff"),
-    ArrowUp: createIcon("ArrowUp"),
+    CornerDownLeft: createIcon("CornerDownLeft"),
     Plus: createIcon("Plus"),
     Square: createIcon("Square"),
   };

packages/app/src/components/message-input.tsx

@@ -20,7 +20,7 @@ import {
   forwardRef,
 } from "react";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
-import { Mic, MicOff, ArrowUp, Plus, Square } from "lucide-react-native";
+import { Mic, MicOff, CornerDownLeft, Plus, Square } from "lucide-react-native";
 import Animated, { useSharedValue, useAnimatedStyle, withTiming } from "react-native-reanimated";
 import { useDictation } from "@/hooks/use-dictation";
 import { DictationOverlay } from "./dictation-controls";
@@ -1181,7 +1181,7 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(funct
                   {isSubmitLoading ? (
                     <ActivityIndicator size="small" color="white" />
                   ) : (
-                    <ArrowUp size={buttonIconSize} color="white" />
+                    <CornerDownLeft size={buttonIconSize} color="white" />
                   )}
                 </TooltipTrigger>
                 <TooltipContent side="top" align="center" offset={8}>

packages/app/src/components/ui/tooltip.test.tsx

@@ -0,0 +1,116 @@
+import React from "react";
+import { act } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { JSDOM } from "jsdom";
+import { Pressable, Text } from "react-native";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { Tooltip, TooltipTrigger } from "./tooltip";
+
+vi.mock("@/constants/platform", () => ({
+  isWeb: true,
+  isNative: false,
+}));
+
+vi.mock("@/constants/layout", () => ({
+  useIsCompactFormFactor: () => false,
+}));
+
+vi.mock("@gorhom/portal", () => ({
+  Portal: ({ children }: { children: React.ReactNode }) => <>{children}</>,
+}));
+
+vi.mock("@gorhom/bottom-sheet", () => ({
+  useBottomSheetModalInternal: () => null,
+}));
+
+vi.mock("react-native-reanimated", () => ({
+  default: {
+    View: "div",
+  },
+  FadeIn: {},
+  FadeOut: {},
+}));
+
+vi.mock("react-native-unistyles", () => ({
+  StyleSheet: {
+    create: (styles: unknown) => styles,
+  },
+}));
+
+let root: Root | null = null;
+let container: HTMLElement | null = null;
+
+beforeEach(() => {
+  const dom = new JSDOM("<!doctype html><html><body></body></html>");
+  vi.stubGlobal("React", React);
+  vi.stubGlobal("IS_REACT_ACT_ENVIRONMENT", true);
+  vi.stubGlobal("window", dom.window);
+  vi.stubGlobal("document", dom.window.document);
+  vi.stubGlobal("HTMLElement", dom.window.HTMLElement);
+  vi.stubGlobal("Node", dom.window.Node);
+  vi.stubGlobal("navigator", dom.window.navigator);
+
+  container = document.createElement("div");
+  document.body.appendChild(container);
+  root = createRoot(container);
+});
+
+afterEach(() => {
+  if (root) {
+    act(() => {
+      root?.unmount();
+    });
+  }
+  root = null;
+  container = null;
+  vi.unstubAllGlobals();
+});
+
+function renderTrigger({
+  childDisabled,
+  onPress,
+}: {
+  childDisabled: boolean;
+  onPress: () => void;
+}): void {
+  act(() => {
+    root?.render(
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Pressable disabled={childDisabled} onPress={onPress} testID="trigger">
+            <Text>Send</Text>
+          </Pressable>
+        </TooltipTrigger>
+      </Tooltip>,
+    );
+  });
+}
+
+function pressTrigger(): void {
+  const trigger = container?.querySelector('[data-testid="trigger"]');
+  expect(trigger).not.toBeNull();
+
+  act(() => {
+    trigger?.dispatchEvent(new window.MouseEvent("click", { bubbles: true }));
+  });
+}
+
+describe("TooltipTrigger", () => {
+  it("keeps an asChild trigger disabled when the child is disabled", () => {
+    const onPress = vi.fn();
+
+    renderTrigger({ childDisabled: true, onPress });
+    pressTrigger();
+
+    expect(onPress).not.toHaveBeenCalled();
+  });
+
+  it("keeps an asChild trigger interactive when the child is not disabled", () => {
+    const onPress = vi.fn();
+
+    renderTrigger({ childDisabled: false, onPress });
+    pressTrigger();
+
+    expect(onPress).toHaveBeenCalledTimes(1);
+  });
+});

packages/app/src/components/ui/tooltip.tsx

@@ -386,6 +386,7 @@ export function TooltipTrigger({
     const mergedProps = {
       ...childProps,
       ...triggerProps,
+      disabled: childProps.disabled || disabled,
       onHoverIn: composeEventHandlers(childProps.onHoverIn, handleHoverIn),
       onHoverOut: composeEventHandlers(childProps.onHoverOut, handleHoverOut),
       onFocus: composeEventHandlers(childProps.onFocus, handleFocus),