Merge pull request #10780 from Expensify/paulogasparsv-delete-message…

…-strike Show deleted messages with a strike-through when offline
Expensify · Sep 2, 2022 · 77e5843 · 77e5843
2 parents fffb7c3 + 47a776b
commit 77e5843
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 5 deletions.
diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js
@@ -1066,13 +1066,12 @@ Onyx.connect({
  */
 function deleteReportComment(reportID, reportAction) {
     const sequenceNumber = reportAction.sequenceNumber;
+
+    // We are not updating the message content here so the message can re-appear as strike-throughed
+    // if the user goes offline. The API will update the message content to empty strings on success.
     const optimisticReportActions = {
         [sequenceNumber]: {
             pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
-            message: [{
-                html: '',
-                text: '',
-            }],
         },
     };
 

diff --git a/src/pages/home/report/ReportActionItemFragment.js b/src/pages/home/report/ReportActionItemFragment.js
@@ -51,6 +51,12 @@ const propTypes = {
     /** Should this fragment be contained in a single line? */
     isSingleLine: PropTypes.bool,
 
+    // Additional styles to add after local styles
+    style: PropTypes.oneOfType([
+        PropTypes.arrayOf(PropTypes.object),
+        PropTypes.object,
+    ]),
+
     ...windowDimensionsPropTypes,
 
     /** localization props */
@@ -69,6 +75,7 @@ const defaultProps = {
     isSingleLine: false,
     tooltipText: '',
     source: '',
+    style: [],
 };
 
 const ReportActionItemFragment = (props) => {
@@ -119,7 +126,7 @@ const ReportActionItemFragment = (props) => {
                 <Text
                     family="EMOJI_TEXT_FONT"
                     selectable={!canUseTouchScreen() || !props.isSmallScreenWidth}
-                    style={[EmojiUtils.containsOnlyEmojis(text) ? styles.onlyEmojisText : undefined, styles.ltr]}
+                    style={[EmojiUtils.containsOnlyEmojis(text) ? styles.onlyEmojisText : undefined, styles.ltr, ...props.style]}
                 >
                     {StyleUtils.convertToLTR(Str.htmlDecode(text))}
                     {props.fragment.isEdited && (

diff --git a/src/pages/home/report/ReportActionItemMessage.js b/src/pages/home/report/ReportActionItemMessage.js
@@ -45,6 +45,7 @@ const ReportActionItemMessage = (props) => {
                     attachmentInfo={props.action.attachmentInfo}
                     source={lodashGet(props.action, 'originalMessage.source')}
                     loading={props.action.isLoading}
+                    style={props.style}
                 />
             ))}
         </View>