diff --git a/src/pages/home/report/ReportActionItemFragment.tsx b/src/pages/home/report/ReportActionItemFragment.tsx
index e762f07cf20f..4250c874a471 100644
--- a/src/pages/home/report/ReportActionItemFragment.tsx
+++ b/src/pages/home/report/ReportActionItemFragment.tsx
@@ -105,6 +105,7 @@ function ReportActionItemFragment({
source={source}
html={fragment.html ?? ''}
addExtraMargin={!displayAsGroup}
+ styleAsDeleted={!!(isOffline && isPendingDelete)}
/>
);
}
diff --git a/src/pages/home/report/comment/AttachmentCommentFragment.tsx b/src/pages/home/report/comment/AttachmentCommentFragment.tsx
index 3c49cb90a106..fec5ebe92e54 100644
--- a/src/pages/home/report/comment/AttachmentCommentFragment.tsx
+++ b/src/pages/home/report/comment/AttachmentCommentFragment.tsx
@@ -1,6 +1,7 @@
import React from 'react';
import {View} from 'react-native';
import useThemeStyles from '@hooks/useThemeStyles';
+import CONST from '@src/CONST';
import type {OriginalMessageSource} from '@src/types/onyx/OriginalMessage';
import RenderCommentHTML from './RenderCommentHTML';
@@ -8,15 +9,19 @@ type AttachmentCommentFragmentProps = {
source: OriginalMessageSource;
html: string;
addExtraMargin: boolean;
+ styleAsDeleted: boolean;
};
-function AttachmentCommentFragment({addExtraMargin, html, source}: AttachmentCommentFragmentProps) {
+function AttachmentCommentFragment({addExtraMargin, html, source, styleAsDeleted}: AttachmentCommentFragmentProps) {
const styles = useThemeStyles();
+ const isUploading = html === CONST.ATTACHMENT_UPLOADING_MESSAGE_HTML;
+ const htmlContent = styleAsDeleted && isUploading ? `${html}` : html;
+
return (
);