diff --git a/src/containers/EditListingForm/EditListingForm.js b/src/containers/EditListingForm/EditListingForm.js
index ea431edf..80047e43 100644
--- a/src/containers/EditListingForm/EditListingForm.js
+++ b/src/containers/EditListingForm/EditListingForm.js
@@ -1,6 +1,7 @@
import React, { Component, PropTypes } from 'react';
import { Field, reduxForm, propTypes as formPropTypes } from 'redux-form';
import { intlShape, injectIntl } from 'react-intl';
+import { isEqual } from 'lodash';
import { maxLength, required } from '../../util/validators';
import { Promised } from '../../components';
import css from './EditListingForm.css';
@@ -17,9 +18,9 @@ const readImage = file => new Promise((resolve, reject) => {
reader.readAsDataURL(file);
});
-
// Custom inputs with validator messages
-const RenderField = ({ input, label, type, meta: { touched, error } }) => {
+const RenderField = ({ input, label, type, meta }) => {
+ const { touched, error } = meta;
const component = type === 'textarea'
?
: ;
@@ -28,16 +29,19 @@ const RenderField = ({ input, label, type, meta: { touched, error } }) => {
{component}
- {touched && (error && {error})}
+ {touched && error ? {error} : null}
);
};
-const { any, bool, shape, string } = PropTypes;
+const { bool, func, object, shape, string } = PropTypes;
RenderField.propTypes = {
- input: any.isRequired,
+ input: shape({
+ onChange: func.isRequired,
+ name: string.isRequired,
+ }).isRequired,
label: string.isRequired,
type: string.isRequired,
meta: shape({
@@ -48,17 +52,16 @@ RenderField.propTypes = {
// Add image wrapper. Label is the only visible element, file input is hidden.
const RenderAddImage = props => {
- const { accept, input: {name, onChange}, label, type, meta: { touched, warning } } = props;
+ const { accept, input, label, type, meta } = props;
+ const { name, onChange } = input;
+ const { touched, warning } = meta;
const inputProps = { accept, id: name, name, onChange, type };
return (
);
@@ -66,7 +69,11 @@ const RenderAddImage = props => {
RenderAddImage.propTypes = {
accept: string.isRequired,
- input: any.isRequired,
+ input: shape({
+ value: object,
+ onChange: func.isRequired,
+ name: string.isRequired,
+ }).isRequired,
label: string.isRequired,
type: string.isRequired,
meta: shape({
@@ -82,6 +89,12 @@ class EditListingForm extends Component {
this.onImageUploadHandler = this.onImageUploadHandler.bind(this);
}
+ componentWillReceiveProps(nextProps) {
+ if (!isEqual(this.props.images, nextProps.images)) {
+ nextProps.change('images', nextProps.images);
+ }
+ }
+
componentDidMount() {
this.handleInitialize();
}
@@ -156,6 +169,15 @@ class EditListingForm extends Component {
/>
+ {
+ const { input, type } = props;
+ return ;
+ }}
+ name="images"
+ type="hidden"
+ />
+
+