diff --git a/src/pages/home/report/ReportActionCompose.js b/src/pages/home/report/ReportActionCompose.js index aded32a50a98..7a14fd124208 100644 --- a/src/pages/home/report/ReportActionCompose.js +++ b/src/pages/home/report/ReportActionCompose.js @@ -376,8 +376,9 @@ class ReportActionCompose extends React.Component { * Update the value of the comment in Onyx * * @param {String} newComment + * @param {Boolean} shouldDebounceSaveComment */ - updateComment(newComment) { + updateComment(newComment, shouldDebounceSaveComment) { this.setState({ isCommentEmpty: !!newComment.match(/^(\s|`)*$/), value: newComment, @@ -394,7 +395,11 @@ class ReportActionCompose extends React.Component { } this.comment = newComment; - this.debouncedSaveReportComment(newComment); + if (shouldDebounceSaveComment) { + this.debouncedSaveReportComment(newComment); + } else { + Report.saveReportComment(this.props.reportID, newComment || ''); + } if (newComment) { this.debouncedBroadcastUserIsTyping(); } @@ -472,6 +477,11 @@ class ReportActionCompose extends React.Component { e.preventDefault(); } + // Since we're submitting the form here which should clear the composer + // We don't really care about saving the draft the user was typing + // We need to make sure an empty draft gets saved instead + this.debouncedSaveReportComment.cancel(); + const comment = this.prepareCommentAndResetComposer(); if (!comment) { return; @@ -604,7 +614,7 @@ class ReportActionCompose extends React.Component { textAlignVertical="top" placeholder={inputPlaceholder} placeholderTextColor={themeColors.placeholderText} - onChangeText={this.updateComment} + onChangeText={comment => this.updateComment(comment, true)} onKeyPress={this.triggerHotkeyActions} onDragEnter={(e, isOriginComposer) => { if (!isOriginComposer) {