aimeat 1.40.1 → 2.1.0

package/dist/public/views/profile/appdev-tab.js

@@ -0,0 +1,275 @@
+/**
+ * @file appdev-tab.js
+ * @description Profile → AppDev — the human-facing window into the AppDev knowledge base:
+ *   (1) copyable start prompts (the research-first flow prompt for Claude Code/OpenHands +
+ *   the canonical build-app prompt), (2) learned pitfalls with share/outdated/delete
+ *   management and model/app attribution, (3) agent-proposed template proposals with
+ *   derived-from links and proofs, (4) the curated node registry (read-only). Everything an
+ *   owner needs to follow what agents learned and to start the next build right.
+ * @structure AppDevTab (default export) — sections: StartPrompts · LearnedPitfalls ·
+ *   TemplateProposals · CuratedPitfalls
+ * @usage registered in views/profile.js TABS + landing-page.cards.js SIDEBAR_GROUPS (id 'appdev').
+ * @version-history
+ *   v1.0.0 — 2026-07-19 — initial (AppDev KB UI phase).
+ */
+import { h } from 'preact';
+import { useState, useEffect, useRef } from 'preact/hooks';
+import htm from 'htm';
+const html = htm.bind(h);
+import { t } from '/js/i18n.js';
+import { Spinner, KebabMenu } from './shared.js';
+import { CopyButton } from '/components/CopyButton.js';
+import {
+  getFlowPromptText, getBuildPromptText, getCuratedPitfalls, getLearnedPitfalls,
+  updateLearnedPitfall, deleteLearnedPitfall, getTemplateProposals, deleteTemplateProposal,
+} from '/js/services/appdev.js';
+
+const SEV_CLASS = { critical: 'pf-adk-sev--critical', warn: 'pf-adk-sev--warn', info: 'pf-adk-sev--info' };
+
+function sevBadge(severity) {
+  return html`<span class="pf-adk-sev ${SEV_CLASS[severity] || SEV_CLASS.info}">${t('profile.appdev.severity.' + (severity || 'info'))}</span>`;
+}
+
+function chip(text, cls = '') {
+  if (!text) return null;
+  return html`<span class="pf-adk-chip ${cls}">${text}</span>`;
+}
+
+// ── Section 1: copyable start prompts ──────────────────────────────────────
+function StartPrompts({ locale, showToast }) {
+  const [flow, setFlow] = useState(null);
+  const [build, setBuild] = useState(null);
+  const [open, setOpen] = useState(null); // 'flow' | 'build' | null
+
+  useEffect(() => {
+    getFlowPromptText().then(setFlow).catch(() => setFlow(''));
+    getBuildPromptText(locale).then(setBuild).catch(() => setBuild(''));
+  }, [locale]);
+
+  const box = (id, title, desc, text) => html`
+    <div class="card pf-adk-prompt-card">
+      <div class="pf-adk-prompt-head">
+        <div>
+          <div class="pf-adk-prompt-title">${title}</div>
+          <div class="section-desc">${desc}</div>
+        </div>
+        <div class="pf-adk-prompt-actions">
+          <button class="btn-ghost" onClick=${() => setOpen(open === id ? null : id)}>
+            ${open === id ? t('profile.appdev.hidePrompt') : t('profile.appdev.showPrompt')}
+          </button>
+          ${text != null && html`<${CopyButton} text=${text} className="copy-prompt-btn" label=${t('profile.appdev.copyPrompt')} onCopied=${() => showToast(t('profile.appdev.copied'))} />`}
+        </div>
+      </div>
+      ${open === id && html`<pre class="pf-adk-prompt-body">${text ?? t('profile.loading')}</pre>`}
+    </div>`;
+
+  return html`
+    <div class="section-title">${t('profile.appdev.promptsTitle')}</div>
+    <div class="section-desc">${t('profile.appdev.promptsDesc')}</div>
+    ${box('flow', t('profile.appdev.flowPromptTitle'), t('profile.appdev.flowPromptDesc'), flow)}
+    ${box('build', t('profile.appdev.buildPromptTitle'), t('profile.appdev.buildPromptDesc'), build)}
+  `;
+}
+
+// ── Section 2: learned pitfalls ────────────────────────────────────────────
+function LearnedPitfalls({ showToast }) {
+  const [data, setData] = useState(null);
+  const [includeShared, setIncludeShared] = useState(false);
+  const [showOutdated, setShowOutdated] = useState(false);
+  const [expanded, setExpanded] = useState(null);
+
+  async function load(shared = includeShared) {
+    try { setData(await getLearnedPitfalls(shared)); } catch { setData({ pitfalls: [], total: 0 }); }
+  }
+  const liveRef = useRef(load); liveRef.current = load;
+  useEffect(() => { liveRef.current(includeShared); }, [includeShared]);
+  useEffect(() => {
+    const handler = () => liveRef.current();
+    window.addEventListener('aimeat-live-update', handler);
+    return () => window.removeEventListener('aimeat-live-update', handler);
+  }, []);
+
+  async function toggleShare(p) {
+    try {
+      await updateLearnedPitfall(p.category, p.slug, { share: !p.shared });
+      showToast(!p.shared ? t('profile.appdev.sharedOn') : t('profile.appdev.sharedOff'));
+      load();
+    } catch (e) { showToast(e.message, true); }
+  }
+  async function toggleOutdated(p) {
+    try {
+      await updateLearnedPitfall(p.category, p.slug, { status: p.status === 'outdated' ? 'active' : 'outdated' });
+      load();
+    } catch (e) { showToast(e.message, true); }
+  }
+  async function remove(p) {
+    try {
+      await deleteLearnedPitfall(p.category, p.slug);
+      showToast(t('profile.appdev.deleted'));
+      load();
+    } catch (e) { showToast(e.message, true); }
+  }
+
+  if (!data) return html`<${Spinner} text=${t('profile.loading')} />`;
+  let rows = data.pitfalls;
+  if (!showOutdated) rows = rows.filter(p => p.status !== 'outdated');
+
+  return html`
+    <div class="section-title">${t('profile.appdev.learnedTitle')}</div>
+    <div class="section-desc">${t('profile.appdev.learnedDesc')}</div>
+    <div class="pf-adk-filters">
+      <label class="pf-adk-filter"><input type="checkbox" checked=${includeShared} onChange=${e => setIncludeShared(e.target.checked)} /> ${t('profile.appdev.showShared')}</label>
+      <label class="pf-adk-filter"><input type="checkbox" checked=${showOutdated} onChange=${e => setShowOutdated(e.target.checked)} /> ${t('profile.appdev.showOutdated')}</label>
+    </div>
+    ${rows.length === 0 && html`<div class="card pf-adk-empty">${t('profile.appdev.learnedEmpty')}</div>`}
+    ${rows.map(p => html`
+      <div class="card pf-adk-row ${p.status === 'outdated' ? 'pf-adk-row--outdated' : ''}" key=${p.key + (p.owner || '')}>
+        <div class="pf-adk-row-head" onClick=${() => setExpanded(expanded === p.key ? null : p.key)}>
+          <div class="pf-adk-row-title">
+            ${sevBadge(p.severity)}
+            <span>${p.title}</span>
+          </div>
+          <div class="pf-adk-row-chips">
+            ${chip(p.category, 'pf-adk-chip--cat')}
+            ${chip(p.model, 'pf-adk-chip--model')}
+            ${p.source === 'shared' && chip(t('profile.appdev.fromCommunity'), 'pf-adk-chip--shared')}
+            ${p.source === 'own' && p.shared && chip(t('profile.appdev.sharedBadge'), 'pf-adk-chip--shared')}
+            ${p.status === 'outdated' && chip(t('profile.appdev.outdatedBadge'), 'pf-adk-chip--outdated')}
+          </div>
+          ${p.source === 'own' && html`
+            <${KebabMenu} label=${t('profile.appdev.actions')} items=${[
+              { label: p.shared ? t('profile.appdev.unshare') : t('profile.appdev.share'), onClick: () => toggleShare(p) },
+              { label: p.status === 'outdated' ? t('profile.appdev.markActive') : t('profile.appdev.markOutdated'), onClick: () => toggleOutdated(p) },
+              { divider: true },
+              { label: t('profile.appdev.delete'), danger: true, onClick: () => remove(p) },
+            ]} />`}
+        </div>
+        ${expanded === p.key && html`
+          <div class="pf-adk-row-body">
+            <div><strong>${t('profile.appdev.symptom')}:</strong> ${p.symptom}</div>
+            <div><strong>${t('profile.appdev.resolution')}:</strong> ${p.resolution}</div>
+            ${p.app_ref && html`<div><strong>${t('profile.appdev.relatedApp')}:</strong> <code>${p.app_ref}</code></div>`}
+            ${p.owner && html`<div><strong>${t('profile.appdev.sharedBy')}:</strong> <code>${p.owner}</code></div>`}
+          </div>`}
+      </div>`)}
+  `;
+}
+
+// ── Section 3: template proposals ──────────────────────────────────────────
+function TemplateProposals({ showToast }) {
+  const [data, setData] = useState(null);
+  const [expanded, setExpanded] = useState(null);
+
+  async function load() {
+    try { setData(await getTemplateProposals()); } catch { setData({ templates: [], total: 0 }); }
+  }
+  useEffect(() => { load(); }, []);
+  const liveRef = useRef(load); liveRef.current = load;
+  useEffect(() => {
+    const handler = () => liveRef.current();
+    window.addEventListener('aimeat-live-update', handler);
+    return () => window.removeEventListener('aimeat-live-update', handler);
+  }, []);
+
+  async function remove(tpl) {
+    try {
+      await deleteTemplateProposal(tpl.id);
+      showToast(t('profile.appdev.deleted'));
+      load();
+    } catch (e) { showToast(e.message, true); }
+  }
+
+  if (!data) return html`<${Spinner} text=${t('profile.loading')} />`;
+
+  return html`
+    <div class="section-title">${t('profile.appdev.templatesTitle')}</div>
+    <div class="section-desc">${t('profile.appdev.templatesDesc')}</div>
+    ${data.templates.length === 0 && html`<div class="card pf-adk-empty">${t('profile.appdev.templatesEmpty')}</div>`}
+    ${data.templates.map(tpl => html`
+      <div class="card pf-adk-row" key=${tpl.id}>
+        <div class="pf-adk-row-head" onClick=${() => setExpanded(expanded === tpl.id ? null : tpl.id)}>
+          <div class="pf-adk-row-title">
+            ${chip(tpl.tier, 'pf-adk-chip--tier')}
+            <span>${tpl.title}</span>
+          </div>
+          <div class="pf-adk-row-chips">
+            ${chip(tpl.model, 'pf-adk-chip--model')}
+            ${chip(tpl.startMode, 'pf-adk-chip--cat')}
+            ${(tpl.proofs || []).length > 0 && chip(t('profile.appdev.proofsCount', { count: tpl.proofs.length }), 'pf-adk-chip--proof')}
+          </div>
+          <${KebabMenu} label=${t('profile.appdev.actions')} items=${[
+            { label: t('profile.appdev.openSourceApp'), onClick: () => window.open(`/v1/apps/${encodeURIComponent(tpl.derivedFrom.owner)}/${encodeURIComponent(tpl.derivedFrom.filename)}`, '_blank') },
+            { divider: true },
+            { label: t('profile.appdev.delete'), danger: true, onClick: () => remove(tpl) },
+          ]} />
+        </div>
+        ${expanded === tpl.id && html`
+          <div class="pf-adk-row-body">
+            <div>${tpl.description}</div>
+            <div><strong>${t('profile.appdev.derivedFrom')}:</strong> <code>${tpl.derivedFrom.owner}/${tpl.derivedFrom.filename}</code> v${tpl.derivedFrom.version}</div>
+            <div><strong>${t('profile.appdev.reuseNotes')}:</strong> ${tpl.reuseNotes}</div>
+            ${(tpl.packs || []).length > 0 && html`<div><strong>${t('profile.appdev.packs')}:</strong> ${tpl.packs.map(pk => chip(pk, 'pf-adk-chip--cat'))}</div>`}
+            ${(tpl.proofs || []).length > 0 && html`
+              <div><strong>${t('profile.appdev.proofs')}:</strong>
+                ${tpl.proofs.map(pr => chip(`${pr.model}: ${pr.verdict}`, pr.verdict === 'pass' ? 'pf-adk-chip--proof' : 'pf-adk-chip--outdated'))}
+              </div>`}
+          </div>`}
+      </div>`)}
+  `;
+}
+
+// ── Section 4: curated registry (read-only) ────────────────────────────────
+function CuratedPitfalls() {
+  const [data, setData] = useState(null);
+  const [filter, setFilter] = useState('');
+  const [expanded, setExpanded] = useState(null);
+  const [show, setShow] = useState(false);
+
+  const dataRef = useRef(data); dataRef.current = data;
+  useEffect(() => {
+    if (show && !dataRef.current) getCuratedPitfalls().then(setData).catch(() => setData({ pitfalls: [], facets: {} }));
+  }, [show]);
+
+  const areas = data?.facets?.applies_to ? Object.keys(data.facets.applies_to) : [];
+  let rows = data?.pitfalls ?? [];
+  if (filter) rows = rows.filter(p => (p.appliesTo || []).includes(filter));
+
+  return html`
+    <div class="section-title">${t('profile.appdev.curatedTitle')}</div>
+    <div class="section-desc">${t('profile.appdev.curatedDesc')}</div>
+    ${!show && html`<button class="btn-outline" onClick=${() => setShow(true)}>${t('profile.appdev.showCurated')}</button>`}
+    ${show && !data && html`<${Spinner} text=${t('profile.loading')} />`}
+    ${show && data && html`
+      <div class="pf-adk-filters">
+        <button class="btn-ghost ${filter === '' ? 'pf-adk-filter--active' : ''}" onClick=${() => setFilter('')}>${t('profile.appdev.allAreas')}</button>
+        ${areas.map(a => html`<button class="btn-ghost ${filter === a ? 'pf-adk-filter--active' : ''}" onClick=${() => setFilter(filter === a ? '' : a)}>${a} (${data.facets.applies_to[a]})</button>`)}
+      </div>
+      ${rows.map(p => html`
+        <div class="card pf-adk-row" key=${p.id}>
+          <div class="pf-adk-row-head" onClick=${() => setExpanded(expanded === p.id ? null : p.id)}>
+            <div class="pf-adk-row-title">${sevBadge(p.severity)}<span>${p.title}</span></div>
+            <div class="pf-adk-row-chips">${(p.appliesTo || []).map(a => chip(a, 'pf-adk-chip--cat'))}</div>
+          </div>
+          ${expanded === p.id && html`
+            <div class="pf-adk-row-body">
+              <div><strong>${t('profile.appdev.symptom')}:</strong> ${p.symptom}</div>
+              <div><strong>${t('profile.appdev.resolution')}:</strong> ${p.fix}</div>
+            </div>`}
+        </div>`)}
+    `}
+  `;
+}
+
+// ── The tab ────────────────────────────────────────────────────────────────
+export default function AppDevTab({ showToast, locale }) {
+  return html`
+    <div class="pf-adk">
+      <div class="section-title">${t('profile.appdev.title')}</div>
+      <div class="section-desc">${t('profile.appdev.desc')}</div>
+      <${StartPrompts} locale=${locale} showToast=${showToast} />
+      <${LearnedPitfalls} showToast=${showToast} />
+      <${TemplateProposals} showToast=${showToast} />
+      <${CuratedPitfalls} />
+    </div>
+  `;
+}

