All files / client/components/Page PageBody.tsx

0% Statements 0/22
0% Branches 0/6
0% Functions 0/5
0% Lines 0/22

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63                                                                                                                             
import React from 'react'
import CrowiRenderer from 'client/util/CrowiRenderer'
import { Page } from 'client/types/crowi'
 
interface Props {
  page: Page
  highlightKeywords: string
  pageBody: string
}
 
export default class PageBody extends React.Component<Props> {
  static defaultProps = { page: {}, pageBody: '' }
 
  crowiRenderer: CrowiRenderer
 
  constructor(props: Props) {
    super(props)
 
    this.crowiRenderer = window.crowiRenderer // FIXME
    this.getMarkupHTML = this.getMarkupHTML.bind(this)
    this.getHighlightBody = this.getHighlightBody.bind(this)
  }
 
  getHighlightBody(body: string, keywords: string) {
    let returnBody = body
 
    keywords
      .replace(/"/g, '')
      .split(' ')
      .forEach(keyword => {
        if (keyword === '') {
          return
        }
        const k = keyword.replace(/[.*+?^${}()|[\]\\]/g, '\\$&').replace(/(^"|"$)/g, '') // for phrase (quoted) keyword
        const keywordExp = new RegExp(`(${k}(?!(.*?")))`, 'ig')
        returnBody = returnBody.replace(keywordExp, '<em class="highlighted">$&</em>')
      })
 
    return returnBody
  }
 
  getMarkupHTML() {
    let body = this.props.pageBody
    if (body === '') {
      body = this.props.page.revision.body
    }
 
    body = this.crowiRenderer.render(body)
 
    if (this.props.highlightKeywords) {
      body = this.getHighlightBody(body, this.props.highlightKeywords)
    }
 
    return { __html: body }
  }
 
  render() {
    const parsedBody = this.getMarkupHTML()
 
    return <div className="content" dangerouslySetInnerHTML={parsedBody} />
  }
}