<commit_before>import React, {PureComponent, PropTypes, createElement} from 'react'
import Markdown from 'markdown-react-js'
import cn from 'classnames'

import ScrollToHash from '../ScrollToHash'
import injectSheet from '../../utils/jss'
import Code from './Code'
import A from './A'
import H from './H'
import styles from './styles'

// There was a wrong formatted image url in all our .md files, now its fixed
// but we still need to support older versions.
const fixGitterBadge = text => text.replace(/Join Chat\.svg/g, 'JoinChat.svg')

const markdownOptions = {
  linkify: true
}

const headlines = ['h1', 'h2', 'h3', 'h4', 'h5']

class HighlightedMarkdown extends PureComponent {
  static propTypes = {
    sheet: PropTypes.object.isRequired,
    text: PropTypes.string.isRequired,
    page: PropTypes.string.isRequired,
    className: PropTypes.string,
  }

  static defaultProps = {
    className: ''
  }

  onIterate = (tag, props, children) => {
    if (tag === 'a') return <A {...props} page={this.props.page}>{children}</A>
    if (tag === 'code') return <Code lang={props['data-language']} text={children[0]} />
    // React throws if children are passed to img.
    if (tag === 'img') return createElement(tag, props)
    if (headlines.indexOf(tag) !== -1) {
      return <H {...props} tag={tag} sheet={this.props.sheet}>{children}</H>
    }
    return createElement(tag, props, children)
  }

  render() {
    const {sheet: {classes}, className, text} = this.props

    // Server side rendering throws erros.
    // So we need to handle situation when text comes undefined
    if (!text) return <div />

    return (
      <ScrollToHash>
        <Markdown
          markdownOptions={markdownOptions}
          className={cn(classes.highlightedMarkdown, className)}
          text={fixGitterBadge(text)}
          onIterate={this.onIterate}
        />
      </ScrollToHash>
    )<commit_msg>Fix plain text html markup in rendered markdown<commit_after>import React, {PureComponent, PropTypes, createElement} from 'react'
import Markdown from 'markdown-react-js'
import cn from 'classnames'

import ScrollToHash from '../ScrollToHash'
import injectSheet from '../../utils/jss'
import Code from './Code'
import A from './A'
import H from './H'
import styles from './styles'

// There was a wrong formatted image url in all our .md files, now its fixed
// but we still need to support older versions.
const fixGitterBadge = text => text.replace(/Join Chat\.svg/g, 'JoinChat.svg')

const markdownOptions = {
  html: true,
  linkify: true
}

const headlines = ['h1', 'h2', 'h3', 'h4', 'h5']

class HighlightedMarkdown extends PureComponent {
  static propTypes = {
    sheet: PropTypes.object.isRequired,
    text: PropTypes.string.isRequired,
    page: PropTypes.string.isRequired,
    className: PropTypes.string,
  }

  static defaultProps = {
    className: ''
  }

  onIterate = (tag, props, children, level) => {
    if (tag === 'a') return <A {...props} page={this.props.page}>{children}</A>
    if (tag === 'code') return <Code lang={props['data-language']} text={children[0]} />
    // React throws if children are passed to img.
    if (tag === 'img') return createElement(tag, props)
    if (headlines.indexOf(tag) !== -1) {
      return <H {...props} tag={tag} sheet={this.props.sheet}>{children}</H>
    }
    // Process top level node to convert possible stringified html to real one
    if (level === 0) children = this.iterateChildren(children, tag)
    return createElement(tag, props, children)
  }

  iterateChildren = (node, tag) => {
    node = node.map((entry) => {
      // Suppose, if string starts with '<' - its a html markup
      if (typeof entry === 'string' && entry.indexOf('<') === 0) {
        return createElement(tag, {dangerouslySetInnerHTML: {__html: entry}})
      }
      if (typeof entry === 'object' && entry.children) {
        entry.children = this.iterateChildren(entry.children, tag)
      }
      return entry
    })
    return node
  }

  render() {
    const {sheet: {classes}, className, text} = this.props

    // Server side rendering throws erros.
    // So we need to handle situation when text comes undefined
    if (!text) return <div />

    return (
      <ScrollToHash>
        <Markdown
          markdownOptions={markdownOptions}
          className={cn(classes.highlightedMarkdown, className)}
          text={fixGitterBadge(text)}
          onIterate={this.onIterate}
        />
      </ScrollToHash>
    )
{'fraction_non_alphanumeric': 0.1397945511389013, 'fraction_numerical': 0.003573023671281822, 'mean_word_length': 3.1357340720221605, 'pattern_counts': {'":': 0, '<': 23, '<?xml version=': 0, '>': 27, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6428969', 'n_tokens_mistral': 1355, 'n_tokens_neox': 1328, 'n_words': 415}