GlassKit Docs — Add-ons (optional)

Three opt-in modules (Payments, Email, AI Showcase) that the base boilerplate doesn't register. Turn any subset on with `pnpm run addon enable <id>`.

The base boilerplate ships with only the always-needed pieces: Clerk auth, the Convex schema for users, the glasses-pairing flow, and the companion landing template (minus the pricing section). That's it.

Stripe, Resend, and the AI demo apps live as opt-in add-ons. Each one is OFF by default: no Convex component registration, no env vars to set, no Stripe products to create, no UI cluttering your dashboard until you ask for it.

Why opt-in

Convex's deploy-time analyzer reads component registrations in convex.config.ts and demands the component's env vars in the Convex dashboard, regardless of whether your code calls them. If the boilerplate registered Stripe by default, every developer would have to create Stripe products + set six env vars just to deploy. The add-on model removes that tax: devs only pay it when they're actually charging.

The three add-ons

Payments →

Stripe checkout + customer portal + webhook sync + pricing UI + dashboard billing section. Enable when you're ready to charge.

Email →

Resend welcome email + transactional sends + delivery-status webhook. Enable when you want to send mail beyond Clerk's auth flow.

AI Showcase →

Anthropic + OpenAI via the Vercel AI SDK + six sensor/AI demo apps in the glasses launcher. Enable to see the platform's full capabilities.

Enabling an add-on

pnpm run addon enable payments    # or `email`, `ai`

The CLI flips that add-on's .ts.disabled files back to active extensions and inserts the import / app.use(...) / route / schema content into the glasskit:add-on:<id>:<marker>:BEGIN/END fenced regions across convex.config.ts, http.ts, env.ts, and the companion (page.tsx, config.ts, dashboard-client.tsx). It then prints the Convex env keys you need to set:

cd packages/backend
pnpm exec convex env set STRIPE_SECRET_KEY sk_test_…
pnpm exec convex env set STRIPE_WEBHOOK_SECRET whsec_…
# … etc, one per key the CLI listed
pnpm exec convex dev --once    # regen _generated/api.d.ts

Your AI coder (Claude Code / Cursor / Codex) can drive the env collection conversationally. See the root AGENTS.md for the exact prompts and order.

Disabling an add-on

pnpm run addon disable payments

Renames files back to .disabled, clears the fenced regions. Then remove the matching env vars from the Convex dashboard (pnpm exec convex env remove <KEY>, one per key; the CLI prints them on disable too) and re-run pnpm exec convex dev to regenerate types. The Convex tables the component owns (e.g. the Stripe subscriptions table) stay intact in case you re-enable later.

What about the AI key: does that count as an add-on?

Yes. The useAi() hook + <AiResponse> component + the six demo apps + convex/ai.ts all live behind the AI Showcase add-on. The base glasses app's launcher renders a "Register an app" placeholder until you enable AI Showcase or add your own apps to the APPS registry in app/src/App.tsx.

Why not ship Payments enabled with a "free tier"?

That's what Track A tried (env vars as .optional()). It looked fine in Zod but the Convex analyzer still demanded the env vars at deploy time, forcing every developer to set six placeholder values just to push a build. The add-on model is the only design where the analyzer never sees the registration in the first place.

Add-ons (optional)