move clearing notification logic to ReportScreen

src/libs/actions/Report.ts

@@ -16,7 +16,6 @@ import * as Environment from '@libs/Environment/Environment';
 import * as ErrorUtils from '@libs/ErrorUtils';
 import Log from '@libs/Log';
 import Navigation from '@libs/Navigation/Navigation';
-import clearReportNotifications from '@libs/Notification/clearReportNotifications';
 import LocalNotification from '@libs/Notification/LocalNotification';
 import * as OptionsListUtils from '@libs/OptionsListUtils';
 import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils';
@@ -475,8 +474,6 @@ function openReport(
         return;
     }
 
-    clearReportNotifications(reportID);
-
     const optimisticReport = reportActionsExist(reportID)
         ? {}
         : {

src/pages/home/ReportScreen.js

@@ -291,17 +291,17 @@ function ReportScreen({
         [route],
     );
 
-    // Clear notifications for the current report when the app is focused
-    useAppFocusEvent(
-        useCallback(() => {
-            // Check if this is the top-most ReportScreen since the Navigator preserves multiple at a time
-            if (!isTopMostReportId) {
-                return;
-            }
+    // Clear notifications for the current report when it's opened and re-focused
+    const clearNotifications = useCallback(() => {
+        // Check if this is the top-most ReportScreen since the Navigator preserves multiple at a time
+        if (!isTopMostReportId) {
+            return;
+        }
 
-            clearReportNotifications(report.reportID);
-        }, [report.reportID, isTopMostReportId]),
-    );
+        clearReportNotifications(report.reportID);
+    }, [report.reportID, isTopMostReportId]);
+    useEffect(clearNotifications, [clearNotifications]);
+    useAppFocusEvent(clearNotifications);
 
     useEffect(() => {
         Timing.end(CONST.TIMING.CHAT_RENDER);