aimeat 1.23.1 → 1.23.3

package/dist/public/js/services/offers.js

@@ -0,0 +1,152 @@
+/**
+ * @file offers.js
+ * @description Frontend service for the Agent Offers surface ("what can I do with my agents"). Reads
+ *   the owner aggregate feed + per-agent offers, and the mode-aware Ask: a schedule-born offer triggers
+ *   its schedule; a task-runner/autonomous agent runs a task; an interactive/workstation agent gets a
+ *   paste-ready prompt (AIMEAT's prompt-driven flow). See docs/plans/2026-06-12-agent-offers-*.md.
+ * @structure listOffers / getAgentOffers / publishOffers · ask(agentEntry, offer, inputs) · buildAskPrompt
+ * @usage import * as offers from '/js/services/offers.js';
+ * @version-history
+ *   v1.0.0 -- 2026-06-12 -- Initial: Do feed + mode-aware Ask (run / copy-prompt / schedule-trigger).
+ *   v1.1.0 -- 2026-06-12 -- Billable offers: setOfferBilling (patch one offer's price + visibility).
+ *   v1.2.0 -- 2026-06-12 -- Inbox fixes: deliverable read from the AGENT namespace (prefix + task-tag
+ *     fallback, returns a string); Ask task title carries the user's request (findable in the queue).
+ *   v1.3.0 -- 2026-06-12 -- Offer task carries ONLY the user's request (title + description); the offer
+ *     is referenced via scope.offer_id/offer_title — no more restuffing offer.ask/example (which made
+ *     the agent treat its own boilerplate as the request).
+ */
+import { apiGet, apiPost, apiPut } from '/js/api.js';
+import { copyToClipboard } from '/js/utils.js';
+import { createTask, rateTask } from '/js/services/agent-tasks.js';
+
+/** The goal-first feed: every agent's offers + mode/availability. */
+export async function listOffers() {
+  return apiGet('/v1/offers');
+}
+
+/** One agent's published offers. */
+export async function getAgentOffers(name) {
+  return apiGet(`/v1/agents/${encodeURIComponent(name)}/offers`);
+}
+
+/** Publish/replace an agent's offers (agent self or owner). */
+export async function publishOffers(name, doc) {
+  return apiPut(`/v1/agents/${encodeURIComponent(name)}/offers`, doc);
+}
+
+/** Owner edits ONE offer's billing fields (price + visibility), preserving the rest of the doc.
+ *  Re-reads the agent's current offers first (avoid clobbering a stale feed), patches, re-publishes.
+ *  `price` is `{ morsels, unit }` or `null` (not for sale); `visibility` is private|unlisted|public. */
+export async function setOfferBilling(name, offerId, { price, visibility }) {
+  const cur = await getAgentOffers(name);
+  const offers = (cur?.data?.offers || []).map(o => o.id === offerId
+    ? { ...o, ...(price !== undefined ? { price } : {}), ...(visibility !== undefined ? { visibility } : {}) }
+    : o);
+  return publishOffers(name, { offers });
+}
+
+/** The Inbox feed: everything that came back across all agents (non-draft tasks, newest first). */
+export async function listDeliverables() {
+  return apiGet('/v1/deliverables');
+}
+
+/** Fetch a task's deliverable from the AGENT's memory namespace (owner→agent read).
+ *  Deliverables live under the agent's GAII, not the owner's, so we read via
+ *  `?agent=<gaii>`. Primary handle is the recorded `deliverableKey`; fallback is the
+ *  `task:<id>` tag the runner stamps on every write (works even when the agent never
+ *  set deliverableKey — e.g. CrewAI agents that only publish to memory). Returns the
+ *  deliverable value as a string, or null if nothing was found. Mirrors the proven
+ *  read in agents-tasks-subtab.js. */
+export async function getDeliverableContent({ agentGaii, deliverableKey, taskId }) {
+  if (!agentGaii) return null;
+  const enc = encodeURIComponent;
+  const reqs = [];
+  if (deliverableKey) reqs.push(apiGet(`/v1/memory?agent=${enc(agentGaii)}&prefix=${enc(deliverableKey)}&per_page=5`).catch(() => null));
+  if (taskId) reqs.push(apiGet(`/v1/memory?agent=${enc(agentGaii)}&tags=${enc('task:' + taskId)}&per_page=50`).catch(() => null));
+  const results = await Promise.all(reqs);
+  const items = [];
+  const seen = new Set();
+  for (const r of results) {
+    const list = r?.data?.items || r?.data || [];
+    for (const it of (Array.isArray(list) ? list : [])) {
+      if (it.key && !seen.has(it.key)) { seen.add(it.key); items.push(it); }
+    }
+  }
+  if (!items.length) return null;
+  const len = (v) => (typeof v === 'string' ? v.length : 0);
+  // Prefer the exact deliverableKey, then an *output key, then the longest text value.
+  const pick = items.find(i => i.key === deliverableKey)
+    || items.find(i => /(latest_)?output$/.test(i.key))
+    || items.slice().sort((a, b) => len(b.value) - len(a.value))[0];
+  const v = pick?.value;
+  if (v == null) return null;
+  return typeof v === 'string' ? v : JSON.stringify(v, null, 2);
+}
+
+/** Rate a done task's deliverable via the LOCKED rate endpoint (→ agents.<agent>.statistics.*).
+ *  Owner ratings bypass source-grounding; we still send source_grounded:true (the owner saw it). */
+export async function rateDeliverable(agent, taskId, { stars, comment, context = 'other' }) {
+  return rateTask(agent, taskId, { stars, context, comment, source_grounded: true });
+}
+
+/** Compose the paste-ready prompt for an interactive/workstation agent (prompt-driven Ask). */
+export function buildAskPrompt(agentEntry, offer, inputs) {
+  const lines = [
+    `You are the agent "${agentEntry.agent}". I'm asking you to perform one of your offers.`,
+    ``,
+    `OFFER: ${offer.title}`,
+    `WHAT I'M ASKING: ${offer.ask}`,
+  ];
+  if (offer.example) lines.push(`EXAMPLE OF A REQUEST LIKE THIS: ${offer.example}`);
+  if (inputs && String(inputs).trim()) lines.push(``, `MY REQUEST: ${String(inputs).trim()}`);
+  if (offer.deliverable?.format) lines.push(``, `DELIVER: a ${offer.deliverable.format}${offer.deliverable.location?.space ? ` in ${offer.deliverable.location.space}` : ''}.`);
+  lines.push(``, `Do exactly this offer and nothing outside its scope. When done, write the deliverable and tell me where it is.`);
+  return lines.join('\n');
+}
+
+function scheduleIdOf(offer) {
+  const sb = offer?.availability?.scheduleBorn;
+  if (!sb) return null;
+  return typeof sb === 'object' ? (sb.scheduleId || null) : null;   // string form is a human label only
+}
+
+/**
+ * Mode-aware Ask. Branch order: schedule-born first (independent of mode), then by agent mode.
+ * Returns one of:
+ *   { kind: 'triggered' }                              — schedule-born → ran the schedule now
+ *   { kind: 'task', taskId, agent }                    — task-runner/autonomous → created a queued task
+ *   { kind: 'prompt', copied: true, prompt }           — interactive/workstation → copied a paste-ready prompt
+ */
+export async function ask(agentEntry, offer, inputs) {
+  const scheduleId = scheduleIdOf(offer);
+  if (scheduleId) {
+    const r = await apiPost(`/v1/schedules/${encodeURIComponent(scheduleId)}/trigger`, {});
+    return { kind: 'triggered', ok: r?.ok !== false, error: r?.error };
+  }
+
+  const mode = agentEntry.mode || 'interactive';
+  if (mode === 'task-runner' || mode === 'autonomous') {
+    // The agent ALREADY owns the offer (it published it). Do NOT restuff offer.ask/example into the
+    // task — that makes the agent treat its own boilerplate as the request (e.g. jokes ABOUT four
+    // comedians instead of jokes on the topic). The task carries ONLY the user's request as title +
+    // description; the offer is referenced structurally via scope (the runtime resolves it by offer_id).
+    const reqText = inputs ? String(inputs).trim() : '';
+    const title = reqText ? (reqText.length > 80 ? reqText.slice(0, 80) + '…' : reqText) : offer.title;
+    const r = await createTask(agentEntry.agent, {
+      title,
+      description: reqText,
+      status: 'queued',   // REQUIRED so a task-runner auto-activates it (other modes keep the owner-start gate)
+      scope: [
+        { name: 'kind', value: 'offer', type: 'text' },
+        { name: 'offer_id', value: offer.id, type: 'text' },
+        { name: 'offer_title', value: offer.title, type: 'text' },
+      ],
+    });
+    return { kind: 'task', taskId: r?.data?.task?.id || r?.data?.id, agent: agentEntry.agent, ok: r?.ok !== false, error: r?.error };
+  }
+
+  // interactive / workstation → prompt-driven
+  const prompt = buildAskPrompt(agentEntry, offer, inputs);
+  await copyToClipboard(prompt);
+  return { kind: 'prompt', copied: true, prompt };
+}

