From 330bce527d31134455e9fc83bacc019dbbd738b3 Mon Sep 17 00:00:00 2001 From: Eric Han Date: Sun, 30 Apr 2023 07:10:07 +0800 Subject: [PATCH 1/2] avoid parsing html in editing composer when reloading page --- src/pages/home/report/ReportActionItemMessageEdit.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/src/pages/home/report/ReportActionItemMessageEdit.js b/src/pages/home/report/ReportActionItemMessageEdit.js index e65fc73432df..f8b38924552c 100644 --- a/src/pages/home/report/ReportActionItemMessageEdit.js +++ b/src/pages/home/report/ReportActionItemMessageEdit.js @@ -5,6 +5,7 @@ import {InteractionManager, Keyboard, View} from 'react-native'; import PropTypes from 'prop-types'; import _ from 'underscore'; import ExpensiMark from 'expensify-common/lib/ExpensiMark'; +import Str from 'expensify-common/lib/str'; import reportActionPropTypes from './reportActionPropTypes'; import styles from '../../../styles/styles'; import Composer from '../../../components/Composer'; @@ -81,8 +82,13 @@ class ReportActionItemMessageEdit extends React.Component { this.emojiButtonID = 'emojiButton'; this.messageEditInput = 'messageEditInput'; - const parser = new ExpensiMark(); - const draftMessage = parser.htmlToMarkdown(this.props.draftMessage).trim(); + let draftMessage; + if (this.props.draftMessage === this.props.action.message[0].html) { + const parser = new ExpensiMark(); + draftMessage = parser.htmlToMarkdown(this.props.draftMessage).trim(); + } else { + draftMessage = Str.htmlDecode(this.props.draftMessage); + } this.state = { draft: draftMessage, @@ -147,7 +153,7 @@ class ReportActionItemMessageEdit extends React.Component { // This component is rendered only when draft is set to a non-empty string. In order to prevent component // unmount when user deletes content of textarea, we set previous message instead of empty string. if (newDraft.trim().length > 0) { - this.debouncedSaveDraft(newDraft); + this.debouncedSaveDraft(_.escape(newDraft)); } else { this.debouncedSaveDraft(this.props.action.message[0].html); } From 360627b9f24cc229471bda5b8d9dc942ed316a61 Mon Sep 17 00:00:00 2001 From: Eric Han Date: Sun, 30 Apr 2023 10:59:59 +0800 Subject: [PATCH 2/2] add comments for the change --- src/pages/home/report/ReportActionItemMessageEdit.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/pages/home/report/ReportActionItemMessageEdit.js b/src/pages/home/report/ReportActionItemMessageEdit.js index f8b38924552c..8ca6e1c69da6 100644 --- a/src/pages/home/report/ReportActionItemMessageEdit.js +++ b/src/pages/home/report/ReportActionItemMessageEdit.js @@ -84,9 +84,11 @@ class ReportActionItemMessageEdit extends React.Component { let draftMessage; if (this.props.draftMessage === this.props.action.message[0].html) { + // We only convert the report action message to markdown if the draft message is unchanged. const parser = new ExpensiMark(); draftMessage = parser.htmlToMarkdown(this.props.draftMessage).trim(); } else { + // We need to decode saved draft message because it's escaped before saving. draftMessage = Str.htmlDecode(this.props.draftMessage); } @@ -153,6 +155,7 @@ class ReportActionItemMessageEdit extends React.Component { // This component is rendered only when draft is set to a non-empty string. In order to prevent component // unmount when user deletes content of textarea, we set previous message instead of empty string. if (newDraft.trim().length > 0) { + // We want to escape the draft message to differentiate the HTML from the report action and the HTML the user drafted. this.debouncedSaveDraft(_.escape(newDraft)); } else { this.debouncedSaveDraft(this.props.action.message[0].html);