Skip to content

Instantly share code, notes, and snippets.

@chranderson
Created October 29, 2015 15:11
Show Gist options
  • Save chranderson/77f8f2f968160ab377be to your computer and use it in GitHub Desktop.
Save chranderson/77f8f2f968160ab377be to your computer and use it in GitHub Desktop.
import React, { Component, PropTypes } from 'react';
import {reduxForm} from 'redux-form';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import * as dataMapActions from 'redux/modules/dataMap';
import {updateFieldMap} from 'redux/modules/dataMap';
@connect(
state => ({
fieldMap: state.dataMap.fieldMap,
}),
dispatch => bindActionCreators(dataMapActions, updateFieldMap, dispatch)
)
@reduxForm({
form: 'fieldMap',
fields: ['dataType'],
})
export default class CardForm extends Component {
static propTypes = {
dataTypes: PropTypes.array.isRequired,
fields: PropTypes.object.isRequired,
header: PropTypes.string,
samples: PropTypes.any,
dataField: PropTypes.object,
formKey: PropTypes.string.isRequired,
handleUpdate: PropTypes.func,
fieldMap: PropTypes.array,
updateFieldMap: PropTypes.func,
}
handleUpdate(event, formKey) {
event.preventDefault();
// console.log(event, formKey);
//call action creator with event & formkey
this.props.updateFieldMap(event, formKey);
}
render() {
const styles = require('./CardForm.scss');
const { dataTypes, formKey, dataField, fields: { dataType } } = this.props; // eslint-disable
return (
<div className={styles.card}>
<div className={styles.cardContent}>
<div className={styles.cardHead}>
<select
name="dataType"
value={dataField.dataType}
className={styles.cardTitle}
onChange={this.handleUpdate(event, {formKey})}
{...dataType}>
{dataTypes.map((option) => <option key={option} value={option}>{option}</option> )}
</select>
</div>
<div className={styles.cardBody}>
<ul className={styles.collection}>
<li className={styles.collectionTitle}>{dataField.header}</li>
<div className={styles.collectionItems}>
{dataField.samples.map((sample, index) =>
<li key={ index } className={styles.collectionItem}>{sample}</li>
)}
</div>
</ul>
</div>
</div>
</div>
);
}
}
@erikras
Copy link

erikras commented Oct 29, 2015

Line 50 is going to overwrite the name, value, and onChange props above it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment