import { redLetterSpan, type RedLetterEntry } from './redletter'

export default function RedText({ text, entry }: { text: string; entry: RedLetterEntry | undefined }) {
  if (entry === null) return <span className="jesus">{text}</span>
  if (typeof entry === 'string') {
    const span = redLetterSpan(text, entry)
    if (span) {
      const [s, e] = span
      return (
        <>
          {text.slice(0, s)}
          <span className="jesus">{text.slice(s, e)}</span>
          {text.slice(e)}
        </>
      )
    }
  }
  return <>{text}</>
}