diff --git a/src/pages/home/report/ReportActionItem.js b/src/pages/home/report/ReportActionItem.js index c0c335ca5efe..c1aaf88b14c4 100644 --- a/src/pages/home/report/ReportActionItem.js +++ b/src/pages/home/report/ReportActionItem.js @@ -131,6 +131,7 @@ function ReportActionItem(props) { // Hide the message if it is being moderated for a higher offense, or is hidden by a moderator // Removed messages should not be shown anyway and should not need this flow + useEffect(() => { if (!props.action.actionName === CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT || _.isEmpty(props.action.message[0].moderationDecisions)) { return; @@ -146,7 +147,10 @@ function ReportActionItem(props) { setIsHidden(true); } setModerationDecision(latestDecision.decision); - }, [props.action.message, props.action.actionName]); + + // props.action.message doesn't need to be a dependency, we only need to check the change of props.action.message[0].moderationDecisions + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [props.action.message[0].moderationDecisions, props.action.actionName]); const toggleContextMenuFromActiveReportAction = useCallback(() => { setIsContextMenuActive(ReportActionContextMenu.isActiveReportAction(props.action.reportActionID)); @@ -279,7 +283,7 @@ function ReportActionItem(props) { : undefined, ]} /> - {props.displayAsGroup && hasBeenFlagged && ( + {hasBeenFlagged && ( - )} ); }