Page code

The contract for a waitlist page's reactCode, for hand-written or agent-generated pages.

A waitlist page is a single JavaScript function rendered in a sandbox with React in scope. You can replace the default template by setting reactCode on create or update, over the REST API or MCP.

The contract

• One plain function declaration named GeneratedWaitlist:

  function GeneratedWaitlist(props) {
    // ...
  }

• No JSX, no imports, no TypeScript. Use React.createElement and hooks through the global React (React.useState, React.useEffect, …). Use var and function () {}; avoid const, let, and arrow functions.

• Style with inline style objects. The page renders full viewport; own the whole background.

• props.waitlistData contains the waitlist’s name and description.

Submitting signups

Call props.onSubmit from your form handler:

props.onSubmit({ email: email, name: name || undefined });

Results arrive as window messages. Listen for event.data.type === "waitlist-result":

React.useEffect(function () {
  var handler = function (event) {
    if (event.data && event.data.type === "waitlist-result") {
      if (event.data.success) {
        // event.data: { position, alreadyJoined?, referralEnabled?,
        //   referralCode?, referralCount?, referralBoost?, referralMessage? }
      } else {
        // event.data.error holds the message
      }
    }
  };
  window.addEventListener("message", handler);
  return function () {
    window.removeEventListener("message", handler);
  };
}, []);

Referral links

When referrals are enabled, build the subscriber’s share link from the referral code in the result payload:

var link =
  window.location.origin + window.location.pathname + "?ref=" + referralCode;

Recommended workflow