feat(mobile): sync composer drafts across devices

Author: github-actions[bot]

apps/mobile/src/state/composer-draft-sync.ts

@@ -0,0 +1,147 @@
+import { useAtomValue } from "@effect/atom-react";
+import {
+  canonicalComposerDraftCommon,
+  composerDraftCommonEquals,
+  createComposerDraftEnvironmentAtoms,
+  createComposerDraftSyncController,
+  type ComposerDraftSyncController,
+} from "@t3tools/client-runtime/state/composer-drafts";
+import type {
+  ComposerDraftCommon,
+  ComposerDraftSnapshot,
+  ScopedThreadRef,
+} from "@t3tools/contracts";
+import { AsyncResult, Atom } from "effect/unstable/reactivity";
+import { useEffect, useRef } from "react";
+
+import { connectionAtomRuntime } from "../connection/runtime";
+import { scopedThreadKey } from "../lib/scopedEntities";
+import { uuidv4 } from "../lib/uuid";
+import { appAtomRegistry } from "./atom-registry";
+import { serverEnvironment } from "./server";
+import {
+  applySyncedComposerDraftCommon,
+  composerDraftsAtom,
+  composerDraftsLoadedAtom,
+  type ComposerDraft,
+} from "./use-composer-drafts";
+
+export const composerDraftEnvironment = createComposerDraftEnvironmentAtoms(connectionAtomRuntime);
+
+const EMPTY_SYNC_ATOM = Atom.make<null>(null).pipe(
+  Atom.withLabel("mobile:composer-draft-sync-disabled"),
+);
+const revisions = new Map<string, number>();
+const suppressedPostSendCommon = new Map<string, ComposerDraftCommon | null>();
+
+export function readComposerDraftRevision(threadRef: ScopedThreadRef): number | undefined {
+  return revisions.get(scopedThreadKey(threadRef.environmentId, threadRef.threadId));
+}
+
+/** Prevents retained selector settings from being mistaken for a new draft. */
+export function markComposerDraftSent(threadRef: ScopedThreadRef): void {
+  const key = scopedThreadKey(threadRef.environmentId, threadRef.threadId);
+  const draft = appAtomRegistry.get(composerDraftsAtom)[key];
+  suppressedPostSendCommon.set(key, commonFromDraft(draft ?? { text: "", attachments: [] }));
+}
+
+function commonFromDraft(draft: ComposerDraft): ComposerDraftCommon | null {
+  if (draft.attachments.length > 0) return null;
+  return canonicalComposerDraftCommon({
+    text: draft.text,
+    modelSelection: draft.modelSelection ?? null,
+    runtimeMode: draft.runtimeMode ?? null,
+    interactionMode: draft.interactionMode ?? null,
+  });
+}
+
+export function useServerComposerDraftSync(threadRef: ScopedThreadRef | null): void {
+  const drafts = useAtomValue(composerDraftsAtom);
+  const draftsLoaded = useAtomValue(composerDraftsLoadedAtom);
+  const serverConfig = useAtomValue(
+    threadRef === null
+      ? EMPTY_SYNC_ATOM
+      : serverEnvironment.configValueAtom(threadRef.environmentId),
+  );
+  const enabled =
+    draftsLoaded &&
+    threadRef !== null &&
+    serverConfig !== null &&
+    "environment" in serverConfig &&
+    serverConfig.environment.capabilities.composerDraftSync === true;
+  const streamResult = useAtomValue(
+    enabled && threadRef !== null
+      ? composerDraftEnvironment.changes({
+          environmentId: threadRef.environmentId,
+          input: { threadId: threadRef.threadId },
+        })
+      : EMPTY_SYNC_ATOM,
+  );
+  const draftKey =
+    threadRef === null ? null : scopedThreadKey(threadRef.environmentId, threadRef.threadId);
+  const draft = draftKey === null ? null : (drafts[draftKey] ?? null);
+  const draftRef = useRef<ComposerDraft | null>(draft);
+  draftRef.current = draft;
+  const controllerRef = useRef<ComposerDraftSyncController | null>(null);
+
+  useEffect(() => {
+    controllerRef.current?.dispose();
+    if (!enabled || threadRef === null || draftKey === null) {
+      controllerRef.current = null;
+      return;
+    }
+    const key = draftKey;
+    const readLocal = () => {
+      const common = commonFromDraft(draftRef.current ?? { text: "", attachments: [] });
+      if (!suppressedPostSendCommon.has(key)) return common;
+      const baseline = suppressedPostSendCommon.get(key) ?? null;
+      if (composerDraftCommonEquals(common, baseline)) return null;
+      suppressedPostSendCommon.delete(key);
+      return common;
+    };
+    const controller = createComposerDraftSyncController({
+      threadId: threadRef.threadId,
+      readLocal,
+      canApplyRemote: () => (draftRef.current?.attachments.length ?? 0) === 0,
+      applyRemote: (common) => applySyncedComposerDraftCommon(key, common),
+      update: async (input) => {
+        const result = await composerDraftEnvironment.update.run(appAtomRegistry, {
+          environmentId: threadRef.environmentId,
+          input,
+        });
+        return AsyncResult.isSuccess(result) ? result.value : null;
+      },
+      createMutationId: () => `mobile:${uuidv4()}`,
+      scheduleTask: (task, delayMs) => {
+        const timer = setTimeout(task, delayMs);
+        return () => clearTimeout(timer);
+      },
+      onRevisionChange: (snapshot: ComposerDraftSnapshot) => {
+        revisions.set(key, snapshot.revision);
+      },
+    });
+    controllerRef.current = controller;
+    return () => {
+      controller.dispose();
+      if (controllerRef.current === controller) controllerRef.current = null;
+      revisions.delete(key);
+      suppressedPostSendCommon.delete(key);
+    };
+  }, [draftKey, enabled, threadRef?.environmentId, threadRef?.threadId]);
+
+  useEffect(() => {
+    if (streamResult !== null && AsyncResult.isSuccess(streamResult)) {
+      controllerRef.current?.observeSnapshot(streamResult.value);
+    }
+  }, [streamResult]);
+
+  useEffect(() => {
+    controllerRef.current?.observeLocalChange();
+  }, [
+    draft?.attachments,
+    draft?.interactionMode,
+    draft?.modelSelection,
+    draft?.runtimeMode,
+    draft?.text,
+  ]);
+}

