@bobfrankston/mailx 1.0.12 → 1.0.14

package/bin/mailx.js

@@ -1,25 +1,28 @@
 #!/usr/bin/env node
 /**
- * mailx — email client launcher
+ * mailx — email client
  *
  * Usage:
- *   mailx                    Start unified (in-process server + open browser)
- *   mailx --server           Start as a standalone server only (no browser)
- *   mailx --no-browser       Start server in-process, don't open browser
- *   mailx --external         Bind to all interfaces (default: localhost only)
+ *   mailx                    Launch native app (IPC, no server)
+ *   mailx --server           Start Express server + open browser
+ *   mailx --no-browser       Server mode, don't open browser
+ *   mailx --external         Bind to all interfaces (server mode only)
  */
 
+import fs from "node:fs";
+import path from "node:path";
 import net from "node:net";
 
 const PORT = 9333;
 const args = process.argv.slice(2);
+const serverMode = args.includes("--server");
+const noBrowser = args.includes("--no-browser");
 
 function isPortInUse(port) {
     return new Promise((resolve) => {
-        const server = net.createServer();
-        server.once("error", () => resolve(true));
-        server.once("listening", () => { server.close(); resolve(false); });
-        server.listen(port, "127.0.0.1");
+        const socket = net.createConnection({ port, host: "127.0.0.1" });
+        socket.once("connect", () => { socket.destroy(); resolve(true); });
+        socket.once("error", () => resolve(false));
     });
 }
 
