Vercel AI SDK Integration

npm install ai @ai-sdk/openai

import { createOpenAI } from '@ai-sdk/openai';

export const setu = createOpenAI({
  apiKey: process.env.SUPREME_API_KEY,
  baseURL: 'https://supremeai.services/api/setu/v1',
});

import { streamText } from 'ai';
import { setu } from '@/lib/setu';

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

  const result = await streamText({
    model: setu('quantum-lite'),
    messages,
  });

  return result.toDataStreamResponse();
}

'use client';

import { useChat } from 'ai/react';

export default function ChatBox() {
  const { messages, input, handleInputChange, handleSubmit } = useChat();

  return (
    <div className="flex flex-col h-96 p-4 border rounded-xl">
      <div className="flex-1 overflow-y-auto space-y-2">
        {messages.map((m) => (
          <div key={m.id} className={m.role === 'user' ? 'text-blue-600' : 'text-gray-900'}>
            <strong>{m.role === 'user' ? 'You: ' : 'Setu: '}</strong>
            {m.content}
          </div>
        ))}
      </div>
      <form onSubmit={handleSubmit} className="flex gap-2 pt-2">
        <input
          value={input}
          onChange={handleInputChange}
          placeholder="Ask anything in Nepali or English..."
          className="flex-1 px-3 py-2 border rounded-lg"
        />
        <button type="submit" className="px-4 py-2 bg-blue-600 text-white rounded-lg">
          Send
        </button>
      </form>
    </div>
  );
}