relay-companion 0.1.89 → 0.1.91

package/overlay/inbox.html

@@ -251,11 +251,11 @@
 
   /* subject: single-line serif, right-edge fade mask */
   .rk-subject {
-    font-family:var(--serif); font-size:15px; line-height:1.3; color:var(--muted); font-weight:400;
+    font-family:var(--serif); font-size:15px; line-height:1.32; color:var(--muted); font-weight:400;
     margin-top:5px;
     /* Two full lines with an ellipsis: titles must be scannable when choosing
        which relay to open — the old right-edge fade cut them after a few words. */
-    overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
+    overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;
     overflow-wrap:anywhere;
     transition:color .28s var(--settle);
   }
@@ -703,7 +703,8 @@
      the reused .open-actions light-built panel — never from borders. */
   .sv-head { display:flex; align-items:center; justify-content:space-between; padding:10px 16px 8px; }
   .sv-title { font-family:var(--serif); font-size:16px; font-weight:500; color:var(--ink); }
-  .sv-account { display:flex; align-items:center; gap:12px; padding:4px 16px 0; }
+  /* First element in the pane now (no header above), so it owns the top inset. */
+  .sv-account { display:flex; align-items:center; gap:12px; padding:16px 16px 0; }
   .sv-avatar {
     flex:0 0 auto; width:38px; height:38px; border-radius:50%;
     background:var(--accent-soft); color:var(--accent);
@@ -742,6 +743,8 @@
   .sv-err { margin-top:8px; padding:0 16px; }
   .sv-note { padding:10px 16px 0; font-size:11.5px; color:#1a7f37; line-height:1.4; }
   .sv-version { padding:20px 16px 12px; font-family:var(--mono); font-size:10.5px; color:var(--muted-3); }
+  .sv-update { display:flex; flex-direction:column; gap:8px; align-items:flex-start; }
+  .sv-update-btn { width:auto; padding:7px 12px; border-radius:8px; font-family:var(--sans); font-size:12px; }
   /* signed-out call-to-action on the Relays empty state — quiet filled pill (th-count language) */
   .sv-signin-banner {
     appearance:none; border:0; cursor:pointer; margin-top:2px;
@@ -1561,6 +1564,10 @@
   // The relay row whose open-actions card is expanded. Like openingIds, this
   // survives the innerHTML rebuilds renderRelays performs on every push.
   let expandedRelayId = null;
+  // A conversation expands its actions IN PLACE, exactly like a single relay.
+  // Taking over the whole pane (the old thread-detail push) lost the user's
+  // place in the list for what is really a three-item menu.
+  let expandedThreadId = null;
   function openingTargets(id) {
     return [...document.querySelectorAll("[data-opening-id]")].filter((e) => e.getAttribute("data-opening-id") === id);
   }
@@ -1676,8 +1683,13 @@
       if (t.msgs.length === 1 && inbound.length === 1 && byId.has(inbound[0].id)) {
         return relayRowHtml(byId.get(inbound[0].id), seen);
       }
+      const tExpanded = t.threadId === expandedThreadId;
+      const newestInbound = [...t.msgs].reverse().find((m) => m.direction === "in") || t.msgs[t.msgs.length - 1];
+      const tMenu = tExpanded && newestInbound
+        ? openActionsHtml(newestInbound.id, { thread: true, threadId: t.threadId, messageCount: t.msgs.length })
+        : "";
       return `
-      <div class="th-item${t.unreadCount ? " unread" : ""} deletable" role="button" tabindex="0" data-thread="${esc(t.threadId)}" data-party="${esc(t.party)}">
+      <div class="th-item${t.unreadCount ? " unread" : ""}${tExpanded ? " expanded" : ""} deletable" role="button" tabindex="0" data-thread="${esc(t.threadId)}" data-party="${esc(t.party)}">
         ${threadDeleteButton(t)}
         <span class="th-top">
           ${t.unreadCount ? '<span class="th-unread"></span>' : ""}
@@ -1686,13 +1698,21 @@
           <span class="th-time">${esc(timeAgo(t.latest.at))}</span>
         </span>
         <span class="th-title">${esc(t.latest.title)}</span>
+        ${tMenu}
+        ${newestInbound ? `<div class="row-err${rowNotes.get(newestInbound.id)?.cls === "ok" ? " ok" : ""}" data-err="${esc(newestInbound.id)}" data-stop="1">${esc(rowNotes.get(newestInbound.id)?.text || "")}</div>` : ""}
       </div>`;
     }).join("");
     prevRelayIds = new Set(allRows.map((r) => r.id));
     wireRelayRows();
     for (const el of relaysListEl.querySelectorAll(".th-item")) {
-      el.addEventListener("click", () => openThreadDetail(el.getAttribute("data-thread"), el.getAttribute("data-party") || ""));
+      el.addEventListener("click", () => {
+        const id = el.getAttribute("data-thread");
+        expandedThreadId = expandedThreadId === id ? null : id;
+        expandedRelayId = null; // only one menu open at a time
+        renderRelays();
+      });
     }
+    wireInlineThreadActions();
   }
 
   // Grow the window as the user scrolls toward the end. Cheap: each extension