@@ -32,33 +35,54 @@ function openBrowser(url) {
 }
 
 async function main() {
-    const serverOnly = args.includes("--server");
-    const noBrowser = args.includes("--no-browser") || serverOnly;
+    if (serverMode) {
+        // Server mode — Express + WebSocket, open browser
+        const inUse = await isPortInUse(PORT);
+        if (inUse) {
+            console.log("mailx server already running");
+            if (!noBrowser) openBrowser(`http://localhost:${PORT}`);
+            return;
+        }
+
+        console.log("Starting mailx server...");
+        if (args.includes("--external")) process.argv.push("--external");
+        await import("../packages/mailx-server/index.js");
 
-    const inUse = await isPortInUse(PORT);
-    if (inUse) {
-        console.log("mailx is already running");
         if (!noBrowser) {
+            for (let i = 0; i < 30; i++) {
+                await new Promise(r => setTimeout(r, 200));
+                if (await isPortInUse(PORT)) break;
+            }
             openBrowser(`http://localhost:${PORT}`);
-            console.log("mailx opened");
+            console.log("mailx opened (browser)");
         }
-        return;
-    }
-
-    console.log("Starting mailx...");
+    } else {
+        // Default: launch native WebView app with IPC
+        // Platform-specific binary naming (matches msger pattern)
+        let binaryName;
+        if (process.platform === "win32") binaryName = "mailx-app.exe";
+        else if (process.platform === "darwin") binaryName = process.arch === "arm64" ? "mailx-app-arm64" : "mailx-app";
+        else binaryName = process.arch === "arm64" ? "mailx-app-linux-aarch64" : "mailx-app-linux";
 
-    if (args.includes("--external")) process.argv.push("--external");
+        const launcherPaths = [
+            path.join(import.meta.dirname, "..", "launcher", "bin", binaryName),
+            path.join(import.meta.dirname, "..", "launcher", "target", "release", binaryName),
+        ];
 
-    // Import server directly — relative path, in-process
-    await import("../packages/mailx-server/index.js");
+        let launcherPath = launcherPaths.find(p => fs.existsSync(p));
 
-    if (!noBrowser) {
-        for (let i = 0; i < 30; i++) {
-            await new Promise(r => setTimeout(r, 200));
-            if (await isPortInUse(PORT)) break;
+        if (launcherPath) {
+            console.log("Starting mailx...");
+            const { spawn } = await import("node:child_process");
+            const child = spawn(launcherPath, args, { detached: true, stdio: "ignore" });
+            child.unref();
+            console.log("mailx launched");
+        } else {
+            // No native launcher — fall back to server mode + browser
+            console.log("Native launcher not found, falling back to server mode");
+            process.argv.push("--server");
+            await main(); // recurse with --server
         }
-        openBrowser(`http://localhost:${PORT}`);
-        console.log("mailx opened");
     }
 }
 

package/client/app.js

@@ -8,16 +8,21 @@ import { showMessage, getCurrentMessage } from "./components/message-viewer.js";
 import { connectWebSocket, onWsEvent, triggerSync, getAccounts } from "./lib/api-client.js";
 // ── Wire up components ──
 const folderTree = document.getElementById("folder-tree");
+let currentFolderSpecialUse = "";
 initFolderTree(folderTree, (accountId, folderId, folderName, specialUse) => {
+    currentFolderSpecialUse = specialUse;
+    currentAccountId = accountId;
+    currentFolderId = folderId;
     loadMessages(accountId, folderId, 1, specialUse);
     document.title = `mailx - ${folderName}`;
 }, () => {
     // Unified inbox handler
+    currentFolderSpecialUse = "inbox";
     loadUnifiedInbox();
     document.title = "mailx - All Inboxes";
 });
-initMessageList((accountId, uid) => {
-    showMessage(accountId, uid);
+initMessageList((accountId, uid, folderId) => {
+    showMessage(accountId, uid, folderId, currentFolderSpecialUse);
     // Enable action buttons when a message is selected
     for (const id of ["btn-reply", "btn-reply-all", "btn-forward", "btn-delete", "btn-flag"]) {
         const btn = document.getElementById(id);
@@ -144,14 +149,27 @@ async function deleteCurrentMessage() {
             if (statusSync?.textContent?.includes("Ctrl+Z"))
                 statusSync.textContent = "";
         }, 30000);
-        // Clear the preview pane
-        const bodyEl = document.getElementById("mv-body");
-        const headerEl = document.getElementById("mv-header");
-        if (bodyEl)
-            bodyEl.innerHTML = `<div class="mv-empty">Select a message to read</div>`;
-        if (headerEl)
-            headerEl.hidden = true;
-        reloadCurrentFolder();
+        // Remove the deleted row and select the next message
+        const mlBody = document.getElementById("ml-body");
+        if (mlBody) {
+            const deletedRow = mlBody.querySelector(`.ml-row[data-uid="${message.uid}"]`);
+            if (deletedRow) {
+                const nextRow = (deletedRow.nextElementSibling || deletedRow.previousElementSibling);
+                deletedRow.remove();
+                if (nextRow?.classList.contains("ml-row")) {
+                    nextRow.click();
+                }
+                else {
+                    // No more messages — clear preview
+                    const bodyEl = document.getElementById("mv-body");
+                    const headerEl = document.getElementById("mv-header");
+                    if (bodyEl)
+                        bodyEl.innerHTML = `<div class="mv-empty">Select a message to read</div>`;
+                    if (headerEl)
+                        headerEl.hidden = true;
+                }
+            }
+        }
     }
     catch (e) {
         console.error(`Delete failed: ${e.message}`);
@@ -191,35 +209,82 @@ document.getElementById("btn-forward")?.addEventListener("click", () => openComp
 // ── Search ──
 let searchTimeout;
 const searchInput = document.getElementById("search-input");
+const searchScope = document.getElementById("search-scope");
+function doSearch() {
+    const query = searchInput.value.trim();
+    if (query.length < 2) {
+        if (query.length === 0)
+            reloadCurrentFolder();
+        return;
+    }
+    const scope = searchScope?.value || "all";
+    // For "current" and "server" scopes, pass the active folder context
+    loadSearchResults(query, scope, currentAccountId, currentFolderId);
+    document.title = `mailx - Search: ${query}`;
+}
+// Track current folder for scoped search
+let currentAccountId = "";
+let currentFolderId = 0;
 searchInput?.addEventListener("input", () => {
     clearTimeout(searchTimeout);
-    searchTimeout = setTimeout(() => {
-        const query = searchInput.value.trim();
-        if (query.length >= 2) {
-            loadSearchResults(query);
-            document.title = `mailx - Search: ${query}`;
-        }
-        else if (query.length === 0) {
-            // Clear search — reload current folder
-            reloadCurrentFolder();
-        }
-    }, 400);
+    searchTimeout = setTimeout(doSearch, 400);
 });
-// Enter triggers immediate search
 searchInput?.addEventListener("keydown", (e) => {
     if (e.key === "Enter") {
         clearTimeout(searchTimeout);
-        const query = searchInput.value.trim();
-        if (query) {
-            loadSearchResults(query);
-            document.title = `mailx - Search: ${query}`;
-        }
+        doSearch();
     }
     if (e.key === "Escape") {
         searchInput.value = "";
         reloadCurrentFolder();
     }
 });
+// ── Reload message list after drag-move ──
+document.addEventListener("mailx-message-moved", () => reloadCurrentFolder());
+// ── Folder filter ──
+const ftFilterInput = document.getElementById("ft-filter-input");
+if (ftFilterInput) {
+    ftFilterInput.addEventListener("input", () => {
+        const query = ftFilterInput.value.toLowerCase();
+        const tree = document.getElementById("folder-tree");
+        if (!tree)
+            return;
+        if (!query) {
+            // Clear filter — show everything
+            tree.querySelectorAll(".ft-filter-hidden").forEach(el => el.classList.remove("ft-filter-hidden"));
+            return;
+        }
+        // Hide all folders first, then show matches + their parent accounts
+        const folders = tree.querySelectorAll(".ft-folder");
+        const accounts = tree.querySelectorAll(".ft-account");
+        for (const acct of accounts)
+            acct.classList.add("ft-filter-hidden");
+        for (const f of folders)
+            f.classList.add("ft-filter-hidden");
+        for (const f of folders) {
+            const name = f.querySelector(".ft-folder-name")?.textContent?.toLowerCase() || "";
+            if (name.includes(query)) {
+                f.classList.remove("ft-filter-hidden");
+                // Show parent account
+                const acct = f.closest(".ft-account");
+                if (acct)
+                    acct.classList.remove("ft-filter-hidden");
+            }
+        }
+        // Also show unified inbox if it matches
+        const unified = tree.querySelector(".ft-unified");
+        if (unified) {
+            const text = unified.textContent?.toLowerCase() || "";
+            unified.classList.toggle("ft-filter-hidden", !text.includes(query));
+        }
+    });
+    ftFilterInput.addEventListener("keydown", (e) => {
+        if (e.key === "Escape") {
+            ftFilterInput.value = "";
+            ftFilterInput.dispatchEvent(new Event("input"));
+        }
+    });
+}
 // ── Open links from email body in system browser ──
 window.addEventListener("message", (e) => {
     if (e.data?.type === "openLink" && e.data.url) {
@@ -260,16 +325,20 @@ if (splitter) {
 connectWebSocket();
 onWsEvent((event) => {
     const statusSync = document.getElementById("status-sync");
+    const startupStatus = document.getElementById("startup-status");
     switch (event.type) {
         case "connected":
             if (statusSync)
                 statusSync.textContent = "Connected";
-            // Refresh folder counts on reconnect (non-disruptive)
-            refreshFolderTree();
+            if (startupStatus)
+                startupStatus.textContent = "Loading accounts...";
+            // Don't refresh folder tree on connect — it's already loaded by initFolderTree
             break;
         case "syncProgress":
             if (statusSync)
                 statusSync.textContent = `Sync: ${event.phase} ${event.progress}%`;
+            if (startupStatus)
+                startupStatus.textContent = `Syncing ${event.accountId}: ${event.phase}`;
             break;
         case "folderCountsChanged": {
             refreshFolderTree();
@@ -402,7 +471,10 @@ fetch("/api/version").then(r => r.json()).then(d => {
         el.textContent = `mailx s${d.server}/c${d.client}${isApp ? "" : " [browser]"}`;
 }).catch(async () => {
     // Server not running — try to start it if we're in the app
+    const startupStatus = document.getElementById("startup-status");
     if (isApp) {
+        if (startupStatus)
+            startupStatus.textContent = "Starting server...";
         await mailxapi.ensureServer();
         location.reload();
     }
@@ -410,6 +482,8 @@ fetch("/api/version").then(r => r.json()).then(d => {
         const el = document.getElementById("app-version");
         if (el)
             el.textContent = "mailx [server offline]";
+        if (startupStatus)
+            startupStatus.textContent = "Server offline — start with: node packages/mailx-server/index.js";
     }
 });
 // ── Sync pending indicator ──
@@ -427,5 +501,14 @@ setInterval(async () => {
     }
     catch { /* offline */ }
 }, 5000);
-console.log("mailx client initialized");
+console.log("mailx client initialized, location:", location.href);
+// Diagnostic: test API connectivity (helps debug WebView2 blank screen)
+fetch("/api/version").then(r => r.json()).then(d => {
+    console.log("API reachable:", d);
+}).catch(e => {
+    console.error("API unreachable:", e.message);
+    const status = document.getElementById("startup-status");
+    if (status)
+        status.textContent = `Cannot reach server API: ${e.message}`;
+});
 //# sourceMappingURL=app.js.map

package/client/components/folder-tree.js

@@ -123,7 +123,16 @@ function renderNode(node, container, depth) {
     nameSpan.className = "ft-folder-name";
     nameSpan.textContent = node.name;
     folderEl.appendChild(nameSpan);
-    if (node.unreadCount > 0) {
+    const isOutbox = node.specialUse === "outbox" || node.path.toLowerCase() === "outbox";
+    if (isOutbox && node.totalCount > 0) {
+        // Outbox: show total (pending) count with warning style
+        const badge = document.createElement("span");
+        badge.className = "ft-badge ft-badge-outbox";
+        badge.textContent = String(node.totalCount);
+        badge.title = `${node.totalCount} pending`;
+        folderEl.appendChild(badge);
+    }
+    else if (node.unreadCount > 0) {
         const badge = document.createElement("span");
         badge.className = "ft-badge";
         badge.textContent = String(node.unreadCount);
@@ -147,6 +156,58 @@ function renderNode(node, container, depth) {
         selectedFolderId = node.id;
         onFolderSelect(node.accountId, node.id, node.name, node.specialUse || node.path.toLowerCase());
     });
+    // ── Drop target for message drag-and-drop ──
+    if (node.id !== -1) {
+        folderEl.addEventListener("dragover", (e) => {
+            e.preventDefault();
+            e.dataTransfer.dropEffect = e.ctrlKey ? "copy" : "move";
+            folderEl.classList.add("drop-target");
+        });
+        folderEl.addEventListener("dragleave", () => folderEl.classList.remove("drop-target"));
+        folderEl.addEventListener("drop", async (e) => {
+            e.preventDefault();
+            folderEl.classList.remove("drop-target");
+            // Multi-message or single-message drop
+            const multiData = e.dataTransfer.getData("application/x-mailx-messages");
+            const singleData = e.dataTransfer.getData("application/x-mailx-message");
+            const messages = multiData ? JSON.parse(multiData) : singleData ? [JSON.parse(singleData)] : [];
+            // Filter: not already in target folder
+            const toMove = messages.filter(m => m.folderId !== node.id || m.accountId !== node.accountId);
+            if (toMove.length === 0)
+                return;
+            const statusEl = document.getElementById("status-sync");
+            const crossAccount = toMove.some(m => m.accountId !== node.accountId);
+            try {
+                let moved = 0;
+                for (const msg of toMove) {
+                    const body = { targetFolderId: node.id };
+                    if (msg.accountId !== node.accountId)
+                        body.targetAccountId = node.accountId;
+                    const res = await fetch(`/api/message/${msg.accountId}/${msg.uid}/move`, {
+                        method: "POST",
+                        headers: { "Content-Type": "application/json" },
+                        body: JSON.stringify(body),
+                    });
+                    if (!res.ok) {
+                        const err = await res.json().catch(() => ({ error: res.statusText }));
+                        throw new Error(err.error);
+                    }
+                    moved++;
+                }
+                if (statusEl)
+                    statusEl.textContent = `Moved ${moved} message${moved > 1 ? "s" : ""} to ${node.name}`;
+                const treeContainer = document.getElementById("folder-tree");
+                if (treeContainer)
+                    loadFolderTree(treeContainer);
+                document.dispatchEvent(new CustomEvent("mailx-message-moved"));
+            }
+            catch (err) {
+                console.error(`Move failed: ${err.message}`);
+                if (statusEl)
+                    statusEl.textContent = `Move failed: ${err.message}`;
+            }
+        });
+    }
     container.appendChild(folderEl);
     // Render children if expanded
     if (hasChildren && isExpanded) {
@@ -161,13 +222,19 @@ export function initFolderTree(container, handler, unifiedHandler) {
     loadFolderTree(container);
 }
 async function loadFolderTree(container) {
-    container.innerHTML = "";
+    // Show loading state while preserving existing tree (if any) on refresh
+    const hadContent = container.children.length > 0 && !container.querySelector(".folder-loading");
+    if (!hadContent) {
+        container.innerHTML = `<div class="folder-loading">Loading accounts...</div>`;
+    }
     try {
         const accounts = await getAccounts();
         if (accounts.length === 0) {
             container.innerHTML = `<div class="folder-loading">No accounts configured.<br>Edit ~/.mailx/settings.jsonc</div>`;
             return;
         }
+        // Clear loading state now that we have data
+        container.innerHTML = "";
         // Unified Inbox (if multiple accounts)
         if (accounts.length > 1) {
             const unifiedEl = document.createElement("div");
@@ -192,7 +259,7 @@ async function loadFolderTree(container) {
             const accountExpanded = expandState[accountKey] !== false; // accounts default expanded
             const header = document.createElement("div");
             header.className = "ft-account-header";
-            header.textContent = `${accountExpanded ? "▾" : "▸"} ${account.name}`;
+            header.textContent = `${accountExpanded ? "▾" : "▸"} ${account.label || account.name}`;
             header.addEventListener("click", () => {
                 expandState[accountKey] = !accountExpanded;
                 saveExpandState();
@@ -272,9 +339,23 @@ async function loadFolderTree(container) {
             if (target)
                 target.click();
         }
+        // Dismiss startup overlay once tree is loaded
+        const overlay = document.getElementById("startup-overlay");
+        if (overlay)
+            overlay.classList.add("hidden");
+        // Remove from DOM after transition
+        setTimeout(() => overlay?.remove(), 400);
     }
     catch (e) {
         container.innerHTML = `<div class="folder-loading">Error loading folders: ${e.message}</div>`;
+        // Dismiss overlay on error too — show the error, not a spinner
+        const overlay = document.getElementById("startup-overlay");
+        if (overlay) {
+            const status = document.getElementById("startup-status");
+            if (status)
+                status.textContent = `Error: ${e.message}`;
+            setTimeout(() => { overlay.classList.add("hidden"); setTimeout(() => overlay.remove(), 400); }, 2000);
+        }
     }
 }
 /** Refresh folder tree (e.g., after sync) */