kami/Maven
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Hide the relation filters in the capability views and render inline code (V-725)

Browse Source 
Two defects found by screenshotting the built page under headless chromium,
which is the only way to see either.

The six relation filters and the component-type legend do nothing in views 6 and
7. Leaving them on screen reads as controls that are broken.

The ledger carries markdown inline code, because docs/spec.md does. The side
panel printed the backticks literally beside every path.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
claude
2026-08-26 13:21:21 +04:00
parent be062b2d48
commit 2f338a1ab6
1 changed files with 14 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/architecture/viewer.template.html
+14 -3
View File
@@ -190,6 +190,7 @@ ol.steps .ev{display:block;color:var(--dim2);font-size:11.5px;margin-top:3px}
<h2>Search</h2>
<input class="searchbox" id="q" placeholder="component, file or symbol">
<div class="results" id="results"></div>
<div id="archctl">
<h2>Filters</h2>
<label class="toggle"><input type="checkbox" id="tLow" checked> show low-confidence relations</label>
<label class="toggle"><input type="checkbox" id="tMed" checked> show medium-confidence relations</label>
@@ -199,6 +200,7 @@ ol.steps .ev{display:block;color:var(--dim2);font-size:11.5px;margin-top:3px}
<label class="toggle"><input type="checkbox" id="tWires" checked> draw relation wires</label>
<h2>Type</h2>
<div class="legend" id="legend"></div>
</div>
</nav>
<main id="main"></main>
@@ -379,6 +381,11 @@ const capById = Object.fromEntries(CAPS.capabilities.map(c => [c.id, c]));
const BLOCKREASON = new Set(['configuration missing','deployment missing',
'external dependency unavailable','scenario missing']);
const dotCls = v => v==='spec-only' ? 'speconly' : v;
// The ledger carries markdown inline code, because docs/spec.md does. Rendering
// it literally puts backticks on screen next to every path.
const md = t => (t||'').replace(/[&<>]/g, m => ({'&':'&amp;','<':'&lt;','>':'&gt;'}[m]))
.replace(/`([^`]+)`/g, '<code>$1</code>')
.replace(/\*\*([^*]+)\*\*/g, '<b>$1</b>');
function capRow(c){
const cls = {'capability missing':'missing','capability exists but unreachable':'unreachable',
@@ -436,7 +443,7 @@ function renderCapSide(id){
<h3>${c.title}</h3>
<div class="sub">${c.section} · ${c.domain.join(', ')} · ${c.scope}${
c.implementation.gap_class==='none'?'':' · '+c.implementation.gap_class}</div>
<p>${c.state}</p>
<p>${md(c.state)}</p>
<section><h4>Implementation</h4>
<div class="bars">${DIMS.map(d=>{
const v = c.implementation[d];
@@ -449,8 +456,8 @@ function renderCapSide(id){
<section><h4>Definition of done — ${c.criteria.length}</h4>
${c.criteria.map(cr=>`<div class="crit">
<span class="vd ${cr.verified}">${cr.verified}</span><span class="rs">${cr.reason}</span>
<p>${cr.text}</p>
${cr.detail?`<p style="color:var(--dim2)">${cr.detail}</p>`:''}
<p>${md(cr.text)}</p>
${cr.detail?`<p style="color:var(--dim2)">${md(cr.detail)}</p>`:''}
${(cr.evidence||[]).length?`<p class="mono" style="font-size:11px;color:var(--dim2)">${cr.evidence.join('<br>')}</p>`:''}
</div>`).join('')}</section>
<section><h4>Blockers — ${blockers.length}</h4>
@@ -659,6 +666,10 @@ document.getElementById('views').innerHTML = VIEWS.map(v=>`<button class="viewbt
document.getElementById('legend').innerHTML = [...new Set(ARCH.components.map(c=>c.type))].sort().map(t=>`<span>${t}</span>`).join('');
function setView(id){ S.view=id; S.sel=null; S.selCap=null;
// The relation filters and the component-type legend do nothing in the
// capability views. Leaving them visible reads as controls that are broken.
const vw = VIEWS.find(x=>x.id===id);
document.getElementById('archctl').style.display = (vw.caps || vw.inv) ? 'none' : '';
document.querySelectorAll('.viewbtn').forEach(b=>b.classList.toggle('on', b.dataset.v===id));
renderView();
const v = VIEWS.find(x=>x.id===id);