"use client";

import { useChat } from "@ai-sdk/react";
import { DefaultChatTransport } from "ai";
import { ChatError } from "./chat-error";
import { ChatForm } from "./chat-form";
import { ChatMessages } from "./chat-messages";

export function Chat() {
  const { messages, sendMessage, status, error } = useChat({
    transport: new DefaultChatTransport({
      api: "http://localhost:3000/api/chat",
    }),
  });

  return (
    <div className="max-w-2xl flex flex-col gap-4">
      <ChatError error={error} />
      <ChatMessages messages={messages} />
      <ChatForm
        onMessage={sendMessage}
        disabled={status === "submitted" || status === "streaming"}
      />
    </div>
  );
}