@@ -1711,7 +1731,7 @@
   // Preview plus the two host-open actions, as one small text-first menu.
   // Preview is the primary, non-navigation path; the other actions hand the
   // relay to a current or fresh host session.
-  function openActionsHtml(id, { thread, previewable = true } = {}) {
+  function openActionsHtml(id, { thread, previewable = true, threadId = "", messageCount = 0 } = {}) {
     const preview = thread ? `data-thread-preview="${esc(id)}"` : `data-preview="${esc(id)}"`;
     const cur = thread ? `data-thread-open-current="${esc(id)}"` : `data-open-current="${esc(id)}"`;
     const fresh = thread ? `data-thread-open-fresh="${esc(id)}"` : `data-open-fresh="${esc(id)}"`;
@@ -1724,9 +1744,37 @@
         <button class="oa-item${previewable ? "" : " oa-primary"}" type="button" role="menuitem" ${cur}>${thread ? "Open Thread in Current Chat" : "Open in Current Chat"}</button>
         <div class="oa-sep" role="separator"></div>
         <button class="oa-item" type="button" role="menuitem" ${fresh}>${thread ? "Open Thread in New Chat" : "Open in New Chat"}</button>
+        ${threadId ? `<div class="oa-sep" role="separator"></div>
+        <button class="oa-item" type="button" role="menuitem" data-thread-history="${esc(threadId)}">Read the Conversation${messageCount ? ` (${messageCount})` : ""}</button>` : ""}
       </div>`;
   }
 
+
+  // The inline conversation menu reuses the thread actions; scoped to the list so
+  // the detail view's own copy keeps working unchanged.
+  function wireInlineThreadActions() {
+    for (const btn of relaysListEl.querySelectorAll("[data-thread-preview]")) {
+      const id = btn.getAttribute("data-thread-preview");
+      btn.addEventListener("click", () => {
+        expandedThreadId = null;
+        window.relay.preview(id);
+        renderRelays();
+      });
+    }
+    for (const btn of relaysListEl.querySelectorAll("[data-thread-open-current]")) {
+      btn.addEventListener("click", () => openRelayFromUI(btn.getAttribute("data-thread-open-current"), "relay", "current"));
+    }
+    for (const btn of relaysListEl.querySelectorAll("[data-thread-open-fresh]")) {
+      btn.addEventListener("click", () => openRelayFromUI(btn.getAttribute("data-thread-open-fresh"), "relay", "fresh"));
+    }
+    for (const btn of relaysListEl.querySelectorAll("[data-thread-history]")) {
+      btn.addEventListener("click", () => {
+        const el = btn.closest(".th-item");
+        openThreadDetail(btn.getAttribute("data-thread-history"), el ? el.getAttribute("data-party") || "" : "");
+      });
+    }
+  }
+
   // Conversations get the same trash affordance as single relays — the unified
   // list made that inconsistent (a 1-message conversation renders as a relay row
   // WITH delete; a 2-message one rendered as a conversation row without). One
@@ -1747,11 +1795,11 @@
     const subject = relaySubject(r);
     const sender = relaySender(r);
     const actions = relayActionsHtml(r);
-    // result / task_completed / plain message carry a body preview beneath the subject.
-    // (human_question's body IS the subject, so no duplicate preview there.)
-    const body = r.bodyMarkdown || r.body || "";
-    const preview = kind === "human_question" ? "" : bodyPreview(body, subject, 110);
-    const previewHtml = preview ? `<div class="rk-preview">${esc(preview)}</div>` : "";
+    // Cards show the TITLE ONLY. The old truncated body preview leaked the
+    // agent-oriented detail layer — often unreadable out of context — and cost a
+    // third of the row to say little. Titles now carry what/why/ask (see
+    // relay_send's title guidance), so the detail waits for Preview or an open.
+    const previewHtml = "";
     const canDelete = kind === "plain_relay" || kind === "human_question" || kind === "task_completed" || kind === "task_cancelled" || kind === "task_failed";
     const deleteButton = canDelete ? `<button class="row-delete" type="button" data-delete="${esc(r.id)}" data-stop="1" aria-label="Move to Recently Deleted" title="Move to Recently Deleted"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 7h16M9 7V4h6v3M7 7l1 13h8l1-13M10 11v5M14 11v5"/></svg></button>` : "";
     const expanded = r.id === expandedRelayId;
@@ -2988,7 +3036,15 @@
     const threadActions = threadOpenTarget
       ? openActionsHtml(threadOpenTarget.id, { thread: true, previewable: Boolean(newestInbound) })
       : "";
-    thHistoryEl.innerHTML = threadActions + thread.msgs.map((m) => `
+    // Open-status notes ("Handed to your current chat…" / "✓ Delivered" /
+    // open errors) must render HERE too: users who live in the thread view
+    // click these buttons and previously got zero feedback — a working
+    // hand-off was indistinguishable from a dead one (Sven, 2026-08-05,
+    // twice). Rendered from rowNotes so every payload-push rebuild keeps it.
+    const threadNote = threadOpenTarget
+      ? `<div class="row-err${rowNotes.get(threadOpenTarget.id)?.cls === "ok" ? " ok" : ""}" data-err="${esc(threadOpenTarget.id)}" data-stop="1">${esc(rowNotes.get(threadOpenTarget.id)?.text || "")}</div>`
+      : "";
+    thHistoryEl.innerHTML = threadActions + threadNote + thread.msgs.map((m) => `
       <button class="th-msg${m.unread ? " unread" : ""}" type="button" data-msg="${esc(m.id)}" data-dir="${m.direction}">
         <span class="th-msg-top">
           <span class="th-dir${m.direction === "out" ? " out" : ""}">${m.direction === "out" ? "←" : "→"}</span>
@@ -3065,7 +3121,6 @@
     if (info.paired) {
       const name = info.name || info.email || "Relay account";
       html += `
-        <div class="sv-head"><span class="sv-title">Your account.</span></div>
         <div class="sv-account">
           <span class="sv-avatar">${esc(cvInitials(info.name, info.email))}</span>
           <span class="sv-id">
@@ -3090,11 +3145,28 @@
     if (svPairOpen) html += svPairRowHtml();
     if (svNote) html += `<div class="sv-note">${esc(svNote)}</div>`;
     html += `<div class="row-err sv-err" id="svErr">${esc(svError)}</div>`;
-    html += `<div class="sv-version">${esc(info.version ? `Relay ${info.version}` : "Relay")}</div>`;
+    // Version line doubles as the manual update backstop: if the auto-updater
+    // has not refreshed this machine, say so here and make it one click.
+    if (info.updateAvailable) {
+      html += `<div class="sv-version sv-update">
+        <span>Relay ${esc(info.version || "")} · update ${esc(info.updateAvailable)} ready</span>
+        <button class="oa-item oa-primary sv-update-btn" type="button" id="svUpdate" ${info.updating ? "disabled" : ""}>${info.updating ? "Updating…" : "Update and Restart"}</button>
+      </div>`;
+    } else {
+      html += `<div class="sv-version">${esc(info.version ? `Relay ${info.version}` : "Relay")}</div>`;
+    }
     settingsViewEl.innerHTML = html;
     wireSettings();
   }
   function wireSettings() {
+    const upd = document.getElementById("svUpdate");
+    if (upd) {
+      upd.addEventListener("click", async () => {
+        upd.disabled = true;
+        upd.textContent = "Updating…";
+        try { await window.relay.updateNow(); } catch {}
+      });
+    }
     for (const z of settingsViewEl.querySelectorAll('[data-stop="1"]')) {
       z.addEventListener("click", (e) => e.stopPropagation());
     }

package/overlay/main.cjs

@@ -451,6 +451,10 @@ function accountInfo() {
     email: user.email || "",
     deviceName: String(cfg.deviceName || "").trim() || os.hostname(),
     version: pillVersion(),
+    // Surfaced in the Settings card so a stale machine is visible in the app,
+    // not only in the tray menu.
+    updateAvailable: availableUpdate || "",
+    updating: updateInFlight,
     setupPath: "/app/setup",
   };
 }
@@ -2330,12 +2334,19 @@ function anchorTopRight() {
   const display = screen.getDisplayNearestPoint(screen.getCursorScreenPoint()) || screen.getPrimaryDisplay();
   const wa = display.workArea;
   const anchor = { x: wa.x + wa.width - WIN.width - MARGIN, y: wa.y + MARGIN, width: WIN.width, height: WIN.height };
-  if (process.env.RELAY_OVERLAY_TEST === "1") {
-    // Sandboxed harness runs must never materialize under the user's parked
-    // cursor: a pointer resting on the card holds notifications open BY DESIGN
-    // (macOS banners do the same), which would wedge every dwell-based scenario
-    // when the mouse happens to sit in the top-right corner. Flip the sandbox
-    // window to the opposite edge instead. Production placement is unchanged.
+  if (process.env.RELAY_OVERLAY_TEST === "1" || process.env.RELAY_OVERLAY_PERF === "1") {
+    // A harness run must not take over the developer's screen. Park sandbox
+    // windows just off the bottom-right of the work area: still a REAL composited
+    // window on the same display — so paint timing, dwell timers and hit tests
+    // measure exactly what production does — but out of sight while the suite
+    // runs, and never under the user's parked cursor (a pointer resting on the
+    // card holds notifications open BY DESIGN, which wedged dwell scenarios).
+    // RELAY_OVERLAY_TEST_ONSCREEN=1 puts it back on screen for eyeball debugging.
+    if (process.env.RELAY_OVERLAY_TEST_ONSCREEN !== "1") {
+      anchor.x = wa.x + wa.width - 8;
+      anchor.y = wa.y + wa.height - 8;
+      return anchor;
+    }
     try {
       const p = screen.getCursorScreenPoint();
       const overlaps =
@@ -3086,6 +3097,47 @@ function quitRelayCompletely() {
   } catch {}
 }
 
+
+// ---- update availability (the manual backstop) -----------------------------
+// The daemon self-updates, but an update can be pending for a while (the
+// restart cooldown), or fail quietly, and then a machine silently runs old
+// code — exactly what happened to a Windows user who sat nine versions behind.
+// The pill therefore checks the registry itself and, when a newer version
+// exists, surfaces it where a person will actually see it: the tray menu and
+// the Settings card, each offering a one-click "restart now" that runs the
+// same installer with manual intent (which bypasses the cooldown).
+let availableUpdate = null; // version string when newer than what we run
+let updateInFlight = false;
+async function checkForUpdate() {
+  try {
+    const mod = await import(pathToFileURL(path.join(__dirname, "..", "src", "auto-update.js")).href);
+    const latest = await mod.fetchLatestVersion({});
+    const current = pillVersion();
+    availableUpdate = latest && mod.isNewerVersion(latest, current) ? latest : null;
+    if (availableUpdate) syncTray();
+  } catch {}
+}
+function runUpdateNow() {
+  if (updateInFlight) return;
+  updateInFlight = true;
+  try {
+    const child = spawn(process.execPath, [RELAY_CLI, "update"], {
+      detached: true,
+      stdio: "ignore",
+      env: { ...process.env, ELECTRON_RUN_AS_NODE: "1" },
+    });
+    child.on("error", (error) => {
+      updateInFlight = false;
+      console.error(`[overlay] ${new Date().toISOString()} manual update failed:`, error && error.message);
+    });
+    child.unref();
+  } catch (error) {
+    updateInFlight = false;
+    console.error(`[overlay] ${new Date().toISOString()} manual update spawn failed:`, error && error.message);
+  }
+  if (win && !win.isDestroyed()) win.webContents.send("updateStarted");
+}
+
 function createTray() {
   const icon = createTrayIcon();
   if (!icon || icon.isEmpty()) {
@@ -3116,6 +3168,12 @@ function createTray() {
           { label: pillIsOnScreen() ? "Hide Relay" : "Show Relay", click: toggleFromTray },
           ...previewItem,
           { type: "separator" },
+          // Mirrors what good menu-bar apps do: state the version you are on,
+          // and when a newer one is waiting make restarting a single click.
+          ...(availableUpdate
+            ? [{ label: `Update ready (${availableUpdate}) — restart now?`, click: runUpdateNow }]
+            : [{ label: `Relay ${pillVersion()}`, enabled: false }]),
+          { type: "separator" },
           { label: "Quit Relay", click: quitRelayCompletely },
         ]),
       );
@@ -3235,6 +3293,10 @@ ipcMain.handle("relay:contactsSearch", (_e, q) => groupCall((c) => c.searchConta
 ipcMain.handle("relay:accountInfo", () => accountInfo());
 ipcMain.handle("relay:pairWithCode", (_e, input) => pairWithCode(input));
 ipcMain.handle("relay:signOut", () => signOutAccount());
+ipcMain.handle("relay:updateNow", () => {
+  runUpdateNow();
+  return { ok: true };
+});
 
 // The overlay is normally focusable:false so it never steals keyboard focus from
 // Claude/Codex. Text fields (the contact form, quick reply) need focus, so the renderer
@@ -3427,6 +3489,10 @@ if (!gotSingleInstanceLock) {
     if (process.platform === "darwin" && app.dock) app.dock.hide(); // accessory: no dock icon, no NC banners
     createWindow();
     createTray();
+    // Update availability: one check after boot, then hourly. Cheap (a dist-tags
+    // GET) and it only ever surfaces UI — the daemon still owns actual updating.
+    setTimeout(() => checkForUpdate(), 20000).unref?.();
+    setInterval(() => checkForUpdate(), 60 * 60 * 1000).unref?.();
     installActiveSpaceWatcher();
     installPowerAttentionLifecycle();
     // Display topology changes are the remaining event that can strand the

package/overlay/preload.cjs

@@ -68,6 +68,8 @@ contextBridge.exposeInMainWorld("relay", {
   accountInfo: () => ipcRenderer.invoke("relay:accountInfo"),
   pairWithCode: (input) => ipcRenderer.invoke("relay:pairWithCode", input),
   signOut: () => ipcRenderer.invoke("relay:signOut"),
+  // Manual update backstop, when the auto-updater has not refreshed this machine.
+  updateNow: () => ipcRenderer.invoke("relay:updateNow"),
 
 
   // window plumbing

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "relay-companion",
-  "version": "0.1.89",
+  "version": "0.1.91",
   "description": "Relay companion for ordinary messages, with dormant coordination features available only by explicit opt-in.",
   "type": "module",
   "bin": {

package/src/mcp.js

@@ -38,12 +38,12 @@ export const TOOLS = [
         title: {
           type: "string",
           description:
-            "The concise, high-level human-facing takeaway. This is shown first and most prominently, so keep it to one clear phrase or sentence.",
+            "The human-readable layer of the relay, and the ONLY thing shown on the recipient's card — write it to carry real information, not to name a topic. In as few words as it honestly takes (aim ~8-20 words, hard stop around 140 characters), answer: what is this, why does this person care, is anything expected of them, and by when. Value-centric and human, never a detail dump: 'Postmark account still pending approval — DNS is ready, nothing needed from you until they reply' beats 'Postmark update'. State the ask explicitly when there is one, and say so plainly when there is not. The recipient reads this alone, decides whether to act, and only then opens the relay for the full detail in bodyMarkdown — so a title that merely labels the subject forces a pointless open.",
         },
         bodyMarkdown: {
           type: "string",
           description:
-            "The complete human-facing detail you formulate from the sender's request and relevant context. Use readable Markdown (short paragraphs, headings, bullets, tables, or code where useful) and do not merely repeat the title. This is the message body, not a private recipient-agent briefing.",
+            "The high-detail layer, read AFTER the title earns the open. Formulate the complete human-facing detail from the sender's request and relevant context in readable Markdown (short paragraphs, headings, bullets, tables, or code where useful). Never merely repeat the title; the title already carried the what/why/ask, so this is the substance behind it. This is the message body, not a private recipient-agent briefing.",
         },
         userInstructions: { type: "string", description: "Optional private instruction for how the recipient's agent should handle a handoff." },
         targetSurfaces: {