trekoon 0.4.1 → 0.4.2

package/src/board/assets/state/store.js

@@ -116,9 +116,19 @@ export function orderEpicsNewestFirst(epics) {
 
 /** Recently-done epics stay visible for 24h even when the "done" filter is off. */
 const DONE_GRACE_PERIOD_MS = 86400000;
+/**
+ * Bucket Date.now() into hour-aligned chunks so the memoized epic selector
+ * re-evaluates the 24h grace cutoff at most once per hour on a long-open page.
+ */
+const GRACE_BUCKET_MS = 3600000;
 
 const selectVisibleEpics = createSelector(
-  (s) => [s.snapshot?.epics, s.searchQuery, s.epicStatusFilter],
+  (s) => [
+    s.snapshot?.epics,
+    s.searchQuery,
+    s.epicStatusFilter,
+    Math.floor(Date.now() / GRACE_BUCKET_MS),
+  ],
   (epics, searchQuery, epicStatusFilter) => {
     if (!epics) return [];
     const now = Date.now();
@@ -225,6 +235,7 @@ function selectSearchScope(state) {
  * @property {string|null} selectedSubtaskId
  * @property {object|null} selectedSubtask
  * @property {boolean} taskModalOpen
+ * @property {boolean} subtaskModalOpen
  * @property {string} search
  * @property {string} searchQuery
  * @property {object} searchScope
@@ -232,6 +243,38 @@ function selectSearchScope(state) {
  * @property {object[]} visibleTasks
  */
 
+/**
+ * Create a memoizer for deriveBoardState that returns the same reference until
+ * invalidate() is called or the hour bucket changes (so time-sensitive
+ * selectors like selectVisibleEpics can re-evaluate the 24h grace cutoff).
+ * Designed to be invalidated by the store's notify().
+ * @param {(state: object) => BoardState} compute
+ */
+function createBoardStateMemo(compute) {
+  let cachedState = null;
+  let cachedBucket = null;
+  let cachedResult = null;
+  let dirty = true;
+
+  function get(state) {
+    const bucket = Math.floor(Date.now() / GRACE_BUCKET_MS);
+    if (!dirty && cachedState === state && cachedBucket === bucket) {
+      return cachedResult;
+    }
+    cachedState = state;
+    cachedBucket = bucket;
+    cachedResult = compute(state);
+    dirty = false;
+    return cachedResult;
+  }
+
+  function invalidate() {
+    dirty = true;
+  }
+
+  return { get, invalidate };
+}
+
 /**
  * Compute full derived board state from the internal state, using memoized selectors.
  * @param {object} state
@@ -266,6 +309,7 @@ function deriveBoardState(state) {
   const selectedSubtask = selectedTaskId ? selectSelectedSubtask(stateWithTaskSelection) : null;
 
   const taskModalOpen = state.taskModalOpen === true;
+  const subtaskModalOpen = state.subtaskModalOpen === true && selectedSubtask !== null;
 
   return {
     screen,
@@ -276,6 +320,7 @@ function deriveBoardState(state) {
     selectedSubtaskId: selectedSubtask?.id ?? null,
     selectedSubtask,
     taskModalOpen,
+    subtaskModalOpen,
     search: stateWithScreen.search,
     searchQuery: stateWithScreen.searchQuery,
     searchScope: selectSearchScope(stateWithScreen),
@@ -294,6 +339,7 @@ function reconcileBoardState(state) {
     selectedTaskId: derived.selectedTaskId,
     selectedSubtaskId: derived.selectedSubtaskId,
     taskModalOpen: derived.taskModalOpen,
+    subtaskModalOpen: derived.subtaskModalOpen,
   };
 }
 
@@ -337,11 +383,13 @@ export function createStore(initialSnapshot, options = {}) {
     selectedTaskId: typeof storedState.selectedTaskId === "string" ? storedState.selectedTaskId : null,
     selectedSubtaskId: null,
     taskModalOpen: false,
+    subtaskModalOpen: false,
     theme: readThemePreference(),
     focusedEpicIndex: 0,
     copyFeedback: null,
     notice: null,
     isMutating: false,
+    dragFeedback: null,
     notesPanelOpen: storedState.notesPanelOpen === true,
     epicStatusFilter: readStatusFilter(storedState.epicStatusFilter),
     taskStatusFilter: readStatusFilter(storedState.taskStatusFilter),
@@ -350,7 +398,10 @@ export function createStore(initialSnapshot, options = {}) {
   /** @type {Set<(state: object) => void>} */
   const listeners = new Set();
 
+  const boardStateMemo = createBoardStateMemo(deriveBoardState);
+
   function notify() {
+    boardStateMemo.invalidate();
     for (const listener of listeners) {
       listener(state);
     }
@@ -361,12 +412,12 @@ export function createStore(initialSnapshot, options = {}) {
       screen: state.screen,
       selectedEpicId: state.selectedEpicId,
       search: state.search,
-        view: state.view,
-        selectedTaskId: state.selectedTaskId,
-        notesPanelOpen: state.notesPanelOpen,
-        epicStatusFilter: state.epicStatusFilter,
-        taskStatusFilter: state.taskStatusFilter,
-      });
+      view: state.view,
+      selectedTaskId: state.selectedTaskId,
+      notesPanelOpen: state.notesPanelOpen,
+      epicStatusFilter: state.epicStatusFilter,
+      taskStatusFilter: state.taskStatusFilter,
+    });
   }
 
   function syncState(patch = {}) {
@@ -382,7 +433,8 @@ export function createStore(initialSnapshot, options = {}) {
       || state.view !== reconciled.view
       || state.selectedTaskId !== reconciled.selectedTaskId
       || state.selectedSubtaskId !== reconciled.selectedSubtaskId
-      || state.taskModalOpen !== reconciled.taskModalOpen;
+      || state.taskModalOpen !== reconciled.taskModalOpen
+      || state.subtaskModalOpen !== reconciled.subtaskModalOpen;
 
     state.screen = reconciled.screen;
     state.selectedEpicId = reconciled.selectedEpicId;
@@ -392,10 +444,11 @@ export function createStore(initialSnapshot, options = {}) {
     state.selectedTaskId = reconciled.selectedTaskId;
     state.selectedSubtaskId = reconciled.selectedSubtaskId;
     state.taskModalOpen = reconciled.taskModalOpen;
+    state.subtaskModalOpen = reconciled.subtaskModalOpen;
     if (changed) {
       notify();
     }
-    return deriveBoardState(state);
+    return boardStateMemo.get(state);
   }
 
   // Reconcile initial state
@@ -458,7 +511,7 @@ export function createStore(initialSnapshot, options = {}) {
      * @returns {BoardState}
      */
     getBoardState() {
-      return deriveBoardState(state);
+      return boardStateMemo.get(state);
     },
 
     /**
@@ -536,7 +589,22 @@ export function createStore(initialSnapshot, options = {}) {
      * @returns {object|null}
      */
     getSelectedTask() {
-      return deriveBoardState(state).selectedTask;
+      return boardStateMemo.get(state).selectedTask;
     },
+
+    /**
+     * Invalidate the memoized board state. Call after a direct mutation of
+     * `model.store` that didn't go through `setState`/`syncState`/`notify`,
+     * before triggering a rerender, so `getBoardState()` recomputes.
+     */
+    invalidateBoardStateMemo() {
+      boardStateMemo.invalidate();
+    },
+
+    /**
+     * Notify subscribers (and invalidate the memo). Use after a direct
+     * mutation of `model.store` that needs to be reflected in derived state.
+     */
+    notify,
   };
 }

package/src/board/assets/state/url.js

@@ -47,6 +47,9 @@ export function stateToHash(state) {
   if (state.selectedTaskId) {
     params.set("task", state.selectedTaskId);
   }
+  if (state.selectedSubtaskId) {
+    params.set("subtask", state.selectedSubtaskId);
+  }
   if (state.screen === "epics" && state.selectedEpicId) {
     params.set("screen", "epics");
   }
@@ -73,6 +76,7 @@ export function hashToState(hash) {
 
   const epicId = params.get("epic") || null;
   const taskId = params.get("task") || null;
+  const subtaskId = params.get("subtask") || null;
   const screenParam = params.get("screen");
   const search = params.get("search") || "";
   const view = params.get("view") || DEFAULT_VIEW;
@@ -82,9 +86,15 @@ export function hashToState(hash) {
       ? "tasks"
       : "epics";
 
+  // Deep-linking with task=/subtask= must open the corresponding modals so the
+  // booted page actually renders the deep-linked dialog instead of just
+  // selecting a row in the workspace.
   return {
     selectedEpicId: epicId,
     selectedTaskId: taskId,
+    selectedSubtaskId: subtaskId,
+    taskModalOpen: Boolean(taskId),
+    subtaskModalOpen: Boolean(subtaskId),
     search,
     view,
     screen,

package/src/board/assets/state/utils.js

@@ -311,7 +311,8 @@ export function escapeHtml(value) {
     .replaceAll("&", "&")
     .replaceAll("<", "&lt;")
     .replaceAll(">", "&gt;")
-    .replaceAll('"', "&quot;");
+    .replaceAll('"', "&quot;")
+    .replaceAll("'", "&#39;");
 }
 
 /**

package/src/board/event-bus.ts

@@ -0,0 +1,72 @@
+/**
+ * Board event bus.
+ *
+ * Per-server-instance pub/sub used to broadcast snapshot deltas to SSE
+ * subscribers (browser tabs). Publishers (board route handlers, future WAL
+ * watcher) call publish; subscribers receive the JSON-serializable payload.
+ */
+
+export interface BoardDeltaEvent {
+  readonly type: "snapshotDelta";
+  readonly id: number;
+  readonly snapshotDelta: Record<string, unknown>;
+}
+
+export type BoardEvent = BoardDeltaEvent;
+
+export type BoardEventListener = (event: BoardEvent) => void;
+
+export interface BoardEventBus {
+  publishSnapshotDelta(snapshotDelta: Record<string, unknown>): BoardDeltaEvent;
+  subscribe(listener: BoardEventListener): () => void;
+  readonly subscriberCount: number;
+  close(): void;
+}
+
+export function createBoardEventBus(): BoardEventBus {
+  const listeners = new Set<BoardEventListener>();
+  let nextId = 1;
+  let closed = false;
+
+  return {
+    publishSnapshotDelta(snapshotDelta: Record<string, unknown>): BoardDeltaEvent {
+      const event: BoardDeltaEvent = {
+        type: "snapshotDelta",
+        id: nextId++,
+        snapshotDelta,
+      };
+
+      if (closed) {
+        return event;
+      }
+
+      // Snapshot to allow listeners to unsubscribe during dispatch.
+      for (const listener of [...listeners]) {
+        try {
+          listener(event);
+        } catch {
+          // Listener errors must not block other subscribers.
+        }
+      }
+
+      return event;
+    },
+    subscribe(listener: BoardEventListener): () => void {
+      if (closed) {
+        return () => {};
+      }
+
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    },
+    get subscriberCount(): number {
+      return listeners.size;
+    },
+    close(): void {
+      closed = true;
+      listeners.clear();
+    },
+  };
+}