Build an App with Your Own AI Agent

acme-store/
├── schemas.py        data model — fields, references, namespace
├── config.py         AppConfig dataclass — app identity, tenants, users, services
├── setup.py          seed data, RBAC policies, workflow definitions
├── __main__.py        3-line entry point
├── requirements.txt  one line: supero
├── .env.example       credentials template — never ship a real .env
└── ui/
    └── app.js    ★    your entire front end — this exact path

# generated on first local run — never hand-write these, edits are lost:
#   ui/index.html  ui/config.js  ui/server.py  Dockerfile  docker-compose.yml

var cfg = window.__SUPERO_CONFIG || {};

// Auth — 5 positional args; tenant is ALWAYS '' so the server resolves the
// signed-in user's own tenant (multi-tenant users 401 if you pass a fixed tenant name)
await client.login(cfg.domain, email, password, cfg.project, '');

// CRUD — bare or namespaced schema name; both resolve
var leads = await client.getObjects('lead');
var created = await client.createObjectWithRefs('lead',
  { display_name: 'Jane Doe', contact_name: 'Jane Doe', email: '[email protected]', lead_state: 'new' },
  [{ ref_name: 'Company', ref_uuid: companyUuid }]);
if (created.refErrors.length) {
  showToast('Created, but a link failed: ' + created.refErrors.map(function (e) { return e.ref_name; }).join(', '), 'warning');
}

// Filter/sort/search — the real server-side query API for lists and dashboards
var hot = await client.queryObjects('lead',
  { op: 'and', conditions: [{ field: 'lead_state', op: 'eq', value: 'qualified' }] },
  { sort_by: 'value', sort_order: 'desc', limit: 50 });

services.email.send({ to: lead.email, subject: 'Welcome', bodyHtml: '<p>Thanks for reaching out!</p>' })
  .then(function () { showToast('Email sent', 'success'); })
  .catch(function (e) { showToast('Email failed: ' + e.message, 'error'); });

(function () {
  var h = React.createElement;               // React is a global — never import or re-declare it

  function App() {
    var [route, setRoute] = React.useState(window.location.hash || '#/');
    var [authed, setAuthed] = React.useState(client.isAuthenticated());
    React.useEffect(function () {
      function onHash() { setRoute(window.location.hash || '#/'); }
      window.addEventListener('hashchange', onHash);
      return function () { window.removeEventListener('hashchange', onHash); };
    }, []);
    if (!authed) return h(LoginScreen, { onDone: function () { setAuthed(true); } });
    return h(Shell, { route: route });          // your app
  }

  function mountApp() {
    var pl = document.getElementById('supero-preloader');
    if (pl && pl.parentNode) pl.parentNode.removeChild(pl);   // dismiss the boot splash — required in Path B
    var el = document.getElementById('myapp-root');
    if (!el) { el = document.createElement('div'); el.id = 'myapp-root'; document.body.appendChild(el); }
    ReactDOM.createRoot(el).render(h(App, null));              // a SIBLING container, not the library's own root
  }

  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', mountApp);
  else mountApp();
})();

POST https://api.supero.dev/mcp/v1/messages
X-API-Key: ak_...    (an opaque, scoped secret)

build_whoami
build_get_skills                                → author schemas.py / config.py / setup.py / ui/app.js locally
build_create_project {name:"acme-store"}            (or build_list_projects → build_get_project)
build_validate {project_uuid, files:{...}}          → fix any errors it reports
build_publish  {project_uuid, files:{...}}          → version_uuid, download_url
build_deploy   {project_uuid, target:"local"}       → run instructions with the project's own key