'use client'

import { StreamableValue, useStreamableValue } from 'ai/rsc'
import { MemoizedReactMarkdown } from '../ui-v2/markdown'

export function BotMessage({
  content
}: {
  content: string | StreamableValue<string>
}) {
  const [data, error, pending] = useStreamableValue(content)

  // Currently, sometimes error occurs after finishing the stream.
  if (error) return <div>Error</div>

  return (

    <MemoizedReactMarkdown
      // components={{
      //   p({ children }) {
      //     return <p className="mb-2 last:mb-0">{children}</p>
      //   },
      // }}
      className="prose-sm prose-neutral prose-a:text-accent-foreground/50">
      {/* {data} */}
      {data === ''
        ? typeof data === 'string'
          ? data
          : JSON.stringify(data)
        : data ?? ''}
    </MemoizedReactMarkdown >




  )
}
