phodal/growth

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { ScrollView } from 'react-native';
import TimeLine from '../../../components/discover/roadmap-detail/view/TimeLineView';
import AppStyle from '../../../theme/styles';

const parse = (value, re) => (value.replace(re, '\r\n'));

class RoadmapDetail extends Component {
  static componentName = 'RoadmapDetail';

  static propTypes = {
    timeline: PropTypes.arrayOf(
      PropTypes.shape({
        description: PropTypes.string,
        section: PropTypes.string,
      }),
    ),
  };

  static defaultProps = {
    timeline: [],
  };

  constructor(props) {
    super(props);
    this.state = {
      rowData: Array.from(
        new Array(this.props.timeline.length))
        .map((val, index) => (
          this.props.timeline[index]
        )),
    };
  }

  render() {
    const rows = this.state.rowData.map((val, index) => (
      <TimeLine
        title={val.section}
        content={parse(parse(val.description, /<br\s*\/?> /gi), /<br\s*\/?>/gi)}
        itemIndex={index}
        key={val.section}
      />
    ));
    return (
      <ScrollView style={AppStyle.detailBasisStyle}>
        {rows}
      </ScrollView>
    );
  }
}
export default RoadmapDetail;