<commit_before>define(['react', 'components/page_header', 'components/common/glyphicon'], function(React, PageHeader, Glyphicon) {

    var ReportInstanceForm = React.createClass({
        getInitialState: function() {
            return {
                ssh: false,
                vnc: false,
                pending: false,
                installErrors: false,
                metrics: false,
                other: false,
                details: ""
            };
        },
        updateCheckbox: function(key, e) {
            var state = {};
            state[key] = e.target.checked;
            this.setState(state);
        },
        updateDetails: function(e) {
            this.setState({details: e.target.value});
        },
        renderCheckbox: function(value, text) {
            return React.DOM.div({className: 'checkbox'},
                React.DOM.label({},
                    React.DOM.input({
                        type: 'checkbox',
                        name: 'problems',
                        id: 'problems-' + value,
                        value: value,
                        checked: this.state[value],
                        onChange: _.partial(this.updateCheckbox, value)}),
                    text));
        },
        handleSubmit: function(e) {
            e.preventDefault();
            console.log(this.state);
        },
        render: function() {
            return React.DOM.form({role: 'form', onSubmit: this.handleSubmit},
                React.DOM.div({className: 'form-group'},
                    React.DOM.label({}, "What problems are you having with this instance?"),
                    this.renderCheckbox("ssh", "I cannot connect via SSH."),
                    this.renderCheckbox("vnc", "I cannot connect via VNC."),
                    this.renderCheckbox("pending", "The instance's status never changed from pending to running"),
                    this.renderCheckbox("installErrors", "I am receiving errors while trying to run or install software"),
                    this.renderCheckbox("metrics", "The instance's metrics do not display."),
                    this.renderCheckbox("other", "Other problem(s).")),
                React.DOM.div({className: 'form-group'},
                    React.DOM.label({htmlFor: 'details'}, "Please provide as many details about the problem as possible."),
                    React.DOM.textarea({className: 'form-control', onChange: this.updateDetails, rows: 6})),
                React.DOM.button({type: 'submit', className: 'btn btn-primary'}, "Submit"));
        }
    });

    var ReportInstance = React.createClass({
        componentDidMount: function() {
            if (!this.props.instance)
                this.props.onRequestInstance();
        },
        renderIntro: function() {
            return React.DOM.p({className: 'alert alert-info'},
                Glyphicon({name: 'info-sign'}),
                " Is instance ",
                React.DOM.code({}, this.props.instance.get('name_or_id')),
                " exhibiting unexpected behavior? Please read about ",<commit_msg>Collect problem text for sending instance report<commit_after>define(['react', 'components/page_header', 'components/common/glyphicon', 'underscore'], function(React, PageHeader, Glyphicon, _) {

    var ReportInstanceForm = React.createClass({
        getInitialState: function() {
            return {
                ssh: false,
                vnc: false,
                pending: false,
                installErrors: false,
                metrics: false,
                other: false,
                details: ""
            };
        },
        updateCheckbox: function(key, e) {
            var state = {};
            state[key] = e.target.checked;
            this.setState(state);
        },
        updateDetails: function(e) {
            this.setState({details: e.target.value});
        },
        renderCheckbox: function(value) {
            return React.DOM.div({className: 'checkbox'},
                React.DOM.label({},
                    React.DOM.input({
                        type: 'checkbox',
                        name: 'problems',
                        id: 'problems-' + value,
                        value: value,
                        checked: this.state[value],
                        onChange: _.partial(this.updateCheckbox, value)}),
                    this.problemText[value]));
        },
        handleSubmit: function(e) {
            e.preventDefault();
            var problemKeys = _.keys(_.object(_.filter(_.pairs(this.state), function(pair) {return pair[1] === true;})))
            var problems = _.values(_.pick(this.problemText, problemKeys));
            console.log(this.state);
        },
        problemText: {
            ssh: "I cannot connect via SSH.",
            vnc: "I cannot connect via VNC.",
            pending: "The instance's status never changed from pending to running",
            installErrors: "I am receiving errors while trying to run or install software",
            metrics: "The instance's metrics do not display.",
            other: "Other problem(s)."
        },
        render: function() {
            return React.DOM.form({role: 'form', onSubmit: this.handleSubmit},
                React.DOM.div({className: 'form-group'},
                    React.DOM.label({}, "What problems are you having with this instance?"),
                    this.renderCheckbox("ssh"),
                    this.renderCheckbox("vnc"),
                    this.renderCheckbox("pending"),
                    this.renderCheckbox("installErrors"),
                    this.renderCheckbox("metrics"),
                    this.renderCheckbox("other")),
                React.DOM.div({className: 'form-group'},
                    React.DOM.label({htmlFor: 'details'}, "Please provide as many details about the problem as possible."),
                    React.DOM.textarea({className: 'form-control', onChange: this.updateDetails, rows: 6})),
                React.DOM.button({type: 'submit', className: 'btn btn-primary'}, "Submit"));
        }
    });

    var ReportInstance = React.createClass({
        componentDidMount: function() {
            if (!this.props.instance)
                this.props.onRequestInstance();
        },
        renderIntro: function() {
            return React.DOM.p({className: 'alert alert-info'},
                Glyphicon({name: 'info-sign'}),
                " Is instance ",
                React.DOM.code({}, this.props.instance.get('name_or_id')),
                " exhibiting unexpected behavior? Please read about ",
{'fraction_non_alphanumeric': 0.12498117753350399, 'fraction_numerical': 0.0004517391959042313, 'mean_word_length': 1.6589271417133706, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, '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': '1558283', 'n_tokens_mistral': 1662, 'n_tokens_neox': 1591, 'n_words': 384}