npm - @echomem/mcp - Versions diffs - 1.2.0 → 1.3.1 - Mend

@echomem/mcp 1.2.0 → 1.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/dist/setup-page.js ADDED Viewed

@@ -0,0 +1,574 @@
+export function renderSetupPage() {
+    return `<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>EchoMem Device Setup</title>
+  <style>
+    :root {
+      color-scheme: light;
+      --bg: #f7f7f4;
+      --ink: #171717;
+      --muted: #5c655f;
+      --line: #d8d8d2;
+      --panel: #fff;
+      --good-bg: #eff7ec;
+      --good-line: #cbd9c8;
+      --warn-bg: #fff6dc;
+      --warn-line: #edce79;
+      --error-bg: #fff1ef;
+      --error-line: #e7aaa2;
+    }
+    * { box-sizing: border-box; }
+    body {
+      margin: 0;
+      min-height: 100vh;
+      background: var(--bg);
+      color: var(--ink);
+      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+      letter-spacing: 0;
+    }
+    main {
+      width: min(1080px, 100%);
+      margin: 0 auto;
+      padding: clamp(18px, 4vw, 34px);
+    }
+    header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 16px;
+      flex-wrap: wrap;
+      border-bottom: 1px solid var(--line);
+      padding-bottom: 18px;
+      margin-bottom: 24px;
+    }
+    .kicker {
+      margin: 0;
+      color: var(--muted);
+      font-size: 13px;
+      font-weight: 800;
+      text-transform: uppercase;
+    }
+    h1 {
+      margin: 4px 0 0;
+      font-size: clamp(34px, 5vw, 62px);
+      line-height: 1;
+      letter-spacing: 0;
+    }
+    h2 {
+      margin: 0;
+      font-size: 22px;
+      line-height: 1.2;
+      letter-spacing: 0;
+    }
+    .pill {
+      min-height: 38px;
+      display: inline-flex;
+      align-items: center;
+      gap: 8px;
+      border: 1px solid #c9ccc3;
+      border-radius: 999px;
+      padding: 0 14px;
+      background: var(--panel);
+      font-weight: 800;
+      white-space: nowrap;
+    }
+    .state {
+      min-height: 220px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: #3d463f;
+      font-size: 18px;
+      text-align: center;
+    }
+    .grid {
+      display: grid;
+      grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
+      gap: 12px;
+      margin-bottom: 18px;
+    }
+    .grid.compact {
+      grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
+    }
+    .metric, .panel {
+      border: 1px solid var(--line);
+      border-radius: 8px;
+      background: var(--panel);
+      padding: 18px;
+    }
+    .metric {
+      min-height: 132px;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+    }
+    .label {
+      margin: 0;
+      color: #626960;
+      font-size: 13px;
+      font-weight: 800;
+      text-transform: uppercase;
+    }
+    .value {
+      display: block;
+      font-size: 36px;
+      line-height: 1;
+      letter-spacing: 0;
+    }
+    .detail, p {
+      margin: 0;
+      color: #4e554f;
+      font-size: 15px;
+      line-height: 1.45;
+    }
+    .extract-hero {
+      display: grid;
+      grid-template-columns: minmax(0, 1.4fr) minmax(220px, 0.6fr);
+      gap: 18px;
+      align-items: end;
+      margin-bottom: 12px;
+    }
+    .hero-value {
+      display: block;
+      margin-top: 10px;
+      font-size: clamp(42px, 7vw, 84px);
+      line-height: 0.95;
+      letter-spacing: 0;
+    }
+    .hero-copy {
+      max-width: 640px;
+      margin-top: 12px;
+    }
+    .mini-stack {
+      display: grid;
+      gap: 8px;
+    }
+    .mini-row {
+      display: flex;
+      justify-content: space-between;
+      gap: 12px;
+      border-bottom: 1px solid #ecece7;
+      padding-bottom: 8px;
+    }
+    .bucket-row {
+      align-items: center;
+      display: grid;
+      grid-template-columns: minmax(90px, 1fr) minmax(100px, auto);
+      gap: 12px;
+    }
+    .bucket-value {
+      text-align: right;
+      font-weight: 800;
+      white-space: nowrap;
+    }
+    .helper {
+      margin-top: 10px;
+      color: var(--muted);
+      font-size: 14px;
+    }
+    .notice, .done, .warning, .error {
+      border-radius: 8px;
+      padding: 14px 16px;
+      margin-bottom: 18px;
+    }
+    .notice, .done {
+      border: 1px solid var(--good-line);
+      background: var(--good-bg);
+      color: #203820;
+    }
+    .warning {
+      border: 1px solid var(--warn-line);
+      background: var(--warn-bg);
+      color: #5e4300;
+    }
+    .error {
+      border: 1px solid var(--error-line);
+      background: var(--error-bg);
+      color: #7d2117;
+    }
+    .details {
+      display: grid;
+      grid-template-columns: repeat(auto-fit, minmax(min(290px, 100%), 1fr));
+      gap: 12px;
+      margin-bottom: 18px;
+    }
+    dl {
+      margin: 14px 0 0;
+      display: grid;
+      gap: 10px;
+    }
+    .row {
+      display: flex;
+      justify-content: space-between;
+      gap: 12px;
+      border-bottom: 1px solid #ecece7;
+      padding-bottom: 8px;
+    }
+    dt { color: #222; }
+    dd { margin: 0; text-align: right; color: #222; }
+    ol {
+      list-style: none;
+      margin: 14px 0 0;
+      padding: 0;
+      display: grid;
+      gap: 10px;
+    }
+    li {
+      display: flex;
+      justify-content: space-between;
+      gap: 10px;
+    }
+    .actions {
+      display: flex;
+      gap: 10px;
+      flex-wrap: wrap;
+      margin-top: 18px;
+    }
+    button, .button {
+      min-height: 44px;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      gap: 8px;
+      border-radius: 8px;
+      border: 1px solid #171717;
+      padding: 0 16px;
+      font: inherit;
+      font-weight: 800;
+      text-decoration: none;
+      cursor: pointer;
+    }
+    .primary {
+      background: #171717;
+      color: #fff;
+    }
+    .secondary {
+      background: #fff;
+      color: #171717;
+    }
+    button:disabled {
+      cursor: not-allowed;
+      opacity: 0.55;
+    }
+    .track {
+      height: 12px;
+      overflow: hidden;
+      border-radius: 999px;
+      background: #e8e8e1;
+      margin: 16px 0 10px;
+    }
+    .fill {
+      height: 100%;
+      width: 0%;
+      background: #171717;
+      transition: width 180ms ease;
+    }
+    .counts {
+      display: flex;
+      gap: 12px;
+      flex-wrap: wrap;
+      color: var(--muted);
+      font-size: 14px;
+      margin-bottom: 14px;
+    }
+    .hidden { display: none; }
+    @media (max-width: 720px) {
+      .extract-hero {
+        grid-template-columns: 1fr;
+      }
+      .hero-value {
+        font-size: clamp(38px, 13vw, 58px);
+      }
+    }
+  </style>
+</head>
+<body>
+  <main>
+    <header>
+      <div>
+        <p class="kicker">EchoMem device setup</p>
+        <h1 id="title">Connect this device</h1>
+      </div>
+      <div class="pill" id="status">Working</div>
+    </header>
+    <section id="app" class="state">Starting local setup...</section>
+  </main>
+  <script>
+    (function () {
+      var params = new URLSearchParams(location.search);
+      var nonce = params.get("nonce") || "";
+      var app = document.getElementById("app");
+      var title = document.getElementById("title");
+      var status = document.getElementById("status");
+      var stats = null;
+      var statsSlow = false;
+      var decisionMade = false;
+      var authUrl = "";
+      function esc(value) {
+        return String(value == null ? "" : value).replace(/[&<>"']/g, function (ch) {
+          return { "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" }[ch];
+        });
+      }
+      function setHead(nextTitle, nextStatus) {
+        title.textContent = nextTitle;
+        status.textContent = nextStatus;
+      }
+      function number(value) {
+        return typeof value === "number" && isFinite(value) ? Math.round(value).toLocaleString() : "-";
+      }
+      function compact(value) {
+        if (typeof value !== "number" || !isFinite(value)) return "-";
+        var abs = Math.abs(value);
+        if (abs >= 1000000000) return (value / 1000000000).toFixed(1) + "B";
+        if (abs >= 1000000) return (value / 1000000).toFixed(1) + "M";
+        if (abs >= 1000) return (value / 1000).toFixed(1) + "K";
+        return String(Math.round(value));
+      }
+      function hourLabel(hour) {
+        if (typeof hour !== "number" || hour < 0) return "-";
+        var h = hour % 24;
+        var suffix = h >= 12 ? "PM" : "AM";
+        var display = h % 12 || 12;
+        return display + " " + suffix;
+      }
+      function sleep(ms) {
+        return new Promise(function (resolve) { setTimeout(resolve, ms); });
+      }
+      async function getJson(path) {
+        var sep = path.indexOf("?") >= 0 ? "&" : "?";
+        var res = await fetch(path + sep + "nonce=" + encodeURIComponent(nonce), { credentials: "omit" });
+        if (!res.ok) throw new Error(await res.text() || ("HTTP " + res.status));
+        return await res.json();
+      }
+      async function postJson(path, body) {
+        var res = await fetch(path, {
+          method: "POST",
+          credentials: "omit",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify(Object.assign({ nonce: nonce }, body || {}))
+        });
+        var data = await res.json().catch(function () { return {}; });
+        if (!res.ok) {
+          var msg = data.message || data.error || ("HTTP " + res.status);
+          throw new Error(msg);
+        }
+        return data;
+      }
+      function metric(label, value, detail) {
+        return '<section class="metric"><p class="label">' + esc(label) + '</p><strong class="value">' + esc(value) + '</strong><p class="detail">' + esc(detail) + '</p></section>';
+      }
+      function row(label, value) {
+        return '<div class="row"><dt>' + esc(label) + '</dt><dd>' + esc(value) + '</dd></div>';
+      }
+      function migrationBuckets(migratable) {
+        var eta = migratable && migratable.eta ? migratable.eta : {};
+        var buckets = Array.isArray(migratable && migratable.buckets)
+          ? migratable.buckets
+          : (Array.isArray(eta.buckets) ? eta.buckets : []);
+        return buckets;
+      }
+      function bucketCount(buckets, key) {
+        var found = buckets.filter(function (b) { return b && b.key === key; })[0];
+        return found && typeof found.count === "number" ? found.count : 0;
+      }
+      function bucketList(buckets) {
+        if (!buckets.length) return '<p style="margin-top:10px">No pending extraction buckets.</p>';
+        var visible = buckets.filter(function (b) { return b && (b.count || b.chars); });
+        if (!visible.length) return '<p style="margin-top:10px">No pending extraction buckets.</p>';
+        return '<ol>' + visible.map(function (b) {
+          return '<li class="bucket-row"><span>' + esc(b.label) + '</span><span class="bucket-value">' + esc(number(b.count)) + ' · ' + esc(compact(b.chars)) + '</span></li>';
+        }).join("") + '</ol>';
+      }
+      function routeError(code) {
+        if (code === "NO_PENDING_SESSIONS") return "There are no unprocessed local conversations to extract right now.";
+        if (code === "FORBIDDEN_SCOPE") return "This device token cannot import history. Re-connect this device to mint an import-capable token.";
+        if (code === "VAULT_LOCKED") return "Your local vault is locked. Run echomem-mcp unlock, then retry.";
+        if (code === "IMPORT_START_TIMEOUT") return "Starting the import timed out. Retry when the connection settles.";
+        if (code === "NOT_LOGGED_IN") return "The local bridge is not logged in yet. Sign in again and retry.";
+        return code || "Something went wrong. Retry in a moment.";
+      }
+      function showConnect() {
+        setHead("Connect this device", "Local");
+        app.className = "panel";
+        app.innerHTML =
+          '<h2>Local setup is ready</h2>' +
+          '<p style="margin-top:10px">This page is served from 127.0.0.1. EchoMem will only use the web to sign in and mint a device token, then it returns here.</p>' +
+          '<div class="actions"><a class="button primary" href="' + esc(authUrl) + '">Connect EchoMem</a></div>';
+      }
+      async function waitForStats() {
+        setHead("Extract local history", "Working");
+        app.className = "state";
+        app.textContent = "Reading local extraction info from this device...";
+        var started = Date.now();
+        for (;;) {
+          if (decisionMade) return;
+          try {
+            var res = await fetch("/stats?nonce=" + encodeURIComponent(nonce), { credentials: "omit" });
+            if (res.status === 200) {
+              stats = await res.json();
+              if (decisionMade) return;
+              renderDashboard();
+              if (stats && stats.partial) {
+                await sleep(1200);
+                continue;
+              }
+              return;
+            }
+            if (res.status !== 202) throw new Error(await res.text() || ("HTTP " + res.status));
+          } catch (e) {
+            if (Date.now() - started > 20000) {
+              statsSlow = true;
+              renderDashboard();
+            }
+          }
+          if (Date.now() - started > 20000 && !statsSlow) {
+            statsSlow = true;
+            renderDashboard();
+          }
+          await sleep(statsSlow ? 1500 : 500);
+        }
+      }
+      function renderDashboard(error) {
+        var migratable = stats && stats.migratable ? stats.migratable : {};
+        var pending = stats && stats.migratable ? stats.migratable.pending : null;
+        var hasPendingCount = typeof pending === "number";
+        var knownDone = hasPendingCount && pending === 0;
+        setHead(knownDone ? "History is ready" : "Extract local history", "Ready");
+        var eta = migratable && migratable.eta ? migratable.eta : {};
+        var buckets = migrationBuckets(migratable);
+        var over1m = bucketCount(buckets, "huge") + bucketCount(buckets, "massive");
+        var processed = stats && stats.migratable ? stats.migratable.alreadyMigrated : null;
+        var skippedActive = typeof migratable.skippedActive === "number" ? migratable.skippedActive : 0;
+        var etaLabel = eta.estimatedLabel || migratable.estimatedLabel || (knownDone ? "complete" : "calculating");
+        var sessions = stats && stats.sessions ? stats.sessions : {};
+        var notice = pending == null
+          ? "The bridge can check for unprocessed conversations and extract them now."
+          : (knownDone && skippedActive
+            ? "Historical conversations are processed. " + skippedActive.toLocaleString() + " active conversation" + (skippedActive === 1 ? " is" : "s are") + " still changing and will be picked up later."
+            : (pending.toLocaleString() + " unprocessed conversation" + (pending === 1 ? "" : "s") + " can be extracted now. Already processed conversations are skipped."));
+        var productHint = knownDone
+          ? "EchoMem is ready in your editor. Active sessions will be picked up after they stop changing."
+          : "You can start using EchoMem in your editor while extraction runs. Keep this tab and the terminal open until it finishes.";
+        app.className = "";
+        app.innerHTML =
+          (statsSlow ? '<div class="warning">Local processed/unprocessed counts are taking longer than expected. You can still ask the bridge to extract anything unprocessed.</div>' : '') +
+          (stats && stats.partial ? '<div class="warning">Fast local counts are ready. Detailed local stats are still loading.</div>' : '') +
+          (error ? '<div class="error">' + esc(error) + '</div>' : '') +
+          '<section class="panel extract-hero">' +
+            '<div>' +
+              '<p class="label">' + esc(knownDone ? "Extraction complete" : "Estimated processing time") + '</p>' +
+              '<strong class="hero-value">' + esc(knownDone ? "Complete" : etaLabel) + '</strong>' +
+              '<p class="hero-copy">' + esc(notice) + '</p>' +
+              '<p class="helper">' + esc(productHint) + '</p>' +
+            '</div>' +
+            '<div class="mini-stack">' +
+              '<div class="mini-row"><span>Pending</span><strong>' + esc(number(pending)) + '</strong></div>' +
+              '<div class="mini-row"><span>Processed</span><strong>' + esc(number(processed)) + '</strong></div>' +
+              '<div class="mini-row"><span>Active skipped</span><strong>' + esc(number(skippedActive)) + '</strong></div>' +
+              '<div class="mini-row"><span>1M+ sessions</span><strong>' + esc(number(over1m)) + '</strong></div>' +
+            '</div>' +
+          '</section>' +
+          '<div class="grid compact">' +
+            metric("Sessions found", number(sessions.total), number(sessions.codex) + " Codex + " + number(sessions.claudeCode) + " Claude Code") +
+            metric("Pending chars", compact(migratable.totalChars || (eta && eta.totalChars)), "assembled text to process") +
+            metric("Approx input tokens", compact(migratable.approxInputTokens || (eta && eta.approxInputTokens)), "local estimate") +
+            metric("Memories captured", number(stats && stats.memoriesCaptured), "already in EchoMem") +
+          '</div>' +
+          '<div class="details">' +
+            '<section class="panel"><h2>Pending Size</h2>' + bucketList(buckets) + '</section>' +
+            '<section class="panel"><h2>Extraction Plan</h2><dl>' +
+              row("Mode", "local bridge queue") +
+              row("Uploads", "text turns only") +
+              row("Already processed", "skipped") +
+              row("Active sessions", "picked up later") +
+            '</dl></section>' +
+          '</div>' +
+          '<div class="actions">' +
+            '<button id="migrate" class="primary" ' + (knownDone ? "disabled" : "") + '>-> Extract unprocessed conversations</button>' +
+            '<button id="skip" class="secondary">' + (knownDone ? "Finish setup" : "Not today") + '</button>' +
+          '</div>';
+        document.getElementById("migrate").onclick = startMigrate;
+        document.getElementById("skip").onclick = skip;
+      }
+      async function startMigrate() {
+        if (decisionMade) return;
+        decisionMade = true;
+        setHead("Extraction progress", "Starting");
+        app.className = "panel";
+        app.innerHTML = '<h2>Starting extraction</h2><p style="margin-top:10px">You can start using EchoMem in your editor now. Keep this tab and the terminal open while the local bridge imports unprocessed conversations.</p>';
+        try {
+          var started = await postJson("/migrate", {});
+          renderProgress(Object.assign({ status: "running", completed: 0, failed: 0, extracted: 0 }, started));
+          await pollProgress();
+        } catch (e) {
+          decisionMade = false;
+          renderDashboard(routeError(e && e.message));
+        }
+      }
+      async function pollProgress() {
+        for (;;) {
+          var progress = await getJson("/progress");
+          renderProgress(progress);
+          if (progress.status === "completed" || progress.status === "failed") return;
+          await sleep(1200);
+        }
+      }
+      function renderProgress(progress) {
+        var total = progress.total || progress.jobCount || 0;
+        var completed = progress.completed || 0;
+        var failed = progress.failed || 0;
+        var pct = total > 0 ? Math.round((completed / total) * 100) : 0;
+        setHead("Extraction progress", progress.status === "completed" ? "Done" : "Extracting");
+        app.className = "panel";
+        app.innerHTML =
+          '<h2>Extracting local history</h2>' +
+          '<div class="track"><div class="fill" style="width:' + pct + '%"></div></div>' +
+          '<div class="counts"><span>' + completed + ' completed</span><span>' + (progress.running || 0) + ' running</span><span>' + (progress.queued || 0) + ' queued</span><span>' + failed + ' failed</span></div>' +
+          '<p>You can start using EchoMem now. Keep this tab and the terminal open until extraction finishes.</p>' +
+          (progress.latest ? '<p style="margin-top:10px">' + esc(progress.latest) + '</p>' : '') +
+          '<div class="' + (progress.status === "failed" ? "error" : "notice") + '" style="margin-top:16px;margin-bottom:0">' +
+            esc((progress.extracted || 0).toLocaleString()) + ' memories saved so far.' + (progress.error ? ' ' + esc(progress.error) : '') +
+          '</div>';
+      }
+      async function skip() {
+        if (decisionMade) return;
+        decisionMade = true;
+        try {
+          await postJson("/skip", {});
+          setHead("Setup complete", "Done");
+          app.className = "panel";
+          app.innerHTML = '<h2>All set</h2><p style="margin-top:10px">You can extract unprocessed conversations later with echomem-mcp migrate.</p>';
+        } catch (e) {
+          decisionMade = false;
+          renderDashboard(e && e.message);
+        }
+      }
+      async function init() {
+        if (!nonce) throw new Error("Missing setup nonce. Re-run echomem-mcp setup.");
+        var cfg = await getJson("/config");
+        authUrl = cfg.authUrl || "";
+        if (!cfg.connected) {
+          showConnect();
+          var key = "echomem-auth-started-" + nonce;
+          if (!sessionStorage.getItem(key)) {
+            sessionStorage.setItem(key, "1");
+            setTimeout(function () { location.href = authUrl; }, 700);
+          }
+          return;
+        }
+        await waitForStats();
+      }
+      init().catch(function (e) {
+        setHead("Connection issue", "Needs attention");
+        app.className = "error";
+        app.textContent = e && e.message ? e.message : String(e);
+      });
+    })();
+  </script>
+</body>
+</html>`;
+}