chore: update version number to 0.1.79

feat(calendar): order calendars by sortOrder and move them from the drawer

VERSION

@@ -1 +1 @@
-0.1.78
+0.1.79

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "bulwark-mobile",
-  "version": "0.1.78",
+  "version": "0.1.79",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "bulwark-mobile",
-      "version": "0.1.78",
+      "version": "0.1.79",
       "hasInstallScript": true,
       "license": "AGPL-3.0-only",
       "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bulwark-mobile",
-  "version": "0.1.78",
+  "version": "0.1.79",
   "license": "AGPL-3.0-only",
   "main": "index.ts",
   "scripts": {

patches/postal-mime+3.0.0.patch

@@ -0,0 +1,82 @@
+diff --git a/node_modules/postal-mime/src/base64-decoder.js b/node_modules/postal-mime/src/base64-decoder.js
+index 93c2aea..ba6e3f1 100644
+--- a/node_modules/postal-mime/src/base64-decoder.js
++++ b/node_modules/postal-mime/src/base64-decoder.js
+@@ -1,4 +1,4 @@
+-import { decodeBase64, blobToArrayBuffer } from './decode-strings.js';
++import { decodeBase64, concatChunks } from './decode-strings.js';
+ 
+ export default class Base64Decoder {
+     constructor(opts) {
+@@ -49,6 +49,6 @@ export default class Base64Decoder {
+     finalize() {
+         this.flushRemainder();
+ 
+-        return blobToArrayBuffer(new Blob(this.chunks, { type: 'application/octet-stream' }));
++        return concatChunks(this.chunks);
+     }
+ }
+diff --git a/node_modules/postal-mime/src/decode-strings.js b/node_modules/postal-mime/src/decode-strings.js
+index a5e058e..f255e8d 100644
+--- a/node_modules/postal-mime/src/decode-strings.js
++++ b/node_modules/postal-mime/src/decode-strings.js
+@@ -145,6 +145,23 @@ export function getDecoder(charset) {
+  * @param {Blob} blob Blob to convert
+  * @returns {ArrayBuffer} Converted value
+  */
++// React Native's Blob cannot be built from ArrayBuffers or typed arrays, so
++// the decoders join their chunks here instead of through a Blob.
++export function concatChunks(chunks) {
++    const parts = chunks.map(chunk => {
++        if (typeof chunk === 'string') return textEncoder.encode(chunk);
++        if (chunk instanceof ArrayBuffer) return new Uint8Array(chunk);
++        return new Uint8Array(chunk.buffer, chunk.byteOffset, chunk.byteLength);
++    });
++    const out = new Uint8Array(parts.reduce((n, part) => n + part.byteLength, 0));
++    let pos = 0;
++    for (const part of parts) {
++        out.set(part, pos);
++        pos += part.byteLength;
++    }
++    return out.buffer;
++}
++
+ export async function blobToArrayBuffer(blob) {
+     if ('arrayBuffer' in blob) {
+         return await blob.arrayBuffer();
+diff --git a/node_modules/postal-mime/src/pass-through-decoder.js b/node_modules/postal-mime/src/pass-through-decoder.js
+index ad1c222..1e1d012 100644
+--- a/node_modules/postal-mime/src/pass-through-decoder.js
++++ b/node_modules/postal-mime/src/pass-through-decoder.js
+@@ -1,4 +1,4 @@
+-import { blobToArrayBuffer } from './decode-strings.js';
++import { concatChunks } from './decode-strings.js';
+ 
+ export default class PassThroughDecoder {
+     constructor() {
+@@ -12,6 +12,6 @@ export default class PassThroughDecoder {
+ 
+     finalize() {
+         // convert an array of arraybuffers into a blob and then back into a single arraybuffer
+-        return blobToArrayBuffer(new Blob(this.chunks, { type: 'application/octet-stream' }));
++        return concatChunks(this.chunks);
+     }
+ }
+diff --git a/node_modules/postal-mime/src/qp-decoder.js b/node_modules/postal-mime/src/qp-decoder.js
+index adee72c..3973673 100644
+--- a/node_modules/postal-mime/src/qp-decoder.js
++++ b/node_modules/postal-mime/src/qp-decoder.js
+@@ -1,4 +1,4 @@
+-import { blobToArrayBuffer, hexNibble } from './decode-strings.js';
++import { concatChunks, hexNibble } from './decode-strings.js';
+ 
+ const CHR_EQUALS = 0x3d;
+ const CHR_LF = 0x0a;
+@@ -83,6 +83,6 @@ export default class QPDecoder {
+         this.flushBuffer();
+ 
+         // convert an array of arraybuffers into a blob and then back into a single arraybuffer
+-        return blobToArrayBuffer(new Blob(this.chunks, { type: 'application/octet-stream' }));
++        return concatChunks(this.chunks);
+     }
+ }

src/api/__tests__/email-draft-blobs.test.ts

@@ -0,0 +1,138 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+
+vi.mock('../jmap-client', () => ({
+  jmapClient: {
+    accountId: 'acc-1',
+    request: vi.fn(),
+    getMaxCallsInRequest: vi.fn(() => 16),
+    getMaxObjectsInGet: vi.fn(() => 500),
+    getMaxObjectsInSet: vi.fn(() => 500),
+  },
+}));
+
+import { jmapClient } from '../jmap-client';
+import { saveDraftVersion, type OutgoingAttachment, type OutgoingEmail } from '../email';
+import { initialDraftPartBlobState, liveBlobId, rebaseDraftPartBlobs } from '../../lib/draft-part-blobs';
+
+const mockRequest = jmapClient.request as ReturnType<typeof vi.fn>;
+
+/**
+ * A tiny server with Stalwart's blob semantics, as measured on 0.16.22 (2026-10-14):
+ * an email's part blobIds are derived from that email and stop resolving the
+ * moment it is destroyed ("blobId … does not exist on this server"); creating
+ * an email copies the referenced bytes into new parts with new blobIds.
+ */
+function fakeStalwart() {
+  let seq = 0;
+  const emails = new Map<string, Array<{ blobId: string; name: string; size: number; cid?: string; type: string }>>();
+  const live = (blobId: string) => [...emails.values()].some((parts) => parts.some((p) => p.blobId === blobId));
+  const seed = (id: string, parts: OutgoingAttachment[]) => {
+    emails.set(id, parts.map((p) => ({ blobId: p.blobId, name: p.name, size: p.size ?? 0, cid: p.cid, type: p.type })));
+  };
+  mockRequest.mockImplementation(async (calls: Array<[string, Record<string, any>, string]>) => {
+    const out: Array<[string, unknown, string]> = [];
+    let createdId: string | undefined;
+    for (const [method, args, callId] of calls) {
+      if (method === 'Email/set' && args.create) {
+        const create = args.create.draft;
+        const dead = (create.attachments ?? []).find((a: { blobId: string }) => !live(a.blobId));
+        if (dead) {
+          out.push(['Email/set', { notCreated: { draft: {
+            type: 'blobNotFound', description: `blobId ${dead.blobId} does not exist on this server.`,
+          } } }, callId]);
+          continue;
+        }
+        createdId = `e${++seq}`;
+        emails.set(createdId, (create.attachments ?? []).map((a: OutgoingAttachment, i: number) => ({
+          blobId: `${createdId}-part${i}`, name: a.name, size: a.size ?? 0, cid: a.cid ? `<${a.cid}>` : undefined, type: a.type,
+        })));
+        out.push(['Email/set', { created: { draft: { id: createdId } } }, callId]);
+      } else if (method === 'Email/set' && args.destroy) {
+        for (const id of args.destroy) emails.delete(id);
+        out.push(['Email/set', { destroyed: args.destroy }, callId]);
+      } else if (method === 'Email/get') {
+        if (!createdId || args.ids?.[0] !== '#draft') {
+          out.push(['error', { type: 'invalidResultReference' }, callId]);
+          continue;
+        }
+        out.push(['Email/get', { list: [{ id: createdId, attachments: emails.get(createdId) }] }, callId]);
+      }
+    }
+    return { methodResponses: out };
+  });
+  return { seed, emails };
+}
+
+const IMG_A: OutgoingAttachment = { blobId: 'd0-part-a', name: 'schema-a.png', size: 136574, type: 'image/png', disposition: 'inline', cid: 'a@undust.co' };
+const IMG_B: OutgoingAttachment = { blobId: 'd0-part-b', name: 'schema-b.png', size: 175155, type: 'image/png', disposition: 'inline', cid: 'b@undust.co' };
+
+const draftWith = (attachments: OutgoingAttachment[]): OutgoingEmail => ({
+  from: [{ email: 'me@undust.co' }],
+  to: [{ email: 'test@example.invalid' }],
+  subject: 'RE: draft with two inline images',
+  htmlBody: '<p>x <img src="cid:a@undust.co"> <img src="cid:b@undust.co"></p>',
+  textBody: 'x',
+  attachments,
+});
+
+beforeEach(() => {
+  vi.clearAllMocks();
+});
+
+describe('saveDraftVersion', () => {
+  it('reads the new version\'s parts back in the same request, by creation id', async () => {
+    fakeStalwart().seed('d0', [IMG_A]);
+    const saved = await saveDraftVersion(draftWith([IMG_A]), 'drafts', 'd0');
+    const calls = mockRequest.mock.calls[0][0];
+    expect(calls.map((c: [string]) => c[0])).toEqual(['Email/set', 'Email/get']);
+    expect(calls[1][1].ids).toEqual(['#draft']);
+    expect(saved.id).toBe('e1');
+    expect(saved.attachments.map((a) => a.blobId)).toEqual(['e1-part0']);
+  });
+
+  it('destroys the previous version only after the new one exists', async () => {
+    fakeStalwart().seed('d0', [IMG_A]);
+    await saveDraftVersion(draftWith([IMG_A]), 'drafts', 'd0');
+    const destroyCall = mockRequest.mock.calls[1][0][0];
+    expect(destroyCall[0]).toBe('Email/set');
+    expect(destroyCall[1].destroy).toEqual(['d0']);
+  });
+
+  it('still returns the id when the read-back fails', async () => {
+    mockRequest.mockResolvedValueOnce({ methodResponses: [
+      ['Email/set', { created: { draft: { id: 'e9' } } }, '0'],
+      ['error', { type: 'serverFail' }, '1'],
+    ] });
+    const saved = await saveDraftVersion(draftWith([]), 'drafts');
+    expect(saved).toEqual({ id: 'e9', attachments: [] });
+  });
+});
+
+describe('re-opened draft with inline images: save, save again, send', () => {
+  // What ComposeScreen does: buildOutgoing maps each held blobId through the
+  // state, saveDraftOnce rebases it on the parts read back.
+  async function editSession(rebase: boolean) {
+    const server = fakeStalwart();
+    server.seed('d0', [IMG_A, IMG_B]); // the draft as deposited (IMAP APPEND or an earlier save)
+    let state = initialDraftPartBlobState();
+    let draftId = 'd0';
+    const outgoing = () => draftWith([IMG_A, IMG_B].map((a) => ({ ...a, blobId: liveBlobId(state, a.blobId) })));
+    for (let i = 0; i < 2; i++) {
+      const sent = outgoing();
+      const saved = await saveDraftVersion(sent, 'drafts', draftId);
+      draftId = saved.id;
+      if (rebase) state = rebaseDraftPartBlobs(state, sent.attachments ?? [], saved.attachments);
+    }
+    return { server, draftId };
+  }
+
+  it('reproduces the bug without the rebase: the second save references the destroyed draft\'s parts', async () => {
+    await expect(editSession(false)).rejects.toThrow('blobId d0-part-a does not exist on this server.');
+  });
+
+  it('keeps every save (and so the send, which builds the same attachments) on live blobs', async () => {
+    const { server, draftId } = await editSession(true);
+    expect([...server.emails.keys()]).toEqual([draftId]);
+    expect(server.emails.get(draftId)!.map((p) => p.name)).toEqual(['schema-a.png', 'schema-b.png']);
+  });
+});

src/api/__tests__/live-stalwart.test.ts

@@ -22,6 +22,8 @@ import {
   getFullEmails,
   getThreadsHeaders,
   createDraft,
+  saveDraftVersion,
+  destroyEmails,
   sendEmail,
   markAsSpam,
   undoSpam,
@@ -33,6 +35,9 @@ import {
   EMAIL_FULL_PROPERTIES,
 } from '../email';
 import { getIdentities } from '../identity';
+import { uploadBytes } from '../blob';
+import { initialDraftPartBlobState, liveBlobId, rebaseDraftPartBlobs } from '../../lib/draft-part-blobs';
+import type { OutgoingAttachment } from '../email';
 import { getCalendars, queryEvents, createEvent, deleteEvents } from '../calendar';
 import { getAddressBooks, createContact, deleteContacts } from '../contacts';
 
@@ -192,6 +197,44 @@ live('live Stalwart', () => {
       await destroyEmails([id]);
     }, 60_000);
 
+    it('keeps a re-opened draft with an inline image saveable across saves (#849 part blobs)', async () => {
+      // A 1x1 PNG uploaded once; D0 stands for the draft as it sits on the server.
+      const png = Uint8Array.from(atob('iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg=='), (c) => c.charCodeAt(0));
+      const up = await uploadBytes(png, 'image/png');
+      const base = {
+        from: [{ email: USER }],
+        to: [{ email: 'test@example.invalid' }],
+        subject: '[TEST bulwark-blob — supprimable]',
+        htmlBody: '<p>live <img src="cid:img1@live.test"></p>',
+        textBody: 'live',
+      };
+      const img = (blobId: string): OutgoingAttachment => ({
+        blobId, type: 'image/png', name: 'img1.png', size: png.byteLength, disposition: 'inline', cid: 'img1@live.test',
+      });
+      const d0 = await saveDraftVersion({ ...base, attachments: [img(up.blobId)] }, drafts);
+      const created = [d0.id];
+      try {
+        // Re-open D0: the composer holds D0's part blobId.
+        const seeded = d0.attachments[0].blobId;
+        let state = initialDraftPartBlobState();
+        let draftId = d0.id;
+        for (let i = 0; i < 2; i++) {
+          const sent = [img(liveBlobId(state, seeded))];
+          const saved = await saveDraftVersion({ ...base, attachments: sent }, drafts, draftId);
+          created.push(saved.id);
+          draftId = saved.id;
+          state = rebaseDraftPartBlobs(state, sent, saved.attachments);
+        }
+        // Without the rebase the seeded part blob is gone with D0.
+        await expect(saveDraftVersion({ ...base, attachments: [img(seeded)] }, drafts))
+          .rejects.toThrow(/does not exist|blobNotFound/);
+        const [last] = await getFullEmails([draftId]);
+        expect(last.attachments?.[0]?.cid).toContain('img1@live.test');
+      } finally {
+        await destroyEmails(created).catch(() => undefined);
+      }
+    }, 90_000);
+
     it('sends through Drafts and files into Sent only after submission (#188)', async () => {
       const identities = await getIdentities();
       expect(identities.length).toBeGreaterThan(0);

src/api/email.ts

@@ -1679,31 +1679,64 @@ export async function sendEmail(
   };
 }
 
+/** A saved draft version and the attachment parts the server built for it. */
+export interface SavedDraftVersion {
+  id: string;
+  /**
+   * Attachment and inline parts of the new version, with their blobIds. A
+   * part's blobId only lives as long as this version: re-opened drafts must
+   * send these (not the previous version's) on their next save or send.
+   * Empty when the server did not answer the read-back.
+   */
+  attachments: Attachment[];
+}
+
+const DRAFT_PART_BODY_PROPERTIES = ['partId', 'blobId', 'size', 'name', 'type', 'cid', 'disposition'];
+
 /**
  * Save a draft into the Drafts folder (`$draft` + `$seen`). When `previousDraftId`
  * is given it is destroyed only AFTER the replacement was created (#849): a
  * combined create+destroy would delete the last good copy when the create
- * fails (e.g. blobNotFound on a re-opened draft's attachments). Returns the
- * new draft id.
+ * fails (e.g. blobNotFound on a re-opened draft's attachments). The new
+ * version's attachment parts are read back in the same request, so the
+ * composer can re-point its draft-part blobIds before the old version (and
+ * its part blobs) is destroyed.
  */
-export async function createDraft(
+export async function saveDraftVersion(
   email: OutgoingEmail,
   draftsMailboxId: string,
   previousDraftId?: string,
   accountIdOverride?: string,
-): Promise<string> {
+): Promise<SavedDraftVersion> {
   const accountId = accountIdOverride ?? jmapClient.accountId;
   const emailCreate = buildEmailCreate(email);
   emailCreate.mailboxIds = { [draftsMailboxId]: true };
   emailCreate.keywords = { $seen: true, $draft: true };
   const res = await jmapClient.request([
     ['Email/set', { accountId, create: { draft: emailCreate } }, '0'],
+    // `#draft` is the creation id (RFC 8620 §5.3). Stalwart 0.16 does not
+    // resolve a result reference into an Email/set `created` map
+    // (invalidResultReference), but it does resolve the creation id.
+    ['Email/get', {
+      accountId,
+      ids: ['#draft'],
+      properties: ['id', 'attachments'],
+      bodyProperties: DRAFT_PART_BODY_PROPERTIES,
+    }, '1'],
   ]);
   const body = requireMethodResult(res, '0', 'Email/set');
   const notCreated = body.notCreated?.draft as { description?: string; type?: string } | undefined;
   if (notCreated) throw new Error(notCreated.description || notCreated.type || 'Failed to save draft');
   const id = body.created?.draft?.id as string | undefined;
   if (!id) throw new Error('Draft save returned no id');
+  let attachments: Attachment[] = [];
+  try {
+    const got = requireMethodResult(res, '1', 'Email/get');
+    const saved = (got.list as Array<{ id: string; attachments?: Attachment[] }> | undefined)?.find((e) => e.id === id);
+    attachments = (saved?.attachments ?? []).filter((a) => !!a.blobId);
+  } catch (err) {
+    console.warn('[email] could not read back the saved draft parts:', err);
+  }
   if (previousDraftId && previousDraftId !== id) {
     try {
       await destroyEmails([previousDraftId], accountId);
@@ -1711,7 +1744,17 @@ export async function createDraft(
       console.warn('[email] failed to destroy previous draft version:', err);
     }
   }
-  return id;
+  return { id, attachments };
+}
+
+/** {@link saveDraftVersion} for callers that only need the new draft id. */
+export async function createDraft(
+  email: OutgoingEmail,
+  draftsMailboxId: string,
+  previousDraftId?: string,
+  accountIdOverride?: string,
+): Promise<string> {
+  return (await saveDraftVersion(email, draftsMailboxId, previousDraftId, accountIdOverride)).id;
 }
 
 export interface ScheduledEmail {

src/components/RichTextEditor.tsx

@@ -78,10 +78,16 @@ interface Props {
   onSelectionChange?: (state: RichTextSelectionState) => void;
   onFocus?: () => void;
   onBlur?: () => void;
+  /**
+   * Android: the page undid a caret-reveal pan of `dy` px (dp) inside the
+   * WebView. The host should scroll its ScrollView down by `dy` so the caret
+   * stays visible (see `pinVisualViewport` in editor-html).
+   */
+  onViewportShift?: (dy: number) => void;
 }
 
 const RichTextEditor = React.forwardRef<RichTextEditorHandle, Props>(function RichTextEditor(
-  { initialHtml = '', placeholder = '', blockRemoteImages = false, onChange, onSelectionChange, onFocus, onBlur },
+  { initialHtml = '', placeholder = '', blockRemoteImages = false, onChange, onSelectionChange, onFocus, onBlur, onViewportShift },
   ref,
 ) {
   const c = useColors();
@@ -92,6 +98,8 @@ const RichTextEditor = React.forwardRef<RichTextEditorHandle, Props>(function Ri
   const onSelectionRef = React.useRef(onSelectionChange);
   const onFocusRef = React.useRef(onFocus);
   const onBlurRef = React.useRef(onBlur);
+  const onViewportShiftRef = React.useRef(onViewportShift);
+  onViewportShiftRef.current = onViewportShift;
   onChangeRef.current = onChange;
   onSelectionRef.current = onSelectionChange;
   onFocusRef.current = onFocus;
@@ -100,7 +108,9 @@ const RichTextEditor = React.forwardRef<RichTextEditorHandle, Props>(function Ri
   // Build the source HTML once. Theming changes won't auto-rebuild the page,
   // which is fine: themes change rarely and the user can recompose if needed.
   const html = React.useMemo(
-    () => buildEditorHtml({ initialHtml, placeholder, c, blockRemoteImages }),
+    () => buildEditorHtml({
+      initialHtml, placeholder, c, blockRemoteImages, pinVisualViewport: Platform.OS === 'android',
+    }),
     // c reference changes per theme switch but we don't want to lose user
     // edits on a theme change. Bake in the initial colors only.
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -224,6 +234,11 @@ const RichTextEditor = React.forwardRef<RichTextEditorHandle, Props>(function Ri
       case 'blur':
         onBlurRef.current?.();
         break;
+      case 'viewportShift': {
+        const dy = typeof data.payload === 'number' ? data.payload : Number(data.payload);
+        if (Number.isFinite(dy) && dy !== 0) onViewportShiftRef.current?.(dy);
+        break;
+      }
     }
   };
 

src/components/calendar/CalendarSidebarDrawer.tsx

@@ -12,7 +12,7 @@ import {
 } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 import {
-  Check, X, Upload, Rss, Shuffle, Star, Plus, Pencil, Share2, Eraser, Trash2, RefreshCw,
+  Check, X, Upload, Rss, Shuffle, Star, Plus, Pencil, Share2, Eraser, Trash2, RefreshCw, ArrowUp, ArrowDown,
   type AppIcon,
 } from '../icons';
 import type { Calendar } from '../../api/types';
@@ -55,6 +55,9 @@ interface CalendarSidebarDrawerProps {
   onShare?: (calendar: Calendar) => void;
   onClear?: (calendar: Calendar) => void;
   onDelete?: (calendar: Calendar) => void;
+  // Move one of the user's own calendars next to `targetId`, a neighbour in
+  // the same section (before it when moving up, after it when moving down).
+  onMove?: (calendar: Calendar, targetId: string) => void;
   // Client-side iCal subscriptions are managed from the subscriptions sheet.
   isSubscriptionCalendar?: (calendarId: string) => boolean;
 }
@@ -79,6 +82,7 @@ export function CalendarSidebarDrawer({
   onShare,
   onClear,
   onDelete,
+  onMove,
   isSubscriptionCalendar,
 }: CalendarSidebarDrawerProps) {
   const c = useColors();
@@ -148,6 +152,7 @@ export function CalendarSidebarDrawer({
     onShare,
     onClear,
     onDelete,
+    onMove,
     isSubscriptionCalendar,
   };
 
@@ -284,6 +289,7 @@ function Section({
   onShare,
   onClear,
   onDelete,
+  onMove,
   isSubscriptionCalendar,
 }: {
   title: string;
@@ -299,11 +305,14 @@ function Section({
   onShare?: (calendar: Calendar) => void;
   onClear?: (calendar: Calendar) => void;
   onDelete?: (calendar: Calendar) => void;
+  onMove?: (calendar: Calendar, targetId: string) => void;
   isSubscriptionCalendar?: (calendarId: string) => boolean;
 }) {
   const c = useColors();
   const styles = React.useMemo(() => makeStyles(c), [c]);
   const t = useLocaleStore((s) => s.t);
+  // Neighbours a calendar can move past: the server calendars of this section.
+  const orderable = calendars.filter((cal) => cal.id !== BIRTHDAY_CALENDAR_ID);
   return (
     <View style={styles.section}>
       <Text style={styles.sectionTitle}>{title}</Text>
@@ -320,7 +329,11 @@ function Section({
         const canClear = !!onClear && isOwn && isWritableCalendar(cal);
         // Like webmail: the default calendar and shared calendars can't be deleted.
         const canDelete = !!onDelete && isOwn && !cal.isDefault && (!cal.myRights || cal.myRights.mayDelete !== false);
-        const hasActions = canSetDefault || canRecolor || canRename || canShare || canClear || canDelete;
+        const orderIndex = orderable.indexOf(cal);
+        const previousId = isOwn && orderIndex > 0 ? orderable[orderIndex - 1].id : undefined;
+        const nextId = isOwn && orderIndex >= 0 ? orderable[orderIndex + 1]?.id : undefined;
+        const canMove = !!onMove && (!!previousId || !!nextId);
+        const hasActions = canSetDefault || canRecolor || canRename || canShare || canClear || canDelete || canMove;
         const expanded = expandedId === cal.id && hasActions;
         return (
           <View key={cal.id}>
@@ -355,6 +368,27 @@ function Section({
 
             {expanded && (
               <View style={styles.actionsPanel}>
+                {/* The panel stays open so a calendar can be moved several places. */}
+                {canMove && previousId && (
+                  <Pressable
+                    onPress={() => onMove!(cal, previousId)}
+                    style={({ pressed }) => [styles.panelRow, pressed && styles.rowPressed]}
+                    accessibilityRole="button"
+                  >
+                    <ArrowUp size={16} color={c.textSecondary} />
+                    <Text style={styles.panelRowText}>{t('settings.account.accounts.move_up', 'Move up')}</Text>
+                  </Pressable>
+                )}
+                {canMove && nextId && (
+                  <Pressable
+                    onPress={() => onMove!(cal, nextId)}
+                    style={({ pressed }) => [styles.panelRow, pressed && styles.rowPressed]}
+                    accessibilityRole="button"
+                  >
+                    <ArrowDown size={16} color={c.textSecondary} />
+                    <Text style={styles.panelRowText}>{t('settings.account.accounts.move_down', 'Move down')}</Text>
+                  </Pressable>
+                )}
                 {canSetDefault && (
                   <Pressable
                     onPress={() => { onExpand(null); onSetDefault!(cal); }}

src/components/email/AttachmentChips.tsx

@@ -1,23 +1,22 @@
 import React from 'react';
 import { View, Text, StyleSheet, Pressable, ActivityIndicator, Alert } from 'react-native';
 import { Paperclip, Download, Eye, ExternalLink, Save, Share2, FolderArchive } from '../icons';
-import type { File } from 'expo-file-system';
 import type { Attachment, Email } from '../../api/types';
 import { spacing, radius, typography, type ThemePalette } from '../../theme/tokens';
 import { useColors } from '../../theme/colors';
 import { useSettingsStore } from '../../stores/settings-store';
 import { useLocaleStore } from '../../stores/locale-store';
 import {
-  shareAttachment, downloadAttachment, shareAttachmentViaSheet, fetchBlobBytes,
-  shareBytes, shareLocalFile, cachePreviewFile, writePreviewFile, discardPreviewFile,
+  shareAttachment, downloadAttachment, shareAttachmentViaSheet, fetchBlobBytes, shareBytes, attachmentSaveName,
 } from '../../lib/email-export';
 import {
-  getAttachmentDisplayName, visibleAttachments, previewKindFor, formatSize,
+  getAttachmentDisplayName, visibleAttachments, formatSize,
 } from '../../lib/attachment-display';
 import { emailExportFilename } from '../../lib/download-filename';
 import { ActionSheet, type ActionSheetItem } from './ActionSheet';
-import { AttachmentPreviewModal, type PreviewItem } from './AttachmentPreviewModal';
-import { emlPreviewFromBytes, type ExtractedAttachment } from './use-body-override';
+import { AttachmentPreviewModal } from './AttachmentPreviewModal';
+import type { ExtractedAttachment } from './use-body-override';
+import { previewKindOf, useFilePreview, type PreviewSource } from './use-file-preview';
 
 interface Props {
   email: Email;
@@ -65,24 +64,7 @@ export function AttachmentChips({ email, jmapAccountId, calendarBannerShown, tne
   const [expanded, setExpanded] = React.useState(false);
   const [busyKey, setBusyKey] = React.useState<string | null>(null);
   const [sheetItem, setSheetItem] = React.useState<Item | null>(null);
-  const [preview, setPreview] = React.useState<PreviewItem | null>(null);
-  const [previewLoading, setPreviewLoading] = React.useState(false);
-  const previewSource = React.useRef<Item | null>(null);
-  // The file the open preview shows, in a temp folder of its own: images are
-  // cached by path, so two attachments both called "image001.png" must not
-  // share one. Deleted when the preview closes, unless it went to another
-  // app, which may still be reading it; the stale-export sweep gets that one.
-  const previewFile = React.useRef<{ file: File; handedOff: boolean } | null>(null);
-  // Bumped whenever a preview ends, so a download that finishes after its
-  // preview was closed is dropped instead of reopening it.
-  const previewSeq = React.useRef(0);
-  const endPreview = React.useCallback(() => {
-    previewSeq.current += 1;
-    const open = previewFile.current;
-    previewFile.current = null;
-    if (open && !open.handedOff) discardPreviewFile(open.file);
-  }, []);
-  React.useEffect(() => endPreview, [endPreview]);
+  const preview = useFilePreview();
 
   const items = React.useMemo<Item[]>(() => {
     const blobs = visibleAttachments(email, { hideInlineImageAttachments, calendarBannerShown, tnefUnpacked })
@@ -134,49 +116,29 @@ export function AttachmentChips({ email, jmapAccountId, calendarBannerShown, tne
     else await shareBytes(item.part.bytes, item.name, item.type, { forceSheet: true });
   }, t('email_viewer.attachment_failed', 'Could not share attachment'));
 
-  const showPreview = (item: Item) => {
-    const kind = previewKindFor({ name: item.name, type: item.type });
-    if (kind === 'none') { void open(item); return; }
-    previewSource.current = item;
-    endPreview();
-    const seq = previewSeq.current;
-    const stillOpen = () => seq === previewSeq.current;
-    setPreviewLoading(true);
-    setPreview(null);
-    void (async () => {
-      try {
-        if (kind === 'text' || kind === 'eml') {
-          const bytes = item.kind === 'blob'
-            ? await fetchBlobBytes(item.att.blobId, item.att.name, item.att.type, jmapAccountId)
-            : item.part.bytes;
-          const next: PreviewItem = kind === 'eml'
-            ? { kind, name: item.name, mimeType: item.type, eml: await emlPreviewFromBytes(bytes) }
-            : { kind, name: item.name, mimeType: item.type, text: new TextDecoder('utf-8').decode(bytes) };
-          if (stillOpen()) setPreview(next);
-          return;
-        }
-        const file = item.kind === 'blob'
-          ? await cachePreviewFile(item.att.blobId, item.name, item.type, jmapAccountId)
-          : writePreviewFile(item.part.bytes, item.name, item.type);
-        if (!stillOpen()) {
-          discardPreviewFile(file);
-          return;
-        }
-        previewFile.current = { file, handedOff: false };
-        setPreview({ kind, name: item.name, mimeType: item.type, fileUri: file.uri });
-      } catch (e) {
-        if (!stillOpen()) return;
-        setPreview(null);
-        Alert.alert(t('email_viewer.attachment_failed', 'Could not open attachment'), e instanceof Error ? e.message : String(e));
-      } finally {
-        if (stillOpen()) setPreviewLoading(false);
-      }
-    })();
-  };
+  const sourceOf = (item: Item): PreviewSource => (item.kind === 'blob'
+    ? {
+      from: 'blob',
+      blobId: item.att.blobId,
+      accountId: jmapAccountId,
+      email,
+      name: item.name,
+      type: item.type,
+      size: item.size,
+      saveName: attachmentSaveName(email, item.att.name, item.att.type),
+    }
+    : { from: 'bytes', bytes: item.part.bytes, name: item.name, type: item.type, size: item.size });
+
+  // The in-app preview where the type has one, else straight to another app.
+  const showPreview = (item: Item) => run(
+    item.key,
+    () => preview.open(sourceOf(item)),
+    t('email_viewer.attachment_failed', 'Could not open attachment'),
+  );
 
   const onTap = (item: Item) => {
     if (mailAttachmentAction === 'download') void save(item);
-    else showPreview(item);
+    else void showPreview(item);
   };
 
   const downloadAll = () => run('__all__', async () => {
@@ -204,11 +166,11 @@ export function AttachmentChips({ email, jmapAccountId, calendarBannerShown, tne
 
   const visible = expanded ? items : items.slice(0, 3);
   const sheetActions: ActionSheetItem[] = sheetItem ? [
-    ...(previewKindFor({ name: sheetItem.name, type: sheetItem.type }) !== 'none' ? [{
+    ...(previewKindOf(sheetItem) !== 'none' ? [{
       key: 'preview',
       label: t('email_viewer.attachment_actions.preview', 'Preview'),
       icon: <Eye size={18} color={c.textSecondary} />,
-      onPress: () => { const it = sheetItem; setSheetItem(null); showPreview(it); },
+      onPress: () => { const it = sheetItem; setSheetItem(null); void showPreview(it); },
     }] : []),
     {
       key: 'open',
@@ -278,36 +240,7 @@ export function AttachmentChips({ email, jmapAccountId, calendarBannerShown, tne
         onClose={() => setSheetItem(null)}
       />
 
-      <AttachmentPreviewModal
-        item={preview}
-        loading={previewLoading}
-        onClose={() => {
-          endPreview();
-          setPreview(null);
-          setPreviewLoading(false);
-        }}
-        onOpenExternal={() => {
-          const it = previewSource.current;
-          if (!it) return;
-          if (preview?.fileUri && it.kind === 'blob') {
-            void run(it.key, () => shareAttachment(it.att.blobId, it.att.name, it.att.type, email, jmapAccountId), t('email_viewer.attachment_failed', 'Could not open attachment'));
-          } else {
-            void open(it);
-          }
-        }}
-        onShare={() => {
-          const it = previewSource.current;
-          if (!it) return;
-          const open = previewFile.current;
-          if (open) {
-            // The receiving app may keep reading it after the sheet closes.
-            open.handedOff = true;
-            void shareLocalFile(open.file, it.type, it.name, { forceSheet: true, keep: true }).catch(() => undefined);
-          } else {
-            void share(it);
-          }
-        }}
-      />
+      <AttachmentPreviewModal {...preview.modalProps} />
     </View>
   );
 }

src/components/email/ListAttachmentChips.tsx

@@ -15,9 +15,10 @@ import {
   attachmentKind, realAttachments, requestListAttachments, shortAttachmentName,
   type AttachmentKind, type LoadListAttachments,
 } from '../../lib/list-attachments';
-import { getAttachmentDisplayName, previewKindFor } from '../../lib/attachment-display';
-import { cacheBlobFile, downloadAttachment, fetchBlobBytes, shareAttachment, shareLocalFile } from '../../lib/email-export';
-import { AttachmentPreviewModal, type PreviewItem } from './AttachmentPreviewModal';
+import { getAttachmentDisplayName } from '../../lib/attachment-display';
+import { attachmentSaveName, downloadAttachment } from '../../lib/email-export';
+import { AttachmentPreviewModal } from './AttachmentPreviewModal';
+import { useFilePreview } from './use-file-preview';
 
 /** How many chips a row shows before collapsing the rest into a count. */
 const MAX_CHIPS = 2;
@@ -124,26 +125,16 @@ export interface ListAttachmentOpenerHandle {
   open: (email: Email, attachment: Attachment, accountId?: string) => void;
 }
 
-interface OpenTarget {
-  email: Email;
-  attachment: Attachment;
-  accountId?: string;
-  name: string;
-  type: string;
-}
-
 /**
  * Opens a list-row attachment the way the reader's chips do: the "attachment
- * click action" setting either saves it or previews it in-app (images, PDFs,
- * text), and anything that can't be previewed goes to the platform viewer.
- * Holds the preview modal, so the list itself never re-renders for it.
+ * click action" setting either saves it or previews it in-app, and anything
+ * that can't be previewed goes to another app. Holds the preview modal, so
+ * the list itself never re-renders for it.
  */
 export const ListAttachmentOpener = React.forwardRef<ListAttachmentOpenerHandle>(
   function ListAttachmentOpener(_props, ref) {
     const t = useLocaleStore((s) => s.t);
-    const [preview, setPreview] = React.useState<PreviewItem | null>(null);
-    const [loading, setLoading] = React.useState(false);
-    const target = React.useRef<OpenTarget | null>(null);
+    const preview = useFilePreview();
     const busy = React.useRef(false);
 
     const run = React.useCallback(async (fn: () => Promise<void>) => {
@@ -161,59 +152,27 @@ export const ListAttachmentOpener = React.forwardRef<ListAttachmentOpenerHandle>
       }
     }, [t]);
 
-    const openExternal = React.useCallback((it: OpenTarget) => run(
-      () => shareAttachment(it.attachment.blobId, it.attachment.name, it.attachment.type, it.email, it.accountId),
-    ), [run]);
-
+    const { open: openPreview } = preview;
     React.useImperativeHandle(ref, () => ({
       open: (email, attachment, accountId) => {
-        if (busy.current) return;
-        const name = getAttachmentDisplayName(attachment.name, attachment.type);
-        const type = attachment.type || 'application/octet-stream';
-        const it: OpenTarget = { email, attachment, accountId, name, type };
-        target.current = it;
-
         if (useSettingsStore.getState().mailAttachmentAction === 'download') {
           void run(() => downloadAttachment(attachment.blobId, attachment.name, attachment.type, email, accountId));
           return;
         }
-        const kind = previewKindFor({ name, type });
-        if (kind !== 'image' && kind !== 'pdf' && kind !== 'text') {
-          void openExternal(it);
-          return;
-        }
-        setPreview(null);
-        setLoading(true);
-        void run(async () => {
-          try {
-            if (kind === 'text') {
-              const bytes = await fetchBlobBytes(attachment.blobId, attachment.name, attachment.type, accountId);
-              setPreview({ kind, name, mimeType: type, text: new TextDecoder('utf-8').decode(bytes) });
-            } else {
-              const file = await cacheBlobFile(attachment.blobId, name, type, accountId);
-              setPreview({ kind, name, mimeType: type, fileUri: file.uri });
-            }
-          } finally {
-            setLoading(false);
-          }
-        });
+        void run(() => openPreview({
+          from: 'blob',
+          blobId: attachment.blobId,
+          accountId,
+          email,
+          name: getAttachmentDisplayName(attachment.name, attachment.type),
+          type: attachment.type || 'application/octet-stream',
+          size: attachment.size,
+          saveName: attachmentSaveName(email, attachment.name, attachment.type),
+        }));
       },
-    }), [run, openExternal]);
+    }), [run, openPreview]);
 
-    return (
-      <AttachmentPreviewModal
-        item={preview}
-        loading={loading}
-        onClose={() => { setPreview(null); setLoading(false); }}
-        onOpenExternal={() => { if (target.current) void openExternal(target.current); }}
-        onShare={() => {
-          const it = target.current;
-          if (!it || !preview?.fileUri) return;
-          const { File } = require('expo-file-system') as typeof import('expo-file-system');
-          void shareLocalFile(new File(preview.fileUri), it.type, it.name, { forceSheet: true }).catch(() => undefined);
-        }}
-      />
-    );
+    return <AttachmentPreviewModal {...preview.modalProps} />;
   },
 );
 

src/components/email/use-file-preview.ts

@@ -0,0 +1,205 @@
+import React from 'react';
+import { Alert, Platform } from 'react-native';
+import type { File } from 'expo-file-system';
+import type { Email } from '../../api/types';
+import {
+  cachePreviewFile, copyPreviewFile, discardPreviewFile, saveLocalFileCopy, shareAttachment,
+  shareBytes, shareLocalFile, writePreviewFile,
+} from '../../lib/email-export';
+import {
+  exceedsPreviewLimit, inAppPreviewKind, type FilePreviewOptions,
+} from '../../lib/file-preview';
+import type { PreviewKind } from '../../lib/attachment-display';
+import { useLocaleStore } from '../../stores/locale-store';
+import type { PreviewItem } from './AttachmentPreviewModal';
+import { emlPreviewFromBytes } from './use-body-override';
+
+export const PREVIEW_OPTIONS: FilePreviewOptions = { inlinePdf: Platform.OS === 'ios' };
+
+interface PreviewSourceBase {
+  /** Display name, shown in the header and given to the cached copy. */
+  name: string;
+  type: string;
+  size?: number | null;
+  /** Name for "Download" (the attachment filename template); defaults to `name`. */
+  saveName?: string;
+}
+
+/** Where a previewed file comes from. */
+export type PreviewSource = PreviewSourceBase & (
+  | { from: 'blob'; blobId: string; accountId?: string; email?: Email | null }
+  | { from: 'bytes'; bytes: Uint8Array }
+  | { from: 'local'; uri: string }
+);
+
+/** The preview a tap on `source` opens, or 'none' when it goes to another app. */
+export function previewKindOf(source: Pick<PreviewSource, 'name' | 'type' | 'size'>): PreviewKind {
+  return inAppPreviewKind(source, PREVIEW_OPTIONS);
+}
+
+/** Copy the source into a preview folder of its own (see cachePreviewFile). */
+async function materialize(source: PreviewSource): Promise<File> {
+  switch (source.from) {
+    case 'blob':
+      return cachePreviewFile(source.blobId, source.name, source.type, source.accountId);
+    case 'bytes':
+      return writePreviewFile(source.bytes, source.name, source.type);
+    case 'local':
+      return copyPreviewFile(source.uri, source.name, source.type);
+  }
+}
+
+/** Hand a file the app doesn't show to the app that owns its type ("Open with"). */
+function handOff(source: PreviewSource): Promise<void> {
+  switch (source.from) {
+    case 'blob':
+      return shareAttachment(source.blobId, source.name, source.type, source.email, source.accountId);
+    case 'bytes':
+      return shareBytes(source.bytes, source.name, source.type);
+    case 'local':
+      // A copy, so the cleanup after the hand-off never removes the original.
+      return shareLocalFile(copyPreviewFile(source.uri, source.name, source.type), source.type, source.name);
+  }
+}
+
+async function buildItem(
+  kind: Exclude<PreviewKind, 'none'>,
+  source: PreviewSource,
+  local: File,
+  tooLarge: string,
+): Promise<PreviewItem> {
+  const base = { name: source.name, mimeType: source.type };
+  // The source may not know its size; the copy does.
+  if (exceedsPreviewLimit(kind, local.size)) return { ...base, kind: 'none', notice: tooLarge };
+  switch (kind) {
+    case 'text':
+      return { ...base, kind, text: await local.text() };
+    case 'eml':
+      return { ...base, kind, eml: await emlPreviewFromBytes(await local.bytes()) };
+    default:
+      return { ...base, kind, fileUri: local.uri };
+  }
+}
+
+/**
+ * One in-app preview: picks how a file is shown, downloads it once into a
+ * temp folder of its own, and serves Open with, Share and Download from that
+ * copy. Files the app can't show go straight to another app. The copy is
+ * deleted when the preview closes or the next one opens, unless another app
+ * got it, which may still be reading it; the stale-export sweep removes
+ * those. Used by every place that opens a file: the reader's chips, the
+ * list's chips, the Files tab and compose.
+ *
+ * Render `<AttachmentPreviewModal {...preview.modalProps} />` next to it.
+ */
+export function useFilePreview(opts: {
+  /** Called when the preview closes: the close button, or a download that failed. */
+  onClose?: () => void;
+} = {}) {
+  const t = useLocaleStore((s) => s.t);
+  const onCloseRef = React.useRef(opts.onClose);
+  onCloseRef.current = opts.onClose;
+  const [item, setItem] = React.useState<PreviewItem | null>(null);
+  const [loading, setLoading] = React.useState(false);
+  const [title, setTitle] = React.useState('');
+  const source = React.useRef<PreviewSource | null>(null);
+  const session = React.useRef<{ file: File; handedOff: boolean } | null>(null);
+  // Bumped whenever a preview ends, so a download that finishes after its
+  // preview was closed is dropped instead of reopening it.
+  const seq = React.useRef(0);
+  const busy = React.useRef(false);
+
+  const end = React.useCallback(() => {
+    seq.current += 1;
+    const open = session.current;
+    session.current = null;
+    if (open && !open.handedOff) discardPreviewFile(open.file);
+  }, []);
+  React.useEffect(() => end, [end]);
+
+  /** Close without telling the owner (it closed the preview itself). */
+  const reset = React.useCallback(() => {
+    end();
+    source.current = null;
+    setItem(null);
+    setLoading(false);
+  }, [end]);
+
+  const close = React.useCallback(() => {
+    reset();
+    onCloseRef.current?.();
+  }, [reset]);
+
+  /**
+   * Show `src` in the preview, or hand it to another app when the preview
+   * can't show it. The promise settles once that hand-off is done (and
+   * rejects when it fails); a preview resolves at once.
+   */
+  const open = React.useCallback((src: PreviewSource): Promise<void> => {
+    const kind = previewKindOf(src);
+    if (kind === 'none') return handOff(src);
+    end();
+    source.current = src;
+    const mine = seq.current;
+    const current = () => mine === seq.current;
+    setTitle(src.name);
+    setItem(null);
+    setLoading(true);
+    void (async () => {
+      try {
+        const local = await materialize(src);
+        if (!current()) {
+          discardPreviewFile(local);
+          return;
+        }
+        session.current = { file: local, handedOff: false };
+        const next = await buildItem(kind, src, local, t('files.preview_too_large', 'This file is too large to preview.'));
+        if (current()) setItem(next);
+      } catch (e) {
+        if (!current()) return;
+        close();
+        Alert.alert(t('files.preview_error', 'Failed to load preview'), e instanceof Error ? e.message : String(e));
+      } finally {
+        if (current()) setLoading(false);
+      }
+    })();
+    return Promise.resolve();
+  }, [end, close, t]);
+
+  // The preview's own buttons, all on the downloaded copy.
+  const act = React.useCallback((run: (local: File, src: PreviewSource) => Promise<void>, handsOff: boolean, failTitle: string) => {
+    const open = session.current;
+    const src = source.current;
+    if (!open || !src || busy.current) return;
+    busy.current = true;
+    // Another app may keep reading the file after the sheet or viewer returns.
+    if (handsOff) open.handedOff = true;
+    run(open.file, src)
+      .catch((e) => Alert.alert(failTitle, e instanceof Error ? e.message : String(e)))
+      .finally(() => { busy.current = false; });
+  }, []);
+
+  const modalProps = React.useMemo(() => ({
+    item,
+    loading,
+    title,
+    onClose: close,
+    onOpenExternal: () => act(
+      (local, src) => shareLocalFile(local, src.type, src.name, { keep: true }),
+      true,
+      t('files.open_error', 'Could not open the file'),
+    ),
+    onShare: () => act(
+      (local, src) => shareLocalFile(local, src.type, src.name, { forceSheet: true, keep: true }),
+      true,
+      t('files.share_file_error', 'Could not share the file'),
+    ),
+    onDownload: () => act(
+      (local, src) => saveLocalFileCopy(local, src.type, src.saveName ?? src.name),
+      false,
+      t('files.download_error', 'Failed to download'),
+    ),
+  }), [item, loading, title, close, act, t]);
+
+  return { open, close, reset, modalProps };
+}

src/components/files/FilePreviewModal.tsx

@@ -1,24 +1,13 @@
 import React from 'react';
-import { Alert, Platform } from 'react-native';
-import type { File } from 'expo-file-system';
 import type { FileNode } from '../../api/types';
-import {
-  cachePreviewFile, discardPreviewFile, saveLocalFileCopy, shareLocalFile,
-} from '../../lib/email-export';
-import {
-  exceedsPreviewLimit, inAppPreviewKind, type FilePreviewOptions,
-} from '../../lib/file-preview';
-import { useLocaleStore } from '../../stores/locale-store';
-import { AttachmentPreviewModal, type PreviewItem } from '../email/AttachmentPreviewModal';
-import { emlPreviewFromBytes } from '../email/use-body-override';
-
-const PREVIEW_OPTIONS: FilePreviewOptions = { inlinePdf: Platform.OS === 'ios' };
+import { AttachmentPreviewModal } from '../email/AttachmentPreviewModal';
+import { previewKindOf, useFilePreview } from '../email/use-file-preview';
 
 export type PreviewableFileNode = Pick<FileNode, 'name' | 'type' | 'size' | 'blobId' | 'accountId'>;
 
 /** Whether a tap on this file opens the in-app preview (else the OS chooser, as before). */
 export function canPreviewInApp(node: PreviewableFileNode): boolean {
-  return !!node.blobId && inAppPreviewKind(node, PREVIEW_OPTIONS) !== 'none';
+  return !!node.blobId && previewKindOf({ name: node.name, type: node.type || '', size: node.size }) !== 'none';
 }
 
 interface Props {
@@ -30,22 +19,13 @@ interface Props {
 }
 
 /**
- * The Files tab's in-app preview: the reader's attachment preview fed from a
- * FileNode. The file is downloaded once, with the same authenticated
- * download as "Download" (token refresh, client certificate), into its own
- * temp folder; Open with, Share and Download then all use that copy instead
- * of fetching it again. The copy is deleted when the preview closes, unless
- * another app got it, in which case the stale-export sweep removes it.
+ * The Files tab's in-app preview: the shared file preview fed from a
+ * FileNode, downloaded with the same authenticated download as "Download"
+ * (token refresh, client certificate).
  */
 export function FilePreviewModal({ file, onClose, docked = false }: Props) {
-  const t = useLocaleStore((s) => s.t);
-  const [item, setItem] = React.useState<PreviewItem | null>(null);
-  const [loading, setLoading] = React.useState(false);
-  // The downloaded copy of the open preview.
-  const session = React.useRef<{ file: File; handedOff: boolean } | null>(null);
-  const busy = React.useRef(false);
-  const onCloseRef = React.useRef(onClose);
-  onCloseRef.current = onClose;
+  const preview = useFilePreview({ onClose });
+  const { open, reset } = preview;
 
   const blobId = file?.blobId ?? null;
   const accountId = file?.accountId;
@@ -55,93 +35,9 @@ export function FilePreviewModal({ file, onClose, docked = false }: Props) {
 
   React.useEffect(() => {
     if (!blobId) return undefined;
-    let cancelled = false;
-    setItem(null);
-    setLoading(true);
+    void open({ from: 'blob', blobId, accountId, name, type, size });
+    return reset;
+  }, [blobId, accountId, name, type, size, open, reset]);
 
-    const build = async (local: File): Promise<PreviewItem> => {
-      const kind = inAppPreviewKind({ name, type, size }, PREVIEW_OPTIONS);
-      // The node may not report a size; the download does.
-      if (kind === 'none' || exceedsPreviewLimit(kind, local.size)) {
-        return {
-          kind: 'none',
-          name,
-          mimeType: type,
-          notice: kind === 'none' ? undefined : t('files.preview_too_large', 'This file is too large to preview.'),
-        };
-      }
-      switch (kind) {
-        case 'text':
-          return { kind, name, mimeType: type, text: await local.text() };
-        case 'eml':
-          return { kind, name, mimeType: type, eml: await emlPreviewFromBytes(await local.bytes()) };
-        default:
-          return { kind, name, mimeType: type, fileUri: local.uri };
-      }
-    };
-
-    void (async () => {
-      try {
-        const local = await cachePreviewFile(blobId, name, type, accountId);
-        if (cancelled) {
-          discardPreviewFile(local);
-          return;
-        }
-        session.current = { file: local, handedOff: false };
-        const next = await build(local);
-        if (!cancelled) setItem(next);
-      } catch (e) {
-        if (cancelled) return;
-        Alert.alert(t('files.preview_error', 'Failed to load preview'), e instanceof Error ? e.message : String(e));
-        onCloseRef.current();
-      } finally {
-        if (!cancelled) setLoading(false);
-      }
-    })();
-
-    return () => {
-      cancelled = true;
-      const open = session.current;
-      session.current = null;
-      if (open && !open.handedOff) discardPreviewFile(open.file);
-      setItem(null);
-      setLoading(false);
-    };
-  }, [blobId, accountId, name, type, size, t]);
-
-  const act = (run: (local: File) => Promise<void>, handsOff: boolean, failTitle: string) => {
-    const open = session.current;
-    if (!open || busy.current) return;
-    busy.current = true;
-    // Another app may keep reading the file after the sheet or viewer returns.
-    if (handsOff) open.handedOff = true;
-    run(open.file)
-      .catch((e) => Alert.alert(failTitle, e instanceof Error ? e.message : String(e)))
-      .finally(() => { busy.current = false; });
-  };
-
-  return (
-    <AttachmentPreviewModal
-      item={item}
-      loading={loading}
-      title={name}
-      docked={docked}
-      onClose={onClose}
-      onOpenExternal={() => act(
-        (local) => shareLocalFile(local, type, name, { keep: true }),
-        true,
-        t('files.open_error', 'Could not open the file'),
-      )}
-      onShare={() => act(
-        (local) => shareLocalFile(local, type, name, { forceSheet: true, keep: true }),
-        true,
-        t('files.share_file_error', 'Could not share the file'),
-      )}
-      onDownload={() => act(
-        (local) => saveLocalFileCopy(local, type),
-        false,
-        t('files.download_error', 'Failed to download'),
-      )}
-    />
-  );
+  return <AttachmentPreviewModal {...preview.modalProps} docked={docked} />;
 }

src/lib/__tests__/calendar-sort.test.ts

@@ -0,0 +1,94 @@
+import { describe, it, expect } from 'vitest';
+import { compareCalendars, moveCalendar, sortCalendars, sortOrderUpdates } from '../calendar-sort';
+import type { Calendar } from '../../api/types';
+
+function cal(overrides: Partial<Calendar>): Calendar {
+  return { id: 'c', name: 'Cal', sortOrder: 0, ...overrides };
+}
+
+const names = (list: Calendar[]) => list.map((c) => c.name);
+const ids = (list: Calendar[]) => list.map((c) => c.id);
+
+describe('sortCalendars', () => {
+  it('orders by sortOrder, whatever order the server listed them in', () => {
+    const list = [
+      cal({ id: 'b', name: 'Default', sortOrder: 20 }),
+      cal({ id: 'n', name: 'Holidays', sortOrder: 30 }),
+      cal({ id: 'e', name: 'Work', sortOrder: 1 }),
+      cal({ id: 'd', name: 'Personal', sortOrder: 10 }),
+    ];
+    expect(names(sortCalendars(list))).toEqual(['Work', 'Personal', 'Default', 'Holidays']);
+  });
+
+  it('sorts equal sortOrder by name, ignoring case and accents, numbers by value', () => {
+    const list = [
+      cal({ id: '1', name: 'zeta' }),
+      cal({ id: '2', name: 'Team 10' }),
+      cal({ id: '3', name: 'Éclair' }),
+      cal({ id: '4', name: 'alpha' }),
+      cal({ id: '5', name: 'Team 2' }),
+      cal({ id: '6', name: 'Beta' }),
+    ];
+    expect(names(sortCalendars(list))).toEqual(['alpha', 'Beta', 'Éclair', 'Team 2', 'Team 10', 'zeta']);
+  });
+
+  it('treats a missing sortOrder as 0', () => {
+    const list = [cal({ id: 'a', name: 'B', sortOrder: 1 }), cal({ id: 'b', name: 'A', sortOrder: undefined })];
+    expect(names(sortCalendars(list))).toEqual(['A', 'B']);
+  });
+
+  it('keeps each account together, in the order the accounts came', () => {
+    const list = [
+      cal({ id: 'own-2', name: 'Own 2', sortOrder: 2 }),
+      cal({ id: 'own-1', name: 'Own 1', sortOrder: 1 }),
+      cal({ id: 'x:b', name: 'Shared B', sortOrder: 0, isShared: true, accountId: 'x' }),
+      cal({ id: 'y:a', name: 'Other A', sortOrder: 0, isShared: true, accountId: 'y' }),
+      cal({ id: 'x:a', name: 'Shared A', sortOrder: 5, isShared: true, accountId: 'x' }),
+    ];
+    expect(ids(sortCalendars(list))).toEqual(['own-1', 'own-2', 'x:b', 'x:a', 'y:a']);
+  });
+
+  it('does not change the list it is given', () => {
+    const list = [cal({ id: 'b', sortOrder: 2 }), cal({ id: 'a', sortOrder: 1 })];
+    sortCalendars(list);
+    expect(ids(list)).toEqual(['b', 'a']);
+  });
+
+  it('compareCalendars puts the lower sortOrder first', () => {
+    expect(compareCalendars(cal({ sortOrder: 1, name: 'Z' }), cal({ sortOrder: 2, name: 'A' }))).toBeLessThan(0);
+  });
+});
+
+describe('sortOrderUpdates', () => {
+  it('numbers the calendars 1, 2, 3 in the given order and skips unchanged ones', () => {
+    const list = [cal({ id: 'a', sortOrder: 1 }), cal({ id: 'b', sortOrder: 2 }), cal({ id: 'c', sortOrder: 3 })];
+    expect(sortOrderUpdates(list, ['a', 'c', 'b'])).toEqual([
+      { id: 'c', sortOrder: 2 },
+      { id: 'b', sortOrder: 3 },
+    ]);
+  });
+});
+
+describe('moveCalendar', () => {
+  const list = [
+    cal({ id: 'work', name: 'Work', sortOrder: 1 }),
+    cal({ id: 'home', name: 'Home', sortOrder: 10 }),
+    cal({ id: 'tasks', name: 'Tasks', sortOrder: 15 }),
+    cal({ id: 'holidays', name: 'Holidays', sortOrder: 30 }),
+    cal({ id: 'x:team', name: 'Team', sortOrder: 0, isShared: true, accountId: 'x' }),
+  ];
+
+  it('moving up puts the calendar just before the target', () => {
+    expect(moveCalendar(list, 'holidays', 'home')).toEqual(['work', 'holidays', 'home', 'tasks']);
+  });
+
+  it('moving down puts the calendar just after the target', () => {
+    expect(moveCalendar(list, 'work', 'home')).toEqual(['home', 'work', 'tasks', 'holidays']);
+  });
+
+  it('refuses a move across accounts, onto itself or to an unknown id', () => {
+    expect(moveCalendar(list, 'work', 'x:team')).toBeNull();
+    expect(moveCalendar(list, 'work', 'work')).toBeNull();
+    expect(moveCalendar(list, 'work', 'gone')).toBeNull();
+  });
+});

src/lib/__tests__/draft-part-blobs.test.ts

@@ -0,0 +1,100 @@
+import { describe, it, expect } from 'vitest';
+import {
+  initialDraftPartBlobState, liveBlobId, matchDraftParts, rebaseDraftPartBlobs, withSnapshotBody,
+} from '../draft-part-blobs';
+import type { OutgoingAttachment } from '../../api/email';
+
+const inline = (blobId: string, cid: string, name = 'img.png', size = 10): OutgoingAttachment => ({
+  blobId, cid, name, size, type: 'image/png', disposition: 'inline',
+});
+const file = (blobId: string, name: string, size: number): OutgoingAttachment => ({
+  blobId, name, size, type: 'application/pdf', disposition: 'attachment',
+});
+
+describe('matchDraftParts', () => {
+  it('pairs inline parts by Content-ID, brackets and case aside', () => {
+    const pairs = matchDraftParts(
+      [inline('old-a', 'a@x'), inline('old-b', 'b@x')],
+      [
+        { blobId: 'new-b', cid: '<B@x>', name: 'img.png', size: 10 },
+        { blobId: 'new-a', cid: '<a@x>', name: 'img.png', size: 10 },
+      ],
+    );
+    expect(pairs).toEqual(new Map([['old-a', 'new-a'], ['old-b', 'new-b']]));
+  });
+
+  it('pairs file attachments by name and size, claiming each new part once', () => {
+    const pairs = matchDraftParts(
+      [file('old-1', 'q.pdf', 5), file('old-2', 'q.pdf', 5), file('old-3', 'r.pdf', 7)],
+      [
+        { blobId: 'new-r', name: 'r.pdf', size: 7 },
+        { blobId: 'new-q1', name: 'q.pdf', size: 5 },
+        { blobId: 'new-q2', name: 'q.pdf', size: 5 },
+      ],
+    );
+    expect(pairs.get('old-1')).toBe('new-q1');
+    expect(pairs.get('old-2')).toBe('new-q2');
+    expect(pairs.get('old-3')).toBe('new-r');
+  });
+
+  it('leaves a part it cannot find unpaired', () => {
+    expect(matchDraftParts([file('old', 'gone.pdf', 1)], [{ blobId: 'n', name: 'other.pdf', size: 1 }]).size).toBe(0);
+  });
+});
+
+describe('rebaseDraftPartBlobs (webmail #849, second half)', () => {
+  it('follows the draft across successive saves so no save sends a destroyed part', () => {
+    // Re-opened draft D0 with one inline image and one PDF.
+    let state = initialDraftPartBlobState();
+    const sentAt = () => [inline(liveBlobId(state, 'd0-img'), 'img@x'), file(liveBlobId(state, 'd0-pdf'), 'q.pdf', 5)];
+
+    // Save 1 sends D0's parts (D0 is still alive), creates D1, destroys D0.
+    expect(sentAt().map((a) => a.blobId)).toEqual(['d0-img', 'd0-pdf']);
+    state = rebaseDraftPartBlobs(state, sentAt(), [
+      { blobId: 'd1-img', cid: '<img@x>', name: 'img.png', size: 10 },
+      { blobId: 'd1-pdf', name: 'q.pdf', size: 5 },
+    ]);
+    // Save 2 / send must reference D1's parts, not D0's dead ones.
+    expect(sentAt().map((a) => a.blobId)).toEqual(['d1-img', 'd1-pdf']);
+    state = rebaseDraftPartBlobs(state, sentAt(), [
+      { blobId: 'd2-img', cid: '<img@x>', name: 'img.png', size: 10 },
+      { blobId: 'd2-pdf', name: 'q.pdf', size: 5 },
+    ]);
+    expect(sentAt().map((a) => a.blobId)).toEqual(['d2-img', 'd2-pdf']);
+  });
+
+  it('re-points uploads too: an upload expires once nothing references it', () => {
+    let state = initialDraftPartBlobState();
+    const sent = () => [inline(liveBlobId(state, 'd0-img'), 'img@x'), file(liveBlobId(state, 'upload-1'), 'new.pdf', 3)];
+    state = rebaseDraftPartBlobs(state, sent(), [
+      { blobId: 'd1-img', cid: '<img@x>', name: 'img.png', size: 10 },
+      { blobId: 'd1-new', name: 'new.pdf', size: 3 },
+    ]);
+    expect(sent().map((a) => a.blobId)).toEqual(['d1-img', 'd1-new']);
+  });
+
+  it('leaves the state alone when nothing was sent', () => {
+    const state = initialDraftPartBlobState();
+    expect(rebaseDraftPartBlobs(state, [], [{ blobId: 'p', name: 'a.pdf', size: 1 }])).toBe(state);
+  });
+
+  it('keeps the old id when the read-back came back empty (next save fails loudly, nothing is lost)', () => {
+    const state = initialDraftPartBlobState();
+    const next = rebaseDraftPartBlobs(state, [inline('d0-img', 'img@x')], []);
+    expect(liveBlobId(next, 'd0-img')).toBe('d0-img');
+  });
+});
+
+describe('withSnapshotBody', () => {
+  it('replaces only the body of a composer snapshot', () => {
+    const snap = JSON.stringify({ to: [['A', 'a@x', null]], cc: [], bcc: [], subject: 'S', body: '<p>raw</p>', att: ['b1'] });
+    expect(JSON.parse(withSnapshotBody(snap, '<p>normalised</p>'))).toEqual({
+      to: [['A', 'a@x', null]], cc: [], bcc: [], subject: 'S', body: '<p>normalised</p>', att: ['b1'],
+    });
+  });
+
+  it('keeps the key order, so an unchanged composer still compares equal', () => {
+    const make = (body: string) => JSON.stringify({ to: [], cc: [], bcc: [], subject: 'S', body, att: [] });
+    expect(withSnapshotBody(make('<p>raw</p>'), '<p>x</p>')).toBe(make('<p>x</p>'));
+  });
+});

src/lib/__tests__/editor-html.test.ts

@@ -196,3 +196,87 @@ describe('editor page messages', () => {
     expect((page.selections()[1].payload as { bold: boolean }).bold).toBe(true);
   });
 });
+
+// Android pans the editor page's visual viewport to reveal the caret and the
+// pan outlived the moment: back at the top of the composer the body's first
+// lines stayed hidden under To/Cc/Subject. The page undoes each pan and hands
+// the offset to RN instead.
+describe('editor visual viewport pinning', () => {
+  function boot(pinVisualViewport: boolean | undefined, withVisualViewport = true) {
+    const posted: Array<{ type: string; payload: unknown }> = [];
+    const scrolledIntoView: unknown[] = [];
+    const vvListeners: Record<string, Array<() => void>> = {};
+    const visualViewport = {
+      offsetTop: 0,
+      addEventListener: (name: string, fn: () => void) => { (vvListeners[name] ??= []).push(fn); },
+    };
+    const editor = {
+      innerHTML: '',
+      get textContent() { return this.innerHTML.replace(/<[^>]*>/g, ''); },
+      scrollHeight: 100,
+      querySelector: () => null,
+      setAttribute: () => undefined,
+      focus: () => undefined,
+      addEventListener: () => undefined,
+      // Resetting the pan is what scrolling the page top into view does.
+      scrollIntoView: (opts: unknown) => { scrolledIntoView.push(opts); visualViewport.offsetTop = 0; },
+    };
+    const document = {
+      activeElement: editor as unknown,
+      getElementById: () => editor,
+      addEventListener: () => undefined,
+      queryCommandState: () => false,
+    };
+    const window = {
+      ReactNativeWebView: { postMessage: (msg: string) => posted.push(JSON.parse(msg)) },
+      addEventListener: () => undefined,
+      getSelection: () => null,
+      visualViewport: withVisualViewport ? visualViewport : undefined,
+    };
+    const script = extractScript(buildEditorHtml({
+      initialHtml: '<p><br></p>', placeholder: '', c: LIGHT_COLORS, pinVisualViewport,
+    }));
+    new Function('window', 'document', script)(window, document);
+    const pan = (offsetTop: number) => {
+      visualViewport.offsetTop = offsetTop;
+      (vvListeners.scroll ?? []).forEach((fn) => fn());
+    };
+    const shifts = () => posted.filter((m) => m.type === 'viewportShift').map((m) => m.payload);
+    return { pan, shifts, scrolledIntoView, visualViewport, vvListeners };
+  }
+
+  it('undoes a caret-reveal pan and reports its offset to RN', () => {
+    const page = boot(true);
+    page.pan(18.5);
+    expect(page.visualViewport.offsetTop).toBe(0);
+    expect(page.scrolledIntoView).toEqual([{ block: 'start', inline: 'nearest' }]);
+    expect(page.shifts()).toEqual([18.5]);
+  });
+
+  it('ignores the scroll event its own reset fires', () => {
+    const page = boot(true);
+    page.pan(40);
+    page.pan(0);
+    page.pan(0.2);
+    expect(page.shifts()).toEqual([40]);
+    expect(page.scrolledIntoView).toHaveLength(1);
+  });
+
+  it('reports each later pan separately', () => {
+    const page = boot(true);
+    page.pan(12);
+    page.pan(30);
+    expect(page.shifts()).toEqual([12, 30]);
+  });
+
+  it('leaves the viewport alone unless asked (iOS, settings editors)', () => {
+    const off = boot(false);
+    expect(off.vvListeners.scroll).toBeUndefined();
+    const unset = boot(undefined);
+    expect(unset.vvListeners.scroll).toBeUndefined();
+  });
+
+  it('survives a WebView without visualViewport', () => {
+    expect(() => boot(true, false)).not.toThrow();
+  });
+});

src/lib/__tests__/postal-mime-rn.test.ts

@@ -0,0 +1,54 @@
+import { afterEach, beforeEach, describe, expect, it } from 'vitest';
+import PostalMime from 'postal-mime';
+
+// React Native's Blob only takes strings and other Blobs; building one from an
+// ArrayBuffer or typed array throws. postal-mime used to join every decoded
+// part through such a Blob, so an .eml with an attachment could not be
+// previewed on the device (patches/postal-mime+3.0.0.patch).
+class ReactNativeBlob {
+  constructor(parts: unknown[] = []) {
+    if (parts.some((p) => p instanceof ArrayBuffer || ArrayBuffer.isView(p))) {
+      throw new Error("Creating blobs from 'ArrayBuffer' and 'ArrayBufferView' are not supported");
+    }
+  }
+}
+
+const MESSAGE = [
+  'From: Carol <carol@example.org>',
+  'Subject: With parts',
+  'MIME-Version: 1.0',
+  'Content-Type: multipart/mixed; boundary="b1"',
+  '',
+  '--b1',
+  'Content-Type: text/plain; charset=utf-8',
+  'Content-Transfer-Encoding: quoted-printable',
+  '',
+  'Gr=C3=BC=C3=9Fe',
+  '--b1',
+  'Content-Type: application/octet-stream; name="a.bin"',
+  'Content-Transfer-Encoding: base64',
+  'Content-Disposition: attachment; filename="a.bin"',
+  '',
+  'AAECAwQF',
+  '--b1',
+  'Content-Type: text/plain; name="inner.txt"',
+  'Content-Disposition: attachment; filename="inner.txt"',
+  '',
+  'Inner text.',
+  '--b1--',
+  '',
+].join('\r\n');
+
+describe('postal-mime under React Native', () => {
+  const realBlob = globalThis.Blob;
+  beforeEach(() => { (globalThis as { Blob: unknown }).Blob = ReactNativeBlob; });
+  afterEach(() => { globalThis.Blob = realBlob; });
+
+  it('decodes base64, quoted-printable and plain parts without a Blob', async () => {
+    const parsed = await PostalMime.parse(new TextEncoder().encode(MESSAGE), { attachmentEncoding: 'arraybuffer' });
+    expect(parsed.text?.trim()).toBe('Grüße');
+    const [bin, txt] = parsed.attachments;
+    expect(Array.from(new Uint8Array(bin.content as ArrayBuffer))).toEqual([0, 1, 2, 3, 4, 5]);
+    expect(new TextDecoder().decode(txt.content as ArrayBuffer).trim()).toBe('Inner text.');
+  });
+});

src/lib/calendar-sort.ts

@@ -0,0 +1,69 @@
+import type { Calendar } from '../api/types';
+
+// Names compare the way the user reads them: accents and case are ignored, and
+// "Team 2" comes before "Team 10".
+const nameCollator = new Intl.Collator(undefined, { sensitivity: 'base', numeric: true });
+
+/**
+ * JMAP Calendars: a calendar with a lower `sortOrder` is shown first, and
+ * calendars with equal `sortOrder` are sorted by name. Mirrors the webmail.
+ */
+export function compareCalendars(a: Calendar, b: Calendar): number {
+  return (a.sortOrder ?? 0) - (b.sortOrder ?? 0) || nameCollator.compare(a.name ?? '', b.name ?? '');
+}
+
+/**
+ * Calendars of one account stay together: the user's own first, then each
+ * sharing account, as fetched.
+ */
+export function calendarAccountKey(calendar: Calendar): string {
+  return calendar.isShared ? calendar.accountId ?? '' : '';
+}
+
+/**
+ * The calendars in display order: grouped by account in the order the
+ * accounts first appear, and by `sortOrder`, then name, within each account.
+ */
+export function sortCalendars(calendars: Calendar[]): Calendar[] {
+  const accountRank = new Map<string, number>();
+  for (const calendar of calendars) {
+    const key = calendarAccountKey(calendar);
+    if (!accountRank.has(key)) accountRank.set(key, accountRank.size);
+  }
+  return [...calendars].sort((a, b) =>
+    accountRank.get(calendarAccountKey(a))! - accountRank.get(calendarAccountKey(b))! || compareCalendars(a, b),
+  );
+}
+
+/**
+ * `sortOrder` values that put `orderedIds` in that order: 1, 2, 3... Only the
+ * calendars whose value changes are returned.
+ */
+export function sortOrderUpdates(calendars: Calendar[], orderedIds: string[]): { id: string; sortOrder: number }[] {
+  const byId = new Map(calendars.map((calendar) => [calendar.id, calendar]));
+  const updates: { id: string; sortOrder: number }[] = [];
+  orderedIds.forEach((id, index) => {
+    const calendar = byId.get(id);
+    if (calendar && calendar.sortOrder !== index + 1) updates.push({ id, sortOrder: index + 1 });
+  });
+  return updates;
+}
+
+/**
+ * The ids of the calendar's account in display order once it is moved next to
+ * `targetId`: before the target when it moves up, after it when it moves down.
+ * Null when the move is not possible (unknown ids, or another account).
+ */
+export function moveCalendar(calendars: Calendar[], calendarId: string, targetId: string): string[] | null {
+  const sorted = sortCalendars(calendars);
+  const moving = sorted.find((calendar) => calendar.id === calendarId);
+  const target = sorted.find((calendar) => calendar.id === targetId);
+  if (!moving || !target || moving === target) return null;
+  const key = calendarAccountKey(moving);
+  if (calendarAccountKey(target) !== key) return null;
+  const group = sorted.filter((calendar) => calendarAccountKey(calendar) === key);
+  const movingDown = group.indexOf(moving) < group.indexOf(target);
+  const rest = group.filter((calendar) => calendar !== moving);
+  rest.splice(rest.indexOf(target) + (movingDown ? 1 : 0), 0, moving);
+  return rest.map((calendar) => calendar.id);
+}

src/lib/draft-part-blobs.ts

@@ -0,0 +1,108 @@
+// Keep a re-opened draft's attachments pointing at blobs that still exist.
+//
+// A draft's attachments and inline images are MIME parts of that draft, and a
+// part's blobId lives only as long as the message that holds it: once a save
+// creates the next version and destroys the previous one, the server forgets
+// the old part blobs (Stalwart answers `blobNotFound`, "blobId … does not
+// exist on this server"). The composer was seeded with those part blobIds, so
+// without a re-point the second save of a re-opened draft - and any send
+// after its first save - failed (webmail #849, second half).
+//
+// Upload blobs are only a reprieve: the server keeps an unreferenced upload
+// for a limited time, so every attachment is re-pointed at the parts of the
+// version each save creates.
+
+import type { Attachment } from '../api/types';
+import type { OutgoingAttachment } from '../api/email';
+import { stripMessageIdBrackets } from './email-threading';
+
+const normCid = (cid?: string | null) => (cid ? stripMessageIdBrackets(cid).trim().toLowerCase() : '');
+
+/**
+ * Pair each sent attachment with the part of the newly created version that
+ * carries the same content: inline parts by Content-ID, the rest by name and
+ * size. Each new part is claimed at most once. Returns sent blobId → new blobId.
+ */
+export function matchDraftParts(
+  sent: readonly OutgoingAttachment[],
+  fresh: readonly Pick<Attachment, 'blobId' | 'name' | 'size' | 'cid'>[],
+): Map<string, string> {
+  const out = new Map<string, string>();
+  const claimed = new Set<number>();
+  const claim = (s: OutgoingAttachment, test: (p: (typeof fresh)[number]) => boolean) => {
+    if (out.has(s.blobId)) return;
+    const i = fresh.findIndex((p, idx) => !claimed.has(idx) && !!p.blobId && test(p));
+    if (i === -1) return;
+    claimed.add(i);
+    out.set(s.blobId, fresh[i].blobId);
+  };
+  for (const s of sent) {
+    const cid = normCid(s.cid);
+    if (cid) claim(s, (p) => normCid(p.cid) === cid);
+  }
+  for (const s of sent) {
+    claim(s, (p) => (p.name || '') === (s.name || '') && (s.size == null || p.size === s.size));
+  }
+  return out;
+}
+
+export interface DraftPartBlobState {
+  /** blobId an attachment entry holds → blobId to send for it now. */
+  live: Map<string, string>;
+}
+
+export function initialDraftPartBlobState(): DraftPartBlobState {
+  return { live: new Map() };
+}
+
+/** The blobId to put on the wire for an entry that holds `blobId`. */
+export function liveBlobId(state: DraftPartBlobState, blobId: string): string {
+  return state.live.get(blobId) ?? blobId;
+}
+
+/**
+ * After a save: point every attachment that was sent at the matching part of
+ * the version just created. Those parts live exactly as long as the saved
+ * draft, so the next save or the send always references live blobs - whether
+ * the entry came from the previous version (dies with it) or from an upload
+ * (an unreferenced upload expires on the server). Blobs that could not be
+ * matched keep their id: the next save then fails loudly (and, with
+ * create-before-destroy, never loses the draft) instead of silently dropping
+ * an attachment.
+ */
+export function rebaseDraftPartBlobs(
+  state: DraftPartBlobState,
+  sent: readonly OutgoingAttachment[],
+  fresh: readonly Pick<Attachment, 'blobId' | 'name' | 'size' | 'cid'>[],
+): DraftPartBlobState {
+  const pairs = matchDraftParts(sent, fresh);
+  if (pairs.size === 0) return state;
+  const live = new Map(state.live);
+  const current = new Set(state.live.values());
+  for (const [held, sentId] of state.live) {
+    const next = pairs.get(sentId);
+    if (next) live.set(held, next);
+  }
+  for (const [sentId, next] of pairs) {
+    // An entry sent under its own blobId for the first time.
+    if (!current.has(sentId)) live.set(sentId, next);
+  }
+  return { live };
+}
+
+/**
+ * The composer's dirty snapshot with its body replaced. Opening a draft whose
+ * inline images get hydrated rewrites the editor body (normalised DOM HTML,
+ * data URLs for `cid:` images); that rewrite is not an edit, so the baseline
+ * has to follow it - comparing against the raw server HTML instead made every
+ * re-opened draft with inline images look edited, and the autosave replaced
+ * it (and destroyed the opened version) two seconds after opening.
+ */
+export function withSnapshotBody(snapshot: string, body: string): string {
+  try {
+    const parsed = JSON.parse(snapshot) as Record<string, unknown>;
+    return JSON.stringify({ ...parsed, body });
+  } catch {
+    return snapshot;
+  }
+}

src/lib/editor-html.ts

@@ -70,8 +70,14 @@ export function buildEditorHtml(opts: {
   c: ThemePalette;
   /** Block remote images and fonts (see `buildEditorCsp`). */
   blockRemoteImages?: boolean;
+  /**
+   * Keep the page's visual viewport at the top and report every pan to RN as
+   * a `viewportShift` (CSS px = dp) instead (see the page script). Android
+   * only: its WebView pans the visual viewport to reveal the caret.
+   */
+  pinVisualViewport?: boolean;
 }): string {
-  const { initialHtml, placeholder, c, blockRemoteImages = false } = opts;
+  const { initialHtml, placeholder, c, blockRemoteImages = false, pinVisualViewport = false } = opts;
   // Inject initial content as a JSON-encoded string so any HTML/quotes inside
   // are safely embedded (no template literal collision with the script body).
   const initialJson = JSON.stringify(initialHtml);
@@ -362,6 +368,27 @@ export function buildEditorHtml(opts: {
   reportHeight();
   reportChange();
 
+  // ── Visual viewport pinning (Android) ──────────────────────────────
+  // The WebView is as tall as its content and sits in RN's ScrollView, so
+  // the page itself never scrolls. But Android's WebView shrinks the visual
+  // viewport to the part of the view that is on screen (above the keyboard,
+  // below the header fields) and pans it to reveal the caret while typing.
+  // The pan outlives the moment: once the composer is scrolled back to the
+  // top the body is still drawn shifted up by that offset, so its first
+  // lines hide under To/Cc/Subject until a scroll to the very bottom clamps
+  // it away. Undo every pan at once (window.scrollTo only moves the layout
+  // viewport; scrolling the top of the page into view resets both) and hand
+  // the offset to RN, which scrolls the composer by as much so the caret
+  // stays where the pan had put it.
+  if (${pinVisualViewport ? 'true' : 'false'} && window.visualViewport) {
+    window.visualViewport.addEventListener('scroll', function () {
+      var shift = window.visualViewport.offsetTop;
+      if (Math.abs(shift) < 0.5) return;
+      try { editor.scrollIntoView({ block: 'start', inline: 'nearest' }); } catch (e) {}
+      post('viewportShift', shift);
+    });
+  }
+
   // Re-measure after async layout (image loads, font swap).
   window.addEventListener('load', function () {
     setTimeout(reportHeight, 50);

src/lib/email-export.ts

@@ -47,6 +47,11 @@ function attachmentFileOptions(): EmailFilenameOptions {
   };
 }
 
+/** The name "Save" gives an attachment of `email`: the user's attachment filename template. */
+export function attachmentSaveName(email: Email, name: string | undefined, type: string | undefined): string {
+  return attachmentDownloadFilename(email, { name, type }, attachmentFileOptions());
+}
+
 function safeAttachmentName(name: string | undefined, type: string | undefined): string {
   const fallbackExt = type?.split('/')[1]?.replace(/[^a-z0-9]/gi, '').slice(0, 8) || 'bin';
   const cleaned = (name ?? '').replace(/[\\/:*?"<>|]/g, '_').trim();
@@ -347,6 +352,20 @@ export async function cachePreviewFile(
   }
 }
 
+/**
+ * {@link cachePreviewFile} for a file already on the device (a compose
+ * attachment): copied, so the preview owns its copy and the original is never
+ * deleted with it.
+ */
+export function copyPreviewFile(uri: string, name: string | undefined, type: string | undefined): File {
+  void sweepStaleExportFiles();
+  const dir = newPreviewDir();
+  ensureDir(dir);
+  const file = new File(dir, safeAttachmentName(name, type));
+  new File(uri).copy(file);
+  return file;
+}
+
 /**
  * {@link cachePreviewFile} for bytes already in memory (parts unpacked on the
  * device, e.g. from winmail.dat).

src/screens/CalendarScreen.tsx

@@ -96,6 +96,7 @@ import {
   truncateRecurrenceRules,
 } from '../lib/recurrence-overrides';
 import { generateBirthdayEvents, createBirthdayCalendar, BIRTHDAY_CALENDAR_ID } from '../lib/birthday-calendar';
+import { moveCalendar } from '../lib/calendar-sort';
 import { useContactsStore } from '../stores/contacts-store';
 import { useLocaleStore } from '../stores/locale-store';
 import { useUserCalendarAddresses } from '../lib/calendar-user-addresses';
@@ -262,6 +263,7 @@ export default function CalendarScreen() {
   const setDefaultCalendar = useCalendarStore((s) => s.setDefaultCalendar);
   const createCalendar = useCalendarStore((s) => s.createCalendar);
   const updateCalendar = useCalendarStore((s) => s.updateCalendar);
+  const reorderCalendars = useCalendarStore((s) => s.reorderCalendars);
   const removeCalendar = useCalendarStore((s) => s.removeCalendar);
   const clearCalendarEvents = useCalendarStore((s) => s.clearCalendarEvents);
   const shareCalendar = useCalendarStore((s) => s.shareCalendar);
@@ -954,6 +956,14 @@ export default function CalendarScreen() {
     [setSharedCalendarColor, updateCalendar, reportError],
   );
 
+  const handleMoveCalendar = React.useCallback(
+    (cal: Calendar, targetId: string) => {
+      const orderedIds = moveCalendar(storeCalendars, cal.id, targetId);
+      if (orderedIds) reorderCalendars(orderedIds).catch(reportError);
+    },
+    [storeCalendars, reorderCalendars, reportError],
+  );
+
   const handleClearCalendar = React.useCallback(
     (cal: Calendar) => {
       Alert.alert(
@@ -1277,6 +1287,7 @@ export default function CalendarScreen() {
         onShare={(cal) => { setSidebarVisible(false); setShareTarget(cal); }}
         onClear={handleClearCalendar}
         onDelete={handleDeleteCalendar}
+        onMove={handleMoveCalendar}
         isSubscriptionCalendar={isSubscriptionCalendar}
       />
 

src/screens/ComposeScreen.tsx

@@ -17,7 +17,6 @@ import DateTimePicker, { type DateTimePickerEvent } from '@react-native-communit
 import * as ImagePicker from 'expo-image-picker';
 import * as DocumentPicker from 'expo-document-picker';
 import * as FileSystem from 'expo-file-system/legacy';
-import * as Sharing from 'expo-sharing';
 import * as Clipboard from 'expo-clipboard';
 import { spacing, radius, typography, componentSizes, type ThemePalette } from '../theme/tokens';
 import { useColors } from '../theme/colors';
@@ -43,7 +42,7 @@ import { toast } from '../stores/toast-store';
 import { type EmailTemplate } from '../stores/templates-store';
 import { getIdentities } from '../api/identity';
 import {
-  sendEmail, createDraft, destroyEmails, patchKeywordsForEmails, type OutgoingAttachment, type OutgoingEmail,
+  sendEmail, saveDraftVersion, destroyEmails, patchKeywordsForEmails, type OutgoingAttachment, type OutgoingEmail,
 } from '../api/email';
 import { jmapClient, RequestTimeoutError, ScheduleTooLateError } from '../api/jmap-client';
 import { uploadBlob, uploadBytes } from '../api/blob';
@@ -64,6 +63,9 @@ import {
   findComposeIdentityId, findDraftIdentityId, resolveComposeAccountEmail, resolveReplyIdentity,
 } from '../lib/reply-identity';
 import { shouldBlockEditorRemoteImages } from '../lib/editor-html';
+import {
+  initialDraftPartBlobState, liveBlobId, rebaseDraftPartBlobs, withSnapshotBody,
+} from '../lib/draft-part-blobs';
 import {
   signatureIdentityFor, buildEmbeddedSignatureHtml, containsEmbeddedSignature, spliceSignature,
   insertSignatureAboveQuote, getPlainTextSignature, appendPlainTextSignature,
@@ -80,6 +82,8 @@ import type { EmailAddress, Identity } from '../api/types';
 import type { RootStackParamList } from '../navigation/types';
 import { MODAL_ORIENTATIONS } from '../lib/modal-orientations';
 import ToggleSwitch from '../components/ToggleSwitch';
+import { AttachmentPreviewModal } from '../components/email/AttachmentPreviewModal';
+import { useFilePreview } from '../components/email/use-file-preview';
 
 type Props = NativeStackScreenProps<RootStackParamList, 'Compose'>;
 
@@ -395,6 +399,7 @@ function OptionsSheet({
 }
 
 export default function ComposeScreen({ route, navigation }: Props) {
+  const filePreview = useFilePreview();
   const c = useColors();
   const styles = React.useMemo(() => makeStyles(c), [c]);
   const t = useLocaleStore((s) => s.t);
@@ -673,10 +678,29 @@ export default function ComposeScreen({ route, navigation }: Props) {
   const subjectRef = React.useRef<TextInput>(null);
   const plainBodyRef = React.useRef<TextInput>(null);
   const [subjectFocused, setSubjectFocused] = React.useState(false);
+
+  // The composer's ScrollView and its live offset. On Android the editor page
+  // hands back the caret-reveal pans it undoes (see `pinVisualViewport` in
+  // editor-html); scrolling the composer by the same amount keeps the caret
+  // where the pan had put it, without leaving the body drawn shifted up.
+  const bodyScrollRef = React.useRef<ScrollView>(null);
+  const bodyScrollY = React.useRef(0);
+  const onEditorViewportShift = React.useCallback((dy: number) => {
+    const y = Math.max(0, bodyScrollY.current + dy);
+    bodyScrollY.current = y;
+    bodyScrollRef.current?.scrollTo({ y, animated: false });
+  }, []);
   const isPickingSuggestion = React.useRef(false);
   // Track inline-image placeholders that haven't yet been rewritten to cid:
   // until send time. Maps cid → blobId/type/name/size.
   const inlineRegistryRef = React.useRef<Map<string, AttachmentEntry>>(new Map());
+  // A re-opened draft's attachments and inline images are parts of that
+  // draft: their blobIds die with each version a save replaces (#849), and an
+  // upload expires once nothing references it. This maps the blobId each
+  // entry holds to the matching part of the latest saved version, which
+  // `buildOutgoing` sends. Kept out of the attachment state so the dirty
+  // snapshot does not change on every save.
+  const draftPartBlobsRef = React.useRef(initialDraftPartBlobState());
 
   const getAutocomplete = useContactsStore((s) => s.getAutocomplete);
   const getGroupRecipients = useContactsStore((s) => s.getGroupRecipients);
@@ -836,6 +860,10 @@ export default function ComposeScreen({ route, navigation }: Props) {
         }
       }
       if (cancelled || map.size === 0) return;
+      // No change message since the editor loaded = the user has not typed
+      // yet, so the editor still holds the seeded body (normalised by the
+      // WebView DOM, which is why it can differ from the raw server HTML).
+      const untouched = !plainTextMode && latestRef.current.bodyHtml === initialBodyHtml;
       let live = latestRef.current.bodyHtml;
       try {
         live = (await editorRef.current?.getHtml()) ?? live;
@@ -846,8 +874,16 @@ export default function ComposeScreen({ route, navigation }: Props) {
         editorRef.current?.setHtml(next);
       }
       // The hydrated images are part of the untouched baseline, not an edit.
-      baselineRef.current = replaceInlineImagePlaceholders(baselineRef.current, map);
-      if (lastSavedRef.current) lastSavedRef.current = replaceInlineImagePlaceholders(lastSavedRef.current, map);
+      if (untouched) {
+        // Rebase on the body the composer now holds: comparing it with the
+        // raw server HTML made every re-opened draft with inline images look
+        // edited, and the autosave replaced (and destroyed) it unasked.
+        baselineRef.current = withSnapshotBody(baselineRef.current, next);
+        if (lastSavedRef.current) lastSavedRef.current = withSnapshotBody(lastSavedRef.current, next);
+      } else {
+        baselineRef.current = replaceInlineImagePlaceholders(baselineRef.current, map);
+        if (lastSavedRef.current) lastSavedRef.current = replaceInlineImagePlaceholders(lastSavedRef.current, map);
+      }
     })();
     return () => { cancelled = true; };
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -1229,7 +1265,7 @@ export default function ComposeScreen({ route, navigation }: Props) {
       .map((cid) => inlineRegistryRef.current.get(cid))
       .filter((e): e is AttachmentEntry => !!e && !!e.blobId && !e.error)
       .map<OutgoingAttachment>((e) => ({
-        blobId: e.blobId!,
+        blobId: liveBlobId(draftPartBlobsRef.current, e.blobId!),
         type: e.type,
         name: e.name,
         size: e.size,
@@ -1240,7 +1276,7 @@ export default function ComposeScreen({ route, navigation }: Props) {
     const fileAttachments = attachments
       .filter((a) => !a.inline && a.blobId && !a.error)
       .map<OutgoingAttachment>((a) => ({
-        blobId: a.blobId!,
+        blobId: liveBlobId(draftPartBlobsRef.current, a.blobId!),
         type: a.type,
         name: a.name,
         size: a.size,
@@ -1300,8 +1336,14 @@ export default function ComposeScreen({ route, navigation }: Props) {
     setDraftStatus('saving');
     try {
       const outgoing = buildOutgoing(identity, html, { forDraft: true });
-      const id = await createDraft(outgoing, draftsMailbox.id, draftIdRef.current ?? undefined);
+      const saved = await saveDraftVersion(outgoing, draftsMailbox.id, draftIdRef.current ?? undefined);
+      const id = saved.id;
       draftIdRef.current = id;
+      // The previous version and its part blobs are gone: point every
+      // attachment at the parts of the version just created.
+      draftPartBlobsRef.current = rebaseDraftPartBlobs(
+        draftPartBlobsRef.current, outgoing.attachments ?? [], saved.attachments,
+      );
       lastSavedRef.current = snapshot;
       lastSaveAtRef.current = Date.now();
       setDraftStatus('saved');
@@ -1705,22 +1747,14 @@ export default function ComposeScreen({ route, navigation }: Props) {
     await insertInlineImages(result.assets);
   };
 
-  // Open a chip: local files straight from their URI, server blobs after a
-  // download into the cache.
+  // Open a chip in the file preview: local files from their URI, server
+  // blobs (forwarded, from a draft) after a download.
   const previewAttachment = async (entry: AttachmentEntry) => {
     try {
-      let uri = entry.uri;
-      if (!uri && entry.blobId) {
-        const buf = await jmapClient.fetchBlobArrayBuffer(entry.blobId, entry.name, entry.type);
-        const dir = FileSystem.cacheDirectory ?? '';
-        uri = `${dir}${entry.localId}-${entry.name.replace(/[^\w.-]+/g, '_')}`;
-        await FileSystem.writeAsStringAsync(uri, bytesToBase64(new Uint8Array(buf)), {
-          encoding: FileSystem.EncodingType.Base64,
-        });
-      }
-      if (!uri) return;
-      if (await Sharing.isAvailableAsync()) {
-        await Sharing.shareAsync(uri, { mimeType: entry.type, dialogTitle: entry.name });
+      if (entry.uri) {
+        await filePreview.open({ from: 'local', uri: entry.uri, name: entry.name, type: entry.type, size: entry.size });
+      } else if (entry.blobId) {
+        await filePreview.open({ from: 'blob', blobId: entry.blobId, name: entry.name, type: entry.type, size: entry.size });
       }
     } catch (err) {
       Alert.alert(t('email_composer.attach', 'Attach'), err instanceof Error ? err.message : String(err));
@@ -2363,9 +2397,12 @@ export default function ComposeScreen({ route, navigation }: Props) {
 
       <View style={[styles.flex, { paddingBottom: bottomPad }]}>
         <ScrollView
+          ref={bodyScrollRef}
           style={styles.flex}
           keyboardShouldPersistTaps="always"
           contentContainerStyle={styles.scrollContent}
+          onScroll={(e) => { bodyScrollY.current = e.nativeEvent.contentOffset.y; }}
+          scrollEventThrottle={16}
         >
           <View style={styles.fieldRow}>
             <Text style={[styles.fieldLabel, fieldLabelWidth]} numberOfLines={1}>{t('email_composer.from', 'From')}</Text>
@@ -2456,6 +2493,7 @@ export default function ComposeScreen({ route, navigation }: Props) {
               placeholder={t('email_composer.body_placeholder', 'Write your message...')}
               onChange={setBodyHtml}
               onSelectionChange={setSelState}
+              onViewportShift={onEditorViewportShift}
             />
           )}
         </ScrollView>
@@ -2915,6 +2953,8 @@ export default function ComposeScreen({ route, navigation }: Props) {
         selectedIdentityId={selectedIdentityId}
         onPick={(identity) => { setSelectedIdentityId(identity.id); setFromOverride(null); }}
       />
+
+      <AttachmentPreviewModal {...filePreview.modalProps} />
     </SafeAreaView>
   );
   if (!isSplit) return composer;

src/stores/__tests__/calendar-store-sort-order.test.ts

@@ -0,0 +1,84 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+
+vi.mock('../../api/calendar', () => ({
+  getCalendars: vi.fn(),
+  updateCalendar: vi.fn(),
+  createCalendar: vi.fn(),
+  isCalendarAccessDenied: vi.fn(() => false),
+  noteCalendarAccessError: vi.fn(() => false),
+  resetCalendarAccessDenied: vi.fn(),
+  supportsSyntheticCalendarIds: vi.fn(async () => false),
+  resetSyntheticIdSupport: vi.fn(),
+}));
+
+vi.mock('../../api/jmap-client', () => ({
+  jmapClient: { accountId: 'acc-1', isConnected: true },
+}));
+
+vi.mock('../../device-sync/app/request', () => ({ requestDeviceSync: vi.fn() }));
+
+import * as calendarApi from '../../api/calendar';
+import { useCalendarStore } from '../calendar-store';
+import type { Calendar } from '../../api/types';
+
+const mockGetCalendars = calendarApi.getCalendars as ReturnType<typeof vi.fn>;
+const mockUpdateCalendar = calendarApi.updateCalendar as ReturnType<typeof vi.fn>;
+
+const cal = (overrides: Partial<Calendar>): Calendar => ({ id: 'c', name: 'Cal', sortOrder: 0, ...overrides });
+const names = () => useCalendarStore.getState().calendars.map((c) => c.name);
+
+beforeEach(() => {
+  vi.clearAllMocks();
+  useCalendarStore.setState({ calendars: [], error: null });
+});
+
+describe('calendar order', () => {
+  it('fetchCalendars lists the calendars by sortOrder, not in server order', async () => {
+    mockGetCalendars.mockResolvedValue([
+      cal({ id: 'b', name: 'Default', sortOrder: 20 }),
+      cal({ id: 'n', name: 'Holidays', sortOrder: 30 }),
+      cal({ id: 'e', name: 'Work', sortOrder: 1 }),
+    ]);
+
+    await useCalendarStore.getState().fetchCalendars();
+
+    expect(names()).toEqual(['Work', 'Default', 'Holidays']);
+  });
+
+  it('reorderCalendars writes only the sortOrders that change, to the owning account', async () => {
+    useCalendarStore.setState({
+      calendars: [
+        cal({ id: 'a', name: 'A', sortOrder: 1 }),
+        cal({ id: 'b', name: 'B', sortOrder: 2 }),
+        cal({ id: 'x:c', originalId: 'c', name: 'C', sortOrder: 0, isShared: true, accountId: 'x' }),
+      ],
+    });
+    mockUpdateCalendar.mockResolvedValue(undefined);
+
+    const done = useCalendarStore.getState().reorderCalendars(['b', 'a']);
+    expect(names()).toEqual(['B', 'A', 'C']);
+    await done;
+
+    expect(mockUpdateCalendar.mock.calls).toEqual([
+      ['b', { sortOrder: 1 }, undefined],
+      ['a', { sortOrder: 2 }, undefined],
+    ]);
+  });
+
+  it('after a failed write, shows the order the server holds and rethrows', async () => {
+    useCalendarStore.setState({
+      calendars: [
+        cal({ id: 'a', name: 'A', sortOrder: 1 }),
+        cal({ id: 'b', name: 'B', sortOrder: 2 }),
+        cal({ id: 'c', name: 'C', sortOrder: 3 }),
+      ],
+    });
+    mockUpdateCalendar.mockResolvedValueOnce(undefined).mockRejectedValueOnce(new Error('forbidden'));
+
+    await expect(useCalendarStore.getState().reorderCalendars(['c', 'a', 'b'])).rejects.toThrow('forbidden');
+
+    expect(useCalendarStore.getState().calendars.map((c) => [c.id, c.sortOrder])).toEqual([
+      ['a', 1], ['c', 1], ['b', 2],
+    ]);
+  });
+});

src/stores/calendar-store.ts

@@ -48,6 +48,7 @@ import {
 import { findTasksOnlyCalendarIds, isTaskLikeObject } from '../lib/calendar-component-detection';
 import { mergeRangeEvents, mergedSpanLimit, planRangeLoad, sameRange } from '../lib/calendar-range-cache';
 import { requestDeviceSync } from '../device-sync/app/request';
+import { sortCalendars, sortOrderUpdates } from '../lib/calendar-sort';
 import { CALENDAR_AUTHORITY } from '../device-sync/types';
 
 // extendRange merges up to twice the requested range (at least half a year,
@@ -266,6 +267,8 @@ export interface CalendarState {
   importEvents: (events: Partial<CalendarEvent>[], calendarId: string) => Promise<ImportResult>;
   createCalendar: (name: string, color?: string, description?: string) => Promise<Calendar>;
   updateCalendar: (id: string, updates: CalendarUpdates) => Promise<void>;
+  // Store `orderedIds` in that order by renumbering their sortOrder.
+  reorderCalendars: (orderedIds: string[]) => Promise<void>;
   removeCalendar: (id: string) => Promise<void>;
   clearCalendarEvents: (id: string) => Promise<number>;
   shareCalendar: (id: string, principalId: string, rights: CalendarRights | null) => Promise<void>;
@@ -572,7 +575,7 @@ export const useCalendarStore = create<CalendarState>()(
     if (calendarsInFlight) return calendarsInFlight;
     calendarsInFlight = (async () => {
       try {
-        const calendars = (await fetchCalendars()) ?? [];
+        const calendars = sortCalendars((await fetchCalendars()) ?? []);
         set({ calendars });
       } catch (err) {
         set({ error: err instanceof Error ? err.message : 'Failed to load calendars' });
@@ -1013,7 +1016,7 @@ export const useCalendarStore = create<CalendarState>()(
 
   createCalendar: async (name, color, description) => {
     const created = await apiCreateCalendar(name, color, description);
-    set({ calendars: [...get().calendars, created] });
+    set({ calendars: sortCalendars([...get().calendars, created]) });
     requestDeviceSync(CALENDAR_AUTHORITY);
     return created;
   },
@@ -1022,11 +1025,36 @@ export const useCalendarStore = create<CalendarState>()(
     const cal = get().calendars.find((c) => c.id === id);
     await apiUpdateCalendar(cal?.originalId || id, updates, cal?.accountId);
     set({
-      calendars: get().calendars.map((c) => (c.id === id ? { ...c, ...updates } as Calendar : c)),
+      calendars: sortCalendars(get().calendars.map((c) => (c.id === id ? { ...c, ...updates } as Calendar : c))),
     });
     requestDeviceSync(CALENDAR_AUTHORITY);
   },
 
+  reorderCalendars: async (orderedIds) => {
+    const updates = sortOrderUpdates(get().calendars, orderedIds);
+    if (updates.length === 0) return;
+    const before = get().calendars;
+    const withSortOrders = (sortOrders: Map<string, number>) => sortCalendars(before.map((c) =>
+      sortOrders.has(c.id) ? { ...c, sortOrder: sortOrders.get(c.id)! } : c));
+    // Optimistic, so the list moves at once.
+    set({ calendars: withSortOrders(new Map(updates.map((u) => [u.id, u.sortOrder]))) });
+    const saved = new Map<string, number>();
+    try {
+      for (const { id, sortOrder } of updates) {
+        const cal = before.find((c) => c.id === id);
+        await apiUpdateCalendar(cal?.originalId || id, { sortOrder }, cal?.accountId);
+        saved.set(id, sortOrder);
+      }
+    } catch (err) {
+      // Show the order the server now holds: the moves saved before the
+      // failure stay, the rest are undone.
+      set({ calendars: withSortOrders(saved) });
+      throw err;
+    } finally {
+      if (saved.size > 0) requestDeviceSync(CALENDAR_AUTHORITY);
+    }
+  },
+
   removeCalendar: async (id) => {
     const cal = get().calendars.find((c) => c.id === id);
     await apiDeleteCalendar(cal?.originalId || id, cal?.accountId);