@seanmars/tospec 0.23.0 → 0.26.0-beta

package/assets/dashboard/lib/store.js

@@ -0,0 +1,326 @@
+// Everything the page knows, fetched from the hub. The hub answers every
+// per-project read from the snapshot the project's session last pushed, so an
+// offline project still reads; only /render and the task write need a live
+// session.
+
+import { assignLineSlots, stationOf } from './derive.js';
+
+const SLOT_KEY = 'tospec-line-slots';
+
+export const store = {
+  hubConnected: true,
+  projectsLoaded: false,
+  /** False when the hub is bound beyond loopback: the page may watch, not answer sessions or tick tasks. */
+  interactive: false,
+  /** /api/projects, sorted by name so rows do not jump when a push re-sorts the hub's list. */
+  projects: [],
+  /** key -> { overview, activity, archive, details: Map<name, detail>, decisions, error, loaded } */
+  data: new Map(),
+  slots: new Map(),
+  /** `<key>/<session>` -> { events, error }, for sessions whose log the page has open. */
+  logs: new Map(),
+};
+
+const listeners = new Set();
+let pending = false;
+
+/** Coalesces bursts (a push refreshes several requests) into one render. */
+function emit() {
+  if (pending) return;
+  pending = true;
+  queueMicrotask(() => {
+    pending = false;
+    for (const fn of listeners) fn();
+  });
+}
+
+export function onStoreChange(fn) {
+  listeners.add(fn);
+}
+
+export class ApiError extends Error {
+  constructor(message, status) {
+    super(message);
+    this.status = status;
+  }
+}
+
+export async function api(path, options) {
+  const res = await fetch(path, options);
+  if (!res.ok) {
+    let detail = 'HTTP ' + res.status;
+    try {
+      const body = await res.json();
+      // `fix` rides along on a project-side refusal (a file where the layout
+      // expects a directory); without it the page names the problem only.
+      if (body && body.error) detail = body.fix ? body.error + ' ' + body.fix : body.error;
+    } catch {
+      // No JSON body; keep the status line.
+    }
+    throw new ApiError(detail, res.status);
+  }
+  return res.json();
+}
+
+export function projectApi(key, path, options) {
+  return api('/api/p/' + key + path, options);
+}
+
+export function projectByKey(key) {
+  return store.projects.find((p) => p.key === key) || null;
+}
+
+export function dataOf(key) {
+  let data = store.data.get(key);
+  if (!data) {
+    data = { overview: null, activity: null, archive: null, details: new Map(), decisions: null, error: null, loaded: false };
+    store.data.set(key, data);
+  }
+  return data;
+}
+
+function setConnected(ok) {
+  if (store.hubConnected !== ok) {
+    store.hubConnected = ok;
+    emit();
+  }
+}
+
+function readSavedSlots() {
+  try {
+    const parsed = JSON.parse(localStorage.getItem(SLOT_KEY) || '{}');
+    return parsed && typeof parsed === 'object' ? parsed : {};
+  } catch {
+    return {};
+  }
+}
+
+function refreshSlots() {
+  const saved = readSavedSlots();
+  store.slots = assignLineSlots(store.projects.map((p) => p.key), saved);
+  for (const [key, slot] of store.slots) saved[key] = slot;
+  try {
+    localStorage.setItem(SLOT_KEY, JSON.stringify(saved));
+  } catch {
+    // Storage full or blocked: slots still hold for this page load.
+  }
+}
+
+export function slotOf(key) {
+  return store.slots.get(key) || 1;
+}
+
+export async function loadProjects() {
+  try {
+    const { projects, interactive } = await api('/api/projects');
+    store.interactive = interactive === true;
+    store.projects = projects.slice().sort((a, b) => a.name.localeCompare(b.name) || a.key.localeCompare(b.key));
+    store.projectsLoaded = true;
+    refreshSlots();
+    setConnected(true);
+    emit();
+  } catch {
+    setConnected(false);
+  }
+}
+
+/**
+ * The reads the route map needs for one project, rendered as each lands.
+ *
+ * Usually every read is a snapshot hit. Right after a task write it is not:
+ * the hub empties the project's cache until the session pushes again, so each
+ * read becomes a relayed `tospec dashboard query`, one at a time. Waiting for
+ * all of them before drawing anything held the whole map for seconds; the
+ * overview alone places every train, so it draws first and the rest fill in.
+ */
+export async function loadProject(key) {
+  const data = dataOf(key);
+  let overview;
+  try {
+    overview = await projectApi(key, '/overview');
+  } catch (e) {
+    data.error = e.status ? e.message : '無法連到 hub';
+    data.loaded = true;
+    if (!e.status) setConnected(false);
+    emit();
+    return;
+  }
+  Object.assign(data, { overview, error: null, loaded: true });
+  setConnected(true);
+  emit();
+  await Promise.all([
+    projectApi(key, '/activity?days=30').then((activity) => { data.activity = activity; emit(); }, () => {}),
+    projectApi(key, '/archive').then((archive) => { data.archive = archive; emit(); }, () => {}),
+    // Only a planning train's gap names artifacts; the rest load on demand.
+    ...overview.changes.filter((c) => stationOf(c) === 'plan').map((c) => loadDetail(key, c.name, true)),
+  ]);
+}
+
+const detailsInFlight = new Set();
+
+/** One change's artifacts and files. `force` re-reads a detail already held. */
+export function loadDetail(key, name, force = false) {
+  const data = dataOf(key);
+  const id = key + '/' + name;
+  if (detailsInFlight.has(id) || (!force && data.details.has(name))) return Promise.resolve();
+  detailsInFlight.add(id);
+  return projectApi(key, '/changes/' + encodeURIComponent(name))
+    .then((detail) => {
+      data.details.set(name, detail);
+      data.detailErrors && data.detailErrors.delete(name);
+    }, (e) => {
+      (data.detailErrors ||= new Map()).set(name, e.status ? e.message : '無法連到 hub');
+    })
+    .finally(() => {
+      detailsInFlight.delete(id);
+      emit();
+    });
+}
+
+export async function loadDecisions(key) {
+  const data = dataOf(key);
+  try {
+    data.decisions = await projectApi(key, '/decisions');
+    data.decisionsError = null;
+  } catch (e) {
+    data.decisionsError = e.status ? e.message : '無法連到 hub';
+  }
+  emit();
+}
+
+export function loadAllProjects() {
+  return Promise.all(store.projects.map((p) => loadProject(p.key)));
+}
+
+/** Asks live sessions for fresh snapshots; their pushes arrive as `change` events. */
+export function requestRefresh(keys) {
+  for (const key of keys) {
+    projectApi(key, '/refresh', {
+      method: 'POST',
+      headers: { 'content-type': 'application/json' },
+      body: '{}',
+    }).catch(() => {});
+  }
+}
+
+export function postTask(key, file, line, done) {
+  return projectApi(key, '/task', {
+    method: 'POST',
+    headers: { 'content-type': 'application/json' },
+    body: JSON.stringify({ file, line, done }),
+  });
+}
+
+// --- sessions --------------------------------------------------------------------
+
+export function logId(key, session) {
+  return key + '/' + session;
+}
+
+function sessionApi(key, session, action, body) {
+  return projectApi(key, '/sessions/' + encodeURIComponent(session) + '/' + action, body === undefined ? undefined : {
+    method: 'POST',
+    headers: { 'content-type': 'application/json' },
+    body: JSON.stringify(body),
+  });
+}
+
+/** Reads a session's log whole; live events append to it from then on. */
+export async function loadSessionLog(key, session) {
+  const id = logId(key, session);
+  try {
+    const { events } = await sessionApi(key, session, 'log');
+    store.logs.set(id, { events, error: null });
+  } catch (e) {
+    store.logs.set(id, { events: (store.logs.get(id) || { events: [] }).events, error: e.status ? e.message : '無法連到 hub' });
+  }
+  emit();
+}
+
+export function forgetSessionLog(key, session) {
+  store.logs.delete(logId(key, session));
+}
+
+export function answerAsk(key, session, id, answer) {
+  return sessionApi(key, session, 'answer', { id, answer });
+}
+
+/**
+ * A session reported: its summary replaces the one in the project list (no
+ * refetch for a status or an action), and its new events extend the log when
+ * the page has that log open. Events arrive in order; one already held (the
+ * log was read while it was on its way) is skipped by its number.
+ */
+function applyActivity({ project: key, session, events }) {
+  const project = projectByKey(key);
+  if (project) {
+    const at = project.sessions.findIndex((s) => s.id === session.id);
+    if (at >= 0) project.sessions[at] = session;
+  }
+  const log = store.logs.get(logId(key, session.id));
+  if (log) {
+    const last = log.events.length ? log.events[log.events.length - 1].seq : 0;
+    for (const event of events) if (event.seq > last) log.events.push(event);
+    if (log.events.length > 200) log.events.splice(0, log.events.length - 200);
+  }
+  emit();
+}
+
+/**
+ * Live updates: `change` when a session pushes (or a task write lands),
+ * `projects` when one registers or goes on- or offline. EventSource
+ * reconnects by itself; the page only reflects the link state.
+ */
+export function subscribe(onProjectChange) {
+  let es = null;
+  const connect = () => {
+    es = new EventSource('/api/events');
+    es.addEventListener('change', (event) => {
+      let key = null;
+      try {
+        key = JSON.parse(event.data).project;
+      } catch {
+        return;
+      }
+      if (!key) return;
+      onProjectChange(key);
+      loadProject(key);
+    });
+    es.addEventListener('projects', async () => {
+      const before = new Set(store.projects.map((p) => p.key));
+      await loadProjects();
+      await Promise.all(store.projects.filter((p) => !before.has(p.key)).map((p) => loadProject(p.key)));
+    });
+    es.addEventListener('activity', (event) => {
+      try {
+        applyActivity(JSON.parse(event.data));
+      } catch {
+        // A malformed event changes nothing; the next one carries the whole summary.
+      }
+    });
+    es.onopen = () => {
+      setConnected(true);
+      // Events sent while the stream was down are gone: read open logs afresh.
+      for (const id of store.logs.keys()) {
+        const slash = id.indexOf('/');
+        loadSessionLog(id.slice(0, slash), id.slice(slash + 1));
+      }
+    };
+    es.onerror = () => setConnected(false);
+  };
+  connect();
+  // A page parked in the back/forward cache would keep its stream open, and
+  // the browser allows only six connections per host: a few parked tabs and
+  // a fresh page's reads queue behind them. Close on the way out, reopen and
+  // catch up on the way back.
+  window.addEventListener('pagehide', () => es.close());
+  window.addEventListener('pageshow', (event) => {
+    if (!event.persisted) return;
+    connect();
+    loadProjects().then(loadAllProjects);
+  });
+}
+
+export function notify() {
+  emit();
+}