@lovek4d/kickflip 0.5.0 → 0.6.0

package/board/public/view-hub.js

@@ -39,8 +39,12 @@
     const { row, tile } = HubUI;
     const fixHtml = (fix) => fix.command ? `<code>${esc(fix.command)}</code>` : fix.settings
       ? `${esc(fix.text)} <button type="button" class="link" data-settings-open="${esc(fix.settings)}">${esc(fix.label)}</button>.` : esc(fix.text);
+    // One line per device with notifications on: kind, browser, last seen, and a Remove that forgets it.
+    const mine = (() => { try { return localStorage.getItem('kickflip.push.id'); } catch { return null; } })();
+    const deviceLine = (d) => `<span class="rd-device">${esc([d.kind, d.browser, `seen ${BoardUI.ago(d.added)}`].filter(Boolean).join(' · '))}${d.id === mine ? ' · <b>this device</b>' : ''} <button type="button" class="link" data-forget-device="${esc(d.id)}">Remove</button></span>`;
+    const devices = (it) => it.devices?.length ? `<span class="links">${it.devices.map(deviceLine).join('')}</span>` : '';
     const rows = integrations.map((it) => row({ icon: tile(it.id, it.ready ? 'var(--color-quiet)' : 'var(--color-notice)'), title: esc(it.name), wrap: true,
-      sub: it.ready ? `<span class="st ok">ready</span> · ${esc(it.detail)}`
+      sub: it.ready ? `<span class="st ok">ready</span> · ${esc(it.detail)}${devices(it)}`
         : `<span class="st wait">not ready</span> · ${esc(it.missing)}<span class="links"><span class="rd-fix">${fixHtml(it.fix)}</span>${it.waits ? `<span class="rd-waits">${esc(it.waits)}</span>` : ''}</span>` })).join('');
     return `<h2 class="label" id="integrations">Integrations</h2><div class="group">${rows}</div>
 <p class="note">A feature that needs an integration stays off until it’s ready, and says why.</p>
@@ -67,13 +71,14 @@
     return `${HubUI.flash(flash)}${HubUI.pauseBanner(d.pause)}${HubUI.holdBanner(d.hold)}${usage}${promptsHtml(d.prompts || [], prompts)}<h2 class="label"${usage ? '' : ' style="margin-top:4px"'}>Health</h2>
 <div class="group">${row({ icon: tile('power', { ok: '#22c55e', wait: '#f59e0b' }[d.hub.tone] || '#ef4444'), title: 'Hub', sub: `${word} ·${esc(d.hub.detail)}${d.awake ? `<span class="links"><span><span class="awake-on">Keeping awake</span> ${esc(d.awake)}</span></span>` : ''}`, wrap: true,
     trail: d.hub.restart ? restartHubButton(restartingHub) : '' })}
