import { Typography } from '@mui/material'
import type { ChatThinkingProps } from '../types'
import { styles } from './styles'

export function ChatThinking({
  children = 'Thinking...',
  duration = 2000,
  sx,
}: ChatThinkingProps) {
  const durSeconds = `${duration / 1000}s`
  return (
    <Typography
      variant='body2'
      sx={{
        ...styles.thinking,
        animationDuration: durSeconds,
        ...sx,
      }}
    >
      {children}
    </Typography>
  )
}