TanStack AI + گونکا — TypeScript پر AI-ایپلی کیشنز صرف چند روپے میں

پیکیج انسٹالیشن (کور + OpenAI-اڈاپٹر، جہاں openaiCompatible موجود ہے):

# pnpm
pnpm add @tanstack/ai @tanstack/ai-openai

# npm
npm install @tanstack/ai @tanstack/ai-openai

React میں چیٹ انٹرفیس کے لیے کلائنٹ اور ہکس شامل کریں:

pnpm add @tanstack/ai-client @tanstack/ai-react

JoinGonka API-key: اگر ابھی تک نہیں ہے — gate.joingonka.ai/register پر رجسٹر کریں، 3M مفت ٹوکنز حاصل کریں اور Dashboard → API Keys میں jg-xxx کی (key) بنائیں۔ ایک ہی کی اور بیلنس OpenAI اور Anthropic دونوں فارمیٹس کے لیے کام کرتا ہے۔

TanStack AI میں کسٹم OpenAI-مطابق پرووائیڈر openaiCompatible() فنکشن سے کنفیگر کیا جاتا ہے: ایک بار baseURL، apiKey اور ماڈلز کی فہرست سیٹ کریں، پھر ہر کال کے لیے ماڈل منتخب کریں۔ ہمارا Gateway Chat Completions فارمیٹ میں بات کرتا ہے، اس لیے ہم api: 'chat-completions' رکھتے ہیں (یہی ڈیفالٹ ویلیو ہے)۔

import { openaiCompatible } from '@tanstack/ai-openai'

// Gonka provider: configured once
export const gonka = openaiCompatible({
  name: 'gonka',
  baseURL: 'https://gate.joingonka.ai/v1',
  apiKey: process.env.GONKA_API_KEY!, // jg-your-key
  api: 'chat-completions',
  models: [
    'MiniMaxAI/MiniMax-M2.7', // default
    'deepseek-ai/DeepSeek-V4-Flash-0731',
    'zai-org/GLM-5.3-Flash', // reasoning model
  ],
})

سرور پر اسٹریمنگ چیٹ (مثلاً کسی بھی فل اسٹیک فریم ورک یا TanStack Start میں روٹ ہینڈلر)۔ جواب کی لمبائی modelOptions سے طے ہوتی ہے — یہی نیتیو wire پیرامیٹرز (max_tokens، temperature) کی واحد جگہ ہے:

import { chat, toServerSentEventsResponse } from '@tanstack/ai'
import { gonka } from './gonka'

export async function POST(request: Request) {
  const { messages } = await request.json()

  const stream = chat({
    adapter: gonka('MiniMaxAI/MiniMax-M2.7'),
    messages,
    modelOptions: { max_tokens: 8192 }, // Gateway output cap
  })

  return toServerSentEventsResponse(stream)
}

React کلائنٹ useChat ہُک کے ذریعے — سرور سے UI تک جوابات اسٹریم کرتا ہے:

import { useChat } from '@tanstack/ai-react'

function Chat() {
  const { messages, sendMessage, status } = useChat({ api: '/api/chat' })

  return (
    <div>
      {messages.map((m) => (
        <p key={m.id}><b>{m.role}:</b> {m.content}</p>
      ))}
      <button onClick={() => sendMessage('What is Gonka?')}>
        Ask
      </button>
    </div>
  )
}

سرور کے بغیر: یہی پرووائیڈر اسکرپٹ یا بیک اینڈ میں براہ راست کام کرتا ہے — chat() کال کریں اور اسٹریم پڑھیں۔ Gonka سے کنیکشن ہر صورت میں یکساں ہے۔

Gateway کے ذریعے ماڈل پیرامیٹرز: کانٹیکسٹ — MiniMax M2.7 میں 180K ٹوکنز، DeepSeek V4 Flash میں 380K اور GLM-5.3 Flash میں 390K۔ max_tokens کی حد — MiniMax M2.7 اور GLM-5.3 Flash میں 8192، DeepSeek V4 Flash میں 32768۔ اگر max_tokens نہ دیا جائے تو non-stream کے لیے ڈیفالٹ 1500 ہے، اس لیے لمبے جوابات کے لیے اسے واضح طور پر دیں۔

