<commit_before>import React, {Component, PropTypes} from 'react';
import {connectReduxForm} from 'redux-form';
import {Button, ButtonGroup} from 'react-bootstrap';
import Select from "react-select";
import numeral from 'numeral';
import Immutable from 'immutable';
import * as Utils from '../utils';
import Api from "../../api";


function bookValidation(data) {
    const errors = {};

    if (!data.title) {
    	errors.title = "Title is required";	
    }

    if (!data.language) {
    	console.log("fiuertuiertyiuertiuyter");
    	errors.language = "Language is required";	
    }

    if (!data.pageCount) {
    	errors.pageCount = "Page count is required";
    } else if (!Utils.isPositiveInteger(data.pageCount) || data.pageCount == 0) {
		errors.pageCount = "Value must be an integer greater than 0";
	}

	if (!data.price) {
		errors.price = "Price is required";
	} else if (isNaN(parseFloat(data.price))) {
		errors.price = "Not a valid price";
	}

    return errors;
}

export default class BookForm extends Component {
	static defaultProps = {
		fields: {
			title: null,
			language: null,
			authors: null,
			pageCount: 0,
			price: 0
		}
	}

	constructor(props) {
		super(props);

		this.state = {
			title: null,
			language: null,
			authors: null,
			pageCount: 0,
			price: 0
		}

		console.log("ctor called: " + JSON.stringify(props));
	}

	searchAuthors(input, callback) {
		const {d} = this.props;
		console.log("lols");
		Api.searchAuthors(input).then(authors => {
			console.log("authors2: " + JSON.stringify(authors.toArray()));

			let mapped = Immutable.List();

			authors.map(author => {
				mapped = mapped.push({
					value: author.id,
					label: author.name,
				})
			});

			console.log("sss: " + mapped.toArray());
    		//let selections = {options: authors.toArray()};
    		let selections = {options: mapped.toArray()};
			callback(null, selections);
			//this.props.courseActions.setCourses(courses, d);
		});

	}

	getOptions(input, callback) {	
		var self = this;

	    setTimeout(() => {
	    	self.searchAuthors(input, callback);
	    }, 500);
	}

	changeValue(newValue) {
		console.log("new value: " + newValue);
		let selectedAuthorIds = newValue.split(",");
	}

	renderOption(author) {
		console.log("luss: " + JSON.stringify(author));
		return (
			<div>
				<p key={author.value}>
					{author.label}
				</p>
			</div>
		);
	}

	foo(a, b, c) {
		console.log("a: " + JSON.stringify(a));
		console.log("b: " + JSON.stringify(b));
		console.log("c: " + JSON.stringify(c));
	}

	validateForm(e) {
		e.preventDefault();

    	const {
      		fields: {
	      		title, 
	      		language,
	      		authors,
	      		pageCount,
	      		price
      		}, 
    	} = this.props;

		let formData = {
			title: this.props.fields.title 
		};

		alert("validateForm(): " + JSON.stringify(formData));
	}

	handleChange(name, field) {

	}

