diff --git a/src/libs/actions/Policy.js b/src/libs/actions/Policy.js index 2f9c36eeedb3..c0205f091fe9 100644 --- a/src/libs/actions/Policy.js +++ b/src/libs/actions/Policy.js @@ -286,16 +286,23 @@ function uploadAvatar(file) { return API.User_UploadAvatar({file}) .then((response) => { if (response.jsonCode !== 200) { - // Show the user feedback - const errorMessage = translateLocal('workspace.editor.avatarUploadFailureMessage'); - Growl.error(errorMessage, 5000); - return; + // Let the component handle the issue. + throw new Error(); } return response.s3url; }); } +/** + * Sets local values for the policy + * @param {String} policyID + * @param {Object} values + */ +function updateLocalPolicyValues(policyID, values) { + Onyx.merge(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, values); +} + /** * Sets the name of the policy * @@ -307,34 +314,22 @@ function update(policyID, values, shouldGrowl = false) { API.UpdatePolicy({policyID, value: JSON.stringify(values), lastModified: null}) .then((policyResponse) => { if (policyResponse.jsonCode !== 200) { - // Show the user feedback - const errorMessage = translateLocal('workspace.editor.genericFailureMessage'); - Growl.error(errorMessage, 5000); - Onyx.merge(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {isPolicyUpdating: false}); - return; + throw new Error(); } - const updatedValues = {...values, ...{isPolicyUpdating: false}}; - Onyx.merge(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, updatedValues); + updateLocalPolicyValues(policyID, {...values, isPolicyUpdating: false}); if (shouldGrowl) { Growl.show(translateLocal('workspace.common.growlMessageOnSave'), CONST.GROWL.SUCCESS, 3000); } }).catch(() => { - Onyx.merge(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {isPolicyUpdating: false}); + updateLocalPolicyValues(policyID, {isPolicyUpdating: false}); + + // Show the user feedback const errorMessage = translateLocal('workspace.editor.genericFailureMessage'); Growl.error(errorMessage, 5000); }); } -/** - * Sets local values for the policy - * @param {String} policyID - * @param {Object} values - */ -function updateLocalPolicyValues(policyID, values) { - Onyx.merge(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, values); -} - /** * @param {String} policyID * @param {Object} errors diff --git a/src/pages/workspace/WorkspaceSettingsPage.js b/src/pages/workspace/WorkspaceSettingsPage.js index 017a153990dc..a67e9e478783 100644 --- a/src/pages/workspace/WorkspaceSettingsPage.js +++ b/src/pages/workspace/WorkspaceSettingsPage.js @@ -67,6 +67,7 @@ class WorkspaceSettingsPage extends React.Component { this.uploadAvatar = this.uploadAvatar.bind(this); this.removeAvatar = this.removeAvatar.bind(this); this.getCurrencyItems = this.getCurrencyItems.bind(this); + this.validate = this.validate.bind(this); this.uploadAvatarPromise = Promise.resolve(); } @@ -74,6 +75,10 @@ class WorkspaceSettingsPage extends React.Component { getCurrencyList(); } + componentWillUnmount() { + Policy.updateLocalPolicyValues(this.props.policy.id, {isAvatarUploading: false}); + } + /** * @returns {Object[]} */ @@ -101,11 +106,15 @@ class WorkspaceSettingsPage extends React.Component { this.uploadAvatarPromise = Policy.uploadAvatar(image).then(url => new Promise((resolve) => { this.setState({avatarURL: url}, resolve); })).catch(() => { + this.setState({previewAvatarURL: ''}); Growl.error(this.props.translate('workspace.editor.avatarUploadFailureMessage')); }).finally(() => Policy.updateLocalPolicyValues(this.props.policy.id, {isAvatarUploading: false})); } submit() { + if (this.props.policy.isAvatarUploading || !this.validate()) { + return; + } const name = this.state.name.trim(); const avatarURL = this.state.avatarURL; const outputCurrency = this.state.currency; @@ -118,6 +127,14 @@ class WorkspaceSettingsPage extends React.Component { Growl.success(this.props.translate('workspace.common.growlMessageOnSave')); } + validate() { + const errors = {}; + if (!this.state.name.trim().length) { + errors.nameError = true; + } + return _.size(errors) === 0; + } + render() { const {policy} = this.props;