aimeat 1.40.0 → 2.0.0

package/dist/public/views/landing.js

@@ -11,6 +11,9 @@
  * @structure default export Landing({ navigate }) + BuildHero/Gallery(live wall)/StatsPanel/BuildAppPrompt/BuildAgentPrompt/AskYourAI
  * @usage routed at /v1/portal (and '/' for browsers) by spa.html
  * @version-history
+ *   v2.2.0 — 2026-07-16 — Build-app prompt fetched from the canonical GET /v1/prompts/build-app
+ *     (registry-generated libraries + capability packs; kills the landing's 5th drifting copy);
+ *     the hand-built text remains only as the offline fallback. Template block via shared helper.
  *   v1.0.0 — 2026-06-10 — Initial: landing/portal split (owner spec).
  *   v1.1.0 — 2026-06-16 — Add BuildAppPrompt section: copyable Generate App Prompt from app-catalog.
  *   v1.2.0 — 2026-06-16 — Embed PublicActivityFeed (3 real-time tabs) after the proof gallery.
@@ -32,6 +35,10 @@
  *     iframe (openAppSandboxed) instead of a top-level apex ?mode=inline link.
  *   v3.3.0 — 2026-06-20 — Replace PublicActivityFeed (read as broken when empty) with NodeTotals:
  *     cumulative "this node has X" counters (apps/organisms/agents+online/knowledge/downloads).
+ *   v3.4.0 — 2026-07-14 — Footer GitHub link: fix href to the real repo
+ *     (github.com/miikkij/aimeat-protocol) + add the GitHub Octocat mark.
+ *   v3.5.0 — 2026-07-17 — Hero gains an Experience Center line (the hands-on academy at
+ *     experience-center.apps.aimeat.io) under the two CTAs.
  */
 import { h } from 'preact';
 import { useState, useEffect } from 'preact/hooks';
@@ -45,6 +52,9 @@ import NodeTotals from './landing-node-totals.js';
 // t() echoes the key when a translation is missing — fall back to readable English.
 const tr = (key, fallback) => { const v = t(key); return v && v !== key ? v : fallback; };
 
+// The familiar GitHub "Octocat" mark. fill=currentColor so it inherits the link's themed color.
+const GhMark = html`<svg class="gh-mark" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"></path></svg>`;
+
 /* ── Today's stats + ownership line — THE sales core. Real numbers; zeros are omitted. ── */
 function StatsPanel({ navigate }) {
   const [stats, setStats] = useState(null);
@@ -170,6 +180,27 @@ hosting is the only subscription.`;
 
 // Mirrors buildPromptFromBuilder() in app-catalog.html for the "new app / no description" case,
 // with the current node URL injected. If no idea is given the prompt explicitly tells the AI to ask.
+// Canonical build prompt from the node (GET /v1/prompts/build-app - the single source of
+// truth the app-catalog + agentic coders use; includes the registry-generated library
+// sections and capability packs). Cached per locale. The hand-built text below is ONLY the
+// offline / older-node fallback and may lag behind the node's.
+const _canonicalPromptCache = {};
+async function fetchCanonicalBuildPrompt(locale) {
+  const key = locale || 'en';
+  if (_canonicalPromptCache[key]) return _canonicalPromptCache[key];
+  const d = await (await fetch('/v1/prompts/build-app?mode=new&lang=' + encodeURIComponent(key))).json();
+  const full = d && d.data && d.data.prompt;
+  if (typeof full === 'string' && full.length > 500) { _canonicalPromptCache[key] = full; return full; }
+  throw new Error('no canonical prompt');
+}
+
+// Appended to whichever prompt body is in use (canonical or fallback).
+function appendTemplateBlock(p, templateContent) {
+  if (!templateContent) return p;
+  return p + '\n## Starting template (copy from this)\nUse this skeleton as your base — keep its boot, login pill, and self-hosted theme wiring; fill the {{...}} slots; build your views inside <main>. Return the COMPLETE single HTML file based on it.\n```html\n' + templateContent + '\n```\n';
+}
+
+// FALLBACK ONLY - used until the canonical fetch resolves (first paint) or when it fails.
 function buildLandingAppPrompt(nodeUrl, templateContent) {
   const base = (nodeUrl || '').replace(/\/+$/, '') || window.location.origin;
   const LANGS = { en: 'English', fi: 'Finnish (Suomi)' };
@@ -289,10 +320,7 @@ function buildLandingAppPrompt(nodeUrl, templateContent) {
   p += '3. Click Publish.\n';
   p += 'I will be asked to sign in first — it is fast: one click with Google, or a quick email + password, and a brand-new account is created right there in seconds.\n';
   p += 'What I get: once published, the app is LIVE on my own AIMEAT node and PUBLIC — anyone can find it in the community catalogue and use it, and I get a link to share. From my catalogue I can launch it, publish updates (older versions are always kept), park it (hide it), or delete it. It keeps working with my AIMEAT login, saved data, files, AI and realtime features.\n';
-  if (templateContent) {
-    p += '\n## Starting template (copy from this)\nUse this skeleton as your base — keep its boot, login pill, and self-hosted theme wiring; fill the {{...}} slots; build your views inside <main>. Return the COMPLETE single HTML file based on it.\n```html\n' + templateContent + '\n```\n';
-  }
-  return p;
+  return appendTemplateBlock(p, templateContent);
 }
 
 function BuildAppPrompt() {
@@ -314,7 +342,9 @@ function BuildAppPrompt() {
     try { const d = await (await fetch('/v1/app-templates/' + encodeURIComponent(id))).json(); setTplContent((d.data && d.data.template && d.data.template.content) || ''); }
     catch { setTplContent(''); }
   };
-  const prompt = buildLandingAppPrompt(window.location.origin, tplContent);
+  const [canonical, setCanonical] = useState('');
+  useEffect(() => { fetchCanonicalBuildPrompt(getLocale()).then(setCanonical).catch(() => {}); }, []);
+  const prompt = appendTemplateBlock(canonical || buildLandingAppPrompt(window.location.origin), tplContent);
   const copy = async () => {
     try {
       await navigator.clipboard.writeText(prompt);
@@ -458,7 +488,9 @@ function AskYourAI() {
    proof that your creation lands on the same shelf as everyone else's. ── */
 function BuildHero() {
   const [copied, setCopied] = useState(false);
-  const prompt = buildLandingAppPrompt(window.location.origin);
+  const [canonical, setCanonical] = useState('');
+  useEffect(() => { fetchCanonicalBuildPrompt(getLocale()).then(setCanonical).catch(() => {}); }, []);
+  const prompt = canonical || buildLandingAppPrompt(window.location.origin);
   const copy = async () => {
     try { await navigator.clipboard.writeText(prompt); setCopied(true); setTimeout(() => setCopied(false), 2000); }
     catch { /* the full prompt is also visible lower on the page */ }
@@ -472,6 +504,7 @@ function BuildHero() {
         <button class="btn-primary" type="button" onClick=${copy}>${copied ? tr('landing.buildHeroCopied', 'Copied ✓ — paste into your AI') : tr('landing.buildHeroCopy', 'Copy the build prompt →')}</button>
         <a class="btn-outline" href="https://github.com/miikkij/aimeat-protocol/releases/latest" target="_blank" rel="noopener">${tr('landing.heroGetOwn', 'Get your own →')}</a>
       </div>
+      <p class="ld-hero2-after"><a href="https://experience-center.apps.aimeat.io" target="_blank" rel="noopener">🧭 ${tr('landing.ecLink', 'New here? Learn the whole ecosystem hands-on — open the Experience Center →')}</a></p>
       ${copied ? html`<p class="ld-hero2-after">${tr('landing.buildHeroAfter', 'Paste it into your AI and answer its questions. When your app is ready,')} <a href="/app-catalog.html">${tr('landing.openAppsToPublish', 'open your apps to add & publish it →')}</a> ${tr('landing.buildHeroAfter2', '(signing in takes seconds — Google or email).')}</p>` : ''}
     </section>
   `;
@@ -533,9 +566,9 @@ export default function Landing({ navigate }) {
       <!-- 7. Footer -->
       <footer class="ld-footer">
         <a href="/v1/pricing" onClick=${(e) => { e.preventDefault(); navigate('/v1/pricing'); }}>${tr('landing.footPricing', 'Pricing')}</a>
-        <a href="/v1/guides">${tr('landing.footDocs', 'Docs')}</a>
+        <a href="/v1/help">${tr('landing.footDocs', 'Docs')}</a>
         <a href="/v1/pricing#own-node" onClick=${(e) => { e.preventDefault(); navigate('/v1/pricing'); }}>${tr('landing.footOwnNode', 'Run your own node')}</a>
-        <a href="https://github.com/aimeat-protocol" target="_blank" rel="noopener">GitHub</a>
+        <a class="ld-gh" href="https://github.com/miikkij/aimeat-protocol" target="_blank" rel="noopener">${GhMark}GitHub</a>
         <a href="/v1/portal?view=dev">${tr('landing.footDev', 'For developers')}</a>
       </footer>
     </div>

package/dist/public/views/members.js

@@ -16,6 +16,8 @@ import { t } from '/js/i18n.js';
 import { apiGet } from '/js/api.js';
 import { escHtml } from '/js/utils.js';
 import { useViewCSS } from '/components/useViewCSS.js';
+import { Spinner } from '/components/Spinner.js';
+import { EmptyState } from '/components/EmptyState.js';
 
 export default function MembersView() {
   useViewCSS('/css/views/members.css');
@@ -28,8 +30,8 @@ export default function MembersView() {
     <div class="mbr">
       <h1 class="mbr-title">${t('members.title')}</h1>
       <p class="mbr-desc">${t('members.desc')}</p>
-      ${members === null ? html`<div class="mbr-empty">…</div>`
-        : members.length === 0 ? html`<div class="mbr-empty">${t('members.empty')}</div>`
+      ${members === null ? html`<${Spinner} />`
+        : members.length === 0 ? html`<${EmptyState} text=${t('members.empty')} />`
         : html`<div class="mbr-grid">
             ${members.map(m => html`
               <a class="mbr-card" key=${m.username} href=${`/v1/portfolio/${encodeURIComponent(m.username)}`}>

package/dist/public/views/my-company.js

@@ -24,6 +24,13 @@
  *     (describe → generate in-app / copy-prompt → review → apply) for departments/roles/people/reporting (GET/PUT /v1/orgs/:slug/model).
  *   v0.8.0 — 2026-07-01 — Company Secretary subtab hidden unless the node enables the Secretary feature
  *     (AIMEAT_SECRETARY_ENABLED, read from /v1/site/header-nav `features.secretary`). Governance + model unaffected.
+ *   v0.9.0 — 2026-07-16 — Member-add input is the shared ContactPicker (contacts + directory
+ *     suggestions + email resolve).
+ *   v0.10.0 — 2026-07-18 — Money UI (TARGET-043): Payments panel gains Stripe Connect (Platform)
+ *     onboarding (Express Account Links via POST /v1/orgs/{slug}/connect/onboard + status), a
+ *     Stripe-backed KYB badge, and the money books — payables owed to the seller (GET
+ *     /v1/orgs/{slug}/payables) + DAC7/ALV compliance (GET /v1/orgs/{slug}/dac7). The individual
+ *     standalone-key PSP form is demoted behind an "Advanced" toggle.
  */
 import { h } from 'preact';
 import { useState, useEffect, useCallback } from 'preact/hooks';
@@ -35,7 +42,11 @@ import { setOfferBilling } from '/js/services/offers.js';
 import { useViewCSS } from '/components/useViewCSS.js';
 import { DeliverableBody } from '/components/ImageDeliverable.js';
 import { OfferCardView } from '/components/offer-card-view.js';
+import { Spinner } from '/components/Spinner.js';
+import { EmptyState } from '/components/EmptyState.js';
 import { THEMES, buildPortfolioData } from '/views/portfolio-themes.js';
+import { ContactPicker } from '/components/ContactPicker.js';
+import { PaymentsPanel } from '/views/my-company.payments.js';
 
 const html = htm.bind(h);
 
@@ -71,7 +82,7 @@ function OrderRow({ o, view }) {
 }
 
 function OrdersList({ orders, view, empty }) {
-  if (!orders || orders.length === 0) return html`<p class="mc-empty">${empty}</p>`;
+  if (!orders || orders.length === 0) return html`<${EmptyState} text=${empty} />`;
   return html`<ul class="mc-order-list">${orders.map(o => html`<${OrderRow} key=${o.id} o=${o} view=${view} />`)}</ul>`;
 }
 
@@ -81,8 +92,8 @@ function CustomersPanel({ slug }) {
   useEffect(() => {
     apiGet(`/v1/orgs/${encodeURIComponent(slug)}/customers`).then(r => setCustomers(r.data?.customers ?? [])).catch(() => setCustomers([]));
   }, [slug]);
-  if (customers === null) return html`<div class="mc-center"><div class="spinner"></div></div>`;
-  if (!customers.length) return html`<p class="mc-empty">${t('myCompany.noCustomers')}</p>`;
+  if (customers === null) return html`<div class="mc-center"><${Spinner} /></div>`;
+  if (!customers.length) return html`<${EmptyState} text=${t('myCompany.noCustomers')} />`;
   return html`
     <ul class="mc-cust-list">
       ${customers.map(c => html`
@@ -108,7 +119,9 @@ function MembersPanel({ slug, creatorOwner, viewerRole }) {
   const load = useCallback(async () => { try { const r = await apiGet(`/v1/orgs/${encodeURIComponent(slug)}/members`); setMembers(r.data?.members ?? []); } catch { setMembers([]); } }, [slug]);
   useEffect(() => { load(); }, [load]);
   async function add(e) {
-    e.preventDefault(); setBusy(true); setErr('');
+    e.preventDefault();
+    if (!owner.trim()) return;   // the picker input carries no `required` attribute
+    setBusy(true); setErr('');
     try { await apiPost(`/v1/orgs/${encodeURIComponent(slug)}/members`, { owner: owner.trim().toLowerCase(), role }); setOwner(''); await load(); }
     catch (e) { setErr(e.message || 'Failed'); } finally { setBusy(false); }
   }
@@ -118,7 +131,7 @@ function MembersPanel({ slug, creatorOwner, viewerRole }) {
     <option value="admin">${t('myCompany.roleAdmin')}</option>
     <option value="member">${t('myCompany.roleMember')}</option>
     <option value="visitor">${t('myCompany.roleVisitor')}</option>`;
-  if (members === null) return html`<div class="mc-center"><div class="spinner"></div></div>`;
+  if (members === null) return html`<div class="mc-center"><${Spinner} /></div>`;
   return html`
     <ul class="mc-member-list">
       ${members.map(m => {
@@ -138,7 +151,7 @@ function MembersPanel({ slug, creatorOwner, viewerRole }) {
       <form class="mc-form" onSubmit=${add}>
         <h3 class="mc-form-title">${t('myCompany.addMember')}</h3>
         <div class="flex-row-wrap mc-manage-row">
-          <input class="input-field input-sm" placeholder=${t('myCompany.memberUsername')} value=${owner} onInput=${(e) => setOwner(e.target.value)} required />
+          <${ContactPicker} value=${owner} onChange=${setOwner} kinds=${['ghii']} placeholder=${t('myCompany.memberUsername')} />
           <select class="input-field input-sm" value=${role} onChange=${(e) => setRole(e.target.value)}>${roleOpts}</select>
           <button class="btn-primary btn-sm" type="submit" disabled=${busy}>${t('myCompany.addMemberBtn')}</button>
         </div>
@@ -224,69 +237,6 @@ function SettingsPanel({ org, onSaved }) {
     </form>`;
 }
 
-/** Payments (read-only): the node's payment handlers + checkout status from /.well-known/ucp,
- * and the company's KYB pre-stage (Y-tunnus given or not). Real-money handlers appear here
- * automatically once the node's EE edition registers them — no UI change needed. */
-function PaymentsPanel({ org }) {
-  const [profile, setProfile] = useState(null);
-  const [psp, setPsp] = useState(null);
-  const [keyIn, setKeyIn] = useState('');
-  const [pspBusy, setPspBusy] = useState(false);
-  const [pspMsg, setPspMsg] = useState('');
-  const loadPsp = useCallback(() => {
-    apiGet(`/v1/orgs/${encodeURIComponent(org.slug)}/psp`).then(r => setPsp(r.data?.psp ?? { configured: false })).catch(() => setPsp(false));
-  }, [org.slug]);
-  useEffect(() => {
-    let alive = true;
-    fetch('/.well-known/ucp').then(r => r.json()).then(p => { if (alive) setProfile(p); }).catch(() => { if (alive) setProfile(false); });
-    loadPsp();
-    return () => { alive = false; };
-  }, [loadPsp]);
-  async function savePsp() {
-    setPspBusy(true); setPspMsg('');
-    try { await apiPut(`/v1/orgs/${encodeURIComponent(org.slug)}/psp`, { secret_key: keyIn.trim() }); setKeyIn(''); setPspMsg(t('myCompany.pspSaved')); loadPsp(); }
-    catch (e) { setPspMsg(e.message || 'Save failed'); }
-    finally { setPspBusy(false); }
-  }
-  async function removePsp() {
-    setPspBusy(true); setPspMsg('');
-    try { await apiDelete(`/v1/orgs/${encodeURIComponent(org.slug)}/psp`); setPspMsg(t('myCompany.pspRemoved')); loadPsp(); }
-    catch (e) { setPspMsg(e.message || 'Remove failed'); }
-    finally { setPspBusy(false); }
-  }
-  if (profile === null) return html`<p class="mc-empty">${t('myCompany.loading')}</p>`;
-  const handlers = (profile && profile.ucp && profile.ucp.payment_handlers) || [];
-  const checkoutOn = !!(profile && profile.ucp && (profile.ucp.capabilities || []).length);
-  const hasKybPre = !!org.businessId;
-  return html`
-    <div class="mc-payments">
-      <div class="mc-label">${t('myCompany.pspTitle')}
-        ${psp && psp.configured
-          ? html`<span class="mc-chip mc-chip-ok">${t('myCompany.pspConfigured')} ${psp.keyHint || ''}</span>`
-          : html`<span class="mc-chip mc-chip-warn">${t('myCompany.pspMissing')}</span>`}
-      </div>
-      <span class="mc-mini">${t('myCompany.pspHint')}</span>
-      <div class="flex-row-wrap mc-manage-row">
-        <input class="input-field input-sm mc-psp-input" type="password" placeholder="sk_live_…" value=${keyIn} onInput=${(e) => setKeyIn(e.target.value)} />
-        <button class="btn-primary btn-sm" disabled=${pspBusy || keyIn.trim().length < 8} onClick=${savePsp}>${t('myCompany.pspSave')}</button>
-        ${psp && psp.configured && html`<button class="btn-ghost btn-sm mc-remove" disabled=${pspBusy} onClick=${removePsp}>${t('myCompany.pspRemove')}</button>`}
-      </div>
-      ${pspMsg && html`<span class="mc-mini">${pspMsg}</span>`}
-      <div class="mc-label">${t('myCompany.paymentsCheckout')}
-        <span class="mc-chip ${checkoutOn ? 'mc-chip-ok' : 'mc-chip-warn'}">${checkoutOn ? t('myCompany.paymentsOn') : t('myCompany.paymentsOff')}</span>
-      </div>
-      <div class="mc-label">${t('myCompany.paymentsHandlers')}</div>
-      ${handlers.length === 0
-        ? html`<p class="mc-empty">${t('myCompany.paymentsNone')}</p>`
-        : html`<ul class="mc-order-list">${handlers.map(h => html`
-            <li key=${h.id} class="mc-payment-row"><b>${h.title || h.id}</b> <span class="mc-mini">${h.id} · ${(h.currencies || []).join(', ')}</span></li>`)}</ul>`}
-      <div class="mc-label">${t('myCompany.paymentsKyb')}
-        <span class="mc-chip ${hasKybPre ? 'mc-chip-ok' : 'mc-chip-warn'}">${hasKybPre ? t('myCompany.paymentsKybPre') : t('myCompany.paymentsKybMissing')}</span>
-      </div>
-      <span class="mc-mini">${t('myCompany.paymentsKybHint')}</span>
-    </div>`;
-}
-
 /** Compose the prompt the user takes to their AI to generate the portfolio HTML (prompt-driven). */
 function buildPortfolioPrompt(org, offerings, c) {
   const origin = (typeof window !== 'undefined' && window.location.origin) || '';
@@ -372,7 +322,7 @@ function PortfolioPanel({ org, offerings }) {
     finally { setBusy(false); }
   }
 
-  if (cfg === undefined) return html`<div class="mc-center"><div class="spinner"></div></div>`;
+  if (cfg === undefined) return html`<div class="mc-center"><${Spinner} /></div>`;
   const published = cfg?.enabled && cfg?.publicUrl;
 
   return html`
@@ -559,8 +509,8 @@ function OfferPicker({ slug, alreadyListed, onListed }) {
     catch (e) { alert(e.message || 'Failed'); }
     finally { setBusy(''); }
   }
-  if (agents === null) return html`<div class="mc-center"><div class="spinner"></div></div>`;
-  if (agents.length === 0) return html`<p class="mc-empty">${t('myCompany.noOffersToList')}</p>`;
+  if (agents === null) return html`<div class="mc-center"><${Spinner} /></div>`;
+  if (agents.length === 0) return html`<${EmptyState} text=${t('myCompany.noOffersToList')} />`;
   return html`
     <div class="mc-pick-agents">
       ${agents.map(ag => html`
@@ -652,7 +602,7 @@ export default function MyCompanyView() {
     finally { setBusy(false); }
   }
 
-  if (state === 'loading') return html`<div class="mc-container"><div class="mc-center"><div class="spinner"></div></div></div>`;
+  if (state === 'loading') return html`<div class="mc-container"><div class="mc-center"><${Spinner} /></div></div>`;
   if (state === 'enterprise') return html`<div class="mc-container"><div class="mc-card mc-stub"><h1 class="mc-title">${t('myCompany.title')}</h1><p class="mc-stub-badge">${t('myCompany.enterpriseBadge')}</p><p class="mc-desc">${t('myCompany.enterpriseRequired')}</p></div></div>`;
   if (state === 'unauth') return html`<div class="mc-container"><div class="mc-card"><h1 class="mc-title">${t('myCompany.title')}</h1><p class="mc-desc">${t('myCompany.loginRequired')}</p></div></div>`;
   if (state === 'error') return html`<div class="mc-container"><div class="mc-card"><h1 class="mc-title">${t('myCompany.title')}</h1><p class="mc-error">${errMsg}</p></div></div>`;
@@ -673,14 +623,14 @@ export default function MyCompanyView() {
       ${showMyOrders && html`
         <div class="mc-card">
           <h2 class="mc-col-title">${t('myCompany.myOrders')}</h2>
-          ${myOrders === null ? html`<div class="mc-center"><div class="spinner"></div></div>`
+          ${myOrders === null ? html`<div class="mc-center"><${Spinner} /></div>`
             : html`<${OrdersList} orders=${myOrders} view="buyer" empty=${t('myCompany.noMyOrders')} />`}
         </div>`}
 
       <div class="mc-grid">
         <aside class="mc-col">
           <h2 class="mc-col-title">${t('myCompany.yourCompanies')}</h2>
-          ${orgs.length === 0 && html`<p class="mc-empty">${t('myCompany.noCompanies')}</p>`}
+          ${orgs.length === 0 && html`<${EmptyState} text=${t('myCompany.noCompanies')} />`}
           <ul class="mc-org-list">
             ${orgs.map(org => html`<li key=${org.slug}>
               <button class="mc-org-item ${selected?.slug === org.slug ? 'active' : ''}" onClick=${() => openOrg(org)}>
@@ -701,7 +651,7 @@ export default function MyCompanyView() {
         </aside>
 
         <section class="mc-col">
-          ${!selected && html`<p class="mc-empty">${t('myCompany.selectHint')}</p>`}
+          ${!selected && html`<${EmptyState} text=${t('myCompany.selectHint')} />`}
           ${selected && html`
             <div class="mc-detail-head">
               <div class="mc-head-id">
@@ -728,7 +678,7 @@ export default function MyCompanyView() {
                 <button class="btn-outline btn-sm" onClick=${() => setShowPicker(s => !s)}>${showPicker ? t('myCompany.done') : t('myCompany.addFromOffers')}</button>
               </div>
               ${showPicker && html`<div class="mc-picker"><p class="mc-pick-hint">${t('myCompany.pickHint')}</p><${OfferPicker} slug=${selected.slug} alreadyListed=${listedKeys} onListed=${() => openOrg(selected)} /></div>`}
-              ${offerings.length === 0 && !showPicker && html`<p class="mc-empty">${t('myCompany.noOfferings')}</p>`}
+              ${offerings.length === 0 && !showPicker && html`<${EmptyState} text=${t('myCompany.noOfferings')} />`}
               <ul class="mc-off-list">
                 ${offerings.map(o => html`<${OfferingCard} key=${o.agentName + '/' + o.offerId} o=${o} orgOwner=${selected.creatorOwner} slug=${selected.slug} callerOwner=${callerOwner} role=${selected.role} onOrdered=${afterOrder} onChanged=${() => openOrg(selected)} />`)}
               </ul>`}

package/dist/public/views/my-company.payments.js

@@ -0,0 +1,177 @@
+/**
+ * @file my-company.payments.js
+ * @description The "Payments" panel of the My Company (Enterprise) view — extracted from
+ *   my-company.js (line-budget). Drives real-money selling via Stripe Connect (Platform model):
+ *   the company onboards as a Stripe EXPRESS connected account under the operator's Platform
+ *   (POST /v1/orgs/{slug}/connect/onboard → hosted Account Link), its KYB verifies automatically
+ *   once the account can take charges and it carries a Y-tunnus (GET /v1/orgs/{slug}/connect/status),
+ *   and the money books render — payables owed to the seller (GET /v1/orgs/{slug}/payables) and
+ *   DAC7/ALV compliance (GET /v1/orgs/{slug}/dac7). The individual standalone-key PSP form is kept
+ *   behind an "Advanced" toggle. Funds settle to the seller's Stripe account — the node never holds
+ *   the key or the funds (non-custodial).
+ * @structure moneyRow (per-currency money row) · PaymentsPanel({ org })
+ * @usage import { PaymentsPanel } from '/views/my-company.payments.js';
+ * @version-history
+ *   v0.10.0 — 2026-07-18 — initial extraction from my-company.js + Stripe Connect onboarding, the
+ *     Stripe-backed KYB badge, and the payables + DAC7/ALV money books (TARGET-043).
+ */
+import { h } from 'preact';
+import { useState, useEffect, useCallback } from 'preact/hooks';
+import htm from 'htm';
+import { t } from '/js/i18n.js';
+import { apiGet, apiPost, apiPut, apiDelete } from '/js/api.js';
+import { fmtMoney } from '/js/utils.js';
+import { Spinner } from '/components/Spinner.js';
+import { EmptyState } from '/components/EmptyState.js';
+
+const html = htm.bind(h);
+
+/** One per-currency money row (micro-units → localized money). */
+function moneyRow(label, totals, field) {
+  const codes = Object.keys(totals || {});
+  if (!codes.length) return null;
+  return html`<div class="mc-money-row"><span class="mc-mini">${label}</span>
+    <b>${codes.map(c => fmtMoney(totals[c][field] ?? 0, c)).join(' · ')}</b></div>`;
+}
+
+/** Payments: Stripe Connect onboarding (Platform model), the node's payment handlers + checkout
+ * status, the KYB gate (Stripe-backed once the connected account can take charges), and the money
+ * books — payables owed to the seller + DAC7/ALV compliance. Sellers onboard as Stripe Express
+ * connected accounts under the operator's Platform; funds settle to their account (no custody). */
+export function PaymentsPanel({ org }) {
+  const [profile, setProfile] = useState(null);
+  const [psp, setPsp] = useState(null);
+  const [keyIn, setKeyIn] = useState('');
+  const [pspBusy, setPspBusy] = useState(false);
+  const [pspMsg, setPspMsg] = useState('');
+  const [showLegacy, setShowLegacy] = useState(false);
+  // Stripe Connect (Platform) onboarding + status.
+  const [connect, setConnect] = useState(undefined); // undefined=loading | {connected,...} | {unavailable}
+  const [cBusy, setCBusy] = useState(false);
+  const [cMsg, setCMsg] = useState('');
+  // Money books.
+  const [payables, setPayables] = useState(null);
+  const [dac7, setDac7] = useState(null);
+
+  const loadPsp = useCallback(() => {
+    apiGet(`/v1/orgs/${encodeURIComponent(org.slug)}/psp`).then(r => setPsp(r.data?.psp ?? { configured: false })).catch(() => setPsp(false));
+  }, [org.slug]);
+  const loadConnect = useCallback(() => {
+    apiGet(`/v1/orgs/${encodeURIComponent(org.slug)}/connect/status`)
+      .then(r => setConnect(r.data ?? { connected: false }))
+      .catch(e => setConnect(e?.code === 'STRIPE_PLATFORM_NOT_CONFIGURED' ? { unavailable: true } : { connected: false, error: e?.message }));
+  }, [org.slug]);
+  const loadMoney = useCallback(() => {
+    apiGet(`/v1/orgs/${encodeURIComponent(org.slug)}/payables`).then(r => setPayables(r.data)).catch(() => setPayables(null));
+    apiGet(`/v1/orgs/${encodeURIComponent(org.slug)}/dac7`).then(r => setDac7(r.data)).catch(() => setDac7(null));
+  }, [org.slug]);
+  useEffect(() => {
+    let alive = true;
+    fetch('/.well-known/ucp').then(r => r.json()).then(p => { if (alive) setProfile(p); }).catch(() => { if (alive) setProfile(false); });
+    loadPsp(); loadConnect(); loadMoney();
+    return () => { alive = false; };
+  }, [loadPsp, loadConnect, loadMoney]);
+  async function onboard() {
+    setCBusy(true); setCMsg('');
+    try {
+      const r = await apiPost(`/v1/orgs/${encodeURIComponent(org.slug)}/connect/onboard`, {});
+      const url = r.data?.onboardingUrl;
+      if (url) { window.open(url, '_blank', 'noopener'); setCMsg(t('myCompany.connectOpened')); }
+      setTimeout(loadConnect, 2000);
+    } catch (e) { setCMsg(e.message || 'Onboarding failed'); }
+    finally { setCBusy(false); }
+  }
+  async function savePsp() {
+    setPspBusy(true); setPspMsg('');
+    try { await apiPut(`/v1/orgs/${encodeURIComponent(org.slug)}/psp`, { secret_key: keyIn.trim() }); setKeyIn(''); setPspMsg(t('myCompany.pspSaved')); loadPsp(); }
+    catch (e) { setPspMsg(e.message || 'Save failed'); }
+    finally { setPspBusy(false); }
+  }
+  async function removePsp() {
+    setPspBusy(true); setPspMsg('');
+    try { await apiDelete(`/v1/orgs/${encodeURIComponent(org.slug)}/psp`); setPspMsg(t('myCompany.pspRemoved')); loadPsp(); }
+    catch (e) { setPspMsg(e.message || 'Remove failed'); }
+    finally { setPspBusy(false); }
+  }
+  if (profile === null) return html`<${Spinner} />`;
+  const handlers = (profile && profile.ucp && profile.ucp.payment_handlers) || [];
+  const checkoutOn = !!(profile && profile.ucp && (profile.ucp.capabilities || []).length);
+  const kyb = (connect && connect.kybStatus) || org.kybStatus || 'pending';
+  const kybVerified = kyb === 'verified';
+  const charges = !!(connect && connect.chargesEnabled);
+  const pt = payables && payables.totals ? payables.totals : {};
+  const d = dac7 && dac7.dac7 ? dac7.dac7 : null;
+  const vat = dac7 && dac7.vat ? dac7.vat : null;
+  return html`
+    <div class="mc-payments">
+      <!-- ── Stripe Connect (Platform model): the primary money-selling path ── -->
+      <div class="mc-label">${t('myCompany.connectTitle')}
+        ${connect === undefined ? null
+          : connect.unavailable ? html`<span class="mc-chip mc-chip-warn">${t('myCompany.connectUnavailable')}</span>`
+          : !connect.connected ? html`<span class="mc-chip mc-chip-warn">${t('myCompany.connectNotStarted')}</span>`
+          : charges ? html`<span class="mc-chip mc-chip-ok">${t('myCompany.connectReady')}</span>`
+          : html`<span class="mc-chip mc-chip-warn">${t('myCompany.connectPending')}</span>`}
+      </div>
+      <span class="mc-mini">${t('myCompany.connectHint')}</span>
+      ${connect && !connect.unavailable && html`
+        <div class="flex-row-wrap mc-manage-row">
+          <button class="btn-primary btn-sm" disabled=${cBusy} onClick=${onboard}>${connect.connected ? t('myCompany.connectContinue') : t('myCompany.connectOnboard')}</button>
+          ${connect.connected && html`<button class="btn-ghost btn-sm" disabled=${cBusy} onClick=${loadConnect}>${t('myCompany.connectRefresh')}</button>`}
+        </div>`}
+      ${connect && connect.connected && Array.isArray(connect.requirementsDue) && connect.requirementsDue.length > 0 && html`
+        <span class="mc-mini">${t('myCompany.connectRequirements')}: ${connect.requirementsDue.slice(0, 6).join(', ')}</span>`}
+      ${cMsg && html`<span class="mc-mini">${cMsg}</span>`}
+
+      <div class="mc-label">${t('myCompany.paymentsKyb')}
+        <span class="mc-chip ${kybVerified ? 'mc-chip-ok' : 'mc-chip-warn'}">${kybVerified ? t('myCompany.kybVerified') : (org.businessId ? t('myCompany.paymentsKybPre') : t('myCompany.paymentsKybMissing'))}</span>
+      </div>
+      <span class="mc-mini">${t('myCompany.kybHintConnect')}</span>
+
+      <div class="mc-label">${t('myCompany.paymentsCheckout')}
+        <span class="mc-chip ${checkoutOn ? 'mc-chip-ok' : 'mc-chip-warn'}">${checkoutOn ? t('myCompany.paymentsOn') : t('myCompany.paymentsOff')}</span>
+      </div>
+      <div class="mc-label">${t('myCompany.paymentsHandlers')}</div>
+      ${handlers.length === 0
+        ? html`<${EmptyState} text=${t('myCompany.paymentsNone')} />`
+        : html`<ul class="mc-order-list">${handlers.map(hd => html`
+            <li key=${hd.id} class="mc-payment-row"><b>${hd.title || hd.id}</b> <span class="mc-mini">${hd.id} · ${(hd.currencies || []).join(', ')}</span></li>`)}</ul>`}
+
+      <!-- ── Money books: payables owed to the seller + DAC7/ALV compliance ── -->
+      <div class="mc-label">${t('myCompany.payablesTitle')}</div>
+      ${Object.keys(pt).length === 0
+        ? html`<${EmptyState} text=${t('myCompany.payablesNone')} />`
+        : html`<div class="mc-money-box">
+            ${moneyRow(t('myCompany.payablesGross'), pt, 'gross')}
+            ${moneyRow(t('myCompany.payablesMember'), pt, 'memberCut')}
+            ${moneyRow(t('myCompany.payablesOrg'), pt, 'orgCut')}
+            ${moneyRow(t('myCompany.payablesFee'), pt, 'fee')}
+          </div>`}
+      ${(d || vat) && html`
+        <div class="mc-label">${t('myCompany.dac7Title')} <span class="mc-mini">${dac7?.year ?? ''}</span></div>
+        <div class="mc-money-box">
+          ${d && html`<div class="mc-money-row"><span class="mc-mini">${t('myCompany.dac7Consideration')}</span><b>${fmtMoney(d.totalConsideration ?? 0, d.currency || 'EUR')}</b></div>`}
+          ${d && html`<div class="mc-money-row"><span class="mc-mini">${t('myCompany.dac7Transactions')}</span><b>${d.totalTransactions ?? 0}</b></div>`}
+          ${vat && html`<div class="mc-money-row"><span class="mc-mini">${t('myCompany.vatTotal')} (${vat.rate}%)</span><b>${fmtMoney(vat.totalVat ?? 0, vat.currency || 'EUR')}</b></div>`}
+        </div>`}
+
+      <!-- ── Legacy: an individual seller's OWN standalone Stripe secret (rarely needed) ── -->
+      <div class="mc-label">
+        <button class="btn-ghost btn-sm" onClick=${() => setShowLegacy(v => !v)}>${showLegacy ? t('myCompany.pspHideLegacy') : t('myCompany.pspShowLegacy')}</button>
+      </div>
+      ${showLegacy && html`
+        <div>
+          <div class="mc-label">${t('myCompany.pspTitle')}
+            ${psp && psp.configured
+              ? html`<span class="mc-chip mc-chip-ok">${t('myCompany.pspConfigured')} ${psp.keyHint || ''}</span>`
+              : html`<span class="mc-chip mc-chip-warn">${t('myCompany.pspMissing')}</span>`}
+          </div>
+          <span class="mc-mini">${t('myCompany.pspHint')}</span>
+          <div class="flex-row-wrap mc-manage-row">
+            <input class="input-field input-sm mc-psp-input" type="password" placeholder="sk_test_…" value=${keyIn} onInput=${(e) => setKeyIn(e.target.value)} />
+            <button class="btn-primary btn-sm" disabled=${pspBusy || keyIn.trim().length < 8} onClick=${savePsp}>${t('myCompany.pspSave')}</button>
+            ${psp && psp.configured && html`<button class="btn-ghost btn-sm mc-remove" disabled=${pspBusy} onClick=${removePsp}>${t('myCompany.pspRemove')}</button>`}
+          </div>
+          ${pspMsg && html`<span class="mc-mini">${pspMsg}</span>`}
+        </div>`}
+    </div>`;
+}

package/dist/public/views/portal-classic.js

@@ -198,7 +198,6 @@ AIMEAT is an open protocol where AI agents get persistent memory, publish servic
 The AIMEAT node is at: ${n}
 MCP endpoint: ${n}/v1/mcp (StreamableHTTP transport)
 Documentation: ${n}/v1/docs
-OpenClaw deep-dive: ${n}/v1/openclaw
 
 ## Step 1 \u2014 Ask me:
 1. What agent runtime are you using?
@@ -478,9 +477,6 @@ export default function PortalClassicView({ navigate }) {
               />
             </div>
           </div>
-          <div style="margin-top:0.75rem;text-align:center">
-            <a href="/v1/openclaw" class="cl-connect-link" onClick=${e => { e.preventDefault(); navigate('/v1/openclaw'); }}>${ct('groups.forAgents.readMore')} \u2192</a>
-          </div>
         </div>
       <//>
 

package/dist/public/views/portal-dev.js

@@ -10,6 +10,8 @@
  *   v1.1.1 — 2026-06-19 — JSDoc type annotations for frontend type-checking
  *   v1.2.0 — 2026-07-13 — Split into sibling modules (shared/background/panels/
  *     upload) to satisfy max-file-lines; render output unchanged.
+ *   v1.3.0 — 2026-07-14 — Add a source-repos row at the top: GitHub links to
+ *     aimeat-protocol + crewaimeat, each with the GitHub Octocat mark.
  */
 import { useState, useEffect, useCallback } from 'preact/hooks';
 import { useViewCSS } from '/components/useViewCSS.js';
@@ -19,6 +21,9 @@ import { BackgroundLayer, BgSelector } from './portal-dev.background.js';
 import { CapTabs } from './portal-dev.panels.js';
 import { UploadSection, CommunityApps } from './portal-dev.upload.js';
 
+// The familiar GitHub "Octocat" mark. fill=currentColor so it inherits the link's themed color.
+const GH_MARK = html`<svg class="gh-mark" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"></path></svg>`;
+
 /* ══════════════════════════════════════════════
    MAIN VIEW
    ══════════════════════════════════════════════ */
@@ -88,6 +93,12 @@ export default function PortalDevView({ locale }) {
       <p class="dv-subtitle">${dt('subtitle', locale)}</p>
       <div class="dv-node-badge"><${StatusDot} status="online" /> ${NODE_URL}</div>
 
+      <!-- Source repos: the protocol/node and the local agent fleet, both on GitHub -->
+      <div class="dv-repos">
+        <a class="dv-repo-link" href="https://github.com/miikkij/aimeat-protocol" target="_blank" rel="noopener">${GH_MARK}${dt('repos.protocol', locale)}</a>
+        <a class="dv-repo-link" href="https://github.com/miikkij/crewaimeat" target="_blank" rel="noopener">${GH_MARK}${dt('repos.crew', locale)}</a>
+      </div>
+
       <!-- Stats -->
       <div class="stat-grid">
         <div class="stat-card"><div class="stat-card-value accent">${stats.agents}</div><div class="stat-card-label">${dt('stats.agents', locale)}</div></div>