@bobfrankston/rmfmail 1.0.467

package/client/components/alarms.js

@@ -0,0 +1,299 @@
+/**
+ * Alarm subsystem — Thunderbird/Outlook-style reminder popups.
+ *
+ * Design decisions (2026-04-24):
+ *   - One shared subsystem for calendar events + tasks (+ future mail reminders).
+ *   - Popup shows item title, scheduled time, Snooze (5 / 15 / 30 min / 1 hr /
+ *     custom), Dismiss. Snooze delays the alarm by the chosen interval; Dismiss
+ *     suppresses it permanently.
+ *   - Dismissed / snoozed state lives in localStorage (per-device). Google
+ *     Calendar's own reminders aren't mutated by this — mailx's popup is a
+ *     local convenience, not a reminder-authority replacement.
+ *   - Default lead time: 10 min before calendar event start; at task due time
+ *     for tasks. Per-event overrides from Google Calendar's `reminders.overrides`
+ *     are a follow-up (we don't currently fetch that field).
+ *
+ * Check cadence: every 30 s while the tab/window is focused. No check when
+ * hidden — alarm won't fire until user returns, which matches Thunderbird's
+ * behavior (focus-gated). OS-level notifications are a separate follow-up.
+ */
+import { getCalendarEvents, getTasks } from "../lib/api-client.js";
+const DISMISSED_KEY = "mailx-alarm-dismissed"; // { uuid: true }
+const SNOOZED_KEY = "mailx-alarm-snoozed"; // { uuid: epoch-ms-end }
+const CAL_LEAD_MS = 10 * 60 * 1000; // 10 min before cal event start
+const LOOKBACK_MS = 60 * 60 * 1000; // fire past-due alarms from the last 60 min
+const LOOKAHEAD_MS = 2 * 60 * 60 * 1000; // poll window: upcoming 2 hr
+const POLL_INTERVAL_MS = 30_000;
+function loadDismissed() {
+    try {
+        return JSON.parse(localStorage.getItem(DISMISSED_KEY) || "{}");
+    }
+    catch {
+        return {};
+    }
+}
+function saveDismissed(map) {
+    try {
+        localStorage.setItem(DISMISSED_KEY, JSON.stringify(map));
+    }
+    catch { /* private mode */ }
+}
+function loadSnoozed() {
+    try {
+        return JSON.parse(localStorage.getItem(SNOOZED_KEY) || "{}");
+    }
+    catch {
+        return {};
+    }
+}
+function saveSnoozed(map) {
+    try {
+        localStorage.setItem(SNOOZED_KEY, JSON.stringify(map));
+    }
+    catch { /* */ }
+}
+/** Prune expired entries so the maps don't grow forever. */
+function pruneState(now) {
+    const snoozed = loadSnoozed();
+    let changed = false;
+    for (const [uuid, until] of Object.entries(snoozed)) {
+        // Snoozed entries older than 7 days have been fired already (or the
+        // event is long past); drop them.
+        if (until < now - 7 * 86400_000) {
+            delete snoozed[uuid];
+            changed = true;
+        }
+    }
+    if (changed)
+        saveSnoozed(snoozed);
+    // Dismissed is sparse — don't bother pruning aggressively.
+}
+async function collectDueAlarms(now) {
+    const dismissed = loadDismissed();
+    const snoozed = loadSnoozed();
+    const items = [];
+    try {
+        const events = await getCalendarEvents(now - LOOKBACK_MS, now + LOOKAHEAD_MS);
+        for (const ev of events) {
+            if (!ev.uuid)
+                continue;
+            if (dismissed[ev.uuid])
+                continue;
+            const alarm = (ev.start || 0) - CAL_LEAD_MS;
+            const effective = snoozed[ev.uuid] || alarm;
+            if (effective <= now && effective > now - LOOKBACK_MS) {
+                items.push({
+                    uuid: ev.uuid, kind: "calendar",
+                    title: ev.title || "(no title)",
+                    alarmMs: effective, whenMs: ev.start || 0,
+                    htmlLink: ev.htmlLink,
+                });
+            }
+        }
+    }
+    catch { /* sidebar will surface API errors; alarm path stays quiet */ }
+    try {
+        const tasks = await getTasks(false);
+        for (const t of tasks) {
+            if (!t.uuid || !t.dueMs)
+                continue;
+            if (dismissed[t.uuid])
+                continue;
+            const effective = snoozed[t.uuid] || t.dueMs;
+            if (effective <= now && effective > now - LOOKBACK_MS) {
+                items.push({
+                    uuid: t.uuid, kind: "task",
+                    title: t.title || "(no title)",
+                    alarmMs: effective, whenMs: t.dueMs,
+                });
+            }
+        }
+    }
+    catch { /* */ }
+    return items;
+}
+function formatWhen(ms) {
+    if (!ms)
+        return "";
+    const d = new Date(ms);
+    return d.toLocaleString(undefined, { weekday: "short", month: "short", day: "numeric", hour: "2-digit", minute: "2-digit" });
+}
+let currentPopup = null;
+let firedThisSession = new Set();
+function showPopup(items) {
+    if (currentPopup)
+        return; // another popup already up
+    if (items.length === 0)
+        return;
+    const overlay = document.createElement("div");
+    overlay.className = "alarm-overlay";
+    const panel = document.createElement("div");
+    panel.className = "alarm-panel";
+    panel.innerHTML = `
+        <div class="alarm-head">
+            <span class="alarm-icon">⏰</span>
+            <span class="alarm-title">${items.length} reminder${items.length > 1 ? "s" : ""}</span>
+            <button type="button" class="alarm-close" aria-label="Close">&times;</button>
+        </div>
+        <div class="alarm-list"></div>
+        <div class="alarm-foot">
+            <label class="alarm-snooze-label">Snooze for
+                <select class="alarm-snooze-sel">
+                    <option value="5">5 minutes</option>
+                    <option value="15" selected>15 minutes</option>
+                    <option value="30">30 minutes</option>
+                    <option value="60">1 hour</option>
+                    <option value="240">4 hours</option>
+                    <option value="1440">1 day</option>
+                    <option value="custom">custom…</option>
+                </select>
+            </label>
+            <span style="flex:1"></span>
+            <button type="button" class="alarm-btn alarm-btn-snooze">Snooze all</button>
+            <button type="button" class="alarm-btn alarm-btn-primary alarm-btn-dismiss">Dismiss all</button>
+        </div>
+    `;
+    const list = panel.querySelector(".alarm-list");
+    for (const it of items) {
+        const row = document.createElement("div");
+        row.className = "alarm-row";
+        row.dataset.uuid = it.uuid;
+        row.innerHTML = `
+            <div class="alarm-row-main">
+                <span class="alarm-row-kind">${it.kind === "calendar" ? "📅" : "☑"}</span>
+                <span class="alarm-row-title"></span>
+                <span class="alarm-row-when"></span>
+            </div>
+            <div class="alarm-row-actions">
+                ${it.htmlLink ? `<button type="button" class="alarm-row-link" data-link="${it.htmlLink}" title="View in browser">↗</button>` : ""}
+                <button type="button" class="alarm-row-dismiss" title="Dismiss this one">✕</button>
+            </div>
+        `;
+        row.querySelector(".alarm-row-title").textContent = it.title;
+        row.querySelector(".alarm-row-when").textContent = formatWhen(it.whenMs);
+        list.appendChild(row);
+    }
+    overlay.appendChild(panel);
+    document.body.appendChild(overlay);
+    currentPopup = overlay;
+    // Pin the mailx window above other apps while a reminder is showing —
+    // matches Thunderbird's reminder dialog behavior. Cleared on close so
+    // the window doesn't stay always-on-top once the user has acknowledged.
+    // No-op in browser fallback (msgapi only present in WebView2).
+    const msgapi = window.msgapi;
+    try {
+        msgapi?.setAlwaysOnTop?.(true);
+    }
+    catch { /* */ }
+    const snoozeMinutes = () => {
+        const sel = panel.querySelector(".alarm-snooze-sel");
+        if (sel.value === "custom") {
+            const v = prompt("Snooze for how many minutes?", "30");
+            const n = parseInt(v || "", 10);
+            return Number.isFinite(n) && n > 0 ? n : null;
+        }
+        return parseInt(sel.value, 10);
+    };
+    const snoozeAll = (minutes) => {
+        const now = Date.now();
+        const map = loadSnoozed();
+        for (const it of items)
+            map[it.uuid] = now + minutes * 60_000;
+        saveSnoozed(map);
+        for (const it of items)
+            firedThisSession.delete(it.uuid);
+        close();
+    };
+    const dismissAll = () => {
+        const map = loadDismissed();
+        for (const it of items)
+            map[it.uuid] = true;
+        saveDismissed(map);
+        close();
+    };
+    const close = () => {
+        overlay.remove();
+        currentPopup = null;
+        try {
+            msgapi?.setAlwaysOnTop?.(false);
+        }
+        catch { /* */ }
+    };
+    panel.querySelector(".alarm-close")?.addEventListener("click", close);
+    panel.querySelector(".alarm-btn-snooze")?.addEventListener("click", () => {
+        const n = snoozeMinutes();
+        if (n)
+            snoozeAll(n);
+    });
+    panel.querySelector(".alarm-btn-dismiss")?.addEventListener("click", dismissAll);
+    panel.querySelectorAll(".alarm-row-dismiss").forEach(btn => {
+        btn.addEventListener("click", () => {
+            const row = btn.closest(".alarm-row");
+            const uuid = row?.dataset.uuid;
+            if (!uuid)
+                return;
+            const map = loadDismissed();
+            map[uuid] = true;
+            saveDismissed(map);
+            row.remove();
+            if (panel.querySelector(".alarm-list")?.childElementCount === 0)
+                close();
+        });
+    });
+    panel.querySelectorAll(".alarm-row-link").forEach(btn => {
+        btn.addEventListener("click", () => {
+            const url = btn.dataset.link;
+            if (!url)
+                return;
+            const api = window.mailxapi;
+            if (api?.openExternal)
+                api.openExternal(url);
+            else
+                window.open(url, "_blank");
+        });
+    });
+    // Escape closes without action (same as X) — user can re-open with next
+    // poll tick by not acting on it.
+    const onKey = (e) => {
+        if (e.key === "Escape") {
+            e.stopPropagation();
+            close();
+            document.removeEventListener("keydown", onKey, true);
+        }
+    };
+    document.addEventListener("keydown", onKey, true);
+}
+async function pollAlarms() {
+    if (document.hidden)
+        return; // don't fire while tab hidden
+    if (currentPopup)
+        return; // user hasn't acknowledged last one
+    const now = Date.now();
+    pruneState(now);
+    const due = await collectDueAlarms(now);
+    // Only show items we haven't already fired this session (prevents the
+    // popup from immediately re-appearing if the user closes it without
+    // dismissing — the item still matches the "due" filter next tick).
+    const fresh = due.filter(d => !firedThisSession.has(d.uuid));
+    if (fresh.length === 0)
+        return;
+    for (const d of fresh)
+        firedThisSession.add(d.uuid);
+    showPopup(fresh);
+}
+/** Start the alarm poller. Called from app.ts on startup. */
+export function startAlarmPoller() {
+    if (window.__mailxAlarmPollerRunning)
+        return;
+    window.__mailxAlarmPollerRunning = true;
+    // First check after 5 s so startup isn't jittered by a modal.
+    setTimeout(() => { pollAlarms().catch(() => { }); }, 5000);
+    setInterval(() => { pollAlarms().catch(() => { }); }, POLL_INTERVAL_MS);
+    // Re-check on visibility change — if the user comes back to the tab
+    // after an hour away, they should see anything they missed immediately.
+    document.addEventListener("visibilitychange", () => {
+        if (!document.hidden)
+            pollAlarms().catch(() => { });
+    });
+}
+//# sourceMappingURL=alarms.js.map

