{"size": 1433, "ext": "js", "max_stars_repo_path": "src/components/contracts/contract-search-box/ContractSearchBoxForm.js", "max_stars_repo_name": "dmerrill6/EthTools", "max_stars_repo_stars_event_min_datetime": "2018-05-04T17:32:57.000Z", "max_stars_repo_stars_event_max_datetime": "2020-12-28T19:22:45.000Z", "max_issues_repo_path": "src/components/contracts/contract-search-box/ContractSearchBoxForm.js", "max_issues_repo_name": "dmerrill6/EthTools", "max_issues_repo_issues_event_min_datetime": "2019-04-10T14:22:50.000Z", "max_issues_repo_issues_event_max_datetime": "2019-06-26T20:16:23.000Z", "max_forks_repo_path": "src/components/contracts/contract-search-box/ContractSearchBoxForm.js", "max_forks_repo_name": "dmerrill6/EthTools", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 7, "max_issues_count": 1, "max_forks_count": null, "avg_line_length": 23.1129032258, "max_line_length": 111, "alphanum_fraction": 0.6671318911}
import React from 'react';
import TextField from 'material-ui/TextField';
import styled from 'styled-components';
import RaisedButton from 'material-ui/RaisedButton';
import { Field, reduxForm } from 'redux-form';

const ContractSearchBoxContainer = styled.div`
  display: inline-block;
  width: 90%;
`


const renderTextField = ({
  input,
  label,
  placeholder,
  fullWidth,
  meta: { touched, error },
  ...custom
}) =>
  <TextField
    hintText={placeholder}
    fullWidth={fullWidth}
    floatingLabelText={label}
    {...input}
    {...custom}
  />

const validate = values => {
  const errors = {}
  const requiredFields = [
    'address',
  ];
  requiredFields.forEach(field => {
    if (!values[field]) {
      errors[field] = 'Required'
    }
  });
  return errors;
}

const ContractSearchBoxForm = (props) => (
  <form onSubmit={props.handleSubmit}>
    <ContractSearchBoxContainer>
      <Field
        name='address'
        component={renderTextField}
        label='E.g. 0xde0b295669a9fd93d5f28d9ec85e40f4cb697bae'
        placeholder='Type or paste the contract address'
        fullWidth
        onFocus={props.onFocus}
        onBlur={props.onBlur}
      />
    </ContractSearchBoxContainer>
    <RaisedButton disabled={props.submitting || props.invalid} type='submit' label="Search" secondary={true} />
  </form>
)

export default reduxForm({
  form: 'ContractSearchBoxForm',
  validate
})(ContractSearchBoxForm);