aimeat 1.2.0

package/dist/public/views/admin.js

@@ -0,0 +1,400 @@
+/**
+ * Admin Dashboard — SPA View
+ * Sidebar layout with data preloading and tab components.
+ */
+import { h } from 'preact';
+import { useState, useEffect, useCallback, useRef } from 'preact/hooks';
+import htm from 'htm';
+const html = htm.bind(h);
+import { t } from '/js/i18n.js';
+import { escHtml } from '/js/utils.js';
+import { useViewCSS } from '/components/useViewCSS.js';
+import { getSession, onAuthChange } from '/js/services/auth.js';
+import * as api from '/js/services/admin.js';
+import { connect, disconnect, onUpdate, offUpdate } from '/lib/live-updates.js';
+
+// ── Tab components (loaded eagerly — admin pages are lightweight) ──
+import OverviewTab     from './admin/overview-tab.js';
+import EconomyTab      from './admin/economy-tab.js';
+import ConfigTab       from './admin/config-tab.js';
+import CorsTab         from './admin/cors-tab.js';
+import MaintenanceTab  from './admin/maintenance-tab.js';
+import HooksTab        from './admin/hooks-tab.js';
+import PortalTab       from './admin/portal-tab.js';
+import StatsTab        from './admin/stats-tab.js';
+import OwnersTab       from './admin/owners-tab.js';
+import AgentsTab       from './admin/agents-tab.js';
+import GhiiTab         from './admin/ghii-tab.js';
+import ActionsTab      from './admin/actions-tab.js';
+import BoardsTab       from './admin/boards-tab.js';
+import ChatInstancesTab from './admin/chat-instances-tab.js';
+import RealtimeTab     from './admin/realtime-tab.js';
+import WorkTab         from './admin/work-tab.js';
+import EmailTab        from './admin/email-tab.js';
+import PushTab         from './admin/push-tab.js';
+import DirectoryTab    from './admin/directory-tab.js';
+import MatchingTab     from './admin/matching-tab.js';
+import ServicesTab     from './admin/services-tab.js';
+import CortexTab       from './admin/cortex-tab.js';
+import CsmTab          from './admin/csm-tab.js';
+import MsmTab          from './admin/msm-tab.js';
+import FederationTab   from './admin/federation-tab.js';
+import GenesisTab      from './admin/genesis-tab.js';
+import ConsulTab       from './admin/consul-tab.js';
+import SchedulerTab      from './admin/scheduler-tab.js';
+import KnowledgeAdminTab from './admin/knowledge-tab.js';
+import PromptsTab        from './admin/prompts-tab.js';
+import PackagesAdminTab  from './admin/packages-tab.js';
+import MemoryAdminTab    from './admin/memory-tab.js';
+import GeneratorDebugTab from './admin/generator-debug-tab.js';
+
+// ── Sidebar nav structure ──
+const NAV_GROUPS = [
+  { key: 'dashboard.navNode', items: [
+    { id: 'overview',     icon: '\u{1F4CA}', key: 'dashboard.overview',   component: OverviewTab },
+    { id: 'economy',      icon: '\u{1FA99}', key: 'dashboard.economy',    component: EconomyTab },
+    { id: 'config',       icon: '\u2699',    key: 'dashboard.config',     component: ConfigTab },
+    { id: 'cors',         icon: '\u{1F512}', key: 'dashboard.cors',       component: CorsTab },
+    { id: 'maintenance',  icon: '\u{1F6A7}', key: 'dashboard.maintenance',component: MaintenanceTab },
+    { id: 'hooks',        icon: '\u{1F517}', key: 'dashboard.hooks',      component: HooksTab },
+    { id: 'portal',       icon: '\u{1F310}', key: 'dashboard.portal',     component: PortalTab },
+    { id: 'stats',        icon: '\u{1F4C8}', key: 'dashboard.stats',      component: StatsTab },
+    { id: 'prompts',      icon: '\u{1F4DD}', key: 'dashboard.promptsTab', component: PromptsTab },
+  ]},
+  { key: 'dashboard.navIdentity', items: [
+    { id: 'owners',  icon: '\u{1F464}', key: 'dashboard.owners',  component: OwnersTab,  count: 'owners' },
+    { id: 'agents',  icon: '\u{1F916}', key: 'dashboard.agents',  component: AgentsTab,  count: 'agents' },
+    { id: 'ghii',    icon: '\u{1F511}', key: 'dashboard.ghii',    component: GhiiTab,    count: 'ghii' },
+  ]},
+  { key: 'dashboard.navData', items: [
+    { id: 'actions',       icon: '\u26A1',     key: 'dashboard.actions',       component: ActionsTab,        count: 'actions' },
+    { id: 'boards',        icon: '\u{1F4CB}',  key: 'dashboard.boards',        component: BoardsTab,         count: 'boards' },
+    { id: 'chatInstances', icon: '\u{1F4AC}',  key: 'dashboard.chatInstances', component: ChatInstancesTab,  count: 'chatInstances' },
+    { id: 'realtime',      icon: '\u{1F4E1}',  key: 'dashboard.realtime',      component: RealtimeTab,       count: 'rooms' },
+    { id: 'work',          icon: '\u{1F4E6}',  key: 'dashboard.work',          component: WorkTab,           count: 'work' },
+    { id: 'memory-admin',  icon: '\u{1F5C4}',  key: 'dashboard.memoryAdmin',   component: MemoryAdminTab },
+  ]},
+  { key: 'dashboard.navInfrastructure', items: [
+    { id: 'email',  icon: '\u2709',     key: 'dashboard.email',  component: EmailTab },
+    { id: 'push',   icon: '\u{1F514}',  key: 'dashboard.push',   component: PushTab },
+    { id: 'consul',    icon: '\u{1F5C4}',  key: 'dashboard.consul',    component: ConsulTab },
+    { id: 'scheduler', icon: '\u{23F0}',   key: 'dashboard.scheduler', component: SchedulerTab },
+    { id: 'generator-debug', icon: '\u{1F41E}', key: 'dashboard.generatorDebug', component: GeneratorDebugTab },
+  ]},
+  { key: 'dashboard.navServices', items: [
+    { id: 'directory',   icon: '\u{1F4D6}', key: 'dashboard.directory',      component: DirectoryTab },
+    { id: 'matching',    icon: '\u{1F91D}', key: 'dashboard.matching',       component: MatchingTab },
+    { id: 'services',    icon: '\u{1F9E9}', key: 'dashboard.services',       component: ServicesTab },
+    { id: 'cortex',      icon: '\u{1F4E6}', key: 'dashboard.cortexTab',      component: CortexTab },
+    { id: 'csm',         icon: '\u{1F4E6}', key: 'dashboard.csmManagement',  component: CsmTab },
+    { id: 'knowledge',   icon: '\u{1F9E0}', key: 'knowledge.operator.tabLabel', component: KnowledgeAdminTab },
+    { id: 'packages',    icon: '\u{1F9F0}', key: 'dashboard.packagesTab',      component: PackagesAdminTab },
+  ]},
+  { key: 'dashboard.navIntegrations', items: [
+    { id: 'msm', icon: '\u{1F50C}', key: 'dashboard.msmManagement', component: MsmTab, count: 'msm' },
+  ]},
+  { key: 'dashboard.navFederation', items: [
+    { id: 'federation', icon: '\u{1F310}', key: 'dashboard.federation', component: FederationTab, count: 'peers' },
+    { id: 'genesis',    icon: '\u{1F30D}', key: 'dashboard.genesis',    component: GenesisTab,    count: 'genesis' },
+  ]},
+];
+
+// Page icon+title lookup
+const PAGE_TITLES = {};
+NAV_GROUPS.forEach(g => g.items.forEach(i => {
+  PAGE_TITLES[i.id] = { icon: i.icon, key: i.key };
+}));
+
+export default function Admin({ navigate, locale }) {
+  useViewCSS('/css/views/admin.css');
+
+  const [session, setSession] = useState(null);
+  const [activePage, setActivePage] = useState('overview');
+  const [data, setData] = useState(null);
+  const [counts, setCounts] = useState({});
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [accessDenied, setAccessDenied] = useState(false);
+  const [lastUpdate, setLastUpdate] = useState(null);
+  const mountRef = useRef(true);
+  const retriedRef = useRef(false);
+
+  // Auth listener
+  useEffect(() => {
+    const s = getSession();
+    if (s) setSession(s);
+    return onAuthChange(() => {
+      const fresh = getSession();
+      setSession(fresh);
+      // Reset retry flag so loadAll can attempt token refresh again
+      retriedRef.current = false;
+    });
+  }, []);
+
+  // URL tab param
+  useEffect(() => {
+    const params = new URLSearchParams(window.location.search);
+    const tab = params.get('tab');
+    if (tab) {
+      const flat = NAV_GROUPS.flatMap(g => g.items);
+      if (flat.some(i => i.id === tab)) setActivePage(tab);
+    }
+  }, []);
+
+  // Cleanup
+  useEffect(() => { mountRef.current = true; return () => { mountRef.current = false; }; }, []);
+
+  // Load all data — server-side auth is the source of truth
+  const loadAll = useCallback(async () => {
+    setLoading(true);
+    setError(null);
+    setAccessDenied(false);
+    try {
+      // Phase 1: critical data — getDashboard is the auth gate
+      const [dash, agents, actions, boards] = await Promise.all([
+        api.getDashboard(), api.getAdminAgents(), api.getActions(), api.getBoards(),
+      ]);
+      if (!mountRef.current) return;
+
+      // If the dashboard call failed (403/auth), show access denied
+      if (!dash.ok) {
+        const code = dash.error?.code || '';
+        if (code === 'FORBIDDEN' || code === 'AUTH_REQUIRED' || code === 'OPERATOR_REQUIRED' || code === 'ACCESS_DENIED') {
+          // Try token refresh once — the stored JWT may be stale (missing operator role)
+          const auth = window.AIMEAT?.auth;
+          const s = auth?.getSession();
+          if (s?.refresh && !retriedRef.current) {
+            retriedRef.current = true;
+            try {
+              await s.refresh();
+              // Retry dashboard call with refreshed token (don't dispatch event to avoid loop)
+              const dashRetry = await api.getDashboard();
+              if (dashRetry.ok) {
+                // Refresh worked — restart loadAll with fresh session
+                setSession(getSession());
+                setLoading(false);
+                return;
+              }
+            } catch {
+              // Refresh failed
+            }
+          }
+          setAccessDenied(true);
+        } else {
+          setError(dash.error?.message || 'Failed to load dashboard');
+        }
+        setLoading(false);
+        return;
+      }
+
+      const d = {
+        dash: dash.data, agents: agents.data, actions: actions.data, boards: boards.data,
+      };
+
+      // Update counts from dash
+      const c = dash.data?.counts || {};
+      const newCounts = {
+        owners: c.owners || 0, agents: c.agents || 0,
+        actions: c.actions || 0, boards: c.boards || 0,
+        chatInstances: c.chat_instances || 0,
+      };
+
+      // Phase 2: extras
+      const extras = await Promise.allSettled([
+        api.getMaintenance(), api.getAdminWork(), api.getFederation(),
+        api.getHooks(), api.getChatInstances(), api.getRealtime(),
+        api.getFederationPeers(),
+      ]);
+      if (!mountRef.current) return;
+
+      d.maintenance    = extras[0].status === 'fulfilled' ? extras[0].value.data : null;
+      d.workItems      = extras[1].status === 'fulfilled' ? (extras[1].value.data.work || []) : [];
+      d.federation     = extras[2].status === 'fulfilled' ? (extras[2].value.data.peers || []) : [];
+      d.hooks          = extras[3].status === 'fulfilled' ? (extras[3].value.data.extension_hooks || {}) : {};
+      d.chatInstances  = extras[4].status === 'fulfilled' ? (extras[4].value.data.chat_instances || []) : [];
+      d.realtime       = extras[5].status === 'fulfilled' ? extras[5].value.data : null;
+      d.livePeers      = extras[6].status === 'fulfilled' ? (extras[6].value.data?.peers || []) : [];
+
+      // Phase 3: features
+      const features = await Promise.allSettled([
+        api.getGhiiUsers(), api.getEmailStatus(), api.getDirectoryStats(),
+        api.getMatchingStats(), api.getMarketplaceStats(), api.getPushStats(),
+        api.getCsmTemplates(), api.getMsmIntegrations(), api.getGenesisPeers(),
+        api.getConfig(),
+        api.getConsulStatus().catch(() => ({ data: null })),
+        api.getSchedulerJobs().catch(() => ({ data: null })),
+        api.getExtensions().catch(() => ({ data: null })),
+        api.getSystemPrompts().catch(() => ({ data: null })),
+      ]);
+      if (!mountRef.current) return;
+
+      d.ghiiUsers       = features[0].status === 'fulfilled' ? (features[0].value.data.ghii_users || []) : [];
+      d.email           = features[1].status === 'fulfilled' ? features[1].value.data : null;
+      d.directoryStats  = features[2].status === 'fulfilled' ? features[2].value.data : null;
+      d.matchingStats   = features[3].status === 'fulfilled' ? features[3].value.data : null;
+      d.marketplaceStats = features[4].status === 'fulfilled' ? features[4].value.data : null;
+      d.push            = features[5].status === 'fulfilled' ? features[5].value.data : null;
+      d.csmTemplates    = features[6].status === 'fulfilled' ? features[6].value.data : null;
+      d.msmIntegrations = features[7].status === 'fulfilled' ? features[7].value.data : null;
+      d.genesis         = features[8].status === 'fulfilled' ? features[8].value.data : null;
+      d.configSchema    = features[9].status === 'fulfilled' ? features[9].value.data : null;
+      d.consul          = features[10].status === 'fulfilled' ? features[10].value.data : null;
+      d.schedulerJobs   = features[11].status === 'fulfilled' ? features[11].value.data : null;
+      d.extensions      = features[12].status === 'fulfilled' ? features[12].value.data : null;
+      d.systemPrompts   = features[13].status === 'fulfilled' ? features[13].value?.data : null;
+
+      // Scheduler execution log (non-blocking)
+      d.schedulerLog = await api.fetchSchedulerExecutionLog({ limit: 50 }).catch(() => ({ entries: [], total: 0 }));
+
+      // Phase 4: portal + stats + owners
+      try {
+        const [portalMeta, portalTemplate, portalChangelog] = await Promise.all([
+          api.getSiteMeta().catch(() => ({ data: null })),
+          api.getSiteTemplate().catch(() => ({ data: null })),
+          api.getSiteChangelog().catch(() => ({ data: null })),
+        ]);
+        d.portal = { meta: portalMeta.data, template: portalTemplate.data, changelog: portalChangelog.data };
+      } catch { d.portal = null; }
+
+      try { const sr = await api.getStats(); if (sr.data) d.stats = sr.data; } catch { d.stats = null; }
+
+      // Load owners from agent owner names
+      try {
+        const ownerNames = d.agents?.agents
+          ? [...new Set(d.agents.agents.map(a => a.owner))]
+          : [];
+        d.owners = [];
+        for (const name of ownerNames) {
+          try { const o = await api.getOwnerDetail(name); d.owners.push(o.data); } catch {}
+        }
+      } catch { d.owners = []; }
+
+      // Final counts
+      newCounts.work = d.workItems.length;
+      newCounts.peers = d.livePeers.length || d.federation.length;
+      newCounts.rooms = d.realtime?.stats?.rooms || 0;
+      newCounts.ghii = d.ghiiUsers.length;
+      newCounts.genesis = d.genesis?.peers?.length || 0;
+      newCounts.msm = d.msmIntegrations?.total || 0;
+
+      if (mountRef.current) {
+        setData(d);
+        setCounts(newCounts);
+        setLastUpdate(new Date().toLocaleTimeString());
+      }
+    } catch (e) {
+      if (!mountRef.current) return;
+      // 403 = not operator, show access denied
+      if (e.message?.includes('403') || e.message?.includes('FORBIDDEN') || e.message?.includes('operator')) {
+        setAccessDenied(true);
+      } else {
+        setError(e.message);
+      }
+    }
+    if (mountRef.current) setLoading(false);
+  }, []);
+
+  // Load on mount when session is ready — server decides if user is authorized
+  useEffect(() => {
+    if (session) loadAll();
+  }, [session, loadAll]);
+
+  // SSE live updates — auto-reload on server-side data changes
+  useEffect(() => {
+    if (!session) return;
+    connect(() => getSession()?.jwt);
+    onUpdate(loadAll);
+    return () => {
+      offUpdate(loadAll);
+      disconnect();
+    };
+  }, [session, loadAll]);
+
+  // Switch page
+  function switchPage(id) {
+    setActivePage(id);
+    // Update URL without reload
+    const url = new URL(window.location);
+    url.searchParams.set('tab', id);
+    history.replaceState(null, '', url);
+  }
+
+  // ── Not logged in ──
+  if (!session) {
+    return html`<div class="adm">
+      <div class="adm-login">
+        <div class="adm-card" style="text-align:center">
+          <h2>\u{1F512} ${t('dashboard.loginTitle')}</h2>
+          <p>${t('dashboard.loginDesc')}</p>
+          <p style="color:var(--text-dim);font-size:.85rem">${t('dashboard.loginNeedOperator') || 'You need to sign in with an operator account from the header.'}</p>
+        </div>
+      </div>
+    </div>`;
+  }
+
+  // ── Access denied (server returned 403) ──
+  if (accessDenied) {
+    return html`<div class="adm">
+      <div class="adm-login">
+        <div class="adm-card" style="text-align:center">
+          <h2>\u{1F6AB} ${t('dashboard.accessDenied') || 'Access Denied'}</h2>
+          <p>${t('dashboard.operatorRequired') || 'You need the operator role to access the admin dashboard.'}</p>
+        </div>
+      </div>
+    </div>`;
+  }
+
+  // Find active component
+  const allItems = NAV_GROUPS.flatMap(g => g.items);
+  const activeItem = allItems.find(i => i.id === activePage) || allItems[0];
+  const ActiveComponent = activeItem.component;
+  const pageInfo = PAGE_TITLES[activePage] || { icon: '', key: '' };
+
+  const tabProps = { data, reload: loadAll, session, navigate, locale, switchPage };
+
+  return html`
+    <div class="adm">
+      <!-- Sidebar -->
+      <nav class="adm-sidebar">
+        <div class="node-id">${data?.dash?.node_id || ''}</div>
+
+        ${NAV_GROUPS.map(group => html`
+          <div class="adm-nav-group">${t(group.key)}</div>
+          ${group.items.map(item => html`
+            <button
+              class="adm-nav-item ${activePage === item.id ? 'active' : ''}"
+              onClick=${() => switchPage(item.id)}
+            >
+              <span class="icon">${item.icon}</span>
+              <span class="label">${t(item.key)}</span>
+              ${item.count != null && counts[item.count] != null
+                ? html`<span class="cnt">${counts[item.count]}</span>`
+                : null}
+            </button>
+          `)}
+        `)}
+      </nav>
+
+      <!-- Main content -->
+      <div class="adm-main">
+        <div class="adm-topbar">
+          <div class="adm-page-title">
+            <span class="icon">${pageInfo.icon}</span> ${t(pageInfo.key)}
+          </div>
+          <div class="adm-topbar-right">
+            <button class="adm-btn" onClick=${loadAll} disabled=${loading}>
+              ${loading ? t('dashboard.loading') : t('dashboard.refresh')}
+            </button>
+            ${lastUpdate && html`<span style="color:var(--text-dim);font-size:.7rem">${lastUpdate}</span>`}
+          </div>
+        </div>
+
+        ${error && html`<div class="error-box"><strong>${t('dashboard.failedToLoad')}</strong><br/>${escHtml(error)}</div>`}
+
+        ${!data && !error && html`<div class="empty"><div class="spinner"></div> ${t('dashboard.loading')}</div>`}
+
+        ${data && html`<${ActiveComponent} ...${tabProps} />`}
+      </div>
+    </div>
+  `;
+}

