@bobfrankston/mailx 1.0.374 → 1.0.377

package/client/components/calendar-sidebar.js

@@ -188,11 +188,15 @@ export function hideCalendarSidebar() {
     catch { /* */ }
 }
 export function isCalendarSidebarOn() {
+    // Default is ON — user-reported 2026-04-23 that the sidebar should be
+    // visible by default, not hidden. An explicit "false" in localStorage
+    // still hides it (the user's stored preference wins).
     try {
-        return localStorage.getItem(SIDEBAR_PREF) === "true";
+        const v = localStorage.getItem(SIDEBAR_PREF);
+        return v === null ? true : v !== "false";
     }
     catch {
-        return false;
+        return true;
     }
 }
 /** Wire one-time event handlers + restore from localStorage. Safe to call

package/client/styles/components.css

@@ -788,37 +788,35 @@ button.tb-menu-item { background: none; border: none; color: inherit; width: 100
     opacity: 0.5;
 }
 
-/* S1 slice C — pink row when a local action (move/flag/delete) is queued
-   but the server hasn't ACK'd. Visible reconciliation state: "we did your
-   thing locally, the server hasn't agreed yet." Selection still wins
-   visually so the active row is identifiable. */
-.ml-row.pending-reconcile {
-    background: oklch(0.96 0.04 350);  /* pale pink */
-}
-.ml-row.pending-reconcile.selected {
-    background: oklch(0.85 0.10 350);  /* deeper pink when selected */
+/* S1 slice C — local action (move/flag/delete) queued but server hasn't
+   ACK'd. Reuses the same date-column dot as the download indicator so
+   "still on client, not yet on server" sits in the same visual slot as
+   "body downloaded". Color, not row background — the row keeps the
+   normal/unread/selected styling so the blue accent isn't fighting pink. */
+.ml-row.pending-reconcile .ml-date::before {
+    color: oklch(0.65 0.22 350);  /* pink dot */
+    opacity: 0.9;
 }
 
 /* S51 — calendar sidebar (Thunderbird Lightning Events & Tasks pane).
-   Right-docked, fixed width, hidden by default. Toggled by View menu.
+   Right-docked, fixed width. Visible by default; user hides via View menu.
    Hides automatically on narrow screens (< 1100px) — Android uses the
-   native calendar app. */
+   native calendar app. When hidden, the main grid does NOT reserve a column
+   for it, so there's no blank strip on the right. */
 .calendar-sidebar {
     grid-area: cal-side;
-    width: 280px;
     border-left: 1px solid var(--color-border);
     background: var(--color-bg);
-    display: flex;
+    display: none;  /* Opt-in: only show when body.calendar-sidebar-on */
     flex-direction: column;
     overflow: hidden;
     font-size: var(--font-size-sm);
 }
+body.calendar-sidebar-on .calendar-sidebar { display: flex; }
+
 @media (max-width: 1100px) {
-    .calendar-sidebar { display: none; }
-}
-body.calendar-sidebar-on {
-    /* Re-flow main grid to make room for the sidebar on the right.
-       Folder-tree / message-list / message-viewer share the remaining area. */
+    .calendar-sidebar,
+    body.calendar-sidebar-on .calendar-sidebar { display: none; }
 }
 .cal-side-head {
     display: flex;

package/client/styles/layout.css

@@ -25,6 +25,18 @@ body {
     background: var(--color-bg);
 }
 
+/* When the calendar sidebar is on, re-flow the grid to reserve a fourth
+   column on the right. When off, no column is reserved — the aside is
+   display:none and the grid stays three-column. */
+body.calendar-sidebar-on {
+    grid-template-columns: var(--rail-width, 48px) var(--folder-width) 1fr var(--cal-side-width, 280px);
+    grid-template-areas:
+        "toolbar  toolbar  toolbar  toolbar"
+        "alert    alert    alert    alert"
+        "rail     folders  main     cal-side"
+        "status   status   status   status";
+}
+
 .toolbar { grid-area: toolbar; }
 .icon-rail { grid-area: rail; }
 .folder-panel { grid-area: folders; display: flex; flex-direction: column; overflow: hidden; }
@@ -101,9 +113,13 @@ body {
     background: var(--color-accent);
 }
 
-/* Responsive: mid-width (tablets, foldables) — keep rail + list + viewer; folders overlay */
+/* Responsive: mid-width (tablets, foldables) — keep rail + list + viewer; folders overlay.
+   Calendar sidebar is hidden in this tier by its own media query, and the
+   body grid does NOT include a cal-side column here — the .calendar-sidebar-on
+   body class override above is shadowed by this mid-width rule. */
 @media (max-width: 1100px) and (min-width: 769px) {
-    body {
+    body,
+    body.calendar-sidebar-on {
         grid-template-columns: var(--rail-width, 48px) 1fr;
         grid-template-rows: var(--toolbar-height) auto 1fr var(--statusbar-height);
         grid-template-areas:
@@ -157,7 +173,8 @@ body {
     #status-version { display: none; }
 }
 @media (max-width: 768px), (max-height: 600px) {
-    body {
+    body,
+    body.calendar-sidebar-on {
         grid-template-columns: 1fr;
         grid-template-rows: var(--toolbar-height) auto 1fr var(--statusbar-height);
         grid-template-areas:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bobfrankston/mailx",
-  "version": "1.0.374",
+  "version": "1.0.377",
   "description": "Local-first email client with IMAP sync and standalone native app",
   "type": "module",
   "main": "bin/mailx.js",

package/packages/mailx-store/db.js

@@ -573,7 +573,12 @@ export class MailxDB {
         const placeholders = inboxRows.map(() => "?").join(",");
         const folderIds = inboxRows.map((r) => r.id);
         const total = this.db.prepare(`SELECT COUNT(*) as cnt FROM messages WHERE folder_id IN (${placeholders})`).get(...folderIds).cnt;
-        const rows = this.db.prepare(`SELECT * FROM messages WHERE folder_id IN (${placeholders}) ORDER BY date DESC LIMIT ? OFFSET ?`).all(...folderIds, pageSize, offset);
+        const rows = this.db.prepare(`SELECT m.*, EXISTS(
+                SELECT 1 FROM sync_actions sa
+                WHERE sa.account_id = m.account_id AND sa.uid = m.uid
+            ) AS pending
+            FROM messages m WHERE m.folder_id IN (${placeholders})
+            ORDER BY m.date DESC LIMIT ? OFFSET ?`).all(...folderIds, pageSize, offset);
         const items = rows.map(r => ({
             id: r.id,
             accountId: r.account_id,
@@ -592,7 +597,8 @@ export class MailxDB {
             size: r.size,
             hasAttachments: !!r.has_attachments,
             preview: r.preview,
-            bodyPath: r.body_path || ""
+            bodyPath: r.body_path || "",
+            pending: !!r.pending,
         }));
         return { items, total, page, pageSize };
     }

package/packages/mailx-store-web/android-bootstrap.js

@@ -430,23 +430,35 @@ class AndroidSyncManager {
         this.db.queueSyncAction(accountId, "undelete", uid, folderId);
     }
     queueOutgoingLocal(accountId, rawMessage) {
-        // Two paths, both real (no stubs that pretend success — see programming.md
-        // rule "Stubs MUST NOT appear successful"):
-        //   - Gmail accounts: POST to users.messages.send (Gmail handles SMTP +
-        //     auto-files into Sent label).
-        //   - Non-Gmail accounts: smtp-direct over BridgeTransport (mailxapi.tcp).
-        // Caller (web-service.send) is sync-returning; we kick off the network
-        // request and surface success/failure via events. Compose UI listens for
-        // sendError/sendComplete.
+        // Local-first: PERSIST to sync_actions before attempting the network
+        // send, so a crash / offline / process kill between now and SMTP ACK
+        // doesn't drop the message. Desktop parity — PC writes `.ltr` to disk
+        // before calling SMTP; Android writes a sync_actions row to sql.js +
+        // IndexedDB (which saveDbToIdb persists on scheduleSave). Unique neg
+        // uid = Date.now() to avoid colliding with real message UIDs and to
+        // give us a stable tracking key through the async send pipeline.
+        //
+        // User-flagged 2026-04-23: "sending on android, like on the PC must
+        // be queued." Equivalent of PC's `~/.mailx/outbox/<acct>/*.ltr`.
+        const queueUid = -Date.now();
+        this.db.queueSyncAction(accountId, "send", queueUid, -1, { rawMessage });
+        this.attemptSend(accountId, queueUid, rawMessage);
+    }
+    /** Kick off a send for a message that's already in the queue. Called by
+     *  queueOutgoingLocal on a fresh submit AND by processSendQueue on
+     *  startup / periodic tick for anything stranded from a prior run. */
+    attemptSend(accountId, queueUid, rawMessage) {
         const provider = this.getProvider(accountId);
         if (provider && typeof provider.sendRaw === "function") {
             provider.sendRaw(rawMessage)
                 .then((result) => {
                 console.log(`[send] ${accountId}: sent via Gmail API (id=${result.id})`);
+                this.db.completeSyncActionByUid(accountId, "send", queueUid);
                 emitEvent({ type: "sendComplete", accountId, messageId: result.id });
             })
                 .catch((e) => {
                 console.error(`[send] ${accountId}: Gmail send failed: ${e.message}`);
+                this.db.failSyncActionByUid(accountId, "send", queueUid, e.message || String(e));
                 emitEvent({ type: "sendError", accountId, error: e.message });
             });
             return;
@@ -458,8 +470,9 @@ class AndroidSyncManager {
         if (!row) {
             const e = "Unknown account";
             console.error(`[send] ${accountId}: ${e}`);
+            this.db.failSyncActionByUid(accountId, "send", queueUid, e);
             emitEvent({ type: "sendError", accountId, error: e });
-            throw new Error(e);
+            return;
         }
         let account;
         try {
@@ -467,26 +480,41 @@ class AndroidSyncManager {
         }
         catch {
             const e = "Account config malformed";
+            this.db.failSyncActionByUid(accountId, "send", queueUid, e);
             emitEvent({ type: "sendError", accountId, error: e });
-            throw new Error(e);
+            return;
         }
         if (!account.smtp) {
             const e = "No SMTP config for this account";
             console.error(`[send] ${accountId}: ${e}`);
+            this.db.failSyncActionByUid(accountId, "send", queueUid, e);
             emitEvent({ type: "sendError", accountId, error: e });
-            throw new Error(e);
+            return;
         }
-        // Fire async — same pattern as Gmail path above.
         this.sendViaSmtpDirect(accountId, account, rawMessage)
             .then((result) => {
             console.log(`[send] ${accountId}: sent via SMTP (${result.accepted.length} accepted, ${result.rejected.length} rejected)`);
+            this.db.completeSyncActionByUid(accountId, "send", queueUid);
             emitEvent({ type: "sendComplete", accountId });
         })
             .catch((e) => {
             console.error(`[send] ${accountId}: SMTP send failed: ${e.message}`);
+            this.db.failSyncActionByUid(accountId, "send", queueUid, e.message || String(e));
             emitEvent({ type: "sendError", accountId, error: e.message });
         });
     }
+    /** Drain any stranded 'send' queue entries — called at startup and on
+     *  each periodic sync tick so messages queued while offline or stranded
+     *  by a crash get a retry. Each row keeps its queueUid as tracking key. */
+    async processSendQueue(accountId) {
+        const pending = this.db.getPendingSyncActions(accountId).filter(a => a.action === "send" && a.rawMessage);
+        if (pending.length === 0)
+            return;
+        console.log(`[send] ${accountId}: draining ${pending.length} queued message(s)`);
+        for (const p of pending) {
+            this.attemptSend(accountId, p.uid, p.rawMessage);
+        }
+    }
     /** Build SMTP config from account, send via smtp-direct over BridgeTransport. */
     async sendViaSmtpDirect(accountId, account, raw) {
         const SMTP_PORT_STARTTLS = 587;
@@ -870,6 +898,15 @@ export async function initAndroid() {
         }
     }
     installBridge();
+    // Drain any stranded send-queue entries BEFORE first sync. A message
+    // queued in a prior session (offline, crashed mid-send, process killed)
+    // gets a retry as soon as we have accounts registered. Desktop parity.
+    for (const account of accounts) {
+        if (!account.enabled)
+            continue;
+        syncManager.processSendQueue(account.id)
+            .catch(e => console.error(`[android] processSendQueue ${account.id}: ${e.message}`));
+    }
     setTimeout(() => {
         syncManager.syncAll().catch(e => console.error(`[android] Sync error: ${e.message}`));
     }, 1000);
@@ -878,6 +915,11 @@ export async function initAndroid() {
     setInterval(() => {
         console.log("[sync] periodic poll");
         vlog("periodic sync poll");
+        // Retry any failed/stranded sends every poll tick
+        for (const account of db.getAccounts()) {
+            syncManager.processSendQueue(account.id)
+                .catch(e => console.error(`[android] retry ${account.id}: ${e.message}`));
+        }
         syncManager.syncAll().catch(e => console.error(`[android] Periodic sync error: ${e.message}`));
     }, SYNC_INTERVAL_MS);
     // Immediate sync when app comes back to foreground (e.g. user switches from

package/packages/mailx-store-web/db.d.ts

@@ -103,6 +103,12 @@ export declare class WebMailxDB {
     getPendingSyncActions(accountId: string): any[];
     completeSyncAction(id: number): void;
     failSyncAction(id: number, error: string): void;
+    /** Delete a queued sync action by (accountId, action, uid) — used by the
+     *  send path which tracks queued sends via a unique negative uid rather
+     *  than threading the row id through the async send pipeline. */
+    completeSyncActionByUid(accountId: string, action: string, uid: number): void;
+    /** Mark a send-queue action failed by uid — same tracking-key rationale. */
+    failSyncActionByUid(accountId: string, action: string, uid: number, error: string): void;
     getPendingSyncCount(accountId: string): number;
     getTotalPendingSyncCount(): number;
     /** Reset the entire database */

package/packages/mailx-store-web/db.js

@@ -478,6 +478,16 @@ export class WebMailxDB {
     failSyncAction(id, error) {
         this.run("UPDATE sync_actions SET attempts = attempts + 1, last_error = ? WHERE id = ?", [error, id]);
     }
+    /** Delete a queued sync action by (accountId, action, uid) — used by the
+     *  send path which tracks queued sends via a unique negative uid rather
+     *  than threading the row id through the async send pipeline. */
+    completeSyncActionByUid(accountId, action, uid) {
+        this.run("DELETE FROM sync_actions WHERE account_id = ? AND action = ? AND uid = ?", [accountId, action, uid]);
+    }
+    /** Mark a send-queue action failed by uid — same tracking-key rationale. */
+    failSyncActionByUid(accountId, action, uid, error) {
+        this.run("UPDATE sync_actions SET attempts = attempts + 1, last_error = ? WHERE account_id = ? AND action = ? AND uid = ?", [error, accountId, action, uid]);
+    }
     getPendingSyncCount(accountId) {
         const r = this.get("SELECT COUNT(*) as cnt FROM sync_actions WHERE account_id = ?", [accountId]);
         return r?.cnt || 0;