From 459b12d0f6b1e6dbbb57da7a4beb02c520b497c3 Mon Sep 17 00:00:00 2001
From: gijoe0295 <gijoe0295@gmail.com>
Date: Fri, 16 Aug 2024 10:53:00 +0700
Subject: [PATCH] fix: receipt in dupe detect is removable

---
 src/ROUTES.ts                                             | 2 +-
 src/components/ReportActionItem/MoneyRequestView.tsx      | 1 +
 src/components/ReportActionItem/ReportActionItemImage.tsx | 8 +++++++-
 src/libs/Navigation/types.ts                              | 1 +
 src/pages/TransactionReceiptPage.tsx                      | 3 ++-
 5 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index de495568daa3..79983e83d342 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -984,7 +984,7 @@ const ROUTES = {
 
     TRANSACTION_RECEIPT: {
         route: 'r/:reportID/transaction/:transactionID/receipt',
-        getRoute: (reportID: string, transactionID: string) => `r/${reportID}/transaction/${transactionID}/receipt` as const,
+        getRoute: (reportID: string, transactionID: string, readonly = false) => `r/${reportID}/transaction/${transactionID}/receipt${readonly ? '?readonly=true' : ''}` as const,
     },
     TRANSACTION_DUPLICATE_REVIEW_PAGE: {
         route: 'r/:threadReportID/duplicates/review',
diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index 13376c05a0f2..48182f31059d 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -494,6 +494,7 @@ function MoneyRequestView({
                                     filename={receiptURIs?.filename}
                                     transaction={transaction}
                                     enablePreviewModal
+                                    readonly={readonly}
                                 />
                             </View>
                         )}
diff --git a/src/components/ReportActionItem/ReportActionItemImage.tsx b/src/components/ReportActionItem/ReportActionItemImage.tsx
index 4f58b193eeb2..718b60828f62 100644
--- a/src/components/ReportActionItem/ReportActionItemImage.tsx
+++ b/src/components/ReportActionItem/ReportActionItemImage.tsx
@@ -52,6 +52,9 @@ type ReportActionItemImageProps = {
 
     /** Whether the map view should have border radius  */
     shouldMapHaveBorderRadius?: boolean;
+
+    /** Whether the receipt is not editable */
+    readonly?: boolean;
 };
 
 /**
@@ -70,6 +73,7 @@ function ReportActionItemImage({
     fileExtension,
     filename,
     isSingleImage = true,
+    readonly = false,
     shouldMapHaveBorderRadius,
 }: ReportActionItemImageProps) {
     const styles = useThemeStyles();
@@ -130,7 +134,9 @@ function ReportActionItemImage({
                     <PressableWithoutFocus
                         style={[styles.w100, styles.h100, styles.noOutline as ViewStyle]}
                         onPress={() =>
-                            Navigation.navigate(ROUTES.TRANSACTION_RECEIPT.getRoute(transactionThreadReport?.reportID ?? report?.reportID ?? '-1', transaction?.transactionID ?? '-1'))
+                            Navigation.navigate(
+                                ROUTES.TRANSACTION_RECEIPT.getRoute(transactionThreadReport?.reportID ?? report?.reportID ?? '-1', transaction?.transactionID ?? '-1', readonly),
+                            )
                         }
                         accessibilityLabel={translate('accessibilityHints.viewAttachment')}
                         accessibilityRole={CONST.ROLE.BUTTON}
diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index 8bd1c44568c4..492a18653fa3 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -1293,6 +1293,7 @@ type AuthScreensParamList = CentralPaneScreensParamList &
         [SCREENS.TRANSACTION_RECEIPT]: {
             reportID: string;
             transactionID: string;
+            readonly?: boolean;
         };
         [SCREENS.CONNECTION_COMPLETE]: undefined;
     };
diff --git a/src/pages/TransactionReceiptPage.tsx b/src/pages/TransactionReceiptPage.tsx
index 6129deb438de..9a59c15b589c 100644
--- a/src/pages/TransactionReceiptPage.tsx
+++ b/src/pages/TransactionReceiptPage.tsx
@@ -31,6 +31,7 @@ function TransactionReceipt({transaction, report, reportMetadata = {isLoadingIni
     const imageSource = tryResolveUrlFromApiRoot(receiptURIs.image ?? '');
 
     const isLocalFile = receiptURIs.isLocalFile;
+    const readonly = route.params.readonly ?? false;
 
     const parentReportAction = ReportActionUtils.getReportAction(report?.parentReportID ?? '-1', report?.parentReportActionID ?? '-1');
     const canEditReceipt = ReportUtils.canEditFieldOfMoneyRequest(parentReportAction, CONST.EDIT_REQUEST_FIELD.RECEIPT);
@@ -58,7 +59,7 @@ function TransactionReceipt({transaction, report, reportMetadata = {isLoadingIni
             isAuthTokenRequired={!isLocalFile}
             report={report}
             isReceiptAttachment
-            canEditReceipt={canEditReceipt}
+            canEditReceipt={canEditReceipt && !readonly}
             allowDownload={!isEReceipt}
             isTrackExpenseAction={isTrackExpenseAction}
             originalFileName={receiptURIs?.filename}