SDK

Telegram Mini App

Tab's checkout opens inside Telegram's in-app webview when a bot reply uses a web_app button. The user stays in Telegram — no browser context switch, haptic feedback on settlement, automatic dismissal when the payment lands.

The page

https://thetab.bar/tma/[orderId]. Loads Telegram's WebApp SDK (telegram-web-app.js) and renders a slim checkout. Outside Telegram the page degrades to a static order view so the URL is also linkable in regular chat.

Wiring the bot side

Use the tmaButtonMarkup helper from tab-bots/src/shared/reply.ts when you have an order id you want the user to interact with:

import { tmaButtonMarkup } from "./shared/reply.js";

// after creating an OpenTab via /api/escrow…
await ctx.reply(
  `Opened a tab for @${slug} — they'll claim when they sign up.`,
  { reply_markup: tmaButtonMarkup({ orderId: openTab.id, label: "View OpenTab" }) }
);

BotFather setup (one-time)

  1. Open @BotFather.
  2. Run /setdomain and pick your Tab bot. Set it to thetab.bar (the Mini App domain must match the host of the URL in the web_app button).
  3. (Optional) /newapp to register a dedicated Mini App listing with a name + icon — Tab users can then launch the checkout from the bot menu, not only from a button reply.

What the Mini App can do

  • Auto-close on settlement. When the polled order flips to completed, we fire haptic success + dismiss the WebApp after ~1.8s.
  • Main button → open browser. The native MainButton at the bottom of the WebApp opens the full Tab checkout in the in-app browser when the user wants wallet unlock + Fund From Anywhere.
  • Theme-aware.Picks up Telegram's colour scheme automatically via the SDK's themeParams.

Identity

Telegram exposes WebApp.initData— a signed payload proving which TG user is viewing the Mini App. v0 doesn't bind this to a Tab handle automatically; the regular /connect @yourtabhandle bot command is the canonical link path. Future versions may auto-link the connection if a TG user opens a Mini App while linked.