@sansynx/erroratlas 0.1.2 → 0.1.3

package/README.md

@@ -4,6 +4,36 @@ ErrorAtlas is hosted debugging memory for coding agents.
 
 Developers do not clone this repo, create Supabase projects, deploy Workers, or manage ErrorAtlas infrastructure. They install the npm MCP client, generate one hosted MCP key, run Supermemory locally, and let their coding agent search and publish verified fixes.
 
+## Working flow
+
+```mermaid
+flowchart TD
+  Dev[Developer] --> Console[Hosted ErrorAtlas dashboard]
+  Console --> Key[Generate one MCP key]
+
+  Dev --> Agent[Codex / Cursor / Windsurf / OpenCode]
+  Agent --> MCP[Local ErrorAtlas MCP server]
+
+  MCP --> LocalMemory[Supermemory local]
+  MCP --> API[Hosted ErrorAtlas API]
+
+  LocalMemory --> PrivateContext[Private project memory stays on machine]
+  API --> Search[Search sanitized shared fixes]
+  API --> Store[Store sanitized incidents and verified playbooks]
+
+  Search --> Agent
+  PrivateContext --> Agent
+```
+
+```txt
+1. Developer signs in at the hosted dashboard.
+2. Dashboard generates one MCP key.
+3. Developer installs @sansynx/erroratlas in their project.
+4. Coding agent connects to the local ErrorAtlas MCP server.
+5. MCP searches Supermemory local plus hosted ErrorAtlas fixes.
+6. After a verified fix, MCP stores sanitized incidents and playbooks remotely.
+```
+
 ## End-user flow
 
 1. Open the hosted dashboard:

package/dist/worker/ui.js

@@ -369,6 +369,9 @@ button { cursor: pointer; }
 .nav-links { display: flex; align-items: center; gap: 10px; color: var(--body); }
 .nav-links a,
 .nav-links button { display: inline-flex; align-items: center; justify-content: center; }
+.nav-actions {
+  display: contents;
+}
 .nav-menu {
     display: none;
     min-height: 38px;
@@ -674,7 +677,6 @@ ul, ol { margin: 0; padding-left: 20px; color: var(--body); }
   }
   .nav-menu {
     display: inline-flex;
-    justify-self: end;
     width: 40px;
     height: 40px;
     padding: 0;
@@ -712,6 +714,21 @@ ul, ol { margin: 0; padding-left: 20px; color: var(--body); }
     transform: translateY(-4px);
     transition: max-height 240ms ease, opacity 180ms ease, transform 220ms ease, margin 220ms ease, padding 220ms ease, border-color 180ms ease;
   }
+  .nav-actions {
+    display: flex;
+    justify-self: end;
+    align-items: center;
+    gap: 4px;
+  }
+  .nav-actions .theme-toggle {
+    display: inline-flex;
+    width: 38px;
+    min-width: 38px;
+    height: 38px;
+    min-height: 38px;
+    border: 0;
+    background: transparent;
+  }
   .nav.open .nav-links {
     max-height: 260px;
     margin: 6px 0 0;
@@ -722,7 +739,6 @@ ul, ol { margin: 0; padding-left: 20px; color: var(--body); }
     transform: translateY(0);
   }
   .nav-links .button,
-  .nav-links .theme-toggle,
   .nav-links > a:not(.button) {
     width: 100%;
     min-height: 40px;
@@ -812,31 +828,6 @@ ul, ol { margin: 0; padding-left: 20px; color: var(--body); }
     padding-left: 12px;
     transform: none;
   }
-  .nav.open .theme-toggle {
-    width: 100%;
-    height: 46px;
-    min-height: 46px;
-    min-width: 0;
-    justify-content: flex-start;
-    gap: 10px;
-    padding: 0 4px;
-    border: 0;
-    border-bottom: 1px solid var(--line);
-    border-radius: 0;
-    background: transparent;
-    color: var(--fg);
-    box-shadow: none;
-  }
-  .nav.open .theme-toggle:hover {
-    background: var(--surface-2);
-    padding-left: 12px;
-    transform: none;
-  }
-  .nav.open .theme-toggle::after {
-    content: "Theme";
-    font-size: 13px;
-    font-weight: 500;
-  }
   .nav.open .nav-links > *:last-child {
     border-bottom: 0;
   }
@@ -857,19 +848,16 @@ ul, ol { margin: 0; padding-left: 20px; color: var(--body); }
   padding-left: 4px;
 }
 .brand::before {
-  content: "";
-  width: 9px;
-  height: 9px;
-  border-radius: 999px;
-  background: var(--fg);
-  box-shadow: 0 0 0 4px var(--surface-2);
+  display: none;
+  content: none;
 }
 .nav-links {
   gap: 6px;
 }
 .nav-links > a:not(.button),
 .nav-links .button,
