<commit_before>
// CSS
import styles from './style.css';

import React, { Component } from 'react';

import Question from '../Question';

class Rating extends Component {

    constructor() {
        super();
        this._onClickQuestion = this._onClickQuestion.bind(this);
    }

    render() {
        const { data } = this.props;
        return (
            <div
                className="question"
                onClick={this._onClickQuestion}
            >
                <Question
                    text={data.label}
                />
                <div className={styles.ratingWrapper}>
                    <ul className={styles.ratingGrp}>
                        {this._renderLabel(data.data[0])}
                        {this._renderRatingItem()}
                        {this._renderLabel(data.data[data.data.length - 1])}
                    </ul>
                </div>
            </div>
        );
    }

    _renderLabel(item) {
        return (
            <li className={styles.label}>{item.label}</li>
        );
    }

    _renderRatingItem() {
        const { data:item } = this.props;
        const items = item.data.map((itm, idx) => {
            const val = itm.value ? itm.value : itm.label;
            const label = itm.label;
            return (
                <li
                    key={idx}
                    title={label}
                    className={styles.ratingItem}
                /><commit_msg>Question's options input in rating<commit_after>
// CSS
import styles from './style.css';

import React, { Component } from 'react';

import Question from '../Question';

class Rating extends Component {

    constructor() {
        super();
        this._onClickQuestion = this._onClickQuestion.bind(this);
    }

    render() {
        const { data } = this.props;
        return (
            <div
                className="question"
                onClick={this._onClickQuestion}
            >
                <Question
                    text={data.label}
                />
                <div className={styles.ratingWrapper}>
                    <ul className={styles.ratingGrp}>
                        {this._renderLabel(data.data[0])}
                        {this._renderRatingItem()}
                        {this._renderLabel(data.data[data.data.length - 1])}
                    </ul>
                    {
                        data.input ?
                            <input
                                type="text"
                                value={data.input}
                                readonly
                            /> : ''
                    }
                </div>
            </div>
        );
    }

    _renderLabel(item) {
        return (
            <li className={styles.label}>{item.label}</li>
        );
    }

    _renderRatingItem() {
        const { data:item } = this.props;
        const items = item.data.map((itm, idx) => {
            const val = itm.value ? itm.value : itm.label;
            const label = itm.label;
            return (
                <li
                    key={idx}
                    title={label}
                    className={styles.ratingItem}
                />
{'fraction_non_alphanumeric': 0.11336032388663968, 'fraction_numerical': 0.0012457178449081284, 'mean_word_length': 1.0843608046722908, 'pattern_counts': {'":': 0, '<': 24, '<?xml version=': 0, '>': 26, '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': '3512767', 'n_tokens_mistral': 826, 'n_tokens_neox': 774, 'n_words': 147}