"use client";
import { useChat } from "@ai-sdk/react";
import { useState } from "react";
export default function Chat() {
const { messages, sendMessage, status } = useChat();
const [input, setInput] = useState("");
return (
<div>
{messages.map((m) => (
<div key={m.id}>
<strong>{m.role}:</strong>{" "}
{m.parts.map((part, i) => (part.type === "text" ? <span key={i}>{part.text}</span> : null))}
</div>
))}
<form
onSubmit={(e) => {
e.preventDefault();
if (!input.trim()) return;
sendMessage({ text: input });
setInput("");
}}
>
<input value={input} onChange={(e) => setInput(e.target.value)} placeholder="Type a message..." />
<button type="submit" disabled={status !== "ready"}>Send</button>
</form>
</div>
);
}