apps/mobile/src/state/thread-outbox-model.ts

@@ -6,6 +6,7 @@ import {
   IsoDateTime,
   MessageId,
   ModelSelection,
+  NonNegativeInt,
   ProjectId,
   ProviderInteractionMode,
   RuntimeMode,
@@ -21,7 +22,7 @@ import { DraftComposerImageAttachmentSchema } from "../lib/composer-image-schema
 import type { DraftComposerImageAttachment } from "../lib/composerImages";
 import { scopedThreadKey } from "../lib/scopedEntities";
 
-const THREAD_OUTBOX_SCHEMA_VERSION = 3;
+const THREAD_OUTBOX_SCHEMA_VERSION = 4;
 const THREAD_OUTBOX_MAX_RETRY_DELAY_MS = 16_000;
 
 const QueuedThreadCreationSchema = Schema.Struct({
@@ -37,7 +38,7 @@ const QueuedThreadCreationSchema = Schema.Struct({
 });
 
 export const QueuedThreadMessageSchema = Schema.Struct({
-  schemaVersion: Schema.Literals([1, 2, THREAD_OUTBOX_SCHEMA_VERSION]),
+  schemaVersion: Schema.Literals([1, 2, 3, THREAD_OUTBOX_SCHEMA_VERSION]),
   environmentId: EnvironmentId,
   threadId: ThreadId,
   messageId: MessageId,
@@ -47,6 +48,7 @@ export const QueuedThreadMessageSchema = Schema.Struct({
   modelSelection: Schema.optional(ModelSelection),
   runtimeMode: Schema.optional(RuntimeMode),
   interactionMode: Schema.optional(ProviderInteractionMode),
+  composerDraftRevision: Schema.optional(NonNegativeInt),
   // Present when the queued item creates a brand-new thread (pending task)
   // instead of appending a turn to an existing one.
   creation: Schema.optional(QueuedThreadCreationSchema),
@@ -76,6 +78,7 @@ export interface QueuedThreadMessage {
   readonly modelSelection?: ModelSelectionType;
   readonly runtimeMode?: RuntimeModeType;
   readonly interactionMode?: ProviderInteractionModeType;
+  readonly composerDraftRevision?: number;
   readonly creation?: QueuedThreadCreation;
   readonly createdAt: string;
 }

apps/mobile/src/state/thread-outbox.test.ts

@@ -58,18 +58,20 @@ describe("thread outbox", () => {
     });
   });
 
-  it("decodes the persisted schema and rejects incomplete messages", () => {
+  it("decodes persisted v1-v3 messages and rejects incomplete messages", () => {
     const message = queuedMessage({
       messageId: "message-1",
       createdAt: "2026-06-08T10:00:01.000Z",
     });
 
-    expect(
-      decodeQueuedThreadMessage({
-        schemaVersion: 1,
-        ...message,
-      }),
-    ).toEqual(message);
+    for (const schemaVersion of [1, 2, 3] as const) {
+      expect(
+        decodeQueuedThreadMessage({
+          schemaVersion,
+          ...message,
+        }),
+      ).toEqual(message);
+    }
     expect(() =>
       decodeQueuedThreadMessage({
         schemaVersion: 1,
@@ -92,6 +94,7 @@ describe("thread outbox", () => {
       },
       runtimeMode: "approval-required",
       interactionMode: "plan",
+      composerDraftRevision: 7,
     } satisfies QueuedThreadMessage;
 
     expect(decodeQueuedThreadMessage(encodeQueuedThreadMessage(selectedMessage))).toEqual(

apps/mobile/src/state/use-composer-drafts.test.ts

@@ -3,6 +3,7 @@ import { EnvironmentId, ProviderInstanceId } from "@t3tools/contracts";
 
 import { appAtomRegistry } from "./atom-registry";
 import {
+  applySyncedComposerDraftCommon,
   clearComposerDraftContentState,
   composerDraftsAtom,
   decodePersistedComposerDrafts,
@@ -23,6 +24,42 @@ afterEach(() => {
 });
 
 describe("mobile composer drafts", () => {
+  it("applies synchronized common state without replacing local attachments or workspace", () => {
+    const draftKey = "environment-1:thread-1";
+    const attachment = {
+      id: "image-1",
+      previewUri: "file:///image.png",
+      type: "image" as const,
+      name: "image.png",
+      mimeType: "image/png",
+      sizeBytes: 4,
+      dataUrl: "data:image/png;base64,AAAA",
+    };
+    const workspaceSelection = {
+      mode: "worktree" as const,
+      branch: "main",
+      worktreePath: "/repo-worktree",
+    };
+    appAtomRegistry.set(composerDraftsAtom, {
+      [draftKey]: { text: "local", attachments: [attachment], workspaceSelection },
+    });
+
+    applySyncedComposerDraftCommon(draftKey, {
+      text: "remote",
+      modelSelection: null,
+      runtimeMode: "full-access",
+      interactionMode: "plan",
+    });
+
+    expect(getComposerDraftSnapshot(draftKey)).toEqual({
+      text: "remote",
+      attachments: [attachment],
+      workspaceSelection,
+      runtimeMode: "full-access",
+      interactionMode: "plan",
+    });
+  });
+
   it("hydrates selector state even when the message content is empty", () => {
     expect(
       decodePersistedComposerDrafts({

apps/mobile/src/state/use-composer-drafts.ts

@@ -1,5 +1,6 @@
 import { useAtomValue } from "@effect/atom-react";
 import {
+  type ComposerDraftCommon,
   ModelSelection as ModelSelectionSchema,
   PROVIDER_SEND_TURN_MAX_ATTACHMENTS,
   ProviderInteractionMode as ProviderInteractionModeSchema,
@@ -100,6 +101,10 @@ export const composerDraftsAtom = Atom.make<Record<string, ComposerDraft>>({}).p
   Atom.keepAlive,
   Atom.withLabel("mobile:composer-drafts"),
 );
+export const composerDraftsLoadedAtom = Atom.make(false).pipe(
+  Atom.keepAlive,
+  Atom.withLabel("mobile:composer-drafts-loaded"),
+);
 
 let loadPromise: Promise<void> | null = null;
 let persistTimer: ReturnType<typeof setTimeout> | null = null;
@@ -247,6 +252,9 @@ export function ensureComposerDraftsLoaded(): void {
         }),
       );
       // Draft loading is best-effort; in-memory drafts still keep working.
+    })
+    .finally(() => {
+      appAtomRegistry.set(composerDraftsLoadedAtom, true);
     });
 }
 
@@ -369,6 +377,41 @@ export function updateComposerDraftSettings(
   });
 }
 
+/** Applies the server-owned draft section without touching device-local assets. */
+export function applySyncedComposerDraftCommon(
+  draftKey: string,
+  common: ComposerDraftCommon | null,
+): void {
+  updateComposerDrafts((current) => {
+    const existing = normalizeDraft(current[draftKey]);
+    const {
+      modelSelection: _modelSelection,
+      runtimeMode: _runtimeMode,
+      interactionMode: _interactionMode,
+      ...deviceLocal
+    } = existing;
+    const draft: ComposerDraft = {
+      ...deviceLocal,
+      text: common?.text ?? "",
+      ...(common?.modelSelection === null || common?.modelSelection === undefined
+        ? {}
+        : { modelSelection: common.modelSelection }),
+      ...(common?.runtimeMode === null || common?.runtimeMode === undefined
+        ? {}
+        : { runtimeMode: common.runtimeMode }),
+      ...(common?.interactionMode === null || common?.interactionMode === undefined
+        ? {}
+        : { interactionMode: common.interactionMode }),
+    };
+    if (isEmptyDraft(draft)) {
+      const next = { ...current };
+      delete next[draftKey];
+      return next;
+    }
+    return { ...current, [draftKey]: draft };
+  });
+}
+
 export function clearComposerDraftContentState(
   current: Record<string, ComposerDraft>,
   draftKey: string,