TanStack AI براہ راست OpenAI/Anthropic ریٹس اور Gonka کے ذریعے یکساں طور پر کام کرتا ہے — صرف baseURL تبدیل ہوتا ہے۔ لیکن قیمت میں زمین آسمان کا فرق ہے۔ TanStack AI پر عام پروڈکشن ایپلیکیشن کے لوڈ کا موازنہ کریں:

TanStack AI کا provider-agnostic طریقہ کار یہ ہے کہ Gonka پر سوئچ کرنا کوڈ کو دوبارہ لکھنا نہیں، بلکہ صرف ایک لائن (baseURL) کو تبدیل کرنا ہے۔ اسی وقت آپ کے ٹائپ-سیف ٹولز، اسٹرکچرڈ آؤٹ پٹ اور React-ہکس برقرار رہتے ہیں۔ ہزاروں صارفین والی ایپلیکیشن کے لیے، یہ ماہانہ ہزاروں ڈالر کی بچت ہے۔

Gonka کی قیمت: ان پٹ پر فی 1M ٹوکنز تقریباً $0.0062، آؤٹ پٹ پر ×3۔ یہ OpenAI اور Anthropic کے براہ راست ریٹس سے سینکڑوں سے ہزار گنا سستا ہے۔

TanStack AI کی سب سے بڑی خصوصیت واحد معاہدہ toolDefinition() ہے: ٹول ایک ہی بار بیان ہوتا ہے (Zod، ArkType، Valibot یا JSON Schema کے ذریعے ان پٹ/آؤٹ پٹ)، جبکہ عمل درآمد سرور یا کلائنٹ پر جڑا جاتا ہے۔ MiniMax M2.7، DeepSeek V4 Flash اور GLM-5.3 Flash، Gonka کے ذریعے مقامی tool calling کی سہولت دیتے ہیں، اس لیے ایجنٹ قابلِ بھروسا طریقے سے کام کرتے ہیں — متنی جوابات کو پارس کرنے کی ضرورت کے بغیر۔

import { chat, toolDefinition } from '@tanstack/ai'
import { gonka } from './gonka'
import { z } from 'zod'

const getWeather = toolDefinition({
  name: 'getWeather',
  description: 'Get the weather in a city',
  inputSchema: z.object({ city: z.string() }),
  outputSchema: z.object({ tempC: z.number() }),
}).server(async ({ city }) => {
  return { tempC: 21 } // your real API call
})

const stream = chat({
  adapter: gonka('MiniMaxAI/MiniMax-M2.7'),
  messages: [{ role: 'user', content: 'What is the weather in Moscow?' }],
  tools: [getWeather],
  modelOptions: { max_tokens: 8192 },
})

کون سا ماڈل منتخب کریں:

• MiniMaxAI/MiniMax-M2.7 — ڈیفالٹ، رفتار اور معیار کا توازن، طویل کانٹیکسٹ۔ جواب کی حد 8192۔
• deepseek-ai/DeepSeek-V4-Flash-0731 — نیٹ ورک کے سب سے طویل کانٹیکسٹ میں سے ایک (380K)، بڑے پرامپٹس پر سستا۔ جواب کی حد 32768۔
• zai-org/GLM-5.3-Flash — reasoning ماڈل: جواب سے پہلے غور کرتا ہے، پیچیدہ منطق میں مضبوط؛ نیٹ ورک کا سب سے طویل کانٹیکسٹ (390K)۔ جواب کی حد 8192؛ استدلال max_tokens کا کچھ حصہ استعمال کرتا ہے۔

TanStack AI میں runtime adapter switching کی بدولت تینوں ماڈل ایک ہی پرووائیڈر میں رکھے جا سکتے ہیں اور لمحہ بہ لمحہ ایک سے دوسرے پر سوئچ کیا جا سکتا ہے — مثلاً، استدلالی کام GLM-5.3 Flash پر اور فوری جوابات MiniMax پر۔