    render() {
    	console.log("BookForm::render()");
    	const {
      		fields: {
	      		title, 
	      		language,
	      		authors,
	      		pageCount,
	      		price
      		}, 
    	} = this.props;

    	const renderInput = (field, name, label) =>
		<div className="">
			<label htmlFor={name} className="col-sm-2">{label}</label>
			<div className={'col-sm-8'}>
				<input type="text" className="form-control" id={name} onChange={this.handleChange.bind(name, field)}/>
			</div>
		</div>;

		const {fields} = this.props;

    	return (
			<div className="component">
				<h1>New Book</h1>
				<form className="form-horizontal" onSubmit={::this.validateForm}>
					{renderInput(fields.title, 'title', 'Title')}
					
					<div className="form-group">
				    	<label className="col-sm-2">Language</label>
				    	
						<div className="col-sm-9 btn-group">
							<label className="btn btn-primary">
						    	<input type="radio" name="language" id="option1"  value="fi" autoComplete="off" />
						  		Finnish
						  	</label>
						  	<label className="btn btn-primary">
						    	<input type="radio" name="language" id="option2" value="se" autoComplete="off" />
						  		Swedish
						  	</label>
						  	<label className="btn btn-primary">
						    	<input type="radio" name="language" id="option3"  value="en" autoComplete="off" />
						  		English
						  	</label>
						</div>	    
				    </div>

				    <div className="form-group">
				    	<label className="col-sm-2">Authors</label>
				    	<div className={'col-sm-8'}>
						<Select
							valueKey="value"
							labelKey="label"<commit_msg>now title is passed to validateForm()<commit_after>import React, {Component, PropTypes} from 'react';
import {connectReduxForm} from 'redux-form';
import {Button, ButtonGroup} from 'react-bootstrap';
import Select from "react-select";
import numeral from 'numeral';
import Immutable from 'immutable';
import * as Utils from '../utils';
import Api from "../../api";


function bookValidation(data) {
    const errors = {};

    if (!data.title) {
    	errors.title = "Title is required";	
    }

    if (!data.language) {
    	console.log("fiuertuiertyiuertiuyter");
    	errors.language = "Language is required";	
    }

    if (!data.pageCount) {
    	errors.pageCount = "Page count is required";
    } else if (!Utils.isPositiveInteger(data.pageCount) || data.pageCount == 0) {
		errors.pageCount = "Value must be an integer greater than 0";
	}

	if (!data.price) {
		errors.price = "Price is required";
	} else if (isNaN(parseFloat(data.price))) {
		errors.price = "Not a valid price";
	}

    return errors;
}

export default class BookForm extends Component {
	static defaultProps = {
		fields: {
			title: null,
			language: null,
			authors: null,
			pageCount: 0,
			price: 0
		}
	}

	constructor(props) {
		super(props);

		this.state = {
			title: null,
			language: null,
			authors: null,
			pageCount: 0,
			price: 0
		}

		console.log("ctor called: " + JSON.stringify(props));
	}

	searchAuthors(input, callback) {
		const {d} = this.props;
		Api.searchAuthors(input).then(authors => {

			let mapped = Immutable.List();

			authors.map(author => {
				mapped = mapped.push({
					value: author.id,
					label: author.name,
				})
			});

    		//let selections = {options: authors.toArray()};
    		let selections = {options: mapped.toArray()};
			callback(null, selections);
			//this.props.courseActions.setCourses(courses, d);
		});

	}

	getOptions(input, callback) {	
		var self = this;

	    setTimeout(() => {
	    	self.searchAuthors(input, callback);
	    }, 500);
	}

	changeValue(newValue) {
		let selectedAuthorIds = newValue.split(",");
	}

	renderOption(author) {
		return (
			<div>
				<p key={author.value}>
					{author.label}
				</p>
			</div>
		);
	}

	foo(a, b, c) {
		console.log("a: " + JSON.stringify(a));
		console.log("b: " + JSON.stringify(b));
		console.log("c: " + JSON.stringify(c));
	}

	validateForm(e) {
		e.preventDefault();

		let formData = {
			title: this.state.title
		};

		alert("validateForm(): " + JSON.stringify(formData));
	}

	handleChange(e, name, field) {
		console.log(e.target.name + ": " + e.target.value);

		let nextState = {}
		nextState[e.target.name] = e.target.value;

		this.setState({
			[e.target.name]:  e.target.value
		})
	}

    render() {
    	console.log("BookForm::render()");
    	const {
      		fields: {
	      		title, 
	      		language,
	      		authors,
	      		pageCount,
	      		price
      		}, 
    	} = this.props;

    	const renderInput = (value, name, label) =>
		<div className="">
			<label htmlFor={name} className="col-sm-2">{label}</label>
			<div className={'col-sm-8'}>
				<input type="text" className="form-control" name={name} id={name} value={value} onChange={::this.handleChange}/>
			</div>
		</div>;

		const {fields} = this.props;

    	return (
			<div className="component">
				STATE: {this.state.title}
				<h1>New Book</h1>
				<form className="form-horizontal" onSubmit={::this.validateForm}>
					{renderInput(this.state.title, 'title', 'Title')}
					
					<div className="form-group">
				    	<label className="col-sm-2">Language</label>
				    	
						<div className="col-sm-9 btn-group">
							<label className="btn btn-primary">
						    	<input type="radio" name="language" id="option1"  value="fi" autoComplete="off" />
						  		Finnish
						  	</label>
						  	<label className="btn btn-primary">
						    	<input type="radio" name="language" id="option2" value="se" autoComplete="off" />
						  		Swedish
						  	</label>
						  	<label className="btn btn-primary">
						    	<input type="radio" name="language" id="option3"  value="en" autoComplete="off" />
						  		English
						  	</label>
						</div>	    
				    </div>

				    <div className="form-group">
				    	<label className="col-sm-2">Authors</label>
				    	<div className={'col-sm-8'}>
						<Select
							valueKey="value"
							labelKey="label"
{'fraction_non_alphanumeric': 0.16311096060503444, 'fraction_numerical': 0.004628061857997517, 'mean_word_length': 2.70866471326915, 'pattern_counts': {'":': 1, '<': 73, '<?xml version=': 0, '>': 79, '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': '2340142', 'n_tokens_mistral': 3565, 'n_tokens_neox': 2954, 'n_words': 611}