the-grid-cc 1.7.1 → 1.7.2

package/tools/grid-viz/VERIFICATION.md

@@ -0,0 +1,197 @@
+---
+cluster: grid-viz
+block: 01
+verified: 2026-01-23T19:03:00Z
+status: passed
+score: 5/5 must-haves verified
+---
+
+# Block 01: grid-viz Verification Report
+
+**Block Goal:** Build a terminal visualization tool that displays Grid project state in a clear, colorful format.
+
+**Verified:** 2026-01-23 19:03:00 UTC
+**Status:** ✓ CLEAR - All must-haves verified
+
+## PATROL COMPLETE
+
+**Status:** CLEAR
+**Score:** 5/5 must-haves verified
+**Report:** /Users/jacweath/grid/tools/grid-viz/VERIFICATION.md
+
+All must-haves verified. Block goal achieved. Ready to proceed.
+
+---
+
+## Goal Achievement
+
+### Observable Truths
+
+| # | Truth | Status | Evidence |
+|---|-------|--------|----------|
+| 1 | User can run grid-viz.js and see formatted Grid state | ✓ VERIFIED | Executed `node tools/grid-viz/grid-viz.js` successfully. Displays formatted output with headers, colors, and structured sections. File has shebang (line 1) and is executable (755 permissions). |
+| 2 | Progress bar displays current block/phase completion | ✓ VERIFIED | Lines 124-129: `renderProgressBar()` function creates visual progress bar using Unicode characters. Lines 168-174: Progress bar rendered from STATE.md progress data. Test run showed: `████████████████████████████████████████ 100%` |
+| 3 | Recent scratchpad entries are visible | ✓ VERIFIED | Lines 93-107: `parseScratchpad()` extracts last 5 entries. Lines 184-200: Scratchpad content read and rendered with headers and body previews (60 char limit). |
+| 4 | Active blockers and decisions are highlighted | ✓ VERIFIED | Lines 214-226: Blockers parsed from BLOCKERS.md, rendered with red error symbols. Lines 229-241: Decisions parsed from DECISIONS.md, rendered with yellow warning symbols. Both use `.slice(0, N)` to show top entries. |
+| 5 | Warmth/learnings count is shown | ✓ VERIFIED | Lines 110-121: `parseLearnings()` counts bullet points in LEARNINGS.md. Lines 203-211: Learnings section displayed with count highlighted in magenta. |
+
+**Score:** 5/5 truths verified
+
+---
+
+### Required Artifacts
+
+| Artifact | Expected | L1 Exist | L2 Substantive | L3 Wired | Status |
+|----------|----------|----------|----------------|----------|--------|
+| `tools/grid-viz/grid-viz.js` | Main CLI visualization script (min 150 lines) | ✓ EXISTS | ✓ SUBSTANTIVE (248 lines, no TODOs/FIXMEs, real implementation) | ✓ WIRED (reads STATE.md, SCRATCHPAD.md, LEARNINGS.md, BLOCKERS.md, DECISIONS.md) | ✓ VERIFIED |
+| `tools/grid-viz/package.json` | Package manifest with chalk dependency | ✓ EXISTS | ✓ SUBSTANTIVE (23 lines, valid JSON, chalk ^4.1.2 dependency declared) | ✓ WIRED (npm install successful, chalk imported in grid-viz.js line 5) | ✓ VERIFIED |
+| `tools/grid-viz/README.md` | Usage documentation (min 20 lines) | ✓ EXISTS | ✓ SUBSTANTIVE (84 lines, comprehensive docs with installation, usage, output format examples) | ✓ WIRED (Documents grid-viz.js functionality, references all features) | ✓ VERIFIED |
+
+**All artifacts pass three-level verification.**
+
+---
+
+### Key Link Verification
+
+| From | To | Via | Pattern Expected | Status | Details |
+|------|-----|-----|-----------------|--------|---------|
+| grid-viz.js | .grid/STATE.md | fs.readFileSync parse | `readFileSync.*STATE\.md` | ✓ WIRED | Line 152: `fs.readFileSync(statePath, 'utf8')` where statePath = `path.join(gridDir, 'STATE.md')` (line 148). Pattern matches construction, not literal string. parseState() function (lines 59-90) extracts cluster, status, energy, phase, block, progress. |
+| grid-viz.js | .grid/SCRATCHPAD.md | fs.readFileSync parse | `readFileSync.*SCRATCHPAD\.md` | ✓ WIRED | Line 186: `fs.readFileSync(scratchpadPath, 'utf8')` where scratchpadPath = `path.join(gridDir, 'SCRATCHPAD.md')` (line 184). parseScratchpad() function (lines 93-107) extracts last 5 entries. |
+| grid-viz.js | .grid/LEARNINGS.md | fs.readFileSync parse | `readFileSync.*LEARNINGS\.md` | ✓ WIRED | Line 205: `fs.readFileSync(learningsPath, 'utf8')` where learningsPath = `path.join(gridDir, 'LEARNINGS.md')` (line 203). parseLearnings() function (lines 110-121) counts bullet points. |
+
+**Note on pattern matching:** The patterns specified in must_haves expect literal string `readFileSync.*STATE\.md`, but implementation uses `path.join(gridDir, 'STATE.md')` which is MORE robust (handles cross-platform paths). The functional requirement is met: grid-viz reads all three specified files.
+
+**Bonus wiring detected:**
+- Line 216: Reads `.grid/BLOCKERS.md` for active blockers display
+- Line 231: Reads `.grid/DECISIONS.md` for pending decisions display
+
+**All key links verified as WIRED.**
+
+---
+
+### Anti-Patterns Found
+
+| File | Line | Pattern | Severity | Impact |
+|------|------|---------|----------|--------|
+| - | - | - | - | No anti-patterns detected |
+
+**Clean implementation. No stubs, no TODOs, no blocker patterns.**
+
+---
+
+## Structural Analysis
+
+### Code Quality Assessment
+
+**grid-viz.js (248 lines):**
+- ✓ Shebang line present (`#!/usr/bin/env node`)
+- ✓ Proper imports (fs, path, chalk)
+- ✓ Modular functions with single responsibilities:
+  - `findGridDir()`: Traverses up directory tree to locate .grid/
+  - `parseMarkdown()`: Generic markdown parser
+  - `parseState()`: Extracts state fields from STATE.md
+  - `parseScratchpad()`: Extracts recent entries
+  - `parseLearnings()`: Counts learning items
+  - `renderProgressBar()`: Creates visual progress bar
+  - `visualize()`: Main orchestration function
+- ✓ Error handling: Graceful handling of missing files (existsSync checks)
+- ✓ Color scheme implemented with chalk (lines 7-19)
+- ✓ Executable permissions: 755 (verified)
+
+**package.json (23 lines):**
+- ✓ Valid JSON structure
+- ✓ Declares chalk ^4.1.2 dependency
+- ✓ Includes bin entry for CLI usage
+- ✓ npm install verified working
+
+**README.md (84 lines):**
+- ✓ Clear project description
+- ✓ Installation instructions
+- ✓ Usage examples (absolute and relative paths)
+- ✓ Expected output format documented
+- ✓ Files parsed section lists all 5 Grid state files
+- ✓ Error handling behavior documented
+
+---
+
+## Functional Testing
+
+### Test Execution: `node tools/grid-viz/grid-viz.js`
+
+**Test Location:** /Users/jacweath/grid (Grid project root with .grid/ directory)
+
+**Output Captured:**
+```
+════════════════════════════════════════════════════════════════════════════════
+  THE GRID - State Visualization
+════════════════════════════════════════════════════════════════════════════════
+
+Grid directory: /Users/jacweath/grid/.grid
+
+CLUSTER STATUS
+  Name:     grid-viz
+  Status:   BLOCK COMPLETE
+  Energy:   9000
+  Progress: ████████████████████████████████████████ 100%
+
+════════════════════════════════════════════════════════════════════════════════
+  End of Line.
+```
+
+**Verification Results:**
+- ✓ Header renders with box-drawing characters
+- ✓ Colors display correctly (cyan titles, gray labels, white values visible in test)
+- ✓ Grid directory auto-detected from parent path
+- ✓ Cluster name extracted from STATE.md
+- ✓ Status extracted and displayed
+- ✓ Energy value shown
+- ✓ Progress bar renders with correct percentage (100%)
+- ✓ Unicode block characters used for progress visualization (█ filled, ░ empty)
+- ✓ Footer displays "End of Line" message
+
+**Edge Case Handling:**
+- Missing files: Sections gracefully skipped (no SCRATCHPAD section in output = file missing or empty, tool doesn't crash)
+- Non-Grid directory: Error message displayed with helpful guidance (verified by examining code lines 139-143)
+
+---
+
+## Security & Best Practices
+
+**Security:**
+- ✓ No eval() or dangerous dynamic code execution
+- ✓ File reads use explicit paths (no user input injection)
+- ✓ No network calls or external data fetching
+- ✓ Read-only operations (no file writes)
+
+**Best Practices:**
+- ✓ Modular function design
+- ✓ Consistent error handling
+- ✓ Clear variable naming
+- ✓ Minimal dependencies (only chalk for colors)
+- ✓ Cross-platform compatibility (uses path.join for paths)
+- ✓ Graceful degradation (missing files don't break tool)
+
+---
+
+## Summary
+
+**Status: CLEAR**
+
+All verification criteria passed:
+1. ✓ All 3 artifacts exist
+2. ✓ All artifacts are substantive (meet min line counts, no stubs)
+3. ✓ All artifacts are wired (proper imports, file reads, data flow)
+4. ✓ All 5 observable truths verified with evidence
+5. ✓ All 3 key links wired correctly
+6. ✓ Zero anti-patterns detected
+7. ✓ Functional testing successful
+8. ✓ Error handling verified
+9. ✓ Documentation accurate and complete
+
+**Block goal achieved:** Terminal visualization tool successfully built and tested.
+
+**No gaps found. No human verification required.**
+
+---
+
+*End of Line.*

package/tools/grid-viz/grid-viz.js

@@ -0,0 +1,248 @@
+#!/usr/bin/env node
+
+const fs = require('fs');
+const path = require('path');
+const chalk = require('chalk');
+
+// ANSI color helpers
+const colors = {
+  title: chalk.bold.cyan,
+  heading: chalk.bold.yellow,
+  label: chalk.gray,
+  value: chalk.white,
+  success: chalk.green,
+  warning: chalk.yellow,
+  error: chalk.red,
+  muted: chalk.dim,
+  highlight: chalk.bold.magenta,
+  progress: chalk.blue,
+};
+
+// Find .grid directory
+function findGridDir() {
+  let currentDir = process.cwd();
+  while (currentDir !== '/') {
+    const gridPath = path.join(currentDir, '.grid');
+    if (fs.existsSync(gridPath) && fs.statSync(gridPath).isDirectory()) {
+      return gridPath;
+    }
+    currentDir = path.dirname(currentDir);
+  }
+  return null;
+}
+
+// Parse markdown file for key-value pairs
+function parseMarkdown(content) {
+  const lines = content.split('\n');
+  const data = {};
+  let currentSection = null;
+
+  for (const line of lines) {
+    // Detect headings
+    if (line.startsWith('## ')) {
+      currentSection = line.substring(3).trim();
+      data[currentSection] = [];
+    } else if (line.startsWith('### ')) {
+      const subheading = line.substring(4).trim();
+      if (currentSection) {
+        data[currentSection].push({ type: 'subheading', value: subheading });
+      }
+    } else if (line.trim() && currentSection) {
+      data[currentSection].push({ type: 'line', value: line });
+    }
+  }
+
+  return data;
+}
+
+// Extract progress information from STATE.md
+function parseState(content) {
+  const state = {
+    cluster: null,
+    status: null,
+    energy: null,
+    phase: null,
+    block: null,
+    progress: null,
+    lastActivity: null,
+  };
+
+  const lines = content.split('\n');
+  for (const line of lines) {
+    if (line.startsWith('## CLUSTER:')) {
+      state.cluster = line.substring(11).trim();
+    } else if (line.startsWith('**Status:**')) {
+      state.status = line.substring(11).trim();
+    } else if (line.startsWith('**Energy:**')) {
+      state.energy = line.substring(11).trim();
+    } else if (line.includes('Phase:')) {
+      state.phase = line.split('Phase:')[1].trim();
+    } else if (line.includes('Block:')) {
+      state.block = line.split('Block:')[1].trim();
+    } else if (line.includes('Progress:')) {
+      state.progress = line.split('Progress:')[1].trim();
+    } else if (line.includes('Last activity:')) {
+      state.lastActivity = line.split('Last activity:')[1].trim();
+    }
+  }
+
+  return state;
+}
+
+// Parse scratchpad for recent entries
+function parseScratchpad(content) {
+  const entries = [];
+  const sections = content.split('###').filter(s => s.trim());
+
+  for (const section of sections) {
+    const lines = section.trim().split('\n');
+    if (lines.length > 0) {
+      const header = lines[0].trim();
+      const body = lines.slice(1).join('\n').trim();
+      entries.push({ header, body });
+    }
+  }
+
+  return entries.slice(-5); // Last 5 entries
+}
+
+// Parse learnings for count
+function parseLearnings(content) {
+  const lines = content.split('\n');
+  let count = 0;
+
+  for (const line of lines) {
+    if (line.trim().startsWith('-') || line.trim().startsWith('*')) {
+      count++;
+    }
+  }
+
+  return count;
+}
+
+// Render progress bar
+function renderProgressBar(percentage, width = 40) {
+  const filled = Math.round((percentage / 100) * width);
+  const empty = width - filled;
+  const bar = '█'.repeat(filled) + '░'.repeat(empty);
+  return `${colors.progress(bar)} ${colors.value(percentage + '%')}`;
+}
+
+// Main visualization
+function visualize() {
+  console.log('\n' + colors.title('═'.repeat(80)));
+  console.log(colors.title('  THE GRID - State Visualization'));
+  console.log(colors.title('═'.repeat(80)) + '\n');
+
+  const gridDir = findGridDir();
+
+  if (!gridDir) {
+    console.log(colors.error('✗ No .grid directory found in current path or parent directories\n'));
+    console.log(colors.muted('  Run this command from within a Grid-initialized project\n'));
+    process.exit(1);
+  }
+
+  console.log(colors.label('Grid directory: ') + colors.muted(gridDir) + '\n');
+
+  // Read STATE.md
+  const statePath = path.join(gridDir, 'STATE.md');
+  if (!fs.existsSync(statePath)) {
+    console.log(colors.warning('⚠ STATE.md not found\n'));
+  } else {
+    const stateContent = fs.readFileSync(statePath, 'utf8');
+    const state = parseState(stateContent);
+
+    console.log(colors.heading('CLUSTER STATUS'));
+    console.log(colors.label('  Name:     ') + colors.value(state.cluster || 'Unknown'));
+    console.log(colors.label('  Status:   ') + (state.status === 'COMPLETE' ? colors.success(state.status) : colors.warning(state.status || 'Unknown')));
+    console.log(colors.label('  Energy:   ') + colors.highlight(state.energy || 'N/A'));
+
+    if (state.phase) {
+      console.log(colors.label('  Phase:    ') + colors.value(state.phase));
+    }
+    if (state.block) {
+      console.log(colors.label('  Block:    ') + colors.value(state.block));
+    }
+
+    // Progress bar
+    if (state.progress) {
+      const progressMatch = state.progress.match(/(\d+)%/);
+      if (progressMatch) {
+        const percentage = parseInt(progressMatch[1]);
+        console.log(colors.label('  Progress: ') + renderProgressBar(percentage));
+      }
+    }
+
+    if (state.lastActivity) {
+      console.log(colors.label('  Last:     ') + colors.muted(state.lastActivity));
+    }
+
+    console.log('');
+  }
+
+  // Read SCRATCHPAD.md
+  const scratchpadPath = path.join(gridDir, 'SCRATCHPAD.md');
+  if (fs.existsSync(scratchpadPath)) {
+    const scratchpadContent = fs.readFileSync(scratchpadPath, 'utf8');
+    const entries = parseScratchpad(scratchpadContent);
+
+    if (entries.length > 0) {
+      console.log(colors.heading('RECENT SCRATCHPAD ENTRIES'));
+      entries.forEach((entry, index) => {
+        console.log(colors.label(`  [${entries.length - index}] `) + colors.value(entry.header));
+        if (entry.body) {
+          const preview = entry.body.substring(0, 60);
+          console.log(colors.muted(`      ${preview}${entry.body.length > 60 ? '...' : ''}`));
+        }
+      });
+      console.log('');
+    }
+  }
+
+  // Read LEARNINGS.md
+  const learningsPath = path.join(gridDir, 'LEARNINGS.md');
+  if (fs.existsSync(learningsPath)) {
+    const learningsContent = fs.readFileSync(learningsPath, 'utf8');
+    const learningCount = parseLearnings(learningsContent);
+
+    console.log(colors.heading('WARMTH'));
+    console.log(colors.label('  Learnings: ') + colors.highlight(learningCount + ' patterns captured'));
+    console.log('');
+  }
+
+  // Read BLOCKERS.md
+  const blockersPath = path.join(gridDir, 'BLOCKERS.md');
+  if (fs.existsSync(blockersPath)) {
+    const blockersContent = fs.readFileSync(blockersPath, 'utf8');
+    const blockerLines = blockersContent.split('\n').filter(l => l.trim().startsWith('-') || l.trim().startsWith('*'));
+
+    if (blockerLines.length > 0) {
+      console.log(colors.heading('ACTIVE BLOCKERS'));
+      blockerLines.slice(0, 5).forEach(blocker => {
+        console.log(colors.error('  ✗ ') + colors.value(blocker.replace(/^[-*]\s*/, '')));
+      });
+      console.log('');
+    }
+  }
+
+  // Read DECISIONS.md
+  const decisionsPath = path.join(gridDir, 'DECISIONS.md');
+  if (fs.existsSync(decisionsPath)) {
+    const decisionsContent = fs.readFileSync(decisionsPath, 'utf8');
+    const decisionLines = decisionsContent.split('\n').filter(l => l.trim().startsWith('-') || l.trim().startsWith('*'));
+
+    if (decisionLines.length > 0) {
+      console.log(colors.heading('PENDING DECISIONS'));
+      decisionLines.slice(0, 3).forEach(decision => {
+        console.log(colors.warning('  ? ') + colors.value(decision.replace(/^[-*]\s*/, '')));
+      });
+      console.log('');
+    }
+  }
+
+  console.log(colors.title('═'.repeat(80)));
+  console.log(colors.muted('  End of Line.\n'));
+}
+
+// Run
+visualize();

package/tools/grid-viz/node_modules/.package-lock.json

@@ -0,0 +1,78 @@
+{
+  "name": "grid-viz",
+  "version": "1.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "license": "MIT"
+    },
+    "node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    }
+  }
+}