package/dist/public/js/services/organisms.js

@@ -1,8 +1,15 @@
 /**
- * AIMEAT Organisms Service
- * Organism CRUD, membership, join requests, and the manifest-driven workspace
- * (a "project" is just an organism with a meta.manifest): apply a template,
- * read the workspace, write/publish drafts, and resolve gate approvals.
+ * @file organisms.js
+ * @description AIMEAT Organisms Service — organism CRUD, membership, join requests, and the
+ *   manifest-driven workspace (a "project" is just an organism with a meta.manifest): apply a
+ *   template, generate a workspace with AI, read the workspace, write/publish drafts, and
+ *   resolve gate approvals.
+ * @usage import * as orgService from '/js/services/organisms.js';
+ * @version-history
+ *   v1.1.0 — 2026-06-10 — Generator prompt: per-property "description", "readOnly": true for
+ *     agent-filled result fields (never required), "x-default": "currentUser" for requester
+ *     fields, and a manifest "i18n" block (en + request language) with flat "{ns}.{field}",
+ *     "{ns}.{field}.hint" and "type.{name}" labels the workspace UI renders.
  */
 import { api, apiGet, apiPost, apiPut, apiPatch, apiDelete } from '/js/api.js';
 
@@ -235,6 +242,7 @@ Respond with this shape:
     "kind": "<short-kebab-case kind, e.g. game-dev>",
     "status": "active",
     "objectTypes": [ <one entry per type> ],
