NEXT_PUBLIC_OPENAI_DOMAIN_KEY=your_domain_key
NEXT_PUBLIC_API_URL=http://localhost:8000

'use client';

import { ChatKit } from '@openai/chatkit';
import { useAuth } from '@/lib/auth';

export default function ChatPage() {
  const { user, token } = useAuth();

  const handleMessage = async (message: string, conversationId?: number) => {
    const response = await fetch(
      `${process.env.NEXT_PUBLIC_API_URL}/api/${user.id}/chat`,
      {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
          'Authorization': `Bearer ${token}`,
        },
        body: JSON.stringify({ conversation_id: conversationId, message }),
      }
    );
    const data = await response.json();
    return data.response;
  };

  return (
    <ChatKit
      domainKey={process.env.NEXT_PUBLIC_OPENAI_DOMAIN_KEY!}
      onMessage={handleMessage}
      placeholder="Ask me to manage your tasks..."
    />
  );
}