<commit_before>import React from "react";
import { Panel, Table } from "react-bootstrap";
import { Maps } from "robe-react-commons";
import ShallowComponent from "robe-react-commons/lib/components/ShallowComponent";
import Highlight from "react-highlight";


export default class Renderer extends ShallowComponent {

    static style = {
        borderBottom: "1px solid lightgray",
        marginBottom: "50px"
    }

    json;

    /* eslint no-useless-constructor: 0*/
    constructor(props) {
        super(props);
        this.json = this.props.json === undefined ? {} : this.props.json;
        this.state = {
            showCode: false
        };
    }

    render() {

        let highlight = undefined;
        if (this.state.showCode) {
            highlight = (<Highlight className="javascript">
                {this.props.code}
            </Highlight>);
        };
        return (
            <div style={Renderer.style}>
                <h3 id={this.props.header}>{this.props.header}</h3>
                <h6><code>{`<${this.props.header}> `}</code>{this.props.desc}</h6>
                <h5>Examples</h5>
                <Panel>
                    <this.props.sample.default/>
                    <a className="pull-right" onClick={this.__toogleCode}>Show Code</a>
                </Panel>
                {highlight}
                <h5>Props</h5>
                {this.__renderTable(this.json.props) }
            </div >);
    }

    __toogleCode = () => {
        console.log(this.state.showCode);
        this.setState({
            showCode: !this.state.showCode
        });
    }

    __renderTable(data: Object): Array {
        let rows = [];

        Maps.forEach(data, (value: any, key: string) => {
            let type = value.type !== undefined ? value.type.name : "";
            rows.push(<tr><commit_msg>log deleted<commit_after>import React from "react";
import { Panel, Table } from "react-bootstrap";
import { Maps } from "robe-react-commons";
import ShallowComponent from "robe-react-commons/lib/components/ShallowComponent";
import Highlight from "react-highlight";


export default class Renderer extends ShallowComponent {

    static style = {
        borderBottom: "1px solid lightgray",
        marginBottom: "50px"
    }

    json;

    /* eslint no-useless-constructor: 0*/
    constructor(props) {
        super(props);
        this.json = this.props.json === undefined ? {} : this.props.json;
        this.state = {
            showCode: false
        };
    }

    render() {

        let highlight = undefined;
        if (this.state.showCode) {
            highlight = (<Highlight className="javascript">
                {this.props.code}
            </Highlight>);
        };
        return (
            <div style={Renderer.style}>
                <h3 id={this.props.header}>{this.props.header}</h3>
                <h6><code>{`<${this.props.header}> `}</code>{this.props.desc}</h6>
                <h5>Examples</h5>
                <Panel>
                    <this.props.sample.default/>
                    <a className="pull-right" onClick={this.__toogleCode}>Show Code</a>
                </Panel>
                {highlight}
                <h5>Props</h5>
                {this.__renderTable(this.json.props) }
            </div >);
    }

    __toogleCode = () => {
        this.setState({
            showCode: !this.state.showCode
        });
    }

    __renderTable(data: Object): Array {
        let rows = [];

        Maps.forEach(data, (value: any, key: string) => {
            let type = value.type !== undefined ? value.type.name : "";
            rows.push(<tr>
{'fraction_non_alphanumeric': 0.14136413641364137, 'fraction_numerical': 0.006600660066006601, 'mean_word_length': 1.7891104294478528, 'pattern_counts': {'":': 0, '<': 45, '<?xml version=': 0, '>': 49, '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': '4711804', 'n_tokens_mistral': 1068, 'n_tokens_neox': 1009, 'n_words': 197}