package/dist/public/views/profile/apps-tab.js

@@ -2,6 +2,12 @@
  * @file apps-tab.js
  * @description Profile tab for HTML app management — upload, gallery, access code editing.
  * @version-history
+ *   v1.7.0 — 2026-07-17 — Agent-Bundled Apps Slice 2: the Deploy action opens a panel with a
+ *     crew-def inspector (crew/tools/tasks) + runner and organism pickers instead of one-click
+ *     defaulting to crew-forge.
+ *   v1.6.0 — 2026-07-16 — Agent-Bundled Apps: My-Apps cards show a "ships an agent" badge for apps
+ *     declaring manifest.cortex.agents, with per-agent Deploy/Undeploy onto the owner's own fleet
+ *     and liveness read from the deploy status endpoint (AppAgents component).
  *   v1.5.0 — 2026-07-06 — Bound skills (2d): each My-Apps card shows the skills that teach agents
  *     this app + an attach/detach picker (rewrites the skill's frontmatter metadata.binding).
  *   v1.4.0 — 2026-06-26 — Add "Edit details" (rename + edit description) to My Apps — updates the
@@ -18,11 +24,14 @@ import { h } from 'preact';
 import { useState, useEffect, useRef, useCallback } from 'preact/hooks';
 import htm from 'htm';
 const html = htm.bind(h);
-import { t } from '/js/i18n.js';
+import { t, getLocale } from '/js/i18n.js';
 import { escHtml, handleImgError, timeAgo } from '/js/utils.js';
 import { Spinner } from './shared.js';
 import { useConfirm } from '/components/Modal.js';
-import { listApps, uploadApp, deleteApp, patchApp } from '/js/services/apps.js';
+import { listApps, uploadApp, deleteApp, patchApp, deployAppAgent, undeployAppAgent, appAgentStatus } from '/js/services/apps.js';
+import { getMemory } from '/js/services/memory.js';
+import { listAgents } from '/js/services/agents.js';
+import { listOrganisms } from '/js/services/organisms.js';
 import * as skillsService from '/js/services/skills.js';
 import { getNodeUrl } from '/js/services/auth.js';
 import { recordRecent } from '/js/recents.js';
@@ -112,6 +121,162 @@ function AppSkills({ owner, filename, showToast }) {
   `;
 }
 
+/**
+ * Agent-Bundled Apps: the crew-defs this app ships (manifest.cortex.agents), each with a
+ * deploy panel (crew-def inspector + runner/organism pickers) targeting the OWNER'S OWN
+ * fleet, Undeploy, and liveness from the status endpoint (agent registration + the
+ * agents.<name>.deploy key the fleet writes). Deploy targets the signed-in owner by
+ * construction — the node hard-rejects any other target.
+ */
+function AppAgents({ owner, filename, agents, showToast, session }) {
+  const [statuses, setStatuses] = useState({});
+  const [busy, setBusy] = useState('');
+  const [openDef, setOpenDef] = useState(null);   // agent_name whose deploy panel is open
+  const [myAgents, setMyAgents] = useState(null); // runner picker options (lazy)
+  const [myOrgs, setMyOrgs] = useState(null);     // organism picker options (lazy)
+  const [runner, setRunner] = useState('');
+  const [organism, setOrganism] = useState('');
+
+  const loadStatuses = useCallback(async () => {
+    const next = {};
+    await Promise.all(agents.map(async (def) => {
+      try {
+        const resp = await appAgentStatus(owner, filename, def.agent_name);
+        if (resp?.ok !== false && resp?.data) next[def.agent_name] = resp.data;
+      } catch { /* leave unknown */ }
+    }));
+    setStatuses(next);
+  }, [owner, filename, agents]);
+
+  useEffect(() => {
+    loadStatuses();
+    const handler = () => loadStatuses();
+    window.addEventListener('aimeat-live-update', handler);
+    return () => window.removeEventListener('aimeat-live-update', handler);
+  }, [loadStatuses]);
+
+  async function openPanel(def) {
+    if (openDef === def.agent_name) { setOpenDef(null); return; }
+    setOpenDef(def.agent_name);
+    if (myAgents === null) {
+      try {
+        const list = await listAgents(session.owner);
+        const rank = m => (m === 'task-runner' ? 0 : m === 'autonomous' ? 1 : 2);
+        list.sort((a, b) => rank(a.mode) - rank(b.mode));
+        setMyAgents(list);
+        setRunner(list.some(a => a.name === 'crew-forge') ? 'crew-forge' : (list[0]?.name ?? ''));
+      } catch { setMyAgents([]); }
+      try {
+        const resp = await listOrganisms({ member: session.owner });
+        setMyOrgs(resp?.data?.organisms ?? []);
+      } catch { setMyOrgs([]); }
+    }
+  }
+
+  async function act(def, deploy) {
+    setBusy(def.agent_name);
+    try {
+      const opts = {};
+      if (deploy && runner) opts.runner_agent = runner;
+      if (deploy && organism) opts.organism_id = organism;
+      const resp = deploy
+        ? await deployAppAgent(owner, filename, def.agent_name, opts)
+        : await undeployAppAgent(owner, filename, def.agent_name, runner ? { runner_agent: runner } : {});
+      if (resp?.ok !== false) {
+        const auto = resp?.data?.auto_activated;
+        showToast(deploy
+          ? (auto ? (t('profile.apps.agentDeployStarted') || 'Deploy task started on your fleet') : (t('profile.apps.agentDeployQueued') || 'Deploy task queued — start it from the Tasks tab'))
+          : (t('profile.apps.agentUndeployQueued') || 'Undeploy task sent to your fleet'));
+        if (deploy) setOpenDef(null);
+        setTimeout(loadStatuses, 1500);
+      } else {
+        showToast(resp?.error?.message || (t('profile.apps.agentDeployFailed') || 'Deploy failed'), true);
+      }
+    } catch (err) {
+      showToast((t('profile.apps.agentDeployFailed') || 'Deploy failed') + ': ' + err.message, true);
+    } finally { setBusy(''); }
+  }
+
+  return html`
+    <div class="pf-app-skills">
+      <span class="text-meta">${t('profile.apps.agentsLabel') || 'Bundled agents'}:</span>
+      ${agents.map(def => {
+        const s = statuses[def.agent_name];
+        const live = !!s?.live && s?.deploy_state?.status !== 'undeployed';
+        return html`
+          <span key=${def.agent_name} class="pf-app-skill-chip flex-row">
+            <span class="badge ${live ? 'badge-success' : 'badge-dim'}" title=${s?.deployed_agent_name || ''}>
+              \u{1F916} ${escHtml(def.agent_name)} ${live ? '● ' + (t('profile.apps.agentLive') || 'live') : '○ ' + (t('profile.apps.agentOffline') || 'not deployed')}
+            </span>
+            ${live
+              ? html`<button class="btn-outline btn-sm" disabled=${busy === def.agent_name} onClick=${() => act(def, false)}>${t('profile.apps.agentUndeploy') || 'Undeploy'}</button>`
+              : html`<button class="btn-primary btn-sm" onClick=${() => openPanel(def)}>${t('profile.apps.agentDeploy') || 'Deploy to my fleet'}…</button>`}
+          </span>`;
+      })}
+      <button class="btn-ghost btn-sm" onClick=${loadStatuses} title=${t('profile.apps.agentRefresh') || 'Refresh status'}>↻</button>
+    </div>
+    ${agents.filter(def => openDef === def.agent_name).map(def => html`
+      <div key=${'panel-' + def.agent_name} class="pf-edit-panel">
+        <div class="text-meta mb-half"><strong>\u{1F916} ${escHtml(def.agent_name)}</strong>${def.llm_profile ? html` <span class="badge badge-dim">${escHtml(def.llm_profile)}</span>` : ''}${def.process ? html` <span class="badge badge-dim">${escHtml(def.process)}</span>` : ''}</div>
+        <div class="text-meta mb-half">${t('profile.apps.agentCrew') || 'Crew'}:</div>
+        ${(def.agents ?? []).map(a => html`
+          <div key=${a.role} class="text-meta-sm mb-half">
+            <strong>${escHtml(a.role)}</strong> — ${escHtml(a.goal || '')}
+            ${(a.tools ?? []).map(x => html` <span class="badge badge-dim">${escHtml(x)}</span>`)}
+            ${(a.skills ?? []).map(x => html` <span class="badge badge-info">${escHtml(x)}</span>`)}
+          </div>`)}
+        <div class="text-meta mb-half">${t('profile.apps.agentTasks') || 'Tasks'}:</div>
+        ${(def.tasks ?? []).map((tk, i) => html`
+          <div key=${tk.id || i} class="text-meta-sm mb-half">• ${escHtml(String(tk.description || '').slice(0, 140))}</div>`)}
+        <div class="flex-row-wrap mb-half">
+          <label class="text-meta">${t('profile.apps.agentRunnerLabel') || 'Runner'}
+            <select class="input-field" value=${runner} onChange=${e => setRunner(e.target.value)}>
+              ${myAgents === null ? html`<option value="">…</option>`
+                : myAgents.length === 0 ? html`<option value="">${t('profile.apps.agentNoRunners') || 'no agents — connect one first'}</option>`
+                : myAgents.map(a => html`<option key=${a.name} value=${a.name}>${a.name}${a.mode === 'task-runner' ? ' · task-runner' : a.mode ? ' · ' + a.mode : ''}</option>`)}
+            </select>
+          </label>
+          <label class="text-meta">${t('profile.apps.agentOrganismLabel') || 'Organism (optional)'}
+            <select class="input-field" value=${organism} onChange=${e => setOrganism(e.target.value)}>
+              <option value="">—</option>
+              ${(myOrgs ?? []).map(o => html`<option key=${o.id} value=${o.id}>${escHtml(o.name || o.id)}</option>`)}
+            </select>
+          </label>
+        </div>
+        <div class="text-meta-sm mb-half">${t('profile.apps.agentDeployHint') || 'Creates a deploy task on YOUR own runner. The fleet reads the crew definition from the manifest and starts the agent under your account.'}</div>
+        <div class="flex-row">
+          <button class="btn-primary btn-sm" disabled=${busy === def.agent_name || !runner} onClick=${() => act(def, true)}>${t('profile.apps.agentDeploy') || 'Deploy to my fleet'}</button>
+          <button class="btn-outline btn-sm" onClick=${() => setOpenDef(null)}>${t('profile.cancel') || 'Cancel'}</button>
+        </div>
+      </div>`)}`;
+}
+
+/**
+ * The ready-made prompt for authoring crew-defs in the user's own AI chat (the AIMEAT
+ * prompt-driven pattern): embeds the app context + current defs + the schema rules the node
+ * enforces at save, and asks for ONLY the JSON array back — paste it into the editor.
+ */
+function buildAgentAuthoringPrompt(app, currentAgents) {
+  return `You are writing the "bundled agents" for an AIMEAT app — declarative crew definitions (crewaimeat crew_def JSON) that the app's users can deploy onto their own agent fleet. Output ONLY a JSON array of crew-def objects (no prose, no markdown fences).
+
+APP CONTEXT
+- Name: ${app.manifest?.name || app.filename}
+- Description: ${app.manifest?.description || '(none)'}
+
+CURRENT CREW-DEFS (edit these, or design new ones):
+${JSON.stringify(currentAgents ?? [], null, 2)}
+
+SCHEMA RULES (the node rejects anything that violates these):
+- Array of 1-5 crew-def objects. Each: { "agent_name", "agents", "tasks", optional "readme_md", "llm_profile" ("content"|"coding"|"content-free"), "temperature" (0-2), "tags", "skills", "process" ("sequential"|"hierarchical") }.
+- "agent_name": 3-32 chars, lowercase alphanumeric + hyphens, unique across the array.
+- "agents": 1-10 crew members: { "role", "goal", optional "backstory", "tools" (names from the vetted set: web, memory, schedule, delegate, image, app_build), "skills", "allow_delegation" (boolean) }. Use several members + "process": "hierarchical" when the work needs an orchestrator over specialists.
+- "tasks": 1-20 items: { "id", "description", "expected_output", "agent" (must equal a declared role), optional "context" (ids of EARLIER tasks whose output feeds this one), "async" }.
+- At least one task description MUST contain the literal placeholder {{ctx.prompt}} — that is where the user's request is injected at runtime.
+- The crew-def is pure data. Never include code.
+
+Design the crew to genuinely serve this app's users, then output the JSON array.`;
+}
+
 export default function AppsTab({ session, showToast, onStats }) {
   const { confirm, ConfirmUI } = useConfirm();
   const NODE_URL = getNodeUrl();
@@ -123,6 +288,10 @@ export default function AppsTab({ session, showToast, onStats }) {
   const [editingMeta, setEditingMeta] = useState(null);
   const [editName, setEditName] = useState('');
   const [editDesc, setEditDesc] = useState('');
+  const [editingAgents, setEditingAgents] = useState(null);
+  const [agentsJson, setAgentsJson] = useState('');
+  // Promoted apps (from the owner's public app-catalog.promoted doc), keyed by "owner/filename".
+  const [promoted, setPromoted] = useState({});
 
   // Reload the app lists when the session becomes available / changes. loadData closes over the
   // optional onStats prop (not guaranteed memoized), so we key on session only to avoid re-running
@@ -140,6 +309,14 @@ export default function AppsTab({ session, showToast, onStats }) {
       setAllApps(list);
       onStats?.({ apps: own.length });
     } catch { setMyApps([]); setAllApps([]); }
+    // Promoted apps: read the owner's own app-catalog.promoted doc (soft = no 404 when unset).
+    try {
+      const res = await getMemory('app-catalog.promoted', { soft: true });
+      const items = res?.data?.value?.items;
+      const map = {};
+      if (Array.isArray(items)) items.forEach(it => { if (it && it.ref) map[it.ref] = it.text || {}; });
+      setPromoted(map);
+    } catch { setPromoted({}); }
   }
 
   async function handleUpload(file, description, screenshot, accessCode) {
@@ -184,6 +361,53 @@ export default function AppsTab({ session, showToast, onStats }) {
     setEditDesc(app.manifest?.description || '');
   }
 
+  // Agent-Bundled Apps authoring: add/edit/remove the crew-defs an app ships, without
+  // re-uploading its HTML. The editor is JSON-first (a crew-def IS data) + a ready-made
+  // AI prompt in the platform's prompt-driven pattern; the node validates on save.
+  function startEditAgents(app) {
+    if (editingAgents === app.filename) { setEditingAgents(null); return; }
+    setEditingAgents(app.filename);
+    setAgentsJson(JSON.stringify(app.manifest?.cortex?.agents ?? [], null, 2));
+  }
+
+  async function handleCopyAgentPrompt(app) {
+    let current;
+    try { current = JSON.parse(agentsJson); } catch { current = app.manifest?.cortex?.agents ?? []; }
+    try {
+      await navigator.clipboard.writeText(buildAgentAuthoringPrompt(app, current));
+      showToast(t('profile.apps.agentPromptCopied') || 'Prompt copied — paste it to your AI chat, then paste the JSON result back here');
+    } catch {
+      showToast(t('profile.apps.agentPromptCopyFailed') || 'Copy failed — clipboard unavailable', true);
+    }
+  }
+
+  async function handleSaveAgents(filename) {
+    let parsed;
+    try {
+      parsed = JSON.parse(agentsJson.trim() || '[]');
+    } catch (err) {
+      showToast((t('profile.apps.agentJsonInvalid') || 'Not valid JSON') + ': ' + err.message, true);
+      return;
+    }
+    if (!Array.isArray(parsed)) {
+      showToast(t('profile.apps.agentJsonNotArray') || 'Expected a JSON ARRAY of crew-def objects', true);
+      return;
+    }
+    try {
+      const resp = await patchApp(filename, { cortex: { agents: parsed } });
+      if (resp.ok === false) throw new Error(resp?.error?.message || 'Update failed');
+      showToast(parsed.length === 0
+        ? (t('profile.apps.agentEditCleared') || 'Bundled agents removed')
+        : (t('profile.apps.agentEditSaved') || 'Bundled agents saved'));
+      setEditingAgents(null);
+      loadData();
+    } catch (err) {
+      // Surface the node's real crew-def validation errors verbatim — that IS the editor's
+      // linter (api() throws on an ok:false envelope, carrying error.message).
+      showToast(err.message || (t('profile.apps.updateFailed') || 'Update failed'), true);
+    }
+  }
+
   function cancelEditMeta() {
     setEditingMeta(null);
     setEditName('');
@@ -266,12 +490,19 @@ export default function AppsTab({ session, showToast, onStats }) {
               <span class="badge badge-info">${escHtml(a.mime_type || a.content_type || 'html')}</span>
               ${a.protected ? html`<span class="badge badge-warn">\u{1F512}</span>` : ''}
               ${a.parked ? html`<span class="badge badge-dim">\u{1F17F}️ ${t('profile.apps.parkedBadge') || 'Parked'}</span>` : ''}
+              ${a.manifest?.cortex?.agents?.length ? html`<span class="badge badge-info" title=${t('profile.apps.agentBadgeHint') || 'This app ships its own agent — deploy it onto your fleet below'}>\u{1F916} ${t('profile.apps.agentBadge') || 'Ships an agent'}</span>` : ''}
+              ${promoted[`${a.owner || session.owner}/${a.filename || a.name}`] ? html`<span class="badge badge-success" title=${t('profile.apps.promotedBadgeHint') || 'Promoted on your public profile — manage the pitch in the app catalog'}>\u{1F4E3} ${t('profile.apps.promotedBadge') || 'Promoted'}</span>` : ''}
               ${a.operator_hidden ? html`<span class="badge badge-danger">\u{1F6AB} ${t('profile.apps.operatorHiddenBadge') || 'Moderated by operator: hidden'}</span>` : ''}
             </div>
           </div>
           ${a.operator_hidden ? html`<div class="text-meta-sm mb-half">${t('profile.apps.operatorHiddenHint') || 'An operator has hidden this app from public view. Only you can still see it. Contact the operator to appeal.'}${a.operator_hide_reason ? ' — ' + escHtml(a.operator_hide_reason) : ''}</div>` : ''}
           ${a.parked ? html`<div class="text-meta-sm mb-half">${t('profile.apps.parkedHint') || 'Only you can see and use this — hidden from the public catalogue.'}</div>` : ''}
           ${a.manifest?.description ? html`<div class="text-meta mb-half">${escHtml(a.manifest.description)}</div>` : ''}
+          ${(() => {
+            const pt = promoted[`${a.owner || session.owner}/${a.filename || a.name}`];
+            const txt = pt ? (pt[getLocale()] || pt.en || pt.fi || '') : '';
+            return txt ? html`<div class="text-meta-sm mb-half">\u{1F4E3} ${escHtml(txt)}</div>` : '';
+          })()}
           <div class="card-subtitle">
             <a href="${NODE_URL}/v1/apps/${encodeURIComponent(a.owner || session.owner)}/${encodeURIComponent(a.filename || a.name)}" target="_blank">${t('profile.apps.download')}</a>
             ${a.size ? ' \u2022 ' + Math.round(a.size / 1024) + ' KB' : ''}
@@ -286,11 +517,13 @@ export default function AppsTab({ session, showToast, onStats }) {
               window.open(`/v1/apps/${encodeURIComponent(a.owner || session.owner)}/${encodeURIComponent(a.filename || a.name)}?mode=inline`, '_blank');
             }}>${t('profile.apps.launch') || 'Launch'}</button>
             <button class="btn-sm" onClick=${() => startEditMeta(a)}>${t('profile.apps.editDetails') || 'Edit Details'}</button>
+            <button class="btn-sm" onClick=${() => startEditAgents(a)}>\u{1F916} ${a.manifest?.cortex?.agents?.length ? (t('profile.apps.agentEdit') || 'Edit Agents') : (t('profile.apps.agentAdd') || 'Add Agents')}</button>
             <button class="btn-sm" onClick=${() => startEdit(a)}>${t('profile.apps.editAccess') || 'Edit Access Code'}</button>
             <button class=${a.parked ? 'btn-success btn-sm' : 'btn-outline btn-sm'} onClick=${() => handleTogglePark(a)}>${a.parked ? (t('profile.apps.unpark') || 'Unpark') : (t('profile.apps.park') || 'Park')}</button>
             <button class="btn-danger-solid btn-sm" onClick=${() => handleDelete(a.filename || a.name)}>${t('profile.apps.deleteBtn') || 'Delete'}</button>
           </div>
           <${AppSkills} owner=${a.owner || session.owner} filename=${a.filename || a.name} showToast=${showToast} />
+          ${a.manifest?.cortex?.agents?.length ? html`<${AppAgents} owner=${a.owner || session.owner} filename=${a.filename || a.name} agents=${a.manifest.cortex.agents} showToast=${showToast} session=${session} />` : ''}
           ${editingMeta === a.filename ? html`
             <div class="pf-edit-panel">
               <label class="text-meta mb-half">${t('profile.apps.nameLabel') || 'App Name'}</label>
@@ -304,6 +537,19 @@ export default function AppsTab({ session, showToast, onStats }) {
               </div>
             </div>
           ` : ''}
+          ${editingAgents === a.filename ? html`
+            <div class="pf-edit-panel">
+              <label class="text-meta mb-half">\u{1F916} ${t('profile.apps.agentJsonLabel') || 'Bundled agents (crew-def JSON array)'}</label>
+              <div class="text-meta-sm mb-half">${t('profile.apps.agentEditorHint') || 'A crew-def can hold a whole TEAM: up to 10 crew members per definition (process "hierarchical" adds an orchestrator over them), up to 5 definitions per app. Use "Copy AI prompt" to have your AI write or extend this JSON, then paste the result here and Save — the node validates it strictly.'}</div>
+              <textarea class="prompt-box mb-half" rows="14" spellcheck="false" value=${agentsJson} onInput=${e => setAgentsJson(e.target.value)}></textarea>
+              <div class="flex-row-wrap">
+                <button class="btn-primary btn-sm" onClick=${() => handleSaveAgents(a.filename)}>${t('profile.apps.save') || 'Save'}</button>
+                <button class="btn-info btn-sm" onClick=${() => handleCopyAgentPrompt(a)}>\u{1F4CB} ${t('profile.apps.agentCopyPrompt') || 'Copy AI prompt'}</button>
+                <button class="btn-outline btn-sm" onClick=${() => setEditingAgents(null)}>${t('profile.cancel') || 'Cancel'}</button>
+              </div>
+              <div class="text-meta-sm mt-xs">${t('profile.apps.agentClearHint') || 'Save an empty array [] to remove all bundled agents.'}</div>
+            </div>
+          ` : ''}
           ${editingApp === a.filename ? html`
             <div class="pf-edit-panel">
               <label class="text-meta mb-half">${t('profile.apps.accessCodeLabel') || 'Access Code'}</label>

package/dist/public/views/profile/calibrator-batch.js

@@ -623,7 +623,7 @@ Now return the full modified instruction prompt with the fixes incorporated. Rem
                 <div class="fnd-cal-reflection-cols">
                   <!-- Judge column -->
                   <div class="fnd-cal-reflection-col">
-                    <h4>${t('profile.calibrator.step3a')}</h4>
+                    <div class="card-h3">${t('profile.calibrator.step3a')}</div>
                     ${jp?.error ? html`<div class="fnd-cal-hint" style="color:var(--danger)">Error: ${jp.error}</div>` : ''}
                     ${jp?.proposals?.length > 0 ? html`
                       <ol>
@@ -637,7 +637,7 @@ Now return the full modified instruction prompt with the fixes incorporated. Rem
                   </div>
                   <!-- Self column -->
                   <div class="fnd-cal-reflection-col">
-                    <h4>${t('profile.calibrator.step3b')}</h4>
+                    <div class="card-h3">${t('profile.calibrator.step3b')}</div>
                     ${sp?.error ? html`<div class="fnd-cal-hint" style="color:var(--danger)">Error: ${sp.error}</div>` : ''}
                     ${sp?.proposals?.length > 0 ? html`
                       <ol>