flexdesk 0.17.2 → 0.17.3

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "flexdesk",
-    "version": "0.17.2",
+    "version": "0.17.3",
     "description": "A tiling window manager and widget set for desktop-class web applications. Zero runtime dependencies.",
     "license": "MIT",
     "repository": {

package/src/ui/components/notification_history.js

@@ -2,8 +2,10 @@
  * NotificationHistory - Bottom bar notification history panel
  *
  * Bell icon in the global-bottom-bar that opens a popover listing past notifications.
- * Reads from NotificationCenter.history (no modifications to NotificationCenter needed).
- * Tracks unread count via lastSeenCount delta and updates a badge on the bell icon.
+ * Reads from NotificationCenter.history and follows it through
+ * `notificationCenter.subscribe()` (0.17.3): every entry the centre records — a
+ * toast from `show()`/`warn()`/... or from the bus — is one unread, until the
+ * popover is opened. The bus is not watched for toasts.
  *
  * THREE OPTIONS, all additive (FlexDesk STORY-0020); without them it is the bell
  * it always was:
@@ -34,7 +36,8 @@ export class NotificationHistory {
 
         this.triggerEl = null;
         this.badgeEl = null;
-        this.lastSeenCount = 0;
+        /** Entries recorded since the popover was last opened. */
+        this.unreadCount = 0;
         this._popoverCleanup = null;
         this._subscriptions = [];
     }
@@ -80,10 +83,14 @@ export class NotificationHistory {
             return;
         }
 
-        // Sync initial count so existing history doesn't show as unread
-        this.lastSeenCount = this.notificationCenter?.history?.length ?? 0;
-
-        this.#subscribeEvents();
+        // What is in the history at mount is not unread.
+        this.unreadCount = 0;
+        const unsubscribe = this.notificationCenter?.subscribe?.(() => {
+            this.unreadCount += 1;
+            this.#updateBadge();
+        });
+        if (typeof unsubscribe === 'function') this._subscriptions.push(unsubscribe);
+        this.#updateBadge();
     }
 
     unmount() {
@@ -99,20 +106,6 @@ export class NotificationHistory {
         this.badgeEl = null;
     }
 
-    #subscribeEvents() {
-        if (!this.eventBus) return;
-
-        // Update badge whenever a new notification comes in
-        const badgeUpdate = () => queueMicrotask(() => this.#updateBadge());
-        const events = ['toast:show', 'notification:show', 'log:entry',
-            'workspace:save:failed', 'workspace:import:failed'];
-
-        events.forEach(name => {
-            const handle = this.eventBus.on(name, badgeUpdate);
-            this._subscriptions.push(() => handle?.dispose?.());
-        });
-    }
-
     /** The Alerts tab, asked for on the bus — or the embedder's own verb. */
     #openAlerts() {
         if (this.onOpen) {
@@ -126,7 +119,7 @@ export class NotificationHistory {
         const historyLen = this.notificationCenter?.history?.length ?? 0;
         const unread = this.alertLog
             ? this.alertLog.unreadCount()
-            : Math.max(0, historyLen - this.lastSeenCount);
+            : Math.min(this.unreadCount, historyLen);
 
         if (!this.badgeEl) return;
 
@@ -164,7 +157,7 @@ export class NotificationHistory {
         this.#closePanel();
 
         // Mark all as seen
-        this.lastSeenCount = this.notificationCenter?.history?.length ?? 0;
+        this.unreadCount = 0;
         this.#updateBadge();
 
         const panel = document.createElement('div');
@@ -197,7 +190,7 @@ export class NotificationHistory {
         header.querySelector('.twm-notification-history__clear-btn')
             .addEventListener('click', () => {
                 this.notificationCenter.history.splice(0);
-                this.lastSeenCount = 0;
+                this.unreadCount = 0;
                 this.#updateBadge();
                 this.#renderList(list);
             });

package/src/ui/notification_center.js

@@ -27,6 +27,14 @@
  * collapsed state and a hovered button survive. A running progress toast is
  * never held behind "+N more" (and never dropped by 'drop'); it counts toward
  * `maxVisible`, so it takes the place of the newest other toast.
+ *
+ * History subscribers (0.17.3)
+ * ----------------------------
+ * `history` holds one entry per toast, whichever way it came (`show()`, the
+ * `warn()`/`error()`/... helpers, `toast:show`, `notification:show`,
+ * `log:entry`). A toast that leaves marks its own entry `dismissed` with a
+ * `reason`; it adds none. `subscribe(fn)` calls `fn(entry, center)` for each
+ * entry added, so a history view follows the centre rather than the bus.
  */
 import { ComponentBase } from './base/component_base.js';
 import { getSetting } from '../core/settings.js';
@@ -55,6 +63,7 @@ const SUPPRESSED_NAMESPACE_TITLES = new Set(['bootstrap', 'app']);
 export class NotificationCenter extends ComponentBase {
     #items;
     #summaryEl;
+    #historyListeners;
 
     constructor({
         eventBus,
@@ -90,6 +99,7 @@ export class NotificationCenter extends ComponentBase {
         /** id -> the drawn toast's nodes, for the toasts on screen. */
         this.#items = new Map();
         this.#summaryEl = null;
+        this.#historyListeners = new Set();
 
         this.container = null;
         this.rootEl = null;
@@ -151,6 +161,7 @@ export class NotificationCenter extends ComponentBase {
     dispose() {
         this.#clearTimers();
         this.#unsubscribeEvents();
+        this.#historyListeners.clear();
         // Give the toast helpers back to the console — unless someone has
         // pointed them at another bus since this centre mounted.
         if (this.eventBus && getToastBus() === this.eventBus) setToastBus(null);
@@ -190,7 +201,7 @@ export class NotificationCenter extends ComponentBase {
             if (idx !== -1) {
                 const [removed] = this.notifications.splice(idx, 1);
                 this.#stopTimer(removed.id);
-                this.#recordHistory({ ...removed, dismissed: true, reason: 'overflow' });
+                this.#recordDismissal(removed, 'overflow');
             }
         }
 
@@ -207,13 +218,13 @@ export class NotificationCenter extends ComponentBase {
             const h = this.held.findIndex((item) => item.id === notificationId);
             if (h === -1) return false;
             const [gone] = this.held.splice(h, 1);
-            this.#recordHistory({ ...gone, dismissed: true, reason });
+            this.#recordDismissal(gone, reason);
             this.#render();
             return true;
         }
         const [removed] = this.notifications.splice(idx, 1);
         this.#stopTimer(notificationId);
-        this.#recordHistory({ ...removed, dismissed: true, reason });
+        this.#recordDismissal(removed, reason);
         // A place on screen came free: the oldest held-back toast takes it.
         this.#rebalance();
         this.#render();
@@ -475,12 +486,39 @@ export class NotificationCenter extends ComponentBase {
         this.activeTimers.clear();
     }
 
+    /**
+     * Hear of every entry added to `history`, by `show()`, `warn()`/`error()`/
+     * `info()`/`success()` and the bus alike: `listener(entry, center)`, once
+     * per toast, after the entry is in `history`. A dismissal changes the
+     * toast's own entry and is not an entry of its own. Answers the unsubscribe.
+     */
+    subscribe(listener) {
+        if (typeof listener !== 'function') return () => {};
+        this.#historyListeners.add(listener);
+        return () => { this.#historyListeners.delete(listener); };
+    }
+
     #recordHistory(entry) {
         if (entry.skipHistory) return;
         this.history.push(entry);
         if (this.history.length > this.historyLimit) {
             this.history.shift();
         }
+        [...this.#historyListeners].forEach((listener) => {
+            try {
+                listener(entry, this);
+            } catch (err) {
+                this.logger?.warn?.('twm-notification-center', 'History listener failed', { err });
+            }
+        });
+    }
+
+    /** A toast that left marks its own entry: one toast, one entry. */
+    #recordDismissal(notification, reason) {
+        if (notification.skipHistory) return;
+        const at = this.history.findLastIndex((entry) => entry.id === notification.id);
+        if (at === -1) return;
+        this.history[at] = { ...notification, dismissed: true, reason };
     }
 
     /** A progress toast that has not been given an outcome yet. */