import React from 'react'
import { isSafe } from 'exotic'
import { Empty } from 'atoms/Empty'
import { DefaultProps } from '../typings'

interface Props extends DefaultProps {}

class LineBrokenText extends React.PureComponent<Props> {
  static defaultProps = {
    className: '',
  }

  renderContent = (content: string) =>
    content.split('\n').map((line, index) => (
      <span key={index}>
        {line}
        <br />
      </span>
    ))

  render() {
    const { content } = this.props
    const view = isSafe(content) ? this.renderContent(content) : <Empty />
    return view
  }
}

export { LineBrokenText }
export default LineBrokenText