Mocap Stage Booker

Required key.

Add this in your Lovable project under Settings → Secrets before pasting the prompt below.

Paste into a fresh Lovable project. Make sure the key above is set first. read the build strategy →

Build "Mocap Stage Booker" as a ONE-SHOT Lovable build. The participant has only
5 credits — this single message must produce a working demo with no follow-ups.
Single-page TanStack Start app. Cut scope ruthlessly.

CONCEPT
Lovable AI runs the agent that rents mocap stages via AP2 so animators capture data on schedule.
Discipline: Game Design & Interactive Media (animation logistics).
Recipe: AP2 Mandates (signed authority) as the single agentic surface.
Why this kernel: AP2 Mandates allow setting a daily facility budget, letting the agent auto-book off-peak hours to maximize studio time.

LOVABLE BUDGET (HARD CAP: ONE-SHOT, ~5 CREDITS TOTAL):
The participant has FIVE Lovable credits for the whole build. This prompt MUST
ship a working demo on the FIRST message with zero follow-ups. Engineer for that.
- ONE TanStack Start app, ONE route (`src/routes/index.tsx`). No extra pages, no auth, no nav.
- ONE TanStack server function in `src/lib/agent.functions.ts` that runs the protocol.
- ONE client surface (a textarea + button) that triggers the server fn and renders the result.
- NO database, NO Lovable Cloud, NO auth, NO file uploads, NO extra integrations.
- NO tests, NO docs pages, NO settings screens, NO theming toggles.
- Libraries: template defaults + `zod` + `ai` + `@ai-sdk/openai-compatible`. Nothing else.
- Demo-fallback contract: every code path must boot with NO secrets and return
  realistic JSON flagged `simulated: true`. Real LLM calls activate only when
  `LOVABLE_API_KEY` is present (auto in Lovable).

STACK
- TanStack Start app, the index route only.
- Agent brain: Lovable AI Gateway via the AI SDK, called from a `createServerFn` handler so the key stays server-side.
- Protocol surface: AP2 Mandates as defined below.
- Client surface fits the kernel: a prompt box (and any minimal extra inputs) that returns the agent's output.
- Tailwind + shadcn. Editorial look: gold accent on a dark or warm-cream background,
  generous type, one strong headline, one primary action.
- Footer renders: "Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14".

GATEWAY HELPER (src/lib/ai-gateway.server.ts) — Lovable AI Gateway provider:
```ts
import { createOpenAICompatible } from "@ai-sdk/openai-compatible";
/** Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14 */
export function lovableGateway(apiKey: string) {
  return createOpenAICompatible({
    name: "lovable",
    baseURL: "https://ai.gateway.lovable.dev/v1",
    headers: { "Lovable-API-Key": apiKey, "X-Lovable-AIG-SDK": "vercel-ai-sdk" },
  });
}
```
Install once: `bun add ai @ai-sdk/openai-compatible zod`.

SERVER FUNCTION (src/lib/agent.functions.ts) — AP2 mandate trio:
```ts
import { createServerFn } from "@tanstack/react-start";
import { generateText } from "ai";
import { z } from "zod";
import { lovableGateway } from "@/lib/ai-gateway.server";

/** Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14 */
export const mandate = createServerFn({ method: "POST" })
  .inputValidator((d) => z.object({
    goal: z.string().min(1).max(400),
    max_ticket_minor: z.number().int().positive().default(5000),
    daily_cap_minor:  z.number().int().positive().default(20000),
    deadline_days:    z.number().int().positive().max(30).default(7),
  }).parse(d))
  .handler(async ({ data }) => {
    const key = process.env.LOVABLE_API_KEY;
    const summary = async (m: unknown) => {
      if (!key) return "Demo summary: agent may spend within the limits above for animation logistics.";
      const { text } = await generateText({
        model: lovableGateway(key)("google/gemini-2.5-flash"),
        prompt: `Summarise this AP2 mandate for a human in 2 plain sentences (no jargon): ${JSON.stringify(m)}`,
      });
      return text.trim();
    };

    const now = Date.now();
    const intent = {
      type: "IntentMandate",
      goal: data.goal,
      caps: { max_ticket_minor: data.max_ticket_minor, daily_cap_minor: data.daily_cap_minor, currency: "USD" },
      deadline: new Date(now + data.deadline_days * 86400_000).toISOString(),
      signature: { alg: "eip712-stub", sig: "0xsimulated" },
    };
    const cart = {
      type: "CartMandate",
      items: [{ name: "animation logistics unit", price_minor: Math.min(data.max_ticket_minor, 4200) }],
      total_minor: Math.min(data.max_ticket_minor, 4200),
      currency: "USD",
      intent_ref: "demo-intent-hash",
      signature: { alg: "eip712-stub", sig: "0xsimulated" },
    };
    const payment = {
      type: "PaymentMandate",
      cart_ref: "demo-cart-hash",
      tx: "0xsimulated",
      settled_at: new Date().toISOString(),
      signature: { alg: "eip712-stub", sig: "0xsimulated" },
    };

    return {
      mandates: { intent, cart, payment },
      explainer: await summary(intent),
      meta: { simulated: !key, kernel: "ap2-mandates" },
    };
  });
```

CLIENT (in `src/routes/index.tsx`): a small "permission slip" form — goal, max ticket,
daily cap, deadline — and a "Sign mandate" button. Render the three mandate JSON blocks
stacked, with the LLM's plain-language explainer at the top. Flag `simulated: true`.

USER FLOW (the entire app — nothing else exists)
1. Land on the page; the headline previews what the agent does for animation logistics.
2. The primary action (a mandate card the user fills like a permission slip, then sees rendered as a signed JSON trio the agent will present at checkout) is one tap away; the rest of the layout supports it.
3. The server fn runs the protocol, the result lands on screen, the user can retry, copy, or audit.

KEYS (Lovable AI first, AIsa AI fallback):
1. `LOVABLE_API_KEY` — PRIMARY agent brain. Auto-provisioned by Lovable. Used
   server-side to call Lovable AI Gateway (Gemini, Claude, GPT) for every
   reasoning step. Never expose to the client; read only via
   `process.env.LOVABLE_API_KEY`. This is the default code path.
2. `AISA_API_KEY` (OPTIONAL FALLBACK) — only set if Lovable credits are
   exhausted or a specific frontier model from https://aisa.one is required.
   The server fn should try Lovable first and fall back to AIsa only if
   `LOVABLE_API_KEY` is missing.
The demo MUST still boot with zero secrets and return realistic `simulated:true`
envelopes — that demo-fallback contract is non-negotiable (see UCP × A2A × AP2 spec).

CREDIT (must appear in UI footer AND as JSDoc on the server function):
Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14

Market sizing.

Indicative figures for hackathon pitches — refine with your own research before raising.