+    "i18n": { <UI labels per language — see below> },
     "policy": { "agentAutonomy": "L3", "alwaysGate": [] }
   },
   "schemas": { <one JSON Schema per RECORDS type, keyed by that type's namespace> },
@@ -254,6 +262,17 @@ Give every objectType all of these fields:
 For each RECORDS type, add a JSON Schema under "schemas" keyed by its namespace:
 { "type": "object", "required": ["id", ...], "properties": { "id": { "type": "string" }, ... } }
 Give every record an "id" string property. Use "enum" for status-like fields and "format": "date" (or "date-time") for date fields.
+Also, for each property:
+- Give every property except "id" a short English "description" telling a human what to fill in.
+- Result fields that an agent or automation fills later (e.g. result_ref, output links, error details) get "readOnly": true — the form hides them from humans. Never list a readOnly field in "required".
+- Fields that should default to the acting user's identity (e.g. requested_by, created_by, author) get "x-default": "currentUser".
+
+Inside "manifest", add an "i18n" object with UI labels: one entry per language — always "en", plus the language of the user's request if different. Keys are flat strings:
+- "<namespace>.<field>": a short human label for that field
+- "<namespace>.<field>.hint": one short sentence telling the user what to enter
+- "type.<objectType name>": a short plural label for that type's tab
+Example: "i18n": { "en": { "shared.milestones.title": "Title", "shared.milestones.title.hint": "A short name for the milestone", "type.milestone": "Milestones" }, "fi": { "shared.milestones.title": "Otsikko", "shared.milestones.title.hint": "Lyhyt nimi virstanpylväälle", "type.milestone": "Virstanpylväät" } }
+Cover every field of every RECORDS type (labels + hints) and every objectType (type.<name>) in every language you include.
 
 For each DOCUMENT type, the content is free markdown — keep it out of "schemas" and "examples" (a document needs neither).
 
@@ -267,10 +286,14 @@ Worked example — request "track game milestones plus free-form design docs":
       { "name": "milestone", "schemaRef": "schema:milestone@1", "namespace": "shared.milestones", "backing": "memory", "writeRole": "member", "cardinality": "many", "versioned": true, "mode": "records" },
       { "name": "design-doc", "schemaRef": "schema:design-doc@1", "namespace": "shared.design-docs", "backing": "memory", "writeRole": "member", "cardinality": "many", "versioned": true, "mode": "document" }
     ],
