Streaming Answer

"use client"

import * as React from "react"

import { StreamingAnswer } from "@/components/streaming-answer"

const REPLY = "All set. Your table for **4** is held at **Toscano** on Friday at 8 pm.\n\n- Window table in the quiet section\n- Invite sent to the team"

// Stand-in for your model stream: append each chunk to `text` as it arrives.
export function Answer() {
  const [text, setText] = React.useState("")
  const [streaming, setStreaming] = React.useState(true)

  React.useEffect(() => {
    const chunks = REPLY.match(/\S+\s*/g) ?? []
    let i = 0
    const timer = setInterval(() => {
      i += 3
      setText(chunks.slice(0, i).join(""))
      if (i >= chunks.length) {
        clearInterval(timer)
        setStreaming(false)
      }
    }, 120)
    return () => clearInterval(timer)
  }, [])

  return (
    <StreamingAnswer
      text={text}
      streaming={streaming}
      actions={<button type="button" onClick={() => navigator.clipboard.writeText(text)}>Copy</button>}
    />
  )
}