relay-companion 0.1.61 → 0.1.63

package/overlay/inbox.html

@@ -241,9 +241,10 @@
   .rk-subject {
     font-family:var(--serif); font-size:15px; line-height:1.3; color:var(--muted); font-weight:400;
     margin-top:5px;
-    white-space:nowrap; overflow:hidden;
-    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 26px), transparent);
-            mask-image:linear-gradient(to right, #000 calc(100% - 26px), transparent);
+    /* 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-wrap:anywhere;
     transition:color .28s var(--settle);
   }
   .row.unread .rk-subject { color:var(--ink); font-weight:500; }
@@ -560,11 +561,13 @@
   .th-time { flex:0 0 auto; margin-left:auto; font-family:var(--mono); font-size:11px; color:var(--muted-2); font-variant-numeric:tabular-nums; padding-left:6px; }
   .th-title {
     font-family:var(--serif); font-size:14px; line-height:1.3; color:var(--muted); margin-top:4px;
-    white-space:nowrap; overflow:hidden;
-    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 26px), transparent);
-            mask-image:linear-gradient(to right, #000 calc(100% - 26px), transparent);
+    overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
+    overflow-wrap:anywhere;
   }
   .th-item.unread .th-title { color:var(--ink); font-weight:500; }
+  /* Conversations you started that have no reply yet sit quietly in the list. */
+  .th-item.th-sent-only .th-party { color:var(--muted); font-weight:500; }
+  .th-item.th-sent-only .th-title { color:var(--muted-2); }
   .th-detail-head { display:flex; align-items:center; gap:9px; padding:10px 16px 8px; border-bottom:1px solid var(--hair-2); }
   .th-back {
     appearance:none; border:0; background:transparent; cursor:pointer; padding:0;
@@ -582,9 +585,8 @@
   .th-msg-top { display:flex; align-items:baseline; gap:7px; min-width:0; }
   .th-dir { flex:0 0 auto; font-family:var(--mono); font-size:11px; line-height:1; align-self:center; color:var(--muted-2); }
   .th-dir.out { color:var(--accent); }
-  .th-msg-title { font-family:var(--serif); font-size:14px; line-height:1.3; color:var(--muted); margin-top:4px; white-space:nowrap; overflow:hidden;
-    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 26px), transparent);
-            mask-image:linear-gradient(to right, #000 calc(100% - 26px), transparent); }
+  .th-msg-title { font-family:var(--serif); font-size:14px; line-height:1.3; color:var(--muted); margin-top:4px;
+    overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow-wrap:anywhere; }
   .th-msg.unread .th-msg-title { color:var(--ink); font-weight:500; }
 
   /* Sent-row read receipt chip: "read" sits in a light-green enclosure, "unread" stays quiet. */
@@ -630,7 +632,6 @@
       <button class="tab active" type="button" data-view="relays">
         Relays <span class="tab-badge gone" id="relaysBadge">0</span>
       </button>
-      <button class="tab" type="button" data-view="threads">Threads</button>
       <button class="tab" type="button" data-view="sent">Sent</button>
       <button class="tab" type="button" data-view="contacts">Contacts</button>
       <button class="mark-all-read gone" id="markAllRead" type="button">Mark all as read</button>
@@ -1428,51 +1429,87 @@
     if (collapsed && !peeking) { pendingRelaysRender = true; return; }
     pendingRelaysRender = false;
     const allRows = (payload.relays || []).filter(isRelayListKind);
-    const rows = peeking ? allRows.filter((row) => row.unread) : allRows;
-    relaysEmptyEl.classList.toggle("gone", rows.length > 0);
+    if (peeking) {
+      // Notification mode is unchanged: flat unread relay rows, newest first.
+      const rows = allRows.filter((row) => row.unread);
+      relaysEmptyEl.classList.toggle("gone", rows.length > 0);
+      const seen = prevRelayIds;
+      relaysListEl.innerHTML = rows.map((r) => relayRowHtml(r, seen)).join("");
+      prevRelayIds = new Set(rows.map((r) => r.id));
+      wireRelayRows();
+      return;
+    }
+    // Conversation list: everything is a thread; most threads have one message.
+    // A single-inbound-message thread renders as the classic relay row (with the
+    // expand-card open actions); anything with replies — or that only exists on
+    // the sent side — renders as a conversation row that drills into the thread.
+    const byId = new Map(allRows.map((r) => [r.id, r]));
+    const threads = buildThreads();
+    relaysEmptyEl.classList.toggle("gone", threads.length > 0);
     const seen = prevRelayIds;
-    relaysListEl.innerHTML = rows.map((r) => {
-      const fresh = seen.size > 0 && !seen.has(r.id);
-      const kind = r.relayNotificationKind;
-      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>` : "";
-      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>` : "";
-      // Row click toggles this open-actions card; the buttons carry the actual
-      // opens ("current" injects into the live Claude session, "new" forces a
-      // fresh host session).
-      const expanded = r.id === expandedRelayId;
-      const openCard = expanded ? `
-        <div class="td-card row-open-card" data-stop="1">
-          <div class="td-card-actions">
-            <button class="td-btn primary" type="button" data-open-current="${esc(r.id)}">Open in current chat</button>
-            <button class="td-btn ghost" type="button" data-open-fresh="${esc(r.id)}">Open in new chat</button>
-          </div>
-        </div>` : "";
+    relaysListEl.innerHTML = threads.map((t) => {
+      const inbound = t.msgs.filter((m) => m.direction === "in");
+      if (t.msgs.length === 1 && inbound.length === 1 && byId.has(inbound[0].id)) {
+        return relayRowHtml(byId.get(inbound[0].id), seen);
+      }
+      const sentOnly = inbound.length === 0;
       return `
-      <div class="row ${r.unread ? "unread" : ""}${fresh ? " enter" : ""}${canDelete ? " deletable" : ""}${expanded ? " expanded" : ""}" data-id="${esc(r.id)}" data-opening-id="${esc(r.id)}">
-        ${deleteButton}
-        <div class="rk-top">
-          <span class="rk-dot"></span>
-          <span class="rk-from">From</span>
-          <span class="rk-sender">${esc(sender)}</span>
-          <span class="rk-time">${timeAgo(r.createdAt)}</span>
-        </div>
-        <div class="rk-subject${kind === "human_question" ? " q" : ""}">${esc(subject)}</div>
-        ${previewHtml}
-        ${actions}
-        ${openCard}
-        <div class="row-err" data-err="${esc(r.id)}"></div>
-      </div>`;
+      <button class="th-item${t.unreadCount ? " unread" : ""}${sentOnly ? " th-sent-only" : ""}" type="button" data-thread="${esc(t.threadId)}">
+        <span class="th-top">
+          ${t.unreadCount ? '<span class="th-unread"></span>' : ""}
+          <span class="th-party">${sentOnly ? "To " : ""}${esc(t.party)}</span>
+          ${t.msgs.length > 1 ? `<span class="th-count">${t.msgs.length}</span>` : ""}
+          <span class="th-time">${esc(timeAgo(t.latest.at))}</span>
+        </span>
+        <span class="th-title">${esc(t.latest.title)}</span>
+      </button>`;
     }).join("");
-    prevRelayIds = new Set(rows.map((r) => r.id));
+    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")));
+    }
+  }
+
+  // The classic relay row (used flat while peeking, and for single-message
+  // conversations in the unified list). Row click toggles the open-actions
+  // card; the buttons carry the actual opens.
+  function relayRowHtml(r, seen) {
+    const fresh = seen.size > 0 && !seen.has(r.id);
+    const kind = r.relayNotificationKind;
+    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>` : "";
+    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;
+    const openCard = expanded ? `
+      <div class="td-card row-open-card" data-stop="1">
+        <div class="td-card-actions">
+          <button class="td-btn primary" type="button" data-open-current="${esc(r.id)}">Open in current chat</button>
+          <button class="td-btn ghost" type="button" data-open-fresh="${esc(r.id)}">Open in new chat</button>
+        </div>
+      </div>` : "";
+    return `
+    <div class="row ${r.unread ? "unread" : ""}${fresh ? " enter" : ""}${canDelete ? " deletable" : ""}${expanded ? " expanded" : ""}" data-id="${esc(r.id)}" data-opening-id="${esc(r.id)}">
+      ${deleteButton}
+      <div class="rk-top">
+        <span class="rk-dot"></span>
+        <span class="rk-from">From</span>
+        <span class="rk-sender">${esc(sender)}</span>
+        <span class="rk-time">${timeAgo(r.createdAt)}</span>
+      </div>
+      <div class="rk-subject${kind === "human_question" ? " q" : ""}">${esc(subject)}</div>
+      ${previewHtml}
+      ${actions}
+      ${openCard}
+      <div class="row-err" data-err="${esc(r.id)}"></div>
+    </div>`;
   }
 
   // The white up-arrow inside the round prussian Send button.
@@ -2359,9 +2396,12 @@
         unread: Boolean(r.unread),
       });
     }
+    // A self-send exists on BOTH sides with the same relay id; keep only the
+    // inbound copy (the richer local row) so the thread doesn't show doubles.
+    const inboundIds = new Set(msgs.map((m) => m.id));
     for (const s of payload.sent || []) {
       const id = s.relayId || s.id;
-      if (!id) continue;
+      if (!id || inboundIds.has(id)) continue;
       msgs.push({
         id, threadId: s.threadId || id, direction: "out",
         title: sentSubject(s), party: sentRecipient(s), at: s.createdAt,
@@ -2440,12 +2480,23 @@
   }
   thBackEl.addEventListener("click", () => {
     threadDetailId = null;
-    renderThreads();
+    activeView = "relays";
+    syncTabs();
+    applyView();
+    renderAll();
   });
+  function openThreadDetail(threadId) {
+    threadDetailId = threadId;
+    activeView = "threads";
+    syncTabs();
+    applyView();
+  }
 
   // ---------- views / tabs ----------
   function syncTabs() {
-    const tabView = activeView === "taskDetail" ? "sent" : activeView;
+    // taskDetail belongs to Sent; the thread-detail view belongs to Relays —
+    // conversations ARE the Relays tab now, a thread is just its drill-down.
+    const tabView = activeView === "taskDetail" ? "sent" : activeView === "threads" ? "relays" : activeView;
     for (const tab of tabEls) tab.classList.toggle("active", tab.getAttribute("data-view") === tabView);
   }
   function applyView() {
@@ -2455,10 +2506,13 @@
     taskDetailViewEl.classList.toggle("hidden", activeView !== "taskDetail");
     contactsViewEl.classList.toggle("hidden", activeView !== "contacts");
     if (activeView === "threads") {
-      threadDetailId = null; // always land on the thread list
+      // Entered only by clicking a conversation row (threadDetailId set there).
       renderThreads();
       if (window.relay.refreshSent) window.relay.refreshSent().catch(() => {}); // outbound half of threads
     }
+    if (activeView === "relays" && window.relay.refreshSent) {
+      window.relay.refreshSent().catch(() => {}); // conversations include the sent side
+    }
     if (activeView !== "taskDetail" && taskDetailTimer) {
       clearInterval(taskDetailTimer);
       taskDetailTimer = null;

package/overlay/main.cjs

@@ -358,6 +358,20 @@ function isRelayTaskWebTarget(pathOrUrl) {
 
 // ---- state.json reading (Relay attention rows) ---------------------------
 
+// The daemon's staging ledger (~/.relay/task-ledger.json plainRelays map) must be
+// invalidated whenever the packet store is reset, or its dedupe permanently blocks
+// re-staging everything the wipe destroyed.
+function clearPlainRelayLedger() {
+  try {
+    const dir = process.env.RELAY_CONFIG_DIR || path.join(os.homedir(), ".relay");
+    const ledgerPath = path.join(dir, "task-ledger.json");
+    const ledger = JSON.parse(fs.readFileSync(ledgerPath, "utf8")) || {};
+    ledger.plainRelays = {};
+    fs.writeFileSync(ledgerPath, `${JSON.stringify(ledger, null, 2)}\n`);
+    console.error(`[overlay] ${new Date().toISOString()} cleared plainRelays ledger after store reset`);
+  } catch {}
+}
+
 function emptyStoreFor(current) {
   return {
     version: 1,
@@ -392,6 +406,7 @@ function scheduleAccountReset(current) {
         if (!stillWrongUser && !stillWrongEmail) return; // a concurrent writer fixed it; wipe nothing
         console.error(`[overlay] ${new Date().toISOString()} account mismatch: resetting local store`);
         writeStateAtomic(emptyStoreFor(current));
+        clearPlainRelayLedger(); // a wiped store makes the dedupe ledger a lie: without this, the daemon never re-stages the server's relays and the inbox stays empty forever
       });
     } finally {
       accountResetScheduled = false;

package/package.json

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

package/src/notifications.js

@@ -1,7 +1,7 @@
 import fs from "node:fs";
 import os from "node:os";
 import path from "node:path";
-import { currentUser, readConfig, webUrl } from "./config.js";
+import { currentUser, readConfig, taskLedgerPath, webUrl } from "./config.js";
 import { relayBinPath } from "./install.js";
 import { withJsonLock, withJsonLockStrict } from "./state-lock.cjs";
 import inboxItemIds from "./inbox-item-id.cjs";
@@ -340,6 +340,15 @@ export function resetCompanionStateForAccount(
       },
     };
     writeCompanionState(statePath, next);
+    // The staging ledger belongs to the store that was just destroyed. Left
+    // intact, its dedupe would permanently block re-staging every relay the
+    // reset wiped, leaving the inbox empty while the server still has them.
+    try {
+      const ledgerFile = taskLedgerPath();
+      const ledger = JSON.parse(fs.readFileSync(ledgerFile, "utf8")) || {};
+      ledger.plainRelays = {};
+      fs.writeFileSync(ledgerFile, `${JSON.stringify(ledger, null, 2)}\n`);
+    } catch {}
     return { reset: true, statePath };
   });
 }