+${HubUI.machineRow(d.pause.machine)}
 ${d.empty ? row({ title: 'No sites yet', sub: 'In a Claude session, run <code>/kickflip &lt;route&gt;</code>.' }) : ''}</div>
 ${integrationsHtml(d.integrations)}${sitesHtml(d.groups, restarting)}${d.remembered?.length ? `<h2 class="label">Sessions without a board</h2><div class="group">${rememberedHtml(d.remembered)}</div>` : ''}<p class="note">The hub runs every site and restarts one that stops. A board's links are what the hub owes it: GitHub polling, the fetch of its repo, events (its session and a watcher run, or the hub can wake it), daily wakes and reviewer links. One that just broke reads settling first.</p>
 <h2 class="label">Polling status</h2>
 <div class="group">${nowRow(d.polling, tile('clock', d.polling.count ? 'var(--color-notice)' : 'var(--color-quiet)'))}</div>`;
   }
 
-  const footer = (d) => `<footer>${esc(d.sites)}. Each belongs to one Claude session, which adds it with <code>/kickflip &lt;route&gt;</code>. This page refreshes every 30 seconds.<br><span class="host">${esc(d.host)}</span></footer>`;
+  const footer = (d) => `<footer>${esc(d.sites)}. Each belongs to one Claude session, which adds it with <code>/kickflip &lt;route&gt;</code>. This page refreshes every 30 seconds.<br><span class="host">${esc(d.host)}</span><br><span class="brand"><a href="https://kickflip.sh">kickflip.sh</a> / v${esc(d.version)}</span></footer>`;
 
   // iOS shows an app badge only in a Home Screen app with notifications allowed; elsewhere this does nothing.
   function badge(n) {
@@ -84,7 +89,7 @@ ${integrationsHtml(d.integrations)}${sitesHtml(d.groups, restarting)}${d.remembe
   (globalThis.AppViews ||= {}).hub = {
     className: 'hub-view view-hub',
     title: () => 'Hub',
-    markup: () => `${BoardUI.header({ lead: 'logo', title: 'Hub', time: 'now', logoSrc: '/_hub/kickflip.png', settingsHref: null })}
+    markup: () => `${BoardUI.header({ lead: 'logo', title: 'Hub', time: 'now', logoSrc: '/_hub/kickflip.png' })}
 <main class="has-top"><div class="hub-status"></div><section class="hub-settings" aria-labelledby="hubSettingsLabel"><h2 class="label" id="hubSettingsLabel">Hub settings</h2>${HubSettings.markup()}</section><div class="hub-foot"></div></main>`,
 
     create: (root, siteRoot, ctx) => BoardView.page(root, siteRoot, (B) => {
@@ -109,8 +114,11 @@ ${integrationsHtml(d.integrations)}${sitesHtml(d.groups, restarting)}${d.remembe
           if (!r.ok || !out) throw new Error();
           if (B.alive()) B.toast(`${out.title} is back up, and its session is listening.`);
         } catch { flash = { text: out?.error || `Could not restart ${title}. Is the host awake?`, error: true }; }
+        // The row keeps its Restart busy until the hub's data shows the board's new word, and only a refusal loads after
+        // (docs/adr/2026-11-05-0200-a-tap-spins-until-the-board-shows-its-change.md).
+        if (!flash && B.alive()) await BoardUI.pending.within(load(), () => { B.toast('Still waiting on the board'); load(); });
         restarting.delete(route);
-        if (B.alive()) { paint(); load(); }
+        if (B.alive()) { paint(); if (flash) load(); }
       }
       // Restart hub asks the host to restart the hub service (POST /_hub/restart-hub), then waits for the hub to answer
       // with other code than it ran (its x-hub-code) and reloads the app; past HUB_WAIT tries it says how to restart by hand.
@@ -145,7 +153,14 @@ ${integrationsHtml(d.integrations)}${sitesHtml(d.groups, restarting)}${d.remembe
         flash = { text: `The hub hasn’t come back. On the host, run ${out.command}`, error: true };
         if (B.alive()) paint();
       }
+      async function forgetDevice(id) {
+        const out = await fetch('/_hub/push/forget', { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify({ id }) }).then((r) => r.ok, () => false);
+        if (!out) { flash = { text: 'Could not remove that device. Is the host awake?', error: true }; paint(); return; }
+        load();
+      }
       B.on(main, 'click', (e) => {
+        const forgetter = e.target.closest?.('[data-forget-device]');
+        if (forgetter) forgetDevice(forgetter.dataset.forgetDevice);
         const opener = e.target.closest?.('[data-settings-open]');
         if (opener) B.openSettings({ hash: `#${opener.dataset.settingsOpen}` }, opener);
         if (e.target.closest?.('[data-restart-hub]')) restartHub();

package/board/public/view-notes.js

@@ -11,22 +11,42 @@
 
   create: (root, siteRoot, ctx) => BoardView.page(root, siteRoot, async (B) => {
     const { $, site } = B;
-    const { esc, markdown, linkContext, fetchJSON, restartNotice } = BoardUI;
+    const { esc, markdown, linkContext, fetchJSON, downLanding, copyNote, pageCopy } = BoardUI;
     const key = ctx.view.item || '';
     const wave = ctx.view.wave;
     const el = $('#plan');
     const get = (url, opts = {}) => fetchJSON(url, { ...opts, sleep: B.sleep });
+    const paint = (body, items, note = '') => {
+      $('#ref').textContent = `${wave ? body.title : body.ref} notes`;
+      document.title = $('#ref').textContent;
+      el.innerHTML = note + markdown(body.markdown, linkContext(items, key, { base: './' }));
+    };
+    // While the board can't be reached, the notes' last answer here shows under its copy line, or with none the landing
+    // for why (docs/adr/2026-11-06-0135-a-board-out-of-reach-keeps-its-copy-or-shows-a-landing.md).
+    const url = site.url(`api/notes?${wave ? `wave=${encodeURIComponent(wave)}` : `item=${encodeURIComponent(key)}`}`);
+    let copy = null;
+    let live = false;
+    let copied = false;
+    const waiting = (down) => {
+      copy ||= pageCopy.read(url);
+      copy.then((c) => {
+        if (!B.alive() || live || copied) return;
+        if (!c) { el.innerHTML = downLanding(down); return; }
+        copied = true;
+        paint(c.body, [], copyNote('the notes', c.savedAt));
+      });
+    };
     try {
       const board = get(site.url('api/board')).then((r) => r.body).catch(() => ({}));
-      const query = wave ? `wave=${encodeURIComponent(wave)}` : `item=${encodeURIComponent(key)}`;
-      const r = await get(site.url(`api/notes?${query}`), { onWait: () => { el.innerHTML = restartNotice(); } });
+      const r = await get(url, { onWait: (ms, down) => waiting(down) });
       if (!B.alive()) return;
       if (!r.ok) throw new Error(r.body.error || `notes ${r.status}`);
-      $('#ref').textContent = `${wave ? r.body.title : r.body.ref} notes`;
-      document.title = $('#ref').textContent;
-      el.innerHTML = markdown(r.body.markdown, linkContext((await board).items || [], key, { base: './' }));
+      live = true;
+      paint(r.body, (await board).items || []);
+      pageCopy.save(url, r.body);
     } catch (e) {
-      el.innerHTML = `<p class="muted">Could not load these notes: ${esc(e.message)}</p>`;
+      if (e.down) waiting(e.down);
+      else el.innerHTML = `<p class="muted">Could not load these notes: ${esc(e.message)}</p>`;
     }
   }),
 };