claude-code-memory-explorer 0.2.0 → 0.2.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-memory-explorer",
-  "version": "0.2.0",
+  "version": "0.2.3",
   "description": "Memory explorer dashboard for Claude Code",
   "main": "server.js",
   "bin": {
@@ -22,5 +22,30 @@
   "devDependencies": {
     "husky": "^9.0.0"
   },
-  "license": "MIT"
+  "keywords": [
+    "claude",
+    "claude-code",
+    "memory",
+    "dashboard",
+    "anthropic",
+    "ai",
+    "cli",
+    "explorer"
+  ],
+  "homepage": "https://github.com/NikiforovAll/claude-code-memory",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/NikiforovAll/claude-code-memory.git"
+  },
+  "bugs": {
+    "url": "https://github.com/NikiforovAll/claude-code-memory/issues"
+  },
+  "author": "NikiforovAll",
+  "license": "MIT",
+  "files": [
+    "server.js",
+    "public/",
+    "README.md",
+    "LICENSE"
+  ]
 }

package/public/app.js

@@ -57,7 +57,7 @@ function highlightSource(text, fileName) {
   return esc(text);
 }
 
-function linkifyImports(text, sourceId) {
+function linkifyImports(text, _sourceId) {
   if (!stackData.length) return { text, placeholders: [] };
   const byName = Object.fromEntries(stackData.map((c) => [c.name, c]));
   const placeholders = [];
@@ -183,14 +183,14 @@ function addRecentProject(p) {
   localStorage.setItem('recentProjects', JSON.stringify(recent.slice(0, 10)));
 }
 
-function removeRecentProject(p, e) {
+function _removeRecentProject(p, e) {
   e.stopPropagation();
   const recent = getRecentProjects().filter((r) => r !== p);
   localStorage.setItem('recentProjects', JSON.stringify(recent));
   renderRecentProjects();
 }
 
-function selectRecentProject(p) {
+function _selectRecentProject(p) {
   document.getElementById('projectPathInput').value = p;
 }
 
@@ -206,9 +206,9 @@ function renderRecentProjects() {
     recent
       .map(
         (p) =>
-          `<div class="recent-project-item" onclick="selectRecentProject('${escJs(p)}')">` +
+          `<div class="recent-project-item" onclick="_selectRecentProject('${escJs(p)}')">` +
           `<span>${esc(p)}</span>` +
-          `<button class="recent-project-remove" onclick="removeRecentProject('${escJs(p)}', event)" title="Remove">&#10005;</button>` +
+          `<button class="recent-project-remove" onclick="_removeRecentProject('${escJs(p)}', event)" title="Remove">&#10005;</button>` +
           `</div>`,
       )
       .join('');
@@ -243,13 +243,14 @@ function bindModalKeys(inputId, modalId, submitFn) {
 
 // #region RENDER_TREE
 
-const SCOPE_ORDER = ['policy', 'user', 'project', 'rule', 'memory'];
+const SCOPE_ORDER = ['policy', 'user', 'project', 'rule', 'memory', 'user-memory'];
 const SCOPE_LABELS = {
   policy: 'Managed Policy',
   user: 'User',
   project: 'Project',
   rule: 'Rules',
   memory: 'Auto Memory',
+  'user-memory': 'User Memory',
 };
 const LOAD_ICONS = {
   always: '\u25CF',
@@ -315,7 +316,7 @@ function renderTree() {
     const loadTitle = LOAD_TITLES[item.load] || item.load;
     const meta = `${item.lines}L`;
     const isConditional = item.load === 'conditional' || item.load === 'ondemand';
-    const pad = indent ? ' style="padding-left:' + (12 + indent * 16) + 'px"' : '';
+    const pad = indent ? ` style="padding-left:${12 + indent * 16}px"` : '';
     let h = `<div class="tree-item${sel}${indent ? ' tree-child' : ''}${isConditional ? ' tree-conditional' : ''}" data-id="${esc(item.id)}" title="${esc(item.path)}" onclick="selectFile('${escJs(item.id)}')"${pad}>`;
     h += `<span class="load-icon" title="${loadTitle}" style="color:var(--scope-${item.scope})">${loadIcon}</span>`;
     h += `<span class="file-name">${esc(item.name)}</span>`;
@@ -398,6 +399,41 @@ function navigateGroup(direction) {
 
 // #endregion RENDER_TREE
 
+// #region MEMORY_INDEX
+
+function parseMemoryIndex(content) {
+  const entries = [];
+  for (const line of content.split('\n')) {
+    const m = line.match(/^\s*-\s*\[([^\]]+)\]\(([^)]+\.md)\)\s*[—–-]\s*(.+)$/);
+    if (m) entries.push({ name: m[1], file: m[2], desc: m[3].trim() });
+  }
+  return entries;
+}
+
+function renderMemoryIndexTable(entries) {
+  const TYPE_COLORS = { feedback: 'rule', user: 'user', project: 'project', reference: 'local' };
+  const byName = Object.fromEntries(stackData.map((s) => [s.name, s]));
+  let html = '<div class="memory-index">';
+  for (const entry of entries) {
+    const child = byName[entry.file];
+    const typeMatch = entry.file.match(/^([a-z]+)_/);
+    const type = typeMatch ? typeMatch[1] : 'memory';
+    const scopeColor = TYPE_COLORS[type] || 'memory';
+    const nameHtml = child
+      ? `<a class="import-link" href="#" onclick="selectFile('${escJs(child.id)}');return false" title="${esc(child.path)}">${esc(entry.name)}</a>`
+      : `<span class="import-link unresolved" title="Not found: ${esc(entry.file)}">⚠ ${esc(entry.name)}</span>`;
+    html += `<div class="memory-index-row">`;
+    html += `<span class="scope-badge scope-${scopeColor} memory-index-type">${esc(type)}</span>`;
+    html += `<span class="memory-index-name">${nameHtml}</span>`;
+    html += `<span class="memory-index-desc">${esc(entry.desc)}</span>`;
+    html += `</div>`;
+  }
+  html += '</div>';
+  return html;
+}
+
+// #endregion MEMORY_INDEX
+
 // #region RENDER_PREVIEW
 
 async function renderPreview() {
@@ -461,7 +497,16 @@ async function renderPreview() {
     const { text: processed, placeholders } = linkifyImports(text, source.id);
     return restorePlaceholders(highlightSource(processed, source.name), placeholders);
   };
-  if (source.scope === 'memory' && source.load === 'startup' && source.maxLines) {
+
+  // Memory index view — render structured table for MEMORY.md index files
+  if ((source.scope === 'memory' || source.scope === 'user-memory') && source.name === 'MEMORY.md') {
+    const entries = parseMemoryIndex(content);
+    if (entries.length) {
+      html += renderMemoryIndexTable(entries);
+    }
+  }
+
+  if ((source.scope === 'memory' || source.scope === 'user-memory') && source.load === 'startup' && source.maxLines) {
     const lines = content.split('\n');
     const cutoff = source.maxLines;
     if (lines.length > cutoff) {
@@ -481,8 +526,8 @@ async function renderPreview() {
 }
 
 function formatBytes(b) {
-  if (b < 1024) return b + 'B';
-  return (b / 1024).toFixed(1) + 'KB';
+  if (b < 1024) return `${b}B`;
+  return `${(b / 1024).toFixed(1)}KB`;
 }
 
 async function openInEditor(filePath) {
@@ -564,7 +609,7 @@ async function loadData() {
       renderPreview();
     }
   } catch (err) {
-    showToast('Failed to load: ' + err.message, 'error');
+    showToast(`Failed to load: ${err.message}`, 'error');
   }
 }
 
@@ -660,7 +705,7 @@ document.addEventListener('keydown', (e) => {
   });
 })();
 
-function hubNavigate(app, url) {
+function _hubNavigate(app, url) {
   if (!window.__HUB__?.enabled) return;
   window.parent?.postMessage({ type: 'hub:navigate', app, url }, '*');
 }

package/public/style.css

@@ -24,6 +24,7 @@
   --scope-local: #8a9bb5;
   --scope-rule: #a89bc4;
   --scope-memory: #c4a06a;
+  --scope-user-memory: #9ab87a;
   --scope-policy: #b58a8a;
   --font-mono: 'IBM Plex Mono', monospace;
   --font-serif: 'Playfair Display', serif;
@@ -120,7 +121,7 @@ body {
   cursor: pointer;
   font-size: 11px;
   font-family: var(--font-mono);
-  max-width: 300px;
+  white-space: nowrap;
 }
 .topbar-project:hover {
   border-color: var(--accent);
@@ -400,6 +401,40 @@ body.light .tree-conditional .file-name {
   text-decoration: none;
   opacity: 0.6;
 }
+/* #region MEMORY_INDEX */
+.memory-index {
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--border);
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+.memory-index-row {
+  display: grid;
+  grid-template-columns: 72px 160px 1fr;
+  align-items: baseline;
+  gap: 8px;
+  padding: 3px 0;
+}
+.memory-index-type {
+  flex-shrink: 0;
+}
+.memory-index-name {
+  font-size: 11px;
+  font-family: var(--font-mono);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.memory-index-desc {
+  font-size: 10px;
+  color: var(--text-muted);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+/* #endregion MEMORY_INDEX */
+
 .cutoff-line {
   border-top: 2px dashed var(--error);
   margin: 8px 0;
@@ -449,6 +484,10 @@ body.light .tree-conditional .file-name {
   background: rgba(196, 149, 106, 0.18);
   color: var(--scope-memory);
 }
+.scope-user-memory {
+  background: rgba(154, 184, 122, 0.18);
+  color: var(--scope-user-memory);
+}
 .scope-policy {
   background: rgba(181, 138, 138, 0.18);
   color: var(--scope-policy);

package/server.js

@@ -332,6 +332,38 @@ function discoverMemorySources(projectPath) {
     }
   }
 
+  // 7. User-level memory (~/.claude/memory/)
+  const userMemoryDir = path.join(os.homedir(), '.claude', 'memory');
+  if (fs.existsSync(userMemoryDir)) {
+    const userMemoryMd = path.join(userMemoryDir, 'MEMORY.md');
+    const userMemInfo = fileInfo(userMemoryMd);
+    if (userMemInfo) {
+      sources.push({
+        id: 'user-memory-index',
+        name: 'MEMORY.md',
+        scope: 'user-memory',
+        load: 'startup',
+        ...userMemInfo,
+        maxLines: 200,
+        maxBytes: 25 * 1024,
+        ...spreadImports(userMemInfo.path, userMemInfo.content),
+      });
+    }
+    for (const file of findMdFiles(userMemoryDir)) {
+      if (path.basename(file) === 'MEMORY.md') continue;
+      const info = fileInfo(file);
+      if (!info) continue;
+      sources.push({
+        id: `user-memory-${path.basename(file, '.md')}`,
+        name: path.basename(file),
+        scope: 'user-memory',
+        load: 'ondemand',
+        ...info,
+        ...spreadImports(info.path, info.content),
+      });
+    }
+  }
+
   // Resolve imports recursively — add imported files as sources if not already present
   const seen = new Set(sources.map(s => s.path));
   const sourceByPath = Object.fromEntries(sources.map(s => [s.path, s]));

package/.claude/commands/release.md

@@ -1,54 +0,0 @@
----
-description: Bump version, tag, push, and create a GitHub release with auto-generated notes
-argument-hint: "[version e.g. 1.13.0 or rc4]"
----
-
-# Release
-
-Create a new release for this project.
-
-## Inputs
-
-- `$ARGUMENTS` — target version or shorthand. Examples:
-  - `1.13.0` — full version
-  - `rc4` — shorthand for next RC (e.g. if current is `1.19.0-rc.3`, becomes `1.19.0-rc.4`)
-  - If not provided, ask the user.
-
-## Steps
-
-1. **Determine version**: Use `$ARGUMENTS` or ask user. Handle `rc<N>` shorthand by reading current version from `package.json` and replacing/appending the RC suffix. Validate it's different from the current version.
-
-2. **Detect prerelease**: If version contains `-rc.`, `-alpha.`, `-beta.`, treat as prerelease.
-
-3. **Check working tree**: Run `git status`. If there are uncommitted changes, warn the user and stop.
-
-4. **Bump version**:
-   ```
-   npm version <version> --no-git-tag-version
-   ```
-
-5. **Commit & push** (push to current branch, not hardcoded `main`):
-   ```
-   git add package.json package-lock.json
-   git commit -m "🔖 chore: Bump version to <version>"
-   git push origin HEAD
-   ```
-
-6. **Tag & push tag**:
-   ```
-   git tag v<version>
-   git push origin v<version>
-   ```
-
-7. **Generate release notes**: Collect commits since the previous tag using `git log --oneline <prev-tag>..HEAD`. Write a **user-facing summary** grouped by:
-   - Features (✨) — describe what was added, not raw commit messages
-   - Fixes (🐛)
-   - Other notable changes
-   Include a "Full Changelog" compare link at the bottom.
-
-8. **Create GitHub release** (add `--prerelease` flag for RC/alpha/beta):
-   ```
-   gh release create v<version> --title "v<version>" --notes "<notes>" [--prerelease]
-   ```
-
-9. **Report**: Show the release URL to the user.

package/.github/workflows/pages.yml

@@ -1,36 +0,0 @@
-name: Deploy static site to Pages
-
-on:
-  push:
-    branches: ["main", "master"]
-    paths:
-      - "docs/**"
-  workflow_dispatch:
-
-permissions:
-  contents: read
-  pages: write
-  id-token: write
-
-concurrency:
-  group: "pages"
-  cancel-in-progress: false
-
-jobs:
-  deploy:
-    environment:
-      name: github-pages
-      url: ${{ steps.deployment.outputs.page_url }}
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-      - name: Setup Pages
-        uses: actions/configure-pages@v5
-      - name: Upload artifact
-        uses: actions/upload-pages-artifact@v3
-        with:
-          path: "docs"
-      - name: Deploy to GitHub Pages
-        id: deployment
-        uses: actions/deploy-pages@v4

package/CLAUDE.md

@@ -1,49 +0,0 @@
-# CLAUDE.md
-
-This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
-
-## What This Is
-
-Dashboard for visualizing all memory sources that influence Claude Code behavior. Shows the full memory stack: CLAUDE.md files (user/project/local), rules (`.claude/rules/*.md` with optional path-scoped frontmatter), auto memory (`~/.claude/projects/<encoded>/memory/`), and `@import` chains.
-
-## Commands
-
-- `npm start` — run server (port 3459)
-- `npm run dev` — run with auto-open browser
-- `npx @biomejs/biome check public/app.js public/style.css` — lint
-- `npx @biomejs/biome format --write public/app.js public/style.css` — format
-
-## Architecture
-
-Single-file Express backend + vanilla JS frontend. No build step, no framework.
-
-- **`server.js`** — Express server with two main responsibilities:
-  1. **Filesystem scanning** (`discoverMemorySources`) — walks `~/.claude/`, ancestor directories, project `.claude/rules/`, and auto memory dirs to build the full memory source stack
-  2. **API endpoints** — `/api/stack`, `/api/summary`, `/api/file`, `/api/rules/match`, `/api/imports` etc.
-- **`public/app.js`** — SPA with tree panel (left) + preview panel (right) split layout. Fetches from API, renders tree grouped by scope, shows syntax-highlighted preview with frontmatter badges and clickable `@import` links.
-- **`public/style.css`** — CSS variables on `:root` (dark default), `body.light` overrides. Scope colors: user=blue, project=green, local=yellow, rule=purple, memory=orange, policy=red.
-
-Both JS files use `// #region` / `// #endregion` markers for code organization.
-
-## Key Server Concepts
-
-- **Project path encoding**: Claude Code stores auto memory in `~/.claude/projects/<encoded-path>/memory/`. The encoding replaces `/` with `-` and strips `:` from drive letters. `findMemoryDir()` tries exact match first, falls back to substring matching.
-- **Import resolution**: `@path/to/file.md` references are parsed from content. `resolveExistingImports()` resolves paths and filters out non-existent files. Imported files are recursively added to the stack (max 5 levels).
-- **Frontmatter parsing**: YAML frontmatter in rules files (`paths`, `type`, `name`, `description`) determines conditional loading. `parseFrontmatter()` handles both inline values and YAML array syntax.
-- **Rules matching**: `micromatch` glob matching against rule `paths` frontmatter via `/api/rules/match?file=`.
-- **Cache**: 30-second TTL on `discoverMemorySources` results, cleared on project switch or manual refresh.
-
-## Conventions
-
-- Dark theme default, light theme via `body.light` class
-- Accent color: `#e86f33`
-- Fonts: IBM Plex Mono (data/code), Playfair Display (headings)
-- Keyboard-driven: j/k navigation, t=theme, r=refresh, e=open in editor, ?=help
-- Port 3459 (cost=3458, marketplace=3460)
-- `zoom: 1.25` on body for proportional scaling
-- No token/context budget estimation — only line/byte counts (deliberate decision)
-
-## Prior Art
-
-- `../claude-code-cost` — same stack, data visualization patterns
-- `../claude-code-marketplace` — file tree, markdown preview, project picker, Highlight.js usage

package/biome.json

@@ -1,33 +0,0 @@
-{
-  "$schema": "https://biomejs.dev/schemas/2.4.10/schema.json",
-  "formatter": {
-    "enabled": true,
-    "indentStyle": "space",
-    "indentWidth": 2,
-    "lineWidth": 120
-  },
-  "linter": {
-    "enabled": true,
-    "rules": {
-      "style": {
-        "noDescendingSpecificity": "off"
-      },
-      "suspicious": {
-        "useIterableCallbackReturn": "off"
-      }
-    }
-  },
-  "javascript": {
-    "formatter": {
-      "quoteStyle": "single"
-    }
-  },
-  "css": {
-    "formatter": {
-      "quoteStyle": "single"
-    }
-  },
-  "files": {
-    "includes": ["public/app.js", "public/style.css"]
-  }
-}