diff --git a/src/pages/home/report/ReportAttachments.js b/src/pages/home/report/ReportAttachments.js
index 5f194d10bce3..23da908fed17 100644
--- a/src/pages/home/report/ReportAttachments.js
+++ b/src/pages/home/report/ReportAttachments.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useCallback} from 'react';
 import _ from 'underscore';
 import PropTypes from 'prop-types';
 import AttachmentModal from '../../../components/AttachmentModal';
@@ -24,6 +24,14 @@ function ReportAttachments(props) {
     const report = ReportUtils.getReport(reportID);
     const source = decodeURI(_.get(props, ['route', 'params', 'source']));
 
+    const onCarouselAttachmentChange = useCallback(
+        (attachment) => {
+            const route = ROUTES.REPORT_ATTACHMENTS.getRoute(reportID, attachment.source);
+            Navigation.navigate(route);
+        },
+        [reportID],
+    );
+
     return (
         <AttachmentModal
             allowDownload
@@ -31,10 +39,7 @@ function ReportAttachments(props) {
             report={report}
             source={source}
             onModalHide={() => Navigation.dismissModal()}
-            onCarouselAttachmentChange={(attachment) => {
-                const route = ROUTES.REPORT_ATTACHMENTS.getRoute(reportID, attachment.source);
-                Navigation.navigate(route);
-            }}
+            onCarouselAttachmentChange={onCarouselAttachmentChange}
         />
     );
 }