v0.3: App Store tab (VDR packages, live review)

ag.js

@@ -128,7 +128,11 @@ window.VK_AG = ({el, t, toast}) => ({
       finally { lock(false); refresh(); } };
     msg.addEventListener('keydown', e => { if (e.key === 'Enter' && !e.isComposing) send(); });
     const btn = (k, f, cls) => el('button', {class:'btn ' + (cls || ''), onclick:f}, t(k));
-    b.append(el('div', {class:'aggrid'},
+    const agentPane = el('div', {class:'agpane'}); const storePane = el('div', {class:'agpane', style:'display:none'});
+    const tabs = el('div', {class:'agtabs'}, el('button', {class:'agtab on', 'data-tab':'agent'}, t('agTabAgent')), el('button', {class:'agtab', 'data-tab':'store'}, t('agTabStore')));
+    tabs.onclick = e => { const k = e.target.dataset.tab; if (!k) return; tabs.querySelectorAll('.agtab').forEach(x => x.classList.toggle('on', x.dataset.tab === k)); agentPane.style.display = k === 'agent' ? '' : 'none'; storePane.style.display = k === 'store' ? '' : 'none'; if (k === 'store') window.VK_STORE(storePane, {el, t, toast, call:(p, bd) => call(p, bd, true), live:() => LIVE}); };
+    b.append(tabs, agentPane, storePane);
+    agentPane.append(el('div', {class:'aggrid'},
       el('div', {class:'agcol'},
         el('div', {class:'row', style:'margin-bottom:6px;flex-wrap:wrap;gap:6px'}, el('b', {}, t('agChat')), mode, el('span', {class:'tag none', id:'agModel'}, 'Meta Muse Spark 1.3'), sel),
         el('div', {class:'row', style:'flex-wrap:wrap;gap:6px;margin-bottom:6px'}, ['a_normal', 'b_injection', 'c_persuasion', 'd_kill', 'e_tamper'].map((s, i) => btn('ag' + 'ABCDE'[i], () => scen(s)))),
@@ -158,13 +162,14 @@ window.VK_AG = ({el, t, toast}) => ({
 });
 
 const css = document.createElement('style');
-css.textContent = `.aggrid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:12px;height:calc(100% - 22px)}
+css.textContent = `.aggrid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:12px;height:calc(100% - 26px)}
 .agcol .btn{white-space:nowrap;flex:0 0 auto}.agcol .row{flex-wrap:wrap}
 .agcol{display:flex;flex-direction:column;min-width:0;min-height:0}
 .agchat{flex:1;min-height:120px;overflow:auto;border:1px solid var(--border);border-radius:10px;padding:8px;background:var(--bg)}
 .agstream{flex:1;min-height:120px;overflow:auto}.agaudit{max-height:150px;overflow:auto}
 .agm{margin:5px 0;padding:7px 9px;border-radius:9px;white-space:pre-wrap;word-break:break-word;font-size:13px}
 .agm.u{background:#EEF2FF}.agm.a{background:var(--card);border:1px solid var(--border)}.agm.s{color:var(--muted);font-size:12px;padding:2px 9px}
+.agtabs{display:flex;gap:4px;margin:-4px 0 8px;border-bottom:1px solid var(--border)}.agtab{border:0;background:none;padding:6px 14px;font-weight:700;cursor:pointer;border-bottom:3px solid transparent;color:var(--muted)}.agtab.on{color:var(--indigo);border-bottom-color:var(--indigo)}.agpane{height:calc(100% - 40px)}
 .agstats{padding:6px 8px;border:1px dashed var(--border);border-radius:9px;margin-bottom:6px}.agv{margin:5px 0;padding:8px 10px}.aginput{flex:1;min-width:0;height:34px;padding:0 10px;border:1px solid var(--border);border-radius:9px;background:var(--card)}
 @media (max-width:700px){.aggrid{grid-template-columns:1fr;height:auto}}`;
 document.head.append(css);

index.html

@@ -78,6 +78,7 @@
 
 <script src="i18n.js"></script>
 <script src="demo_data.js"></script>
+<script src="store.js"></script>
 <script src="ag.js"></script>
 <script src="app.js"></script>
 </body>

server.py

@@ -9,9 +9,9 @@ HF_AUTH = os.environ.get("BACKEND_HF_TOKEN", "")
 BK_TOKEN = os.environ.get("BACKEND_TOKEN", "")
 RATE = int(os.environ.get("RATE_PER_10MIN", "20"))
 TIMEOUT = float(os.environ.get("BACKEND_TIMEOUT", "300"))
-GET_OK = {"health", "status", "audit"}
-POST_OK = {"chat", "scenario", "kill", "resume", "tamper", "reset"}
-STATIC = {"index.html", "app.js", "ag.js", "i18n.js", "demo_data.js", "styles.css", "ag_replay.json"}
+GET_OK = {"health", "status", "audit", "store/catalog"}
+POST_OK = {"chat", "scenario", "kill", "resume", "tamper", "reset", "store/submit"}
+STATIC = {"index.html", "app.js", "ag.js", "store.js", "samples/weather-plus.vdr", "samples/weather-plus-tampered.vdr", "i18n.js", "demo_data.js", "styles.css", "ag_replay.json"}
 HITS = {}
 
 
@@ -75,7 +75,7 @@ class H(SimpleHTTPRequestHandler):
         if limited(ip):
             return self._json(429, {"error": "rate limit"})
         n = int(self.headers.get("Content-Length", 0) or 0)
-        if n > 4096:
+        if n > (700000 if name == "store/submit" else 4096):
             return self._json(413, {"error": "too large"})
         try:
             req = json.loads(self.rfile.read(n) or b"{}")

store.js

@@ -0,0 +1,127 @@
+/* ViKernel App Store tab (inside Agent Guard): Developer Guide, Submit for Review (live checks), Catalog.
+   Packages use the VDR package format (.vdr). Built during the hackathon. */
+(() => {
+'use strict';
+const S = {
+  en: {
+    agTabAgent: 'Agent', agTabStore: 'App Store',
+    stGuide: 'Developer Guide', stSubmit: 'Submit for Review', stCatalog: 'Catalog',
+    stIntro: 'Agent apps ship as VDR packages (.vdr). ViKernel reviews every package live and countersigns the ones it lists. Only countersigned packages install.',
+    stFormat: 'VDR package format v1', stFormatBody: 'A .vdr file is a zip with exactly: manifest.json, app/ (tool code or a workflow), icon.png, META-VK/HASHES (sha256 of every file), META-VK/SIGNATURE (publisher ed25519 over HASHES), META-VK/PUBLISHER (publisher id and public key). After review the store adds META-VK/STORE_SIG. Any extra, missing or changed file is rejected: one changed byte and the package does not install, the same rule as ViKernel boot integrity.',
+    stManifest: 'Manifest', stCli: 'Four commands (vdrpack.py, in our public repo)',
+    stEnforce: 'How ViKernel enforces it',
+    stE1: 'Undeclared actions are denied: a tool, domain or path that is not in the manifest never runs.',
+    stE2: 'The kill switch sits above every app. When the kernel halts, every app stops; only the operator key resumes.',
+    stE3: 'Every app action is decided by the kernel and sealed in the audit chain.',
+    stE4: 'Demo keys only. The store key never leaves the server.',
+    stPick: 'Upload a .vdr package', stSampleOk: 'Use sample: weather-plus.vdr', stSampleBad: 'Use sample with one byte changed',
+    stRunning: 'Reviewing live...', stPass: 'PASS: listed in the catalog', stRej: 'REJECTED', stDownload: 'Download the countersigned package',
+    stProbe: 'probe', stKernel: 'kernel', stVerdict: 'verdict',
+    stPaid: 'Paid listings coming soon.', stBadge: 'Verified by ViKernel', stFree: 'Free', stPerms: 'permissions', stRisk: 'risk',
+    stNeedLive: 'The App Store needs the live backend. It is starting or busy; try again in a minute.',
+  },
+  ko: {
+    agTabAgent: '에이전트', agTabStore: '앱 스토어',
+    stGuide: '개발자 안내', stSubmit: '심사 제출', stCatalog: '카탈로그',
+    stIntro: '에이전트 앱은 VDR 패키지(.vdr)로 배포합니다. ViKernel 이 모든 패키지를 실시간으로 심사하고, 등재하는 패키지에 공동 서명합니다. 공동 서명된 패키지만 설치됩니다.',
+    stFormat: 'VDR 패키지 형식 v1', stFormatBody: '.vdr 파일은 정확히 다음을 담은 zip 입니다: manifest.json, app/(도구 코드나 워크플로), icon.png, META-VK/HASHES(모든 파일의 sha256), META-VK/SIGNATURE(HASHES 에 대한 게시자 ed25519 서명), META-VK/PUBLISHER(게시자 id 와 공개키). 심사 뒤 스토어가 META-VK/STORE_SIG 를 더합니다. 파일이 더 있거나 빠지거나 바뀌면 거부합니다. 1바이트만 바뀌어도 설치되지 않습니다. ViKernel 부팅 무결성과 같은 규칙입니다.',
+    stManifest: '매니페스트', stCli: '명령 4개 (공개 저장소의 vdrpack.py)',
+    stEnforce: 'ViKernel 이 지키는 방법',
+    stE1: '선언하지 않은 행동은 거부합니다. 매니페스트에 없는 도구·도메인·경로는 실행되지 않습니다.',
+    stE2: '정지 스위치는 모든 앱 위에 있습니다. 커널이 정지하면 모든 앱이 멈추고, 운영자 열쇠로만 재개합니다.',
+    stE3: '앱의 모든 행동은 커널이 판정하고 감사 사슬에 봉인합니다.',
+    stE4: '시연용 키만 씁니다. 스토어 키는 서버 밖으로 나가지 않습니다.',
+    stPick: '.vdr 패키지 올리기', stSampleOk: '견본 사용: weather-plus.vdr', stSampleBad: '1바이트 바꾼 견본 사용',
+    stRunning: '실시간 심사 중...', stPass: '통과: 카탈로그에 등재됨', stRej: '거부', stDownload: '공동 서명된 패키지 내려받기',
+    stProbe: '탐침', stKernel: '커널', stVerdict: '판정',
+    stPaid: '유료 등재는 곧 열립니다.', stBadge: 'ViKernel 검증', stFree: '무료', stPerms: '권한', stRisk: '위험도',
+    stNeedLive: '앱 스토어는 실시간 백엔드가 필요합니다. 시작 중이거나 바쁩니다. 1분 뒤 다시 시도하세요.',
+  },
+};
+for (const l of ['en', 'ko']) Object.assign(window.VK_I18N[l], S[l]);
+
+const MANIFEST = `{
+  "name": "Weather Plus",
+  "version": "1.0.0",
+  "publisher": "acme-demo",
+  "description": "Weather with a short forecast note",
+  "permissions": {
+    "tools": ["get_weather", "search_web"],
+    "egress": [],
+    "paths": []
+  },
+  "rate_limits": {"per_minute": 30}
+}`;
+const CLI = `python vdrpack.py init   weather-plus --name "Weather Plus" --publisher acme-demo
+python vdrpack.py build  weather-plus weather-plus.vdr
+python vdrpack.py sign   weather-plus.vdr weather-plus/publisher_demo.key acme-demo
+python vdrpack.py verify weather-plus.vdr`;
+
+window.VK_STORE = (pane, {el, t, toast, call, live}) => {
+  if (pane.dataset.built) { pane.querySelector('[data-sec=catalog]') && pane.__loadCat && pane.__loadCat(); return; }
+  pane.dataset.built = '1';
+  const sec = {};
+  const nav = el('div', {class:'row', style:'gap:6px;margin-bottom:8px;flex-wrap:wrap'});
+  const body = el('div', {class:'stbody'});
+  const show = k => { for (const [n, d] of Object.entries(sec)) d.style.display = n === k ? '' : 'none';
+    nav.querySelectorAll('button').forEach(x => x.classList.toggle('pri', x.dataset.k === k)); if (k === 'catalog') loadCat(); };
+  for (const [k, lab] of [['guide', 'stGuide'], ['submit', 'stSubmit'], ['catalog', 'stCatalog']]) {
+    nav.append(el('button', {class:'btn', 'data-k':k, onclick:() => show(k)}, t(lab)));
+    sec[k] = el('div', {'data-sec':k}); body.append(sec[k]);
+  }
+  pane.append(el('p', {class:'small muted', style:'margin:0 0 8px'}, t('stIntro')), nav, body);
+
+  sec.guide.append(
+    el('h4', {}, t('stFormat')), el('p', {class:'small', style:'line-height:1.6'}, t('stFormatBody')),
+    el('h4', {}, t('stManifest')), el('pre', {class:'stpre mono'}, MANIFEST),
+    el('h4', {}, t('stCli')), el('pre', {class:'stpre mono'}, CLI),
+    el('h4', {}, t('stEnforce')), el('ul', {class:'small', style:'line-height:1.7;margin:0;padding-left:18px'}, ['stE1', 'stE2', 'stE3', 'stE4'].map(k => el('li', {}, t(k)))));
+
+  const out = el('div', {class:'stout'});
+  const file = el('input', {type:'file', accept:'.vdr', style:'max-width:100%'});
+  const b64 = buf => { let s = ''; const u = new Uint8Array(buf); for (let i = 0; i < u.length; i += 0x8000) s += String.fromCharCode.apply(null, u.subarray(i, i + 0x8000)); return btoa(s); };
+  const submit = async (name, buf) => {
+    out.innerHTML = ''; out.append(el('div', {class:'small muted'}, name + ' · ' + buf.byteLength + ' bytes · ' + t('stRunning')));
+    let r;
+    try { r = await call('store/submit', {vdr_b64:b64(buf)}); } catch (e) { out.innerHTML = ''; out.append(el('div', {class:'card small'}, t('stNeedLive'))); return; }
+    out.innerHTML = '';
+    out.append(el('div', {class:'small muted', style:'margin-bottom:6px'}, name + ' · ' + buf.byteLength + ' bytes'));
+    for (const s of r.steps || []) {
+      const row = el('div', {class:'card stck' + (s.ok ? '' : ' blocked')}, el('span', {class:'tag ' + (s.ok ? 'allow' : 'deny')}, s.ok ? 'PASS' : 'FAIL'), el('b', {style:'margin:0 8px'}, s.check), el('span', {class:'small mono'}, s.detail));
+      if (s.probes) row.append(el('table', {class:'sttab small'}, el('tr', {}, el('th', {}, t('stProbe')), el('th', {}, 'tool'), el('th', {}, t('stKernel')), el('th', {}, t('stVerdict')), el('th', {}, 'audit')),
+        s.probes.map(p => el('tr', {}, el('td', {}, p.probe), el('td', {class:'mono'}, p.fn), el('td', {}, p.kernel), el('td', {}, el('span', {class:'tag ' + (p.verdict === 'ALLOW' ? 'allow' : 'deny')}, p.verdict)), el('td', {class:'mono'}, p.audit_seq != null ? '#' + p.audit_seq : '-')))));
+      out.append(row);
+    }
+    const pass = r.status === 'PASS';
+    out.append(el('div', {class:'stresult ' + (pass ? 'ok' : 'bad')}, pass ? t('stPass') : t('stRej') + ': ' + (r.reason || '')));
+    if (pass && r.package_b64) out.append(el('a', {href:'data:application/octet-stream;base64,' + r.package_b64, download:name.replace(/\.vdr$/, '') + '.signed.vdr', class:'small'}, t('stDownload')));
+  };
+  file.onchange = async () => { const f = file.files[0]; if (f) submit(f.name, await f.arrayBuffer()); };
+  const sample = async n => submit(n, await (await fetch('samples/' + n, {cache:'no-store'})).arrayBuffer());
+  sec.submit.append(el('div', {class:'row', style:'gap:8px;flex-wrap:wrap;margin-bottom:8px'}, el('label', {class:'small'}, t('stPick') + ' '), file,
+    el('button', {class:'btn', onclick:() => sample('weather-plus.vdr')}, t('stSampleOk')), el('button', {class:'btn', onclick:() => sample('weather-plus-tampered.vdr')}, t('stSampleBad'))), out);
+
+  const loadCat = pane.__loadCat = async () => {
+    sec.catalog.innerHTML = '';
+    let c;
+    try { c = await call('store/catalog'); } catch { sec.catalog.append(el('div', {class:'card small'}, t('stNeedLive'))); return; }
+    const grid = el('div', {class:'stgrid'});
+    for (const a of c.apps) grid.append(el('div', {class:'card'},
+      el('div', {class:'row', style:'justify-content:space-between;gap:6px'}, el('b', {}, a.name + ' ' + a.version), el('span', {class:'tag allow'}, t('stBadge'))),
+      el('div', {class:'small muted'}, a.publisher + ' · ' + t('stFree') + ' · ' + t('stRisk') + ' ' + a.risk),
+      el('div', {class:'small', style:'margin:4px 0'}, a.description),
+      el('div', {class:'small mono'}, t('stPerms') + ': ' + (a.permissions.tools || []).join(', ') + ((a.permissions.paths || []).length ? ' · paths ' + a.permissions.paths.join(', ') : '')),
+      el('div', {class:'small muted mono'}, 'STORE_SIG ' + a.store_sig + '...')));
+    sec.catalog.append(grid, el('p', {class:'small muted'}, t('stPaid') + ' Store public key: ' + String(c.store_public_key).slice(0, 16) + '...'));
+  };
+  show('guide');
+};
+
+const css = document.createElement('style');
+css.textContent = `.stbody{overflow:auto;height:calc(100% - 70px)}.stbody h4{margin:10px 0 4px;font-size:13px}
+.stpre{background:var(--bg);border:1px solid var(--border);border-radius:9px;padding:8px 10px;font-size:12px;white-space:pre-wrap;margin:0}
+.stck{margin:5px 0;padding:7px 10px}.sttab{width:100%;border-collapse:collapse;margin-top:6px}.sttab td,.sttab th{border-top:1px solid var(--border);padding:3px 6px;text-align:left}
+.stresult{margin:8px 0;padding:10px;border-radius:10px;font-weight:800}.stresult.ok{background:#ECFDF5;color:#065F46}.stresult.bad{background:#FFF1F2;color:#BE123C}
+.stgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px}`;
+document.head.append(css);
+})();