-.nav-links .theme-toggle {
+.nav-links .theme-toggle,
+.nav-actions .theme-toggle {
   height: 38px;
   min-height: 38px;
   border-radius: 12px;
@@ -935,20 +923,27 @@ ul, ol { margin: 0; padding-left: 20px; color: var(--body); }
 @media (max-width: 760px) {
   .nav {
     margin-top: 12px;
-    border-radius: 18px;
-    background: var(--surface);
-    box-shadow: 0 16px 52px rgba(0, 0, 0, 0.12);
+    padding: 10px 0;
+    border-color: transparent;
+    border-radius: 0;
+    background: transparent;
+    box-shadow: none;
   }
   .nav.open {
-    border-radius: 20px;
-    padding: 10px;
+    padding: 10px 0 0;
+    border-radius: 0;
+    background: transparent;
+    border-color: transparent;
+    box-shadow: none;
   }
   .nav.open .nav-links {
-    padding-top: 10px;
+    margin-top: 14px;
+    padding: 12px 0 0;
+    border-top: 1px solid var(--line);
+    background: transparent;
   }
   .nav.open .nav-links .button,
-  .nav.open .nav-links > a:not(.button),
-  .nav.open .theme-toggle {
+  .nav.open .nav-links > a:not(.button) {
     justify-content: flex-start;
     height: 44px;
     min-height: 44px;
@@ -956,6 +951,7 @@ ul, ol { margin: 0; padding-left: 20px; color: var(--body); }
     border-radius: 12px;
     border: 0;
     border-bottom: 0;
+    background: transparent;
   }
   .secret-copy-row {
     grid-template-columns: 1fr;
@@ -964,6 +960,48 @@ ul, ol { margin: 0; padding-left: 20px; color: var(--body); }
     width: 100%;
   }
 }
+.nav-menu {
+  background: transparent;
+}
+@media (max-width: 760px) {
+  .brand {
+    padding-left: 0;
+    font-size: 14px;
+    height: 40px;
+    align-items: center;
+  }
+  .nav-menu {
+    justify-self: end;
+    width: 38px;
+    min-width: 38px;
+    height: 38px;
+    background: transparent;
+  }
+  .nav.open .nav-links {
+    gap: 8px;
+  }
+  .nav.open .nav-menu {
+    background: transparent;
+  }
+  .nav.open .nav-links .button,
+  .nav.open .nav-links > a:not(.button) {
+    align-items: center;
+    justify-content: center;
+    padding-left: 0;
+    padding-right: 0;
+    font-size: 14px;
+    line-height: 1;
+    text-align: center;
+  }
+  .landing-page .hero,
+  .setup-page .hero {
+    justify-items: center;
+    text-align: center;
+  }
+  .landing-page .hero {
+    padding-top: 64px;
+  }
+}
 </style>`;
 }
 export function renderLandingUi(env) {
@@ -974,6 +1012,7 @@ export function renderLandingUi(env) {
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>${appName}</title>
+<link rel="icon" href="/favicon.svg" type="image/svg+xml">
 ${themeBootScript()}
 ${sharedCss()}
 <style>
@@ -1140,6 +1179,10 @@ ${sharedCss()}
   }
     .footer {
       flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      text-align: center;
+      width: 100%;
     }
   }
 </style>
@@ -1148,10 +1191,12 @@ ${sharedCss()}
 <div class="shell narrow">
   <nav class="nav">
     <a href="/" class="brand">ErrorAtlas</a>
-    <button class="nav-menu" id="navMenu" type="button" aria-expanded="false" aria-controls="navLinks" aria-label="Open navigation"><span class="nav-menu-lines" aria-hidden="true"><span class="nav-menu-line"></span><span class="nav-menu-line"></span><span class="nav-menu-line"></span></span></button>
+    <div class="nav-actions">
+      <button class="theme-toggle" id="themeToggle" type="button" aria-label="Switch theme" title="Switch theme"><span class="theme-toggle-icon" aria-hidden="true"></span></button>
+      <button class="nav-menu" id="navMenu" type="button" aria-expanded="false" aria-controls="navLinks" aria-label="Open navigation"><span class="nav-menu-lines" aria-hidden="true"><span class="nav-menu-line"></span><span class="nav-menu-line"></span><span class="nav-menu-line"></span></span></button>
+    </div>
     <div class="nav-links" id="navLinks">
       <a href="/setup">Setup</a>
-      <button class="theme-toggle" id="themeToggle" type="button" aria-label="Switch theme" title="Switch theme"><span class="theme-toggle-icon" aria-hidden="true"></span></button>
       <a class="button primary" href="/dashboard">Dashboard</a>
     </div>
   </nav>
@@ -1210,6 +1255,7 @@ export function renderSetupGuideUi(env, requestOrigin) {
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>${appName} Setup</title>
+<link rel="icon" href="/favicon.svg" type="image/svg+xml">
 ${themeBootScript()}
 ${sharedCss()}
 <style>
@@ -1318,9 +1364,6 @@ ${sharedCss()}
     font-weight: 600;
   }
   @media (max-width: 760px) {
-    .setup-page .nav {
-      border-radius: 999px;
-    }
     .setup-page .nav-links {
       border-top: 1px solid var(--line);
     }
@@ -1350,10 +1393,12 @@ ${sharedCss()}
 <div class="shell narrow">
   <nav class="nav">
     <a href="/" class="brand">ErrorAtlas</a>
-      <button class="nav-menu" id="navMenu" type="button" aria-expanded="false" aria-controls="navLinks" aria-label="Open navigation"><span class="nav-menu-lines" aria-hidden="true"><span class="nav-menu-line"></span><span class="nav-menu-line"></span><span class="nav-menu-line"></span></span></button>
+      <div class="nav-actions">
+        <button class="theme-toggle" id="themeToggle" type="button" aria-label="Switch theme" title="Switch theme"><span class="theme-toggle-icon" aria-hidden="true"></span></button>
+        <button class="nav-menu" id="navMenu" type="button" aria-expanded="false" aria-controls="navLinks" aria-label="Open navigation"><span class="nav-menu-lines" aria-hidden="true"><span class="nav-menu-line"></span><span class="nav-menu-line"></span><span class="nav-menu-line"></span></span></button>
+      </div>
     <div class="nav-links" id="navLinks">
       <a href="/dashboard">Dashboard</a>
-      <button class="theme-toggle" id="themeToggle" type="button" aria-label="Switch theme" title="Switch theme"><span class="theme-toggle-icon" aria-hidden="true"></span></button>
       <a class="button primary" href="/">Home</a>
     </div>
   </nav>
@@ -1495,6 +1540,7 @@ export function renderDashboardUi(env) {
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>${appName} Dashboard</title>
+<link rel="icon" href="/favicon.svg" type="image/svg+xml">
 ${themeBootScript()}
 ${sharedCss()}
 <style>
@@ -1843,10 +1889,12 @@ ${sharedCss()}
 <div class="shell">
   <nav class="nav">
     <a href="/" class="brand">ErrorAtlas</a>
-      <button class="nav-menu" id="navMenu" type="button" aria-expanded="false" aria-controls="navLinks" aria-label="Open navigation"><span class="nav-menu-lines" aria-hidden="true"><span class="nav-menu-line"></span><span class="nav-menu-line"></span><span class="nav-menu-line"></span></span></button>
+      <div class="nav-actions">
+        <button class="theme-toggle" id="themeToggle" type="button" aria-label="Switch theme" title="Switch theme"><span class="theme-toggle-icon" aria-hidden="true"></span></button>
+        <button class="nav-menu" id="navMenu" type="button" aria-expanded="false" aria-controls="navLinks" aria-label="Open navigation"><span class="nav-menu-lines" aria-hidden="true"><span class="nav-menu-line"></span><span class="nav-menu-line"></span><span class="nav-menu-line"></span></span></button>
+      </div>
     <div class="nav-links" id="navLinks">
       <a href="/setup">Setup</a>
-      <button class="theme-toggle" id="themeToggle" type="button" aria-label="Switch theme" title="Switch theme"><span class="theme-toggle-icon" aria-hidden="true"></span></button>
       <a class="button primary" href="/">Home</a>
     </div>
   </nav>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sansynx/erroratlas",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "private": false,
   "type": "module",
   "description": "Hosted ErrorAtlas MCP client and local debugging memory tools for coding agents.",
@@ -27,7 +27,6 @@
     "deploy": "wrangler deploy",
     "build": "npm run sync:assets && tsc -p tsconfig.json",
     "typecheck": "tsc --noEmit",
-    "test:e2e": "npm run build && node scripts/e2e-smoke.mjs",
     "prepack": "npm run build",
     "mcp": "tsx src/mcp/server.ts",
     "cli": "tsx src/cli/index.ts"