@bobfrankston/mailx 1.0.205 → 1.0.207

package/client/android.html

@@ -135,7 +135,7 @@
         <section class="message-viewer" id="message-viewer">
             <div class="mv-header" id="mv-header" hidden>
                 <div class="mv-toolbar">
-                    <button class="tb-btn" id="btn-back" title="Back to list" hidden>←</button>
+                    <button class="tb-btn btn-back-list" id="btn-back" title="Back to message list" hidden>← Inbox</button>
                     <button class="tb-btn" id="btn-reply" title="Reply">↩</button>
                     <button class="tb-btn" id="btn-reply-all" title="Reply All">↩↩</button>
                     <button class="tb-btn" id="btn-forward" title="Forward">→</button>

package/client/components/folder-tree.js

@@ -10,6 +10,7 @@ let selectedElement;
 let selectedAccountId = null;
 let selectedFolderId = null;
 let isFirstLoad = true; // only auto-select on first load
+let hasAutoSelected = false; // track whether we've ever managed to auto-select
 // Debounce timer for refreshFolderTree
 let refreshDebounceTimer = null;
 // Persist expand/collapse state in localStorage
@@ -670,7 +671,9 @@ async function loadFolderTree(container) {
                 }
             }
         }
-        if (!target && isFirstLoad) {
+        // Auto-select on first load OR until we successfully auto-selected at least once
+        // (handles Android where folders don't exist on first load — they arrive after sync)
+        if (!target && (isFirstLoad || !hasAutoSelected)) {
             // Auto-select only on first load — not on refresh (prevents jumping)
             const unified = container.querySelector('.ft-unified');
             if (unified) {
@@ -694,8 +697,10 @@ async function loadFolderTree(container) {
             }
             if (!target && allFolderEls.length > 0)
                 target = allFolderEls[0];
-            if (target)
+            if (target) {
                 target.click();
+                hasAutoSelected = true;
+            }
         }
         isFirstLoad = false;
         // Dismiss startup overlay once tree is loaded

package/client/index.html

@@ -99,7 +99,7 @@
         <section class="message-viewer" id="message-viewer">
             <div class="mv-header" id="mv-header" hidden>
                 <div class="mv-toolbar">
-                    <button class="tb-btn" id="btn-back" title="Back to list" hidden>←</button>
+                    <button class="tb-btn btn-back-list" id="btn-back" title="Back to message list" hidden>← Inbox</button>
                     <button class="tb-btn" id="btn-reply" title="Reply (Ctrl+R)">↩</button>
                     <button class="tb-btn" id="btn-reply-all" title="Reply All (Ctrl+Shift+R)">↩↩</button>
                     <button class="tb-btn" id="btn-forward" title="Forward">→</button>

package/client/styles/layout.css

@@ -87,8 +87,8 @@ body {
     #btn-menu { display: inline-flex !important; }
 }
 
-/* Responsive: narrow viewport — single panel navigation */
-@media (max-width: 768px) {
+/* Responsive: narrow OR short viewport — single panel navigation */
+@media (max-width: 768px), (max-height: 600px) {
     body {
         grid-template-columns: 1fr;
         grid-template-rows: var(--toolbar-height) auto 1fr var(--statusbar-height);
@@ -132,9 +132,20 @@ body {
     }
     .message-list.narrow-hidden { display: none; }
 
-    /* Show hamburger and back buttons */
+    /* Show hamburger always on narrow */
     #btn-menu { display: inline-flex !important; }
-    #btn-back { display: inline-flex !important; }
+    /* Back button: only show when viewer is active (message list hidden) */
+    #btn-back { display: none !important; }
+    .message-viewer.narrow-active ~ * #btn-back,
+    body:has(.message-viewer.narrow-active) #btn-back {
+        display: inline-flex !important;
+        font-size: 1.1em;
+        font-weight: 600;
+        padding: 0.5em 1em;
+        background: var(--color-accent, #1a6dd4);
+        color: white;
+        border-radius: 6px;
+    }
 
     /* Message list: full width, two-line rows */
     .message-list {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bobfrankston/mailx",
-  "version": "1.0.205",
+  "version": "1.0.207",
   "description": "Local-first email client with IMAP sync and standalone native app",
   "type": "module",
   "main": "bin/mailx.js",
@@ -24,7 +24,7 @@
     "@bobfrankston/iflow-node": "^0.1.2",
     "@bobfrankston/miscinfo": "^1.0.8",
     "@bobfrankston/oauthsupport": "^1.0.22",
-    "@bobfrankston/msger": "^0.1.266",
+    "@bobfrankston/msger": "^0.1.268",
     "@capacitor/android": "^8.3.0",
     "@capacitor/cli": "^8.3.0",
     "@capacitor/core": "^8.3.0",

package/packages/mailx-core/index.d.ts

@@ -64,6 +64,7 @@ export declare function getMessage(params: {
     size: number;
     hasAttachments: boolean;
     preview: string;
+    bodyPath?: string;
 }>;
 export declare function updateFlags(params: {
     accountId: string;

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

@@ -14,7 +14,7 @@
 import { WebMailxDB } from "./db.js";
 import { WebMessageStore } from "./web-message-store.js";
 import { WebMailxService } from "./web-service.js";
-import { loadAccounts, loadAccountsFromCloud, saveAccounts, clearSettings, setGDriveTokenProvider, setGDriveFolderId } from "./web-settings.js";
+import { loadAccounts, loadAccountsFromCloud, saveAccounts, clearSettings, getDeviceId, setGDriveTokenProvider, setGDriveFolderId } from "./web-settings.js";
 import { GmailApiWebProvider } from "./gmail-api-web.js";
 // ── State ──
 let db;
@@ -159,6 +159,9 @@ class AndroidSyncManager {
                     flags.push("\\Answered");
                 if (msg.draft)
                     flags.push("\\Draft");
+                // Store the Gmail providerId in bodyPath as "gmail:<id>" so we can
+                // fetch the body directly without re-listing 1000 messages from the folder
+                const bodyPath = msg.providerId ? `gmail:${msg.providerId}` : "";
                 this.db.upsertMessage({
                     accountId, folderId, uid: msg.uid,
                     messageId: msg.messageId || "", inReplyTo: "", references: [],
@@ -167,7 +170,7 @@ class AndroidSyncManager {
                     from: toEmailAddress(msg.from?.[0]),
                     to: msg.to.map(a => toEmailAddress(a)),
                     cc: msg.cc.map(a => toEmailAddress(a)),
-                    flags, size: msg.size || 0, hasAttachments: false, preview: "", bodyPath: "",
+                    flags, size: msg.size || 0, hasAttachments: false, preview: "", bodyPath,
                 });
             }
             this.db.commitTransaction();
@@ -182,15 +185,31 @@ class AndroidSyncManager {
             return this.bodyStore.getMessage(accountId, folderId, uid);
         }
         const provider = this.getProvider(accountId);
-        if (!provider)
-            return null;
-        const folders = this.db.getFolders(accountId);
-        const folder = folders.find(f => f.id === folderId);
-        if (!folder)
+        if (!provider) {
+            console.warn(`[fetchBody] No provider for ${accountId}`);
             return null;
-        const msg = await provider.fetchOne(folder.path, uid, { source: true });
-        if (!msg?.source)
+        }
+        // Look up the Gmail providerId stored in body_path during sync
+        const envelope = this.db.getMessageByUid(accountId, uid, folderId);
+        const bp = envelope?.bodyPath || "";
+        let msg = null;
+        if (bp.startsWith("gmail:") && provider.fetchById) {
+            const providerId = bp.substring(6);
+            msg = await provider.fetchById(providerId, { source: true });
+        }
+        else {
+            // Fallback: list-and-find by UID (slow, fragile)
+            const folders = this.db.getFolders(accountId);
+            const folder = folders.find(f => f.id === folderId);
+            if (!folder)
+                return null;
+            msg = await provider.fetchOne(folder.path, uid, { source: true });
+        }
+        if (!msg?.source) {
+            console.warn(`[fetchBody] No source returned for ${accountId}/${folderId}/${uid} (bp=${bp})`);
             return null;
+        }
+        // Encode the UTF-8 string back to bytes for storage
         const raw = new TextEncoder().encode(msg.source);
         await this.bodyStore.putMessage(accountId, folderId, uid, raw);
         this.db.updateBodyPath(accountId, uid, `idb:${accountId}/${folderId}/${uid}`);
@@ -247,7 +266,10 @@ const OAUTH_CLIENT = {
     // Reverse client ID scheme — auto-allowed for Google "installed" apps
     redirectUri: "com.googleusercontent.apps.884213380682-hcso64dcqmk4p98vsc7br2e6gvn7iv2u:/oauth2callback",
 };
-const OAUTH_SCOPES = "https://mail.google.com/ https://www.googleapis.com/auth/contacts.readonly https://www.googleapis.com/auth/drive.file";
+// Use full drive scope so we can read/write the desktop's accounts.jsonc + clients.jsonc.
+// drive.file is per-consent-grant: files created by desktop's grant aren't visible to Android's grant
+// even with the same client_id. drive (full) lets us see all files the user has access to.
+const OAUTH_SCOPES = "https://mail.google.com/ https://www.googleapis.com/auth/contacts.readonly https://www.googleapis.com/auth/drive";
 // ── Token cache (IndexedDB) ──
 async function getCachedToken(email) {
     const key = `oauth-token-${email.replace(/[@.]/g, "_")}`;
@@ -364,6 +386,67 @@ function createNativeTokenProvider(email) {
     };
 }
 // ── GDrive folder lookup ──
+async function registerDeviceInGDrive(tokenProvider, folderId, accountIds) {
+    try {
+        const token = await tokenProvider();
+        // Use persistent Android device ID (survives factory reset & app data clear)
+        const bridge = window._nativeBridge;
+        let deviceId = "android-unknown";
+        if (bridge?.app?.getAndroidId) {
+            try {
+                const androidId = await bridge.app.getAndroidId();
+                deviceId = `android-${androidId.substring(0, 12)}`;
+            }
+            catch {
+                deviceId = `android-${getDeviceId().substring(0, 8)}`;
+            }
+        }
+        // Read existing clients.jsonc
+        const q = encodeURIComponent(`name='clients.jsonc' and '${folderId}' in parents and trashed=false`);
+        const listRes = await fetch(`https://www.googleapis.com/drive/v3/files?q=${q}&fields=files(id)`, { headers: { "Authorization": `Bearer ${token}` } });
+        if (!listRes.ok) {
+            console.warn(`[gdrive] clients.jsonc list failed: ${listRes.status}`);
+            return;
+        }
+        const listData = await listRes.json();
+        const fileId = listData.files?.[0]?.id;
+        let clients = {};
+        if (fileId) {
+            const readRes = await fetch(`https://www.googleapis.com/drive/v3/files/${fileId}?alt=media`, { headers: { "Authorization": `Bearer ${token}` } });
+            if (readRes.ok) {
+                try {
+                    clients = JSON.parse(await readRes.text());
+                }
+                catch { /* */ }
+            }
+        }
+        clients[deviceId] = {
+            hostname: deviceId,
+            platform: "android",
+            accounts: accountIds,
+            lastSeen: new Date().toISOString(),
+            version: window._nativeBridge?.info?.version || "?",
+        };
+        const content = JSON.stringify(clients, null, 2);
+        if (fileId) {
+            const upRes = await fetch(`https://www.googleapis.com/upload/drive/v3/files/${fileId}?uploadType=media`, {
+                method: "PATCH",
+                headers: {
+                    "Authorization": `Bearer ${token}`,
+                    "Content-Type": "application/json",
+                },
+                body: content,
+            });
+            if (upRes.ok)
+                console.log(`[android] Registered device in clients.jsonc as ${deviceId}`);
+            else
+                console.warn(`[gdrive] clients.jsonc update failed: ${upRes.status}`);
+        }
+    }
+    catch (e) {
+        console.warn(`[android] Device registration failed: ${e.message}`);
+    }
+}
 async function findGDriveMailxFolder(tokenProvider) {
     const token = await tokenProvider();
     const q = encodeURIComponent("name='mailx' and mimeType='application/vnd.google-apps.folder' and trashed=false");
@@ -425,16 +508,37 @@ export async function initAndroid() {
     if (gmailTokenProvider) {
         setGDriveTokenProvider(gmailTokenProvider);
         try {
+            console.log("[android] Looking up GDrive mailx folder...");
             const folderId = await findGDriveMailxFolder(gmailTokenProvider);
-            if (folderId) {
+            if (!folderId) {
+                console.warn("[android] GDrive mailx folder not found");
+            }
+            else {
                 setGDriveFolderId(folderId);
                 console.log(`[android] GDrive mailx folder: ${folderId}`);
-                // Re-read accounts directly from GDrive (bypass cache to pick up bob.ma etc.)
+                // DEBUG: list all files in the folder
+                try {
+                    const tk = await gmailTokenProvider();
+                    const lr = await fetch(`https://www.googleapis.com/drive/v3/files?q='${folderId}'+in+parents+and+trashed%3Dfalse&fields=files(id,name,mimeType,owners(emailAddress))`, { headers: { "Authorization": `Bearer ${tk}` } });
+                    if (lr.ok) {
+                        const ld = await lr.json();
+                        const names = (ld.files || []).map((f) => `${f.name}(${f.owners?.[0]?.emailAddress || "?"})`).join(",");
+                        console.log(`[android] Folder contents: ${ld.files?.length || 0} files [${names}]`);
+                    }
+                    else {
+                        console.warn(`[android] List folder failed: ${lr.status}`);
+                    }
+                }
+                catch (e) {
+                    console.warn(`[android] List debug: ${e.message}`);
+                }
+                // Read accounts directly from GDrive (bypass IndexedDB cache)
+                console.log("[android] Reading accounts.jsonc from GDrive...");
                 const gdriveAccounts = await loadAccountsFromCloud();
-                if (gdriveAccounts.length > accounts.length) {
-                    console.log(`[android] GDrive has ${gdriveAccounts.length} accounts (was ${accounts.length})`);
+                console.log(`[android] GDrive returned ${gdriveAccounts.length} accounts: ${gdriveAccounts.map(a => a.id).join(",")}`);
+                if (gdriveAccounts.length > 0) {
+                    // Use canonical GDrive accounts (upsert handles overwrites)
                     accounts = gdriveAccounts;
-                    // Register any new accounts
                     for (const account of accounts) {
                         if (!account.enabled)
                             continue;
@@ -444,7 +548,10 @@ export async function initAndroid() {
                         }
                         await syncManager.addAccount(account);
                     }
+                    console.log(`[android] Loaded ${accounts.length} accounts from GDrive`);
                 }
+                // Register this Android device in clients.jsonc
+                await registerDeviceInGDrive(gmailTokenProvider, folderId, accounts.map(a => a.id));
             }
         }
         catch (e) {

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

@@ -501,7 +501,8 @@ export class WebMailxDB {
             from: { name: r.from_name, address: r.from_address },
             to: JSON.parse(r.to_json), cc: JSON.parse(r.cc_json),
             flags: JSON.parse(r.flags_json), size: r.size,
-            hasAttachments: !!r.has_attachments, preview: r.preview
+            hasAttachments: !!r.has_attachments, preview: r.preview,
+            bodyPath: r.body_path || ""
         };
     }
 }

package/packages/mailx-store-web/gmail-api-web.d.ts

@@ -19,6 +19,8 @@ export declare class GmailApiWebProvider implements MailProvider {
     fetchSince(folder: string, sinceUid: number, options?: FetchOptions): Promise<ProviderMessage[]>;
     fetchByDate(folder: string, since: Date, before: Date, options?: FetchOptions, onChunk?: (msgs: ProviderMessage[]) => void): Promise<ProviderMessage[]>;
     fetchByUids(folder: string, uids: number[], options?: FetchOptions): Promise<ProviderMessage[]>;
+    /** Fetch a message directly by Gmail provider ID — fast path, no listing needed */
+    fetchById(providerId: string, options?: FetchOptions): Promise<ProviderMessage | null>;
     fetchOne(folder: string, uid: number, options?: FetchOptions): Promise<ProviderMessage | null>;
     getUids(folder: string): Promise<number[]>;
     close(): Promise<void>;

package/packages/mailx-store-web/gmail-api-web.js

@@ -135,16 +135,14 @@ export class GmailApiWebProvider {
         const headers = msg.payload?.headers || [];
         let source = "";
         if (options.source && msg.raw) {
-            // URL-safe base64 → standard base64 → decoded string
+            // URL-safe base64 → standard base64 → UTF-8 string
+            // atob() returns a binary string (1 byte per char). Must decode bytes as UTF-8
+            // to handle multi-byte characters correctly (e.g. smart quotes).
             const base64 = msg.raw.replace(/-/g, "+").replace(/_/g, "/");
-            try {
-                source = atob(base64);
-            }
-            catch {
-                // Handle padding issues
-                const padded = base64 + "=".repeat((4 - (base64.length % 4)) % 4);
-                source = atob(padded);
-            }
+            const padded = base64 + "=".repeat((4 - (base64.length % 4)) % 4);
+            const binary = atob(padded);
+            const bytes = Uint8Array.from(binary, c => c.charCodeAt(0));
+            source = new TextDecoder("utf-8").decode(bytes);
         }
         const fromRaw = getHeader(headers, "From");
         const toRaw = getHeader(headers, "To");
@@ -189,6 +187,24 @@ export class GmailApiWebProvider {
         const matchingIds = ids.filter(id => uidSet.has(idToUid(id)));
         return this.batchFetch(matchingIds, options);
     }
+    /** Fetch a message directly by Gmail provider ID — fast path, no listing needed */
+    async fetchById(providerId, options = {}) {
+        const format = options.source ? "raw" : "metadata";
+        const params = new URLSearchParams({ format });
+        if (format === "metadata") {
+            for (const h of ["From", "To", "Cc", "Subject", "Message-ID", "Date"]) {
+                params.append("metadataHeaders", h);
+            }
+        }
+        try {
+            const msg = await this.apiFetch(`/messages/${providerId}?${params}`);
+            return this.parseMessage(msg, options);
+        }
+        catch (e) {
+            console.warn(`[gmail] fetchById ${providerId} failed: ${e.message}`);
+            return null;
+        }
+    }
     async fetchOne(folder, uid, options = {}) {
         const query = `in:${this.folderToLabel(folder)}`;
         const ids = await this.listMessageIds(query, 1000);

package/packages/mailx-types/index.d.ts

@@ -72,6 +72,7 @@ export interface MessageEnvelope {
     size: number;
     hasAttachments: boolean;
     preview: string; /** First ~200 chars of body text */
+    bodyPath?: string; /** Local body location: "idb:..." or "gmail:<id>" */
 }
 /** Full message with body content */
 export interface Message extends MessageEnvelope {