<commit_before>import React from "react";
import stores from "stores";
import SelectMenu from "components/common/ui/SelectMenu";

export default React.createClass({
    displayName: "PasswordLoginForm",

    propTypes: {
        attemptLogin: React.PropTypes.func.isRequired,
    },

    //
    // Mounting & State
    // ----------------
    //
    componentDidMount: function() {
        stores.ProviderStore.addChangeListener(this.updateState);
    },
    componentWillUnmount: function() {
        stores.ProviderStore.removeChangeListener(this.updateState);
    },
    updateState: function() {
        let providerList = stores.ProviderStore.getAll();
        let provider = this.state.provider;
        let showNewProvider = false;
        if(providerList == []) {
            showNewProvider = true;
        }
        if(provider == null && providerList && providerList.length != 0) {
            provider = providerList.first();
        }
        let username = this.state.username;
        let password = <PASSWORD>;
        let projectName = this.state.projectName;

        this.setState({
            provider, providerList, showNewProvider,
            username, password, projectName});
    },

    getInitialState: function() {
        return {
            username: "",
            password: "",
            project_name: "",
            provider: null,
            providerList: stores.ProviderStore.getAll(),
            showNewProvider: false
        };
    },
    onProjectNameChange: function(e) {
        var input = e.target.value.trim();
        this.setState({
            projectName: input
        });
    },

    onUsernameChange: function(e) {
        var input = e.target.value.trim();
        this.setState({
            username: input
        });
    },

    onEnterPressed: function(e) {
        if (e.key === 'Enter' && this.isSubmittable()) {
            this.attemptLogin()
        }
    },

    attemptLogin: function() {
        this.props.attemptLogin(
            this.state.username,
            this.state.password,
            this.state.projectName,
            this.state.provider,
            this.onLoginError)
    },

    onLoginError: function(error_message) {
        this.setState({
            error_message: error_message
        });
    },

    onPasswordChange: function(e) {
        var input = e.target.value;
        this.setState({
            password: input
        });
    },

    isSubmittable: function() {
        var hasUsername = !!this.state.username && this.state.username.length > 0;
        var hasPassword = !!this.state.password && this.state.password.length > 0;
        var hasProjectName = !!this.state.projectName && this.state.projectName.length > 0;
        if(this.state.showNewProvider) {
            hasProjectName = true;
        }
        return hasUsername && hasPassword && hasProjectName;
    },
    onProviderChange: function(provider) {
        this.setState({provider:provider});
    },

    render: function() {
        let groupClasses = this.state.error_message != null ? "form-group has-error" : "form-group";
        let usernameClasses = groupClasses,
            passwordClasses = groupClasses,<commit_msg>Avoid multiple submissions by disabling the login prompt<commit_after>import React from "react";
import stores from "stores";
import SelectMenu from "components/common/ui/SelectMenu";

export default React.createClass({
    displayName: "PasswordLoginForm",

    propTypes: {
        attemptLogin: React.PropTypes.func.isRequired,
    },

    //
    // Mounting & State
    // ----------------
    //
    componentDidMount: function() {
        stores.ProviderStore.addChangeListener(this.updateState);
    },
    componentWillUnmount: function() {
        stores.ProviderStore.removeChangeListener(this.updateState);
    },
    updateState: function() {
        let providerList = stores.ProviderStore.getAll();
        let provider = this.state.provider;
        let showNewProvider = false;
        if(providerList == []) {
            showNewProvider = true;
        }
        if(provider == null && providerList && providerList.length != 0) {
            provider = providerList.first();
        }
        let username = this.state.username;
        let password = this.state.password;
        let projectName = this.state.projectName;

        this.setState({
            provider, providerList, showNewProvider,
            username, password, projectName});
    },

    getInitialState: function() {
        return {
            username: "",
            password: "",
            project_name: "",
            provider: null,
            allowLogin: true,
            providerList: stores.ProviderStore.getAll(),
            showNewProvider: false
        };
    },
    onProjectNameChange: function(e) {
        var input = e.target.value.trim();
        this.setState({
            projectName: input
        });
    },

    onUsernameChange: function(e) {
        var input = e.target.value.trim();
        this.setState({
            username: input
        });
    },

    onEnterPressed: function(e) {
        if (e.key === 'Enter' && this.isSubmittable()) {
            this.attemptLogin()
        }
    },

    attemptLogin: function() {
        this.setState({
            allowLogin: false,
        });
        this.props.attemptLogin(
            this.state.username,
            this.state.password,
            this.state.projectName,
            this.state.provider,
            this.onLoginError)
    },

    onLoginError: function(error_message) {
        this.setState({
            error_message: error_message,
            allowLogin: true
        });
    },

    onPasswordChange: function(e) {
        var input = e.target.value;
        this.setState({
            password: input
        });
    },

    isSubmittable: function() {
        var hasUsername = !!this.state.username && this.state.username.length > 0;
        var hasPassword = !!this.<PASSWORD> && this.<PASSWORD>.length > 0;
        var hasProjectName = !!this.state.projectName && this.state.projectName.length > 0;
        if(this.state.showNewProvider) {
            hasProjectName = true;
        }
        return hasUsername && hasPassword && hasProjectName && this.state.allowLogin == true;
    },
    onProviderChange: function(provider) {
        this.setState({provider:provider});
    },

    render: function() {
        let groupClasses = this.state.error_message != null ? "form-group has-error" : "form-group";
        let usernameClasses = groupClasses,
            passwordClasses = groupClasses,
{'fraction_non_alphanumeric': 0.12004838221953432, 'fraction_numerical': 0.0012095554883580285, 'mean_word_length': 2.0054520672421625, 'pattern_counts': {'":': 0, '<': 6, '<?xml version=': 0, '>': 12, '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': '372662', 'n_tokens_mistral': 1755, 'n_tokens_neox': 1735, 'n_words': 339}