From 14bac09273d4e73d1a6c2954b0b45758a6237182 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Fri, 23 Feb 2024 16:24:38 +0800
Subject: [PATCH 1/6] fix workspace system message when contains markdown isn't
 grayed out

---
 src/pages/home/report/ReportActionItem.js          | 13 -------------
 src/pages/home/report/ReportActionItemFragment.tsx | 14 +++++++++++++-
 src/pages/home/report/ReportActionItemMessage.tsx  |  2 ++
 .../home/report/comment/TextCommentFragment.tsx    | 11 +++++++++--
 4 files changed, 24 insertions(+), 16 deletions(-)

diff --git a/src/pages/home/report/ReportActionItem.js b/src/pages/home/report/ReportActionItem.js
index 66394190fde6..b6d83a558613 100644
--- a/src/pages/home/report/ReportActionItem.js
+++ b/src/pages/home/report/ReportActionItem.js
@@ -483,19 +483,6 @@ function ReportActionItem(props) {
                                 action={props.action}
                                 displayAsGroup={props.displayAsGroup}
                                 isHidden={isHidden}
-                                style={[
-                                    _.contains(
-                                        [
-                                            ..._.values(CONST.REPORT.ACTIONS.TYPE.POLICYCHANGELOG),
-                                            CONST.REPORT.ACTIONS.TYPE.IOU,
-                                            CONST.REPORT.ACTIONS.TYPE.APPROVED,
-                                            CONST.REPORT.ACTIONS.TYPE.MOVED,
-                                        ],
-                                        props.action.actionName,
-                                    )
-                                        ? styles.colorMuted
-                                        : undefined,
-                                ]}
                             />
                             {hasBeenFlagged && (
                                 <Button
diff --git a/src/pages/home/report/ReportActionItemFragment.tsx b/src/pages/home/report/ReportActionItemFragment.tsx
index e762f07cf20f..f42504b6a04c 100644
--- a/src/pages/home/report/ReportActionItemFragment.tsx
+++ b/src/pages/home/report/ReportActionItemFragment.tsx
@@ -11,7 +11,7 @@ import convertToLTR from '@libs/convertToLTR';
 import * as ReportUtils from '@libs/ReportUtils';
 import CONST from '@src/CONST';
 import type * as OnyxCommon from '@src/types/onyx/OnyxCommon';
-import type {DecisionName, OriginalMessageSource} from '@src/types/onyx/OriginalMessage';
+import type {ActionName, DecisionName, OriginalMessageSource} from '@src/types/onyx/OriginalMessage';
 import type {Message} from '@src/types/onyx/ReportAction';
 import AttachmentCommentFragment from './comment/AttachmentCommentFragment';
 import TextCommentFragment from './comment/TextCommentFragment';
@@ -59,11 +59,15 @@ type ReportActionItemFragmentProps = {
     /** The pending action for the report action */
     pendingAction?: OnyxCommon.PendingAction;
 
+    /** The report action name */
+    actionName: ActionName;
+
     moderationDecision?: DecisionName;
 };
 
 function ReportActionItemFragment({
     pendingAction,
+    actionName,
     fragment,
     accountID,
     iouMessage = '',
@@ -114,6 +118,14 @@ function ReportActionItemFragment({
                     source={source}
                     fragment={fragment}
                     styleAsDeleted={!!(isOffline && isPendingDelete)}
+                    styleAsMuted={(
+                        [
+                            ...Object.values(CONST.REPORT.ACTIONS.TYPE.POLICYCHANGELOG),
+                            CONST.REPORT.ACTIONS.TYPE.IOU,
+                            CONST.REPORT.ACTIONS.TYPE.APPROVED,
+                            CONST.REPORT.ACTIONS.TYPE.MOVED,
+                        ] as ActionName[]
+                    ).includes(actionName)}
                     iouMessage={iouMessage}
                     displayAsGroup={displayAsGroup}
                     style={style}
diff --git a/src/pages/home/report/ReportActionItemMessage.tsx b/src/pages/home/report/ReportActionItemMessage.tsx
index 0ec23e9aaf79..425c5de372a3 100644
--- a/src/pages/home/report/ReportActionItemMessage.tsx
+++ b/src/pages/home/report/ReportActionItemMessage.tsx
@@ -48,6 +48,7 @@ function ReportActionItemMessage({action, displayAsGroup, reportID, style, isHid
                     style={style}
                     source=""
                     styleAsDeleted={false}
+                    styleAsMuted={false}
                 />
             </View>
         );
@@ -80,6 +81,7 @@ function ReportActionItemMessage({action, displayAsGroup, reportID, style, isHid
                 iouMessage={iouMessage}
                 isThreadParentMessage={ReportActionsUtils.isThreadParentMessage(action, reportID)}
                 pendingAction={action.pendingAction}
+                actionName={action.actionName}
                 source={(action.originalMessage as OriginalMessageAddComment['originalMessage'])?.source}
                 accountID={action.actorAccountID ?? 0}
                 style={style}
diff --git a/src/pages/home/report/comment/TextCommentFragment.tsx b/src/pages/home/report/comment/TextCommentFragment.tsx
index 998ed9f6616f..db597fc26d44 100644
--- a/src/pages/home/report/comment/TextCommentFragment.tsx
+++ b/src/pages/home/report/comment/TextCommentFragment.tsx
@@ -27,6 +27,9 @@ type TextCommentFragmentProps = {
     /** Should this message fragment be styled as deleted? */
     styleAsDeleted: boolean;
 
+    /** Should this message fragment be styled as muted */
+    styleAsMuted: boolean;
+
     /** Should the comment have the appearance of being grouped with the previous comment? */
     displayAsGroup: boolean;
 
@@ -37,7 +40,7 @@ type TextCommentFragmentProps = {
     iouMessage?: string;
 };
 
-function TextCommentFragment({fragment, styleAsDeleted, source, style, displayAsGroup, iouMessage = ''}: TextCommentFragmentProps) {
+function TextCommentFragment({fragment, styleAsDeleted, styleAsMuted, source, style, displayAsGroup, iouMessage = ''}: TextCommentFragmentProps) {
     const theme = useTheme();
     const styles = useThemeStyles();
     const {html = '', text} = fragment;
@@ -54,7 +57,10 @@ function TextCommentFragment({fragment, styleAsDeleted, source, style, displayAs
         const editedTag = fragment.isEdited ? `<edited ${styleAsDeleted ? 'deleted' : ''}></edited>` : '';
         const htmlContent = styleAsDeleted ? `<del>${html}</del>` : html;
 
-        const htmlWithTag = editedTag ? `${htmlContent}${editedTag}` : htmlContent;
+        let htmlWithTag = editedTag ? `${htmlContent}${editedTag}` : htmlContent;
+        if (styleAsMuted) {
+            htmlWithTag = `<muted-text>${htmlWithTag}<muted-text>`;
+        }
 
         return (
             <RenderCommentHTML
@@ -79,6 +85,7 @@ function TextCommentFragment({fragment, styleAsDeleted, source, style, displayAs
                     styles.ltr,
                     style,
                     styleAsDeleted ? styles.offlineFeedback.deleted : undefined,
+                    styleAsMuted ? styles.colorMuted : undefined,
                     !DeviceCapabilities.canUseTouchScreen() || !isSmallScreenWidth ? styles.userSelectText : styles.userSelectNone,
                 ]}
             >

From 7aa4ee8655fa240e34711ef567d778b4abac9bf3 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Fri, 23 Feb 2024 16:35:57 +0800
Subject: [PATCH 2/6] fix type

---
 src/pages/home/report/ReportActionItemFragment.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/home/report/ReportActionItemFragment.tsx b/src/pages/home/report/ReportActionItemFragment.tsx
index f42504b6a04c..6293e4855f61 100644
--- a/src/pages/home/report/ReportActionItemFragment.tsx
+++ b/src/pages/home/report/ReportActionItemFragment.tsx
@@ -60,7 +60,7 @@ type ReportActionItemFragmentProps = {
     pendingAction?: OnyxCommon.PendingAction;
 
     /** The report action name */
-    actionName: ActionName;
+    actionName?: ActionName;
 
     moderationDecision?: DecisionName;
 };

From ff55939de2c585e66f61bbd130f4d337e22256e0 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Fri, 23 Feb 2024 16:40:39 +0800
Subject: [PATCH 3/6] fix type

---
 .../home/report/ReportActionItemFragment.tsx  | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/pages/home/report/ReportActionItemFragment.tsx b/src/pages/home/report/ReportActionItemFragment.tsx
index 6293e4855f61..c01fad34c4f0 100644
--- a/src/pages/home/report/ReportActionItemFragment.tsx
+++ b/src/pages/home/report/ReportActionItemFragment.tsx
@@ -118,14 +118,17 @@ function ReportActionItemFragment({
                     source={source}
                     fragment={fragment}
                     styleAsDeleted={!!(isOffline && isPendingDelete)}
-                    styleAsMuted={(
-                        [
-                            ...Object.values(CONST.REPORT.ACTIONS.TYPE.POLICYCHANGELOG),
-                            CONST.REPORT.ACTIONS.TYPE.IOU,
-                            CONST.REPORT.ACTIONS.TYPE.APPROVED,
-                            CONST.REPORT.ACTIONS.TYPE.MOVED,
-                        ] as ActionName[]
-                    ).includes(actionName)}
+                    styleAsMuted={
+                        !!actionName &&
+                        (
+                            [
+                                ...Object.values(CONST.REPORT.ACTIONS.TYPE.POLICYCHANGELOG),
+                                CONST.REPORT.ACTIONS.TYPE.IOU,
+                                CONST.REPORT.ACTIONS.TYPE.APPROVED,
+                                CONST.REPORT.ACTIONS.TYPE.MOVED,
+                            ] as ActionName[]
+                        ).includes(actionName)
+                    }
                     iouMessage={iouMessage}
                     displayAsGroup={displayAsGroup}
                     style={style}

From f7aca60de7745e0cf5a55ab5114478385fea75d4 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Fri, 23 Feb 2024 16:41:51 +0800
Subject: [PATCH 4/6] tidying up

---
 .../home/report/ReportActionItemFragment.tsx  | 19 ++++++++-----------
 1 file changed, 8 insertions(+), 11 deletions(-)

diff --git a/src/pages/home/report/ReportActionItemFragment.tsx b/src/pages/home/report/ReportActionItemFragment.tsx
index c01fad34c4f0..710fe0c58462 100644
--- a/src/pages/home/report/ReportActionItemFragment.tsx
+++ b/src/pages/home/report/ReportActionItemFragment.tsx
@@ -65,6 +65,13 @@ type ReportActionItemFragmentProps = {
     moderationDecision?: DecisionName;
 };
 
+const MUTED_ACTIONS = [
+    ...Object.values(CONST.REPORT.ACTIONS.TYPE.POLICYCHANGELOG),
+    CONST.REPORT.ACTIONS.TYPE.IOU,
+    CONST.REPORT.ACTIONS.TYPE.APPROVED,
+    CONST.REPORT.ACTIONS.TYPE.MOVED,
+] as ActionName[];
+
 function ReportActionItemFragment({
     pendingAction,
     actionName,
@@ -118,17 +125,7 @@ function ReportActionItemFragment({
                     source={source}
                     fragment={fragment}
                     styleAsDeleted={!!(isOffline && isPendingDelete)}
-                    styleAsMuted={
-                        !!actionName &&
-                        (
-                            [
-                                ...Object.values(CONST.REPORT.ACTIONS.TYPE.POLICYCHANGELOG),
-                                CONST.REPORT.ACTIONS.TYPE.IOU,
-                                CONST.REPORT.ACTIONS.TYPE.APPROVED,
-                                CONST.REPORT.ACTIONS.TYPE.MOVED,
-                            ] as ActionName[]
-                        ).includes(actionName)
-                    }
+                    styleAsMuted={!!actionName && MUTED_ACTIONS.includes(actionName)}
                     iouMessage={iouMessage}
                     displayAsGroup={displayAsGroup}
                     style={style}

From af0953b557de9c3d6bc1f221fa4073455b721e96 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Fri, 23 Feb 2024 23:51:19 +0800
Subject: [PATCH 5/6] set default value

---
 src/pages/home/report/ReportActionItemMessage.tsx     | 1 -
 src/pages/home/report/comment/TextCommentFragment.tsx | 2 +-
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/pages/home/report/ReportActionItemMessage.tsx b/src/pages/home/report/ReportActionItemMessage.tsx
index 425c5de372a3..7d5d172e1293 100644
--- a/src/pages/home/report/ReportActionItemMessage.tsx
+++ b/src/pages/home/report/ReportActionItemMessage.tsx
@@ -48,7 +48,6 @@ function ReportActionItemMessage({action, displayAsGroup, reportID, style, isHid
                     style={style}
                     source=""
                     styleAsDeleted={false}
-                    styleAsMuted={false}
                 />
             </View>
         );
diff --git a/src/pages/home/report/comment/TextCommentFragment.tsx b/src/pages/home/report/comment/TextCommentFragment.tsx
index db597fc26d44..ac55e04e2efc 100644
--- a/src/pages/home/report/comment/TextCommentFragment.tsx
+++ b/src/pages/home/report/comment/TextCommentFragment.tsx
@@ -40,7 +40,7 @@ type TextCommentFragmentProps = {
     iouMessage?: string;
 };
 
-function TextCommentFragment({fragment, styleAsDeleted, styleAsMuted, source, style, displayAsGroup, iouMessage = ''}: TextCommentFragmentProps) {
+function TextCommentFragment({fragment, styleAsDeleted, styleAsMuted = false, source, style, displayAsGroup, iouMessage = ''}: TextCommentFragmentProps) {
     const theme = useTheme();
     const styles = useThemeStyles();
     const {html = '', text} = fragment;

From 03fa99ff5d95e28d827ff2152e003944ba3a4b2d Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Fri, 23 Feb 2024 23:52:47 +0800
Subject: [PATCH 6/6] fix type

---
 src/pages/home/report/comment/TextCommentFragment.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/home/report/comment/TextCommentFragment.tsx b/src/pages/home/report/comment/TextCommentFragment.tsx
index ac55e04e2efc..951888a443c1 100644
--- a/src/pages/home/report/comment/TextCommentFragment.tsx
+++ b/src/pages/home/report/comment/TextCommentFragment.tsx
@@ -28,7 +28,7 @@ type TextCommentFragmentProps = {
     styleAsDeleted: boolean;
 
     /** Should this message fragment be styled as muted */
-    styleAsMuted: boolean;
+    styleAsMuted?: boolean;
 
     /** Should the comment have the appearance of being grouped with the previous comment? */
     displayAsGroup: boolean;