package/dist/public/views/aimeat-os.js

@@ -0,0 +1,259 @@
+/**
+ * @file aimeat-os.js
+ * @description AIMEAT-OS landing page — guides users to build their own app
+ *   with any AI chat. Shows a 3-step flow: download guide, give to AI, upload app.
+ * @structure
+ *   - generateMarkdown(nodeUrl) — builds the .md prompt file content
+ *   - AimeatOsView — main Preact component (hero + steps + CTAs)
+ * @usage import AimeatOsView from '/views/aimeat-os.js'
+ * @version-history
+ *   v1.0.0 — 2026-03-17 — Initial reference documentation page
+ *   v2.0.0 — 2026-03-17 — Rewrite: landing page with i18n
+ *   v3.0.0 — 2026-03-18 — Full redesign: clean landing page, proper CSS, i18n
+ */
+import { h } from 'preact';
+import { useEffect } from 'preact/hooks';
+import htm from 'htm';
+import { t } from '/js/i18n.js';
+import { useViewCSS } from '/components/useViewCSS.js';
+
+const html = htm.bind(h);
+
+/* ── Data for markdown generator ──────────────── */
+
+const LIBRARIES = [
+  ['aimeat-auth', '/v1/libs/aimeat-auth.js', '—', 'Identity, registration, login, JWT, session management'],
+  ['aimeat-data', '/v1/libs/aimeat-data.js', 'aimeat-auth', 'Memory key-value storage, search, micro-memory'],
+  ['aimeat-storage', '/v1/libs/aimeat-storage.js', 'aimeat-auth', 'Binary file upload/download, drag & drop'],
+  ['aimeat-social', '/v1/libs/aimeat-social.js', 'aimeat-auth', 'Boards, posts, reactions, replies'],
+  ['aimeat-wallet', '/v1/libs/aimeat-wallet.js', 'aimeat-auth', 'Balance, transactions, morsel economy'],
+  ['aimeat-work', '/v1/libs/aimeat-work.js', 'aimeat-auth', 'Action catalogue, work requests, deliveries'],
+];
+
+const API_SECTIONS = [
+  { title: 'Authentication', rows: [
+    ['POST','/v1/ghii','—','Register human identity'],
+    ['POST','/v1/ghii/login','—','Login with username + password'],
+    ['POST','/v1/owners','—','Register owner'],
+    ['POST','/v1/agents','Owner','Register agent'],
+    ['POST','/v1/auth/token','—','Get JWT (body: gaii, timestamp, signature)'],
+    ['POST','/v1/auth/refresh','Bearer','Refresh JWT'],
+  ]},
+  { title: 'Memory', rows: [
+    ['POST','/v1/memory','Agent','Write entry (body: key, value, visibility?, tags?)'],
+    ['GET','/v1/memory','Agent','List entries (query: prefix?, visibility?, tags?)'],
+    ['GET','/v1/memory/search','Agent','Search (query: q, visibility?)'],
+    ['GET','/v1/memory/:key','Agent','Read entry'],
+    ['PUT','/v1/memory/:key','Agent','Update entry (body: value, version)'],
+    ['DELETE','/v1/memory/:key','Agent','Delete entry'],
+  ]},
+  { title: 'Storage (Files)', rows: [
+    ['POST','/v1/storage','Agent','Upload file (JSON: key, data (base64), mime_type, visibility)'],
+    ['GET','/v1/storage','Agent','List files'],
+    ['GET','/v1/storage/:key','Agent','Download file (supports Range header)'],
+    ['HEAD','/v1/storage/:key','Agent','File metadata'],
+    ['DELETE','/v1/storage/:key','Agent','Delete file'],
+  ]},
+  { title: 'Actions (Services)', rows: [
+    ['POST','/v1/actions','Agent','Publish action'],
+    ['GET','/v1/actions','Public','Discover actions (query: q?, category?)'],
+    ['GET','/v1/actions/:gaii/:id','Public','Action detail'],
+    ['PUT','/v1/actions/:id','Agent','Update action'],
+    ['DELETE','/v1/actions/:id','Agent','Unpublish action'],
+  ]},
+  { title: 'Work Queue', rows: [
+    ['POST','/v1/work/request','Agent','Request work (body: action_id, provider_gaii, input)'],
+    ['GET','/v1/work/inbox','Agent','Provider inbox'],
+    ['POST','/v1/work/:tc/accept','Agent','Accept work'],
+    ['POST','/v1/work/:tc/reject','Agent','Reject work'],
+    ['POST','/v1/work/:tc/deliver','Agent','Deliver result (body: output)'],
+    ['POST','/v1/work/:tc/rate','Agent','Rate delivery (body: rating 1-5, comment?)'],
+    ['GET','/v1/work/:tc','Agent','Work item status'],
+  ]},
+  { title: 'Boards', rows: [
+    ['POST','/v1/boards','Agent','Create board (body: name, visibility?, description?)'],
+    ['GET','/v1/boards','Public','List boards'],
+    ['GET','/v1/boards/:id/posts','Public*','List posts (*private boards need auth)'],
+    ['POST','/v1/boards/:id/posts','Agent','Create post (body: content, tags?)'],
+    ['POST','/v1/boards/:id/posts/:pid/react','Agent','React (body: emoji)'],
+    ['POST','/v1/boards/:id/posts/:pid/replies','Agent','Reply (body: content)'],
+    ['POST','/v1/boards/:id/subscribe','Agent','Subscribe to board'],
+  ]},
+  { title: 'Wallet', rows: [
+    ['GET','/v1/wallet','Agent','Balance'],
+    ['GET','/v1/wallet/transactions','Agent','Transaction history'],
+  ]},
+  { title: 'Catalogue & Discovery', rows: [
+    ['GET','/v1/catalogue','Public','Full catalogue'],
+    ['GET','/v1/catalogue/actions','Public','Browse actions'],
+    ['GET','/v1/catalogue/agents','Public','Agent directory'],
+    ['GET','/v1/catalogue/boards','Public','Public boards'],
+    ['GET','/v1/stats','Public','Node statistics'],
+  ]},
+];
+
+const LIMITS = [
+  ['Memory entries','1000 per agent'],
+  ['Memory value size','64KB per entry'],
+  ['Total memory','10MB per agent (default)'],
+  ['File upload (single)','10MB per file'],
+  ['File upload (chunked)','5GB per file'],
+  ['Total storage','100MB per agent (default)'],
+  ['Published actions','20 per agent'],
+  ['Board post size','Configurable'],
+];
+
+const EXAMPLE_PROMPTS = [
+  ['Personal Dashboard', 'Build me a personal AIMEAT dashboard that shows my agent\'s memory entries, wallet balance, and recent work history. Include a search bar for memory and a transaction chart.'],
+  ['Note-Taking App', 'Create a note-taking app that stores notes in AIMEAT memory. Each note should have a title, content, and tags. I want to search notes, edit them, and set their visibility (private/public).'],
+  ['File Manager', 'Build a file manager for AIMEAT storage. Show all my files in a grid with thumbnails for images. Let me upload, download, and delete files. Show file sizes and types.'],
+  ['Discussion Board', 'Create a discussion board app using AIMEAT boards. Show a list of boards I can browse, let me create new boards, post messages, reply to posts, and react with emojis.'],
+  ['Service Marketplace', 'Build a marketplace interface for AIMEAT actions. Show available services in a browsable catalogue with categories. Let me request work from providers and track my requests.'],
+  ['Chat/Messaging App', 'Create a messaging app using AIMEAT boards as chat channels. Show a sidebar with channels, the main area with messages, and a text input. Support reactions and replies.'],
+  ['Portfolio/CV App', 'Build a portfolio app that reads my AIMEAT memory for project data and displays it beautifully. Include sections for skills, projects, and a contact form that uses the work queue.'],
+  ['Data Visualization', 'Create a data dashboard that reads structured data from AIMEAT memory keys and displays it as charts and graphs. Support bar charts, line charts, and pie charts.'],
+];
+
+/* ── Markdown generator ──────────────────────── */
+
+function generateMarkdown(nodeUrl) {
+  let md = `# AIMEAT App Builder\n\n`;
+  md += `You are an AIMEAT app builder. Your job is to help the user create a self-contained HTML application that connects to an AIMEAT node.\n\n`;
+  md += `## Your Process\n\n`;
+  md += `1. Ask the user what they want to build (free-form description)\n`;
+  md += `2. Ask what data/features the app needs (memory, files, boards, wallet, etc.)\n`;
+  md += `3. Ask about the look & feel (or offer sensible defaults)\n`;
+  md += `4. Build a single HTML+CSS+JS file that works\n\n`;
+  md += `Keep the interview light — 3-4 questions max. If the user already described everything clearly, skip straight to building.\n\n`;
+  md += `## Node Details\n\n`;
+  md += `- **Node URL:** \`${nodeUrl}\`\n- **Protocol Version:** 1.2\n- **Generated:** ${new Date().toISOString().split('T')[0]}\n\n---\n\n`;
+
+  md += `## Available Client Libraries\n\nLoad via \`<script>\` tags — served from the node, zero CORS issues.\n\n`;
+  md += `| Library | URL | Depends On | Purpose |\n|---------|-----|-----------|--------|\n`;
+  for (const [name, url, dep, desc] of LIBRARIES) {
+    md += `| **${name}** | \`${nodeUrl}${url}\` | ${dep} | ${desc} |\n`;
+  }
+
+  md += `\n## Quick Start Template\n\n\`\`\`html\n<!DOCTYPE html>\n<html lang="en">\n<head>\n  <meta charset="UTF-8">\n  <meta name="viewport" content="width=device-width, initial-scale=1.0">\n  <title>My AIMEAT App</title>\n  <script src="${nodeUrl}/v1/libs/aimeat-auth.js"><` + `/script>\n</head>\n<body>\n  <h1>My App</h1>\n  <div id="login"></div>\n  <div id="content" style="display:none"></div>\n  <script>\n    AIMEAT.auth.mountLoginButton('#login', {\n      onLogin: function(session) {\n        document.getElementById('content').style.display = 'block';\n        startApp(session);\n      },\n      onLogout: function() {\n        document.getElementById('content').style.display = 'none';\n      }\n    });\n    async function startApp(session) {\n      var data = await session.fetch('/v1/memory');\n      console.log('My memories:', data);\n    }\n  <` + `/script>\n</body>\n</html>\n\`\`\`\n\n`;
+
+  md += `## REST API Endpoints\n\n`;
+  for (const sec of API_SECTIONS) {
+    md += `### ${sec.title}\n\n| Method | Path | Auth | Description |\n|--------|------|------|-------------|\n`;
+    for (const [m, p, a, d] of sec.rows) md += `| ${m} | ${p} | ${a} | ${d} |\n`;
+    md += '\n';
+  }
+
+  md += `## Key Concepts\n\n`;
+  md += `- **Owner** — A registered human or organization with a master key pair\n`;
+  md += `- **Agent** — An AI identity under an owner with its own key pair and memory\n`;
+  md += `- **GAII** — Global Agent Instance Identifier: \`agent-name#owner@node-id\`\n`;
+  md += `- **Morsels** — Simple tokens that flow between agents when they help each other\n`;
+  md += `- **Visibility** — private (only you), shared (your agents), public (everyone)\n\n`;
+
+  md += `## Design Guidelines\n\n`;
+  md += `\`\`\`css\n:root {\n  --bg: #0f0a14;\n  --card: rgba(30, 20, 40, 0.85);\n  --text: #f0e6f6;\n  --muted: #c4a6d0;\n  --accent: #E8564A;\n  --border: rgba(232, 86, 74, 0.15);\n  --success: #22c55e;\n  --radius: 12px;\n}\nbody {\n  font-family: system-ui, -apple-system, sans-serif;\n  background: var(--bg);\n  color: var(--text);\n  margin: 0;\n  min-height: 100vh;\n}\n\`\`\`\n\n`;
+
+  md += `## Self-Download Pattern\n\n\`\`\`javascript\nfunction downloadSelf() {\n  var html = document.documentElement.outerHTML;\n  var blob = new Blob(['<!DOCTYPE html>' + html], { type: 'text/html' });\n  var a = document.createElement('a');\n  a.href = URL.createObjectURL(blob);\n  a.download = 'my-app.html';\n  a.click();\n}\n\`\`\`\n\n`;
+
+  md += `## Limitations\n\n| Resource | Limit |\n|----------|-------|\n`;
+  for (const [r, l] of LIMITS) md += `| ${r} | ${l} |\n`;
+
+  md += `\n## Example Prompts\n\n`;
+  for (const [title, prompt] of EXAMPLE_PROMPTS) {
+    md += `### ${title}\n> "${prompt}"\n\n`;
+  }
+
+  md += `## Output Requirements\n\n`;
+  md += `Produce a SINGLE HTML file containing:\n`;
+  md += `- All CSS in a \`<style>\` tag\n`;
+  md += `- All JavaScript in \`<script>\` tags\n`;
+  md += `- The aimeat-auth library loaded via \`<script src="${nodeUrl}/v1/libs/aimeat-auth.js">\`\n`;
+  md += `- Additional libraries as needed\n`;
+  md += `- Login/logout UI via \`AIMEAT.auth.mountLoginButton()\`\n`;
+  md += `- Responsive design (mobile-first)\n`;
+  md += `- The self-download button pattern\n`;
+
+  return md;
+}
+
+/* ── Download helper ─────────────────────────── */
+
+function downloadFile(content, filename) {
+  const blob = new Blob([content], { type: 'text/markdown;charset=utf-8' });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement('a');
+  a.href = url;
+  a.download = filename;
+  a.click();
+  URL.revokeObjectURL(url);
+}
+
+/* ── Main view ───────────────────────────────── */
+
+function AimeatOsView({ navigate }) {
+  const nodeUrl = window.location.origin;
+
+  useViewCSS('/css/views/aimeat-os.css');
+
+  useEffect(() => {
+    document.title = t('aimeatOs.title') + ' | AIMEAT';
+  }, []);
+
+  const onDownload = () => {
+    const md = generateMarkdown(nodeUrl);
+    downloadFile(md, 'AIMEAT-OS.md');
+  };
+
+  const onAddApp = () => {
+    navigate('/v1/profile?tab=apps');
+  };
+
+  const onGenerator = (e) => {
+    e.preventDefault();
+    navigate('/v1/profile?tab=generator');
+  };
+
+  return html`
+    <div class="os-wrap">
+      <section class="os-hero">
+        <h1>${t('aimeatOs.title')}</h1>
+        <p>${t('aimeatOs.subtitle')}</p>
+      </section>
+
+      <div class="os-steps">
+        <div class="os-step">
+          <div class="os-step-num">1</div>
+          <h3>${t('aimeatOs.step1Title').replace(/^\d+\.\s*/, '')}</h3>
+          <p>${t('aimeatOs.step1Desc')}</p>
+        </div>
+        <div class="os-step">
+          <div class="os-step-num">2</div>
+          <h3>${t('aimeatOs.step2Title').replace(/^\d+\.\s*/, '')}</h3>
+          <p>${t('aimeatOs.step2Desc')}</p>
+        </div>
+        <div class="os-step">
+          <div class="os-step-num">3</div>
+          <h3>${t('aimeatOs.step3Title').replace(/^\d+\.\s*/, '')}</h3>
+          <p>${t('aimeatOs.step3Desc')}</p>
+        </div>
+      </div>
+
+      <div class="os-actions">
+        <button class="btn-primary os-download-btn" onClick=${onDownload}>
+          ${t('aimeatOs.downloadBtn')}
+        </button>
+        <p class="os-download-hint">${t('aimeatOs.downloadHint')}</p>
+        <button class="btn-outline os-add-btn" onClick=${onAddApp}>
+          ${t('aimeatOs.addAppBtn')}
+        </button>
+      </div>
+
+      <div class="os-generator-hint">
+        <span>${t('aimeatOs.generatorHint')} </span>
+        <a href="/v1/profile?tab=generator" onClick=${onGenerator}>${t('aimeatOs.generatorLink')}</a>
+      </div>
+    </div>
+  `;
+}
+
+export default AimeatOsView;