diff --git a/src/containers/EditListingDescriptionForm/EditListingDescriptionForm.js b/src/containers/EditListingDescriptionForm/EditListingDescriptionForm.js
index 4d7c1632..1fd63e71 100644
--- a/src/containers/EditListingDescriptionForm/EditListingDescriptionForm.js
+++ b/src/containers/EditListingDescriptionForm/EditListingDescriptionForm.js
@@ -24,6 +24,7 @@ const EditListingDescriptionFormComponent = props => (
handleSubmit,
intl,
invalid,
+ pristine,
saveActionMsg,
updated,
updateError,
@@ -62,7 +63,7 @@ const EditListingDescriptionFormComponent = props => (
) : null;
const classes = classNames(css.root, className);
- const submitReady = updated;
+ const submitReady = updated && pristine;
const submitInProgress = updateInProgress;
const submitDisabled = invalid || disabled || submitInProgress;
diff --git a/src/containers/EditListingFeaturesForm/EditListingFeaturesForm.js b/src/containers/EditListingFeaturesForm/EditListingFeaturesForm.js
index f845fd5f..64607dd4 100644
--- a/src/containers/EditListingFeaturesForm/EditListingFeaturesForm.js
+++ b/src/containers/EditListingFeaturesForm/EditListingFeaturesForm.js
@@ -17,12 +17,12 @@ const EditListingFeaturesFormComponent = props => (
mutators={{ ...arrayMutators }}
render={fieldRenderProps => {
const {
- form,
disabled,
rootClassName,
className,
name,
handleSubmit,
+ pristine,
saveActionMsg,
updated,
updateError,
@@ -30,7 +30,7 @@ const EditListingFeaturesFormComponent = props => (
} = fieldRenderProps;
const classes = classNames(rootClassName || css.root, className);
- const submitReady = updated;
+ const submitReady = updated && pristine;
const submitInProgress = updateInProgress;
const submitDisabled = disabled || submitInProgress;
@@ -46,7 +46,7 @@ const EditListingFeaturesFormComponent = props => (
diff --git a/src/containers/EditListingLocationForm/EditListingLocationForm.js b/src/containers/EditListingLocationForm/EditListingLocationForm.js
index 99080ac8..07860579 100644
--- a/src/containers/EditListingLocationForm/EditListingLocationForm.js
+++ b/src/containers/EditListingLocationForm/EditListingLocationForm.js
@@ -21,10 +21,10 @@ export const EditListingLocationFormComponent = props => (
const {
className,
disabled,
- form,
handleSubmit,
intl,
invalid,
+ pristine,
saveActionMsg,
updated,
updateError,
@@ -55,7 +55,7 @@ export const EditListingLocationFormComponent = props => (
) : null;
const classes = classNames(css.root, className);
- const submitReady = updated;
+ const submitReady = updated && pristine;
const submitInProgress = updateInProgress;
const submitDisabled = invalid || disabled || submitInProgress;
@@ -84,7 +84,7 @@ export const EditListingLocationFormComponent = props => (
className={css.building}
type="text"
name="building"
- id={`${form}.building`}
+ id="building"
label={buildingMessage}
placeholder={buildingPlaceholderMessage}
/>
diff --git a/src/containers/EditListingPhotosForm/EditListingPhotosForm.js b/src/containers/EditListingPhotosForm/EditListingPhotosForm.js
index 4f2a1817..76b7ed5a 100644
--- a/src/containers/EditListingPhotosForm/EditListingPhotosForm.js
+++ b/src/containers/EditListingPhotosForm/EditListingPhotosForm.js
@@ -1,9 +1,10 @@
import React, { Component } from 'react';
-import { bool, func, object, shape, string } from 'prop-types';
+import { array, bool, func, object, shape, string } from 'prop-types';
import { compose } from 'redux';
import { Form as FinalForm, Field } from 'react-final-form';
import { FormattedMessage, intlShape, injectIntl } from 'react-intl';
import { arrayMove } from 'react-sortable-hoc';
+import { isEqual } from 'lodash';
import classNames from 'classnames';
import { propTypes } from '../../util/types';
import { nonEmptyArray, composeValidators } from '../../util/validators';
@@ -20,6 +21,7 @@ export class EditListingPhotosFormComponent extends Component {
this.state = { imageUploadRequested: false };
this.onImageUploadHandler = this.onImageUploadHandler.bind(this);
this.onSortEnd = this.onSortEnd.bind(this);
+ this.submittedImages = [];
}
onImageUploadHandler(file) {
@@ -50,8 +52,7 @@ export class EditListingPhotosFormComponent extends Component {
initialValues={{ images: this.props.images }}
render={fieldRenderProps => {
const {
- blur,
- change,
+ form,
className,
disabled,
errors,
@@ -117,7 +118,16 @@ export class EditListingPhotosFormComponent extends Component {
) : null;
- const submitReady = updated || ready;
+ const submittedOnce = this.submittedImages.length > 0;
+ // imgs can contain added images (with temp ids) and submitted images with uniq ids.
+ const arrayOfImgIds = imgs =>
+ imgs.map(i => (typeof i.id === 'string' ? i.imageId : i.id));
+ const imageIdsFromProps = arrayOfImgIds(images);
+ const imageIdsFromPreviousSubmit = arrayOfImgIds(this.submittedImages);
+ const imageArrayHasSameImages = isEqual(imageIdsFromProps, imageIdsFromPreviousSubmit);
+ const pristineSinceLastSubmit = submittedOnce && imageArrayHasSameImages;
+
+ const submitReady = (updated && pristineSinceLastSubmit) || ready;
const submitInProgress = updateInProgress;
const submitDisabled =
invalid || disabled || submitInProgress || imageUploadRequested || ready;
@@ -125,7 +135,13 @@ export class EditListingPhotosFormComponent extends Component {
const classes = classNames(css.root, className);
return (
-