T-Chat
Menu

Developers

T-Chat ships as a React SDK plus a small set of server-side calls. Your host application provisions users — there's no separate signup flow for end users.

1. Install the SDK

react and react-dom 18 or 19 are peer dependencies.

Install
pnpm add @tesark/chat-react

Import the stylesheet once in your app entry:

App entry
import "@tesark/chat-react/styles";

2. Provision a user and mint a token

End users are not Supabase Auth users — your server provisions identities with your tenant API key and exchanges them for a short-lived JWT.

Provision user
curl -X POST "$API_URL/v1/users" \
  -H "Authorization: Bearer $TENANT_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"externalId":"user-42","displayName":"Ada"}'
Exchange for JWT
curl -X POST "$API_URL/v1/token" \
  -H "Authorization: Bearer $TENANT_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"externalUserId":"user-42"}'

3. Render the chat panel

Pass the access token to ChatProvider and drop ChatPanel into a sized container.

App.tsx
import { ChatProvider, ChatPanel } from "@tesark/chat-react";
import "@tesark/chat-react/styles";

<ChatProvider
  accessToken={accessToken}
  userId={userId}
  tenantId={tenantId}
  apiUrl={API_URL}
>
  <div className="flex min-h-0 flex-1 flex-col">
    <ChatPanel />
  </div>
</ChatProvider>

Theming

ChatPanel is themed via CSS variables, so it can match your product's colors, fonts, and radii without overriding component internals.

Full API reference

The full HTTP API reference — including conversation management, system messages, and attachments — is available in your dashboard after signup.

Ready to add chat to your product?

Provision your first tenant and send a moderated message in minutes.