+    "i18n": {
+      "en": { "type.milestone": "Milestones", "type.design-doc": "Design docs", "shared.milestones.title": "Title", "shared.milestones.title.hint": "A short name for the milestone", "shared.milestones.status": "Status", "shared.milestones.status.hint": "Where this milestone stands", "shared.milestones.due_date": "Due date", "shared.milestones.due_date.hint": "When this should be done" },
+      "fi": { "type.milestone": "Virstanpylväät", "type.design-doc": "Suunnitteludokumentit", "shared.milestones.title": "Otsikko", "shared.milestones.title.hint": "Lyhyt nimi virstanpylväälle", "shared.milestones.status": "Tila", "shared.milestones.status.hint": "Missä vaiheessa tämä on", "shared.milestones.due_date": "Määräpäivä", "shared.milestones.due_date.hint": "Milloin tämän pitäisi olla valmis" }
+    },
     "policy": { "agentAutonomy": "L3", "alwaysGate": [] }
   },
   "schemas": {
-    "shared.milestones": { "type": "object", "required": ["id", "title", "status"], "properties": { "id": { "type": "string" }, "title": { "type": "string" }, "status": { "type": "string", "enum": ["planned", "in-progress", "done"] }, "due_date": { "type": "string", "format": "date" } } }
+    "shared.milestones": { "type": "object", "required": ["id", "title", "status"], "properties": { "id": { "type": "string" }, "title": { "type": "string", "description": "A short name for the milestone" }, "status": { "type": "string", "enum": ["planned", "in-progress", "done"], "description": "Where this milestone stands" }, "due_date": { "type": "string", "format": "date", "description": "When this should be done" } } }
   },
   "examples": {
     "shared.milestones": [ { "id": "example-1", "title": "Vertical slice", "status": "planned", "due_date": "2026-09-01" } ]

package/dist/public/js/services/packages.js

@@ -27,6 +27,7 @@ export const createPackage = (data) => apiPost('/v1/packages', data);
 export const createVersion = (groupId, data) => apiPost(`/v1/packages/${enc(groupId)}/versions`, data);
 export const updatePackage = (groupId, data) => apiPatch(`/v1/packages/${enc(groupId)}`, data);
 export const archiveVersion = (groupId, version) => apiDelete(`/v1/packages/${enc(groupId)}/versions/${enc(version)}`);
+export const archivePackageGroup = (groupId) => apiDelete(`/v1/packages/${enc(groupId)}`);
 
 // ── Instances ──
 export const listInstances = (params) => apiGet('/v1/instances' + buildQuery(params));

package/dist/public/spa.html

@@ -67,9 +67,11 @@
   <!-- View CSS preloaded so they are ready before any view renders (prevents FOUC) -->
   <!-- hrefs are stamped with ?v=BUILD_ID at serve time by portal.ts serveSpa() -->
   <link rel="stylesheet" href="/css/views/portal.css">
+  <link rel="stylesheet" href="/css/views/landing.css">
   <link rel="stylesheet" href="/css/views/portal-classic.css">
   <link rel="stylesheet" href="/css/views/portal-dev.css">
   <link rel="stylesheet" href="/css/views/profile.css">
+  <link rel="stylesheet" href="/css/views/offers.css">
   <link rel="stylesheet" href="/css/views/foundry.css">
   <link rel="stylesheet" href="/css/views/calibrator.css">
 <link rel="stylesheet" href="/css/views/hobbies.css">
@@ -86,6 +88,7 @@
   <link rel="stylesheet" href="/css/views/admin-agent-integration.css">
   <link rel="stylesheet" href="/css/views/public-knowledge-viewer.css">
   <link rel="stylesheet" href="/css/views/public-workspace-viewer.css">
+  <link rel="stylesheet" href="/css/views/start.css">
   <script type="importmap">
   {
     "imports": {
@@ -98,6 +101,7 @@
       "/js/format.js": "/js/format.js",
       "/js/api.js": "/js/api.js",
       "/js/hooks.js": "/js/hooks.js",
+      "/js/recents.js": "/js/recents.js",
       "/js/services/admin.js": "/js/services/admin.js",
       "/js/services/agents.js": "/js/services/agents.js",
       "/js/services/apps.js": "/js/services/apps.js",
@@ -151,6 +155,7 @@
       "/js/services/memory.js": "/js/services/memory.js",
       "/js/services/nodes.js": "/js/services/nodes.js",
       "/js/services/organisms.js": "/js/services/organisms.js",
+      "/js/services/offers.js": "/js/services/offers.js",
       "/js/services/packages.js": "/js/services/packages.js",
       "/js/services/security.js": "/js/services/security.js",
       "/js/services/stats.js": "/js/services/stats.js",
@@ -165,6 +170,7 @@
       "/components/Mermaid.js": "/components/Mermaid.js",
       "/components/NotificationBell.js": "/components/NotificationBell.js",
       "/components/CopyButton.js": "/components/CopyButton.js",
+      "/components/ContactCard.js": "/components/ContactCard.js",
       "/components/Spinner.js": "/components/Spinner.js",
       "/components/EmptyState.js": "/components/EmptyState.js",
       "/components/ToggleSwitch.js": "/components/ToggleSwitch.js",
@@ -255,7 +261,14 @@
     // insufficient — modules stay in the module registry for the full session).
     const B = window.__B || '';
     const ROUTES = {
-      '/v1/portal':      () => import('/views/portal.js' + B),
+      // Landing/portal split (2026-06-10): the route serves the logged-out landing;
+      // logged-in visitors are forwarded to /v1/profile by the view itself. The old
+      // portal view stays reachable at /v1/classic (prompt boxes / "Build").
+      '/v1/portal':      () => import('/views/landing.js' + B),
+      '/v1/pricing':     () => import('/views/pricing.js' + B),
+      '/v1/start':       () => import('/views/start.js' + B),
+      '/v1/how-it-works': () => import('/views/how-it-works.js' + B),
+      '/v1/business':    () => import('/views/business.js' + B),
       '/v1/profile':     () => import('/views/profile.js' + B),
       '/v1/guides':      () => import('/views/guides.js' + B),
       '/v1/hobbies':     () => import('/views/hobbies.js' + B),
@@ -347,6 +360,14 @@
           // Only intercept internal /v1/ links
           if (!href || !href.startsWith('/v1/')) return;
           if (e.ctrlKey || e.metaKey || e.shiftKey) return;
+          // Respect explicit new-tab / new-window targets — without this, an
+          // <a href="/v1/apps/.../launch?mode=inline" target="_blank"> from a
+          // child component would be hijacked, navigated in the same tab via
+          // matchRoute (which doesn't know /v1/apps/...), and dump the user
+          // back on the landing page.
+          const target = a.getAttribute('target');
+          if (target && target !== '_self' && target !== '') return;
+          if (a.hasAttribute('download')) return;
           e.preventDefault();
           navigate(href);
         };
@@ -438,6 +459,10 @@
 
       const handleNav = (e, path) => {
         e.preventDefault();
+        // Mark in-app navigation: the landing redirects logged-in users to their Home
+        // ONLY on direct arrival (bookmark/external link), never when they deliberately
+        // navigated here from inside the app (e.g. the brand link).
+        try { sessionStorage.setItem('aimeat.in-app', '1'); } catch {}
         navigate(path);
       };
 
@@ -456,7 +481,12 @@
             <button class="topnav-burger" aria-label="Menu" aria-expanded=${menuOpen ? 'true' : 'false'}
               onClick=${() => setMenuOpen(o => !o)}>☰</button>
             <div class="topnav-menu ${menuOpen ? 'open' : ''}">
-              <a href="/v1/classic" onClick=${(e) => { handleNav(e, '/v1/classic'); setMenuOpen(false); }} class="${currentPath === '/v1/classic' ? 'active' : ''}">${t('nav.try')}</a>
+              <!-- "Try it" leads to the landing's path cards + app gallery — an empty
+                   Welcome Board on /v1/classic was the weakest possible first experience.
+                   Classic stays reachable deeper (landing card B "Start building"). -->
+              <a href="/v1/portal" onClick=${(e) => { handleNav(e, '/v1/portal'); setMenuOpen(false); }} class="${currentPath === '/v1/portal' ? 'active' : ''}">${t('nav.try')}</a>
+              <a href="/v1/how-it-works" onClick=${(e) => { handleNav(e, '/v1/how-it-works'); setMenuOpen(false); }} class="${currentPath === '/v1/how-it-works' ? 'active' : ''}">${t('nav.howItWorks') || 'How it works'}</a>
+              <a href="/v1/business" onClick=${(e) => { handleNav(e, '/v1/business'); setMenuOpen(false); }} class="${currentPath === '/v1/business' ? 'active' : ''}">${t('nav.business') || 'For your business'}</a>
               <a href="/v1/portal?view=dev" onClick=${(e) => { handleNav(e, '/v1/portal?view=dev'); setMenuOpen(false); }}>${t('nav.devView')}</a>
               <a href="/v1/help" onClick=${(e) => { handleNav(e, '/v1/help'); setMenuOpen(false); }} class="${currentPath === '/v1/help' ? 'active' : ''}">${t('nav.help')}</a>
               ${session && html`

package/dist/public/views/admin/subdomains-tab.js

@@ -0,0 +1,182 @@
+/**
+ * @file subdomains-tab.js
+ * @description Admin dashboard Subdomains tab — operator management of
+ *   subdomain → site mappings (serve a published app at `<sub>.<apex>` or
+ *   301-redirect). Table with enabled-toggle, create form, and
+ *   type-to-confirm deletion.
+ * @structure SubdomainsAdminTab (default)
+ * @usage Mounted by the admin dashboard tab router (views/admin.js).
+ * @version-history
+ *   v1.0.0 — 2026-06-12 — Initial: subdomain routing (operator-only management)
+ */
+import { h } from 'preact';
+import { useState, useEffect, useCallback } from 'preact/hooks';
+import htm from 'htm';
+const html = htm.bind(h);
+import { t } from '/js/i18n.js';
+import { dt, Spinner, Empty, ErrorBox } from './shared.js';
+import { Modal } from '/components/Modal.js';
+import * as adminService from '/js/services/admin.js';
+
+export default function SubdomainsAdminTab() {
+  const [sites, setSites] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const [showCreate, setShowCreate] = useState(false);
+  const [form, setForm] = useState({ subdomain: '', kind: 'app', target: '' });
+  const [formError, setFormError] = useState(null);
+  const [saving, setSaving] = useState(false);
+  // Type-to-confirm delete state: { subdomain, typed }
+  const [deleting, setDeleting] = useState(null);
+
+  const load = useCallback(async () => {
+    setLoading(true);
+    setError(null);
+    try {
+      const resp = await adminService.getSubdomainSites();
+      setSites(resp?.data?.sites || []);
+    } catch (err) {
+      setError(err?.message || String(err));
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => { load(); }, [load]);
+
+  useEffect(() => {
+    const handler = () => { load(); };
+    window.addEventListener('aimeat-live-update', handler);
+    return () => window.removeEventListener('aimeat-live-update', handler);
+  }, [load]);
+
+  const create = useCallback(async () => {
+    setFormError(null);
+    setSaving(true);
+    try {
+      await adminService.createSubdomainSite({
+        subdomain: form.subdomain.trim().toLowerCase(),
+        kind: form.kind,
+        target: form.target.trim(),
+      });
+      setShowCreate(false);
+      setForm({ subdomain: '', kind: 'app', target: '' });
+      load();
+    } catch (err) {
+      setFormError(err?.message || String(err));
+    } finally {
+      setSaving(false);
+    }
+  }, [form, load]);
+
+  const toggleEnabled = useCallback(async (site) => {
+    try {
+      await adminService.updateSubdomainSite(site.subdomain, { enabled: !site.enabled });
+      load();
+    } catch (err) {
+      setError(err?.message || String(err));
+    }
+  }, [load]);
+
+  const doDelete = useCallback(async () => {
+    if (!deleting || deleting.typed !== deleting.subdomain) return;
+    try {
+      await adminService.deleteSubdomainSite(deleting.subdomain);
+      setDeleting(null);
+      load();
+    } catch (err) {
+      setError(err?.message || String(err));
+      setDeleting(null);
+    }
+  }, [deleting, load]);
+
+  // Public URL for a mapping, derived from the page's own host
+  const siteUrl = (sub) => `${location.protocol}//${sub}.${location.host}/`;
+
+  return html`
+    <p class="adm-text-sm adm-text-dim adm-mb-md">${t('admin.subdomains.desc')}</p>
+
+    <div class="adm-card">
+      <div class="adm-flex-between adm-mb-md">
+        <h2>${t('admin.subdomains.title')}</h2>
+        <button class="adm-btn-sm" onClick=${() => { setShowCreate(!showCreate); setFormError(null); }}>
+          ${showCreate ? t('common.cancel') : '+ ' + t('admin.subdomains.add')}
+        </button>
+      </div>
+
+      ${showCreate && html`
+        <div class="adm-subdomain-form adm-mb-md">
+          <input class="adm-input" placeholder=${t('admin.subdomains.subdomain')}
+            value=${form.subdomain}
+            onInput=${e => setForm({ ...form, subdomain: e.target.value })} />
+          <select class="adm-input" value=${form.kind}
+            onChange=${e => setForm({ ...form, kind: e.target.value })}>
+            <option value="app">${t('admin.subdomains.kindApp')}</option>
+            <option value="redirect">${t('admin.subdomains.kindRedirect')}</option>
+          </select>
+          <input class="adm-input" value=${form.target}
+            placeholder=${form.kind === 'app' ? t('admin.subdomains.targetHintApp') : t('admin.subdomains.targetHintRedirect')}
+            onInput=${e => setForm({ ...form, target: e.target.value })} />
+          <button class="adm-btn" disabled=${saving || !form.subdomain.trim() || !form.target.trim()}
+            onClick=${create}>${t('admin.subdomains.create')}</button>
+          ${formError && html`<div class="adm-text-error adm-text-sm">${formError}</div>`}
+        </div>
+      `}
+
+      ${error && html`<${ErrorBox} message=${error} />`}
+      ${loading ? html`<${Spinner} />` : sites.length === 0
+        ? html`<${Empty} text=${t('admin.subdomains.empty')} />`
+        : html`
+        <div class="scrollable">
+          <table>
+            <thead><tr>
+              <th>${t('admin.subdomains.subdomain')}</th>
+              <th>${t('admin.subdomains.kind')}</th>
+              <th>${t('admin.subdomains.target')}</th>
+              <th>${t('admin.subdomains.enabled')}</th>
+              <th>${t('admin.subdomains.createdBy')}</th>
+              <th>${t('admin.subdomains.created')}</th>
+              <th></th>
+            </tr></thead>
+            <tbody>
+              ${sites.map(s => html`
+                <tr>
+                  <td class="mono">
+                    <a href=${siteUrl(s.subdomain)} target="_blank" rel="noopener">\u{1F310} ${s.subdomain}</a>
+                  </td>
+                  <td>${s.kind === 'app' ? t('admin.subdomains.kindApp') : t('admin.subdomains.kindRedirect')}</td>
+                  <td class="mono">${s.target}</td>
+                  <td>
+                    <input type="checkbox" checked=${s.enabled} onChange=${() => toggleEnabled(s)}
+                      title=${t('admin.subdomains.enabled')} />
+                  </td>
+                  <td class="mono">${s.createdBy}</td>
+                  <td>${dt(s.createdAt)}</td>
+                  <td>
+                    <button class="adm-btn-sm adm-btn-danger"
+                      onClick=${() => setDeleting({ subdomain: s.subdomain, typed: '' })}>
+                      ${t('admin.subdomains.delete')}
+                    </button>
+                  </td>
+                </tr>
+              `)}
+            </tbody>
+          </table>
+        </div>
+      `}
+    </div>
+
+    <${Modal} open=${!!deleting} onClose=${() => setDeleting(null)} title=${t('admin.subdomains.deleteTitle')}>
+      ${deleting && html`
+        <p>${t('admin.subdomains.deleteConfirm')} <strong class="mono">${deleting.subdomain}</strong></p>
+        <input class="adm-input adm-input-full" value=${deleting.typed}
+          onInput=${e => setDeleting({ ...deleting, typed: e.target.value })} />
+        <div class="adm-flex adm-mt-md adm-subdomain-modal-actions">
+          <button class="btn-ghost" onClick=${() => setDeleting(null)}>${t('common.cancel')}</button>
+          <button class="btn-danger-solid" disabled=${deleting.typed !== deleting.subdomain}
+            onClick=${doDelete}>${t('admin.subdomains.delete')}</button>
+        </div>
+      `}
+    <//>
+  `;
+}

package/dist/public/views/admin.js

@@ -52,6 +52,7 @@ import CapabilitiesAdminTab from './admin/capabilities-tab.js';
 import AgentTasksAdminTab from './admin/agent-tasks-tab.js';
 import SharingGroupsAdminTab from './admin/sharing-groups-tab.js';
 import AgentIntegrationAdminTab from './admin/agent-integration-tab.js';
+import SubdomainsAdminTab from './admin/subdomains-tab.js';
 
 // ── Sidebar nav structure ──
 const NAV_GROUPS = [
@@ -64,6 +65,7 @@ const NAV_GROUPS = [
     { 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: 'subdomains',   icon: '\u{1F517}', key: 'admin.subdomains.title', component: SubdomainsAdminTab },
     { id: 'stats',        icon: '\u{1F4C8}', key: 'dashboard.stats',      component: StatsTab },
     { id: 'prompts',      icon: '\u{1F4DD}', key: 'dashboard.promptsTab', component: PromptsTab },
   ]},