package/client/components/alarms.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alarms.js","sourceRoot":"","sources":["alarms.ts"],"names":[],"mappings":"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"}

package/client/components/alarms.ts

@@ -0,0 +1,276 @@
+/**
+ * Alarm subsystem — Thunderbird/Outlook-style reminder popups.
+ *
+ * Design decisions (2026-04-24):
+ *   - One shared subsystem for calendar events + tasks (+ future mail reminders).
+ *   - Popup shows item title, scheduled time, Snooze (5 / 15 / 30 min / 1 hr /
+ *     custom), Dismiss. Snooze delays the alarm by the chosen interval; Dismiss
+ *     suppresses it permanently.
+ *   - Dismissed / snoozed state lives in localStorage (per-device). Google
+ *     Calendar's own reminders aren't mutated by this — mailx's popup is a
+ *     local convenience, not a reminder-authority replacement.
+ *   - Default lead time: 10 min before calendar event start; at task due time
+ *     for tasks. Per-event overrides from Google Calendar's `reminders.overrides`
+ *     are a follow-up (we don't currently fetch that field).
+ *
+ * Check cadence: every 30 s while the tab/window is focused. No check when
+ * hidden — alarm won't fire until user returns, which matches Thunderbird's
+ * behavior (focus-gated). OS-level notifications are a separate follow-up.
+ */
+
+import { getCalendarEvents, getTasks } from "../lib/api-client.js";
+
+const DISMISSED_KEY = "mailx-alarm-dismissed";      // { uuid: true }
+const SNOOZED_KEY = "mailx-alarm-snoozed";          // { uuid: epoch-ms-end }
+const CAL_LEAD_MS = 10 * 60 * 1000;                 // 10 min before cal event start
+const LOOKBACK_MS = 60 * 60 * 1000;                 // fire past-due alarms from the last 60 min
+const LOOKAHEAD_MS = 2 * 60 * 60 * 1000;            // poll window: upcoming 2 hr
+const POLL_INTERVAL_MS = 30_000;
+
+interface AlarmItem {
+    uuid: string;
+    kind: "calendar" | "task";
+    title: string;
+    /** When the alarm should fire (epoch ms). */
+    alarmMs: number;
+    /** When the source event actually starts / is due (epoch ms) — shown in popup. */
+    whenMs: number;
+    /** Optional web link for "view in browser". */
+    htmlLink?: string;
+}
+
+function loadDismissed(): Record<string, boolean> {
+    try { return JSON.parse(localStorage.getItem(DISMISSED_KEY) || "{}"); } catch { return {}; }
+}
+function saveDismissed(map: Record<string, boolean>): void {
+    try { localStorage.setItem(DISMISSED_KEY, JSON.stringify(map)); } catch { /* private mode */ }
+}
+function loadSnoozed(): Record<string, number> {
+    try { return JSON.parse(localStorage.getItem(SNOOZED_KEY) || "{}"); } catch { return {}; }
+}
+function saveSnoozed(map: Record<string, number>): void {
+    try { localStorage.setItem(SNOOZED_KEY, JSON.stringify(map)); } catch { /* */ }
+}
+
+/** Prune expired entries so the maps don't grow forever. */
+function pruneState(now: number): void {
+    const snoozed = loadSnoozed();
+    let changed = false;
+    for (const [uuid, until] of Object.entries(snoozed)) {
+        // Snoozed entries older than 7 days have been fired already (or the
+        // event is long past); drop them.
+        if (until < now - 7 * 86400_000) { delete snoozed[uuid]; changed = true; }
+    }
+    if (changed) saveSnoozed(snoozed);
+    // Dismissed is sparse — don't bother pruning aggressively.
+}
+
+async function collectDueAlarms(now: number): Promise<AlarmItem[]> {
+    const dismissed = loadDismissed();
+    const snoozed = loadSnoozed();
+    const items: AlarmItem[] = [];
+
+    try {
+        const events = await getCalendarEvents(now - LOOKBACK_MS, now + LOOKAHEAD_MS);
+        for (const ev of events) {
+            if (!ev.uuid) continue;
+            if (dismissed[ev.uuid]) continue;
+            const alarm = (ev.start || 0) - CAL_LEAD_MS;
+            const effective = snoozed[ev.uuid] || alarm;
+            if (effective <= now && effective > now - LOOKBACK_MS) {
+                items.push({
+                    uuid: ev.uuid, kind: "calendar",
+                    title: ev.title || "(no title)",
+                    alarmMs: effective, whenMs: ev.start || 0,
+                    htmlLink: ev.htmlLink,
+                });
+            }
+        }
+    } catch { /* sidebar will surface API errors; alarm path stays quiet */ }
+
+    try {
+        const tasks = await getTasks(false);
+        for (const t of tasks) {
+            if (!t.uuid || !t.dueMs) continue;
+            if (dismissed[t.uuid]) continue;
+            const effective = snoozed[t.uuid] || t.dueMs;
+            if (effective <= now && effective > now - LOOKBACK_MS) {
+                items.push({
+                    uuid: t.uuid, kind: "task",
+                    title: t.title || "(no title)",
+                    alarmMs: effective, whenMs: t.dueMs,
+                });
+            }
+        }
+    } catch { /* */ }
+
+    return items;
+}
+
+function formatWhen(ms: number): string {
+    if (!ms) return "";
+    const d = new Date(ms);
+    return d.toLocaleString(undefined, { weekday: "short", month: "short", day: "numeric", hour: "2-digit", minute: "2-digit" });
+}
+
+let currentPopup: HTMLElement | null = null;
+let firedThisSession = new Set<string>();
+
+function showPopup(items: AlarmItem[]): void {
+    if (currentPopup) return;                       // another popup already up
+    if (items.length === 0) return;
+    const overlay = document.createElement("div");
+    overlay.className = "alarm-overlay";
+    const panel = document.createElement("div");
+    panel.className = "alarm-panel";
+    panel.innerHTML = `
+        <div class="alarm-head">
+            <span class="alarm-icon">⏰</span>
+            <span class="alarm-title">${items.length} reminder${items.length > 1 ? "s" : ""}</span>
+            <button type="button" class="alarm-close" aria-label="Close">&times;</button>
+        </div>
+        <div class="alarm-list"></div>
+        <div class="alarm-foot">
+            <label class="alarm-snooze-label">Snooze for
+                <select class="alarm-snooze-sel">
+                    <option value="5">5 minutes</option>
+                    <option value="15" selected>15 minutes</option>
+                    <option value="30">30 minutes</option>
+                    <option value="60">1 hour</option>
+                    <option value="240">4 hours</option>
+                    <option value="1440">1 day</option>
+                    <option value="custom">custom…</option>
+                </select>
+            </label>
+            <span style="flex:1"></span>
+            <button type="button" class="alarm-btn alarm-btn-snooze">Snooze all</button>
+            <button type="button" class="alarm-btn alarm-btn-primary alarm-btn-dismiss">Dismiss all</button>
+        </div>
+    `;
+    const list = panel.querySelector(".alarm-list")!;
+    for (const it of items) {
+        const row = document.createElement("div");
+        row.className = "alarm-row";
+        row.dataset.uuid = it.uuid;
+        row.innerHTML = `
+            <div class="alarm-row-main">
+                <span class="alarm-row-kind">${it.kind === "calendar" ? "📅" : "☑"}</span>
+                <span class="alarm-row-title"></span>
+                <span class="alarm-row-when"></span>
+            </div>
+            <div class="alarm-row-actions">
+                ${it.htmlLink ? `<button type="button" class="alarm-row-link" data-link="${it.htmlLink}" title="View in browser">↗</button>` : ""}
+                <button type="button" class="alarm-row-dismiss" title="Dismiss this one">✕</button>
+            </div>
+        `;
+        (row.querySelector(".alarm-row-title") as HTMLElement).textContent = it.title;
+        (row.querySelector(".alarm-row-when") as HTMLElement).textContent = formatWhen(it.whenMs);
+        list.appendChild(row);
+    }
+    overlay.appendChild(panel);
+    document.body.appendChild(overlay);
+    currentPopup = overlay;
+
+    // Pin the mailx window above other apps while a reminder is showing —
+    // matches Thunderbird's reminder dialog behavior. Cleared on close so
+    // the window doesn't stay always-on-top once the user has acknowledged.
+    // No-op in browser fallback (msgapi only present in WebView2).
+    const msgapi: any = (window as any).msgapi;
+    try { msgapi?.setAlwaysOnTop?.(true); } catch { /* */ }
+
+    const snoozeMinutes = (): number | null => {
+        const sel = panel.querySelector<HTMLSelectElement>(".alarm-snooze-sel")!;
+        if (sel.value === "custom") {
+            const v = prompt("Snooze for how many minutes?", "30");
+            const n = parseInt(v || "", 10);
+            return Number.isFinite(n) && n > 0 ? n : null;
+        }
+        return parseInt(sel.value, 10);
+    };
+
+    const snoozeAll = (minutes: number): void => {
+        const now = Date.now();
+        const map = loadSnoozed();
+        for (const it of items) map[it.uuid] = now + minutes * 60_000;
+        saveSnoozed(map);
+        for (const it of items) firedThisSession.delete(it.uuid);
+        close();
+    };
+    const dismissAll = (): void => {
+        const map = loadDismissed();
+        for (const it of items) map[it.uuid] = true;
+        saveDismissed(map);
+        close();
+    };
+
+    const close = () => {
+        overlay.remove();
+        currentPopup = null;
+        try { msgapi?.setAlwaysOnTop?.(false); } catch { /* */ }
+    };
+
+    panel.querySelector(".alarm-close")?.addEventListener("click", close);
+    panel.querySelector(".alarm-btn-snooze")?.addEventListener("click", () => {
+        const n = snoozeMinutes();
+        if (n) snoozeAll(n);
+    });
+    panel.querySelector(".alarm-btn-dismiss")?.addEventListener("click", dismissAll);
+
+    panel.querySelectorAll<HTMLButtonElement>(".alarm-row-dismiss").forEach(btn => {
+        btn.addEventListener("click", () => {
+            const row = btn.closest<HTMLElement>(".alarm-row");
+            const uuid = row?.dataset.uuid;
+            if (!uuid) return;
+            const map = loadDismissed();
+            map[uuid] = true;
+            saveDismissed(map);
+            row!.remove();
+            if (panel.querySelector(".alarm-list")?.childElementCount === 0) close();
+        });
+    });
+    panel.querySelectorAll<HTMLButtonElement>(".alarm-row-link").forEach(btn => {
+        btn.addEventListener("click", () => {
+            const url = btn.dataset.link;
+            if (!url) return;
+            const api = (window as any).mailxapi;
+            if (api?.openExternal) api.openExternal(url);
+            else window.open(url, "_blank");
+        });
+    });
+
+    // Escape closes without action (same as X) — user can re-open with next
+    // poll tick by not acting on it.
+    const onKey = (e: KeyboardEvent) => {
+        if (e.key === "Escape") { e.stopPropagation(); close(); document.removeEventListener("keydown", onKey, true); }
+    };
+    document.addEventListener("keydown", onKey, true);
+}
+
+async function pollAlarms(): Promise<void> {
+    if (document.hidden) return;                     // don't fire while tab hidden
+    if (currentPopup) return;                        // user hasn't acknowledged last one
+    const now = Date.now();
+    pruneState(now);
+    const due = await collectDueAlarms(now);
+    // Only show items we haven't already fired this session (prevents the
+    // popup from immediately re-appearing if the user closes it without
+    // dismissing — the item still matches the "due" filter next tick).
+    const fresh = due.filter(d => !firedThisSession.has(d.uuid));
+    if (fresh.length === 0) return;
+    for (const d of fresh) firedThisSession.add(d.uuid);
+    showPopup(fresh);
+}
+
+/** Start the alarm poller. Called from app.ts on startup. */
+export function startAlarmPoller(): void {
+    if ((window as any).__mailxAlarmPollerRunning) return;
+    (window as any).__mailxAlarmPollerRunning = true;
+    // First check after 5 s so startup isn't jittered by a modal.
+    setTimeout(() => { pollAlarms().catch(() => { /* */ }); }, 5000);
+    setInterval(() => { pollAlarms().catch(() => { /* */ }); }, POLL_INTERVAL_MS);
+    // Re-check on visibility change — if the user comes back to the tab
+    // after an hour away, they should see anything they missed immediately.
+    document.addEventListener("visibilitychange", () => {
+        if (!document.hidden) pollAlarms().catch(() => { /* */ });
+    });
+}