From ee0f65bce82043d41855d65b58e6385f2b68d15c Mon Sep 17 00:00:00 2001
From: cdOut <88325488+cdOut@users.noreply.github.com>
Date: Thu, 20 Jun 2024 16:28:02 +0200
Subject: [PATCH 1/7] add trip receipt case
---
src/components/EReceiptThumbnail.tsx | 12 ++++++++-
.../ReportActionItemImage.tsx | 12 +++++++++
src/libs/TripReservationUtils.ts | 25 ++++++++++++++++++-
3 files changed, 47 insertions(+), 2 deletions(-)
diff --git a/src/components/EReceiptThumbnail.tsx b/src/components/EReceiptThumbnail.tsx
index f4216dcc9f8a..6762538b3c91 100644
--- a/src/components/EReceiptThumbnail.tsx
+++ b/src/components/EReceiptThumbnail.tsx
@@ -9,6 +9,7 @@ import colors from '@styles/theme/colors';
import variables from '@styles/variables';
import CONST from '@src/CONST';
import ONYXKEYS from '@src/ONYXKEYS';
+import * as TripReservationUtils from '@libs/TripReservationUtils';
import type {Transaction} from '@src/types/onyx';
import Icon from './Icon';
import * as eReceiptBGs from './Icon/EReceiptBGs';
@@ -56,7 +57,8 @@ const backgroundImages = {
function EReceiptThumbnail({transaction, borderRadius, fileExtension, isReceiptThumbnail = false, centerIconV = true, iconSize = 'large'}: EReceiptThumbnailProps) {
const styles = useThemeStyles();
const StyleUtils = useStyleUtils();
- const colorCode = isReceiptThumbnail ? StyleUtils.getFileExtensionColorCode(fileExtension) : StyleUtils.getEReceiptColorCode(transaction);
+ const {tripIcon, tripBGColor} = TripReservationUtils.getTripEReceiptData(transaction);
+ const colorCode = tripBGColor ?? (isReceiptThumbnail ? StyleUtils.getFileExtensionColorCode(fileExtension) : StyleUtils.getEReceiptColorCode(transaction));
const backgroundImage = useMemo(() => backgroundImages[colorCode], [colorCode]);
@@ -141,6 +143,14 @@ function EReceiptThumbnail({transaction, borderRadius, fileExtension, isReceiptT
fill={primaryColor}
/>
) : null}
+ {tripIcon && isReceiptThumbnail ? (
+
+ ) : null}
diff --git a/src/components/ReportActionItem/ReportActionItemImage.tsx b/src/components/ReportActionItem/ReportActionItemImage.tsx
index 1251be83994b..b0105039bc18 100644
--- a/src/components/ReportActionItem/ReportActionItemImage.tsx
+++ b/src/components/ReportActionItem/ReportActionItemImage.tsx
@@ -95,6 +95,8 @@ function ReportActionItemImage({
const thumbnailSource = tryResolveUrlFromApiRoot(thumbnail ?? '');
const isEReceipt = transaction && TransactionUtils.hasEReceipt(transaction);
+ const shouldUseTripEReceiptThumbnail = transaction?.receipt?.reservationList?.length !== 0;
+
let propsObj: ReceiptImageProps;
if (isEReceipt) {
@@ -110,6 +112,16 @@ function ReportActionItemImage({
};
} else if (isLocalFile && filename && Str.isPDF(filename) && typeof attachmentModalSource === 'string') {
propsObj = {isPDFThumbnail: true, source: attachmentModalSource};
+ } else if (shouldUseTripEReceiptThumbnail) {
+ propsObj = {
+ isThumbnail,
+ transactionID: transaction?.transactionID,
+ ...(isThumbnail && {iconSize: (isSingleImage ? 'medium' : 'small') as IconSize, fileExtension}),
+ shouldUseThumbnailImage: true,
+ isAuthTokenRequired: false,
+ source: thumbnail ?? image ?? '',
+ shouldUseInitialObjectPosition: isDistanceRequest,
+ };
} else {
propsObj = {
isThumbnail,
diff --git a/src/libs/TripReservationUtils.ts b/src/libs/TripReservationUtils.ts
index ead786b8eafd..ced50c7ec0ac 100644
--- a/src/libs/TripReservationUtils.ts
+++ b/src/libs/TripReservationUtils.ts
@@ -3,6 +3,7 @@ import CONST from '@src/CONST';
import type {Reservation, ReservationType} from '@src/types/onyx/Transaction';
import type Transaction from '@src/types/onyx/Transaction';
import type IconAsset from '@src/types/utils/IconAsset';
+import { EReceiptColorName } from '@styles/utils/types';
function getTripReservationIcon(reservationType: ReservationType): IconAsset {
switch (reservationType) {
@@ -24,4 +25,26 @@ function getReservationsFromTripTransactions(transactions: Transaction[]): Reser
.flat();
}
-export {getTripReservationIcon, getReservationsFromTripTransactions};
+type TripEReceiptData = {
+ /** Icon asset associated with the type of trip reservation */
+ tripIcon?: IconAsset,
+
+ /** EReceipt background color associated with the type of trip reservation */
+ tripBGColor?: EReceiptColorName,
+}
+
+function getTripEReceiptData(transaction?: Transaction): TripEReceiptData {
+ const reservationType = transaction ? transaction.receipt?.reservationList?.[0]?.type : '';
+
+ switch (reservationType) {
+ case CONST.RESERVATION_TYPE.FLIGHT:
+ case CONST.RESERVATION_TYPE.CAR:
+ return {tripIcon: Expensicons.Plane, tripBGColor: CONST.ERECEIPT_COLORS.PINK};
+ case CONST.RESERVATION_TYPE.HOTEL:
+ return {tripIcon: Expensicons.Plane, tripBGColor: CONST.ERECEIPT_COLORS.YELLOW};
+ default:
+ return {};
+ }
+}
+
+export {getTripReservationIcon, getReservationsFromTripTransactions, getTripEReceiptData};
From 4e34eb15f41366c75698a3eb0567ae508d686bcd Mon Sep 17 00:00:00 2001
From: cdOut <88325488+cdOut@users.noreply.github.com>
Date: Thu, 20 Jun 2024 16:29:11 +0200
Subject: [PATCH 2/7] fix prettier
---
src/components/EReceiptThumbnail.tsx | 2 +-
src/libs/TripReservationUtils.ts | 8 ++++----
2 files changed, 5 insertions(+), 5 deletions(-)
diff --git a/src/components/EReceiptThumbnail.tsx b/src/components/EReceiptThumbnail.tsx
index 6762538b3c91..aebfff1f5a00 100644
--- a/src/components/EReceiptThumbnail.tsx
+++ b/src/components/EReceiptThumbnail.tsx
@@ -5,11 +5,11 @@ import {withOnyx} from 'react-native-onyx';
import useStyleUtils from '@hooks/useStyleUtils';
import useThemeStyles from '@hooks/useThemeStyles';
import * as ReportUtils from '@libs/ReportUtils';
+import * as TripReservationUtils from '@libs/TripReservationUtils';
import colors from '@styles/theme/colors';
import variables from '@styles/variables';
import CONST from '@src/CONST';
import ONYXKEYS from '@src/ONYXKEYS';
-import * as TripReservationUtils from '@libs/TripReservationUtils';
import type {Transaction} from '@src/types/onyx';
import Icon from './Icon';
import * as eReceiptBGs from './Icon/EReceiptBGs';
diff --git a/src/libs/TripReservationUtils.ts b/src/libs/TripReservationUtils.ts
index ced50c7ec0ac..23a1743d65f4 100644
--- a/src/libs/TripReservationUtils.ts
+++ b/src/libs/TripReservationUtils.ts
@@ -1,9 +1,9 @@
+import {EReceiptColorName} from '@styles/utils/types';
import * as Expensicons from '@src/components/Icon/Expensicons';
import CONST from '@src/CONST';
import type {Reservation, ReservationType} from '@src/types/onyx/Transaction';
import type Transaction from '@src/types/onyx/Transaction';
import type IconAsset from '@src/types/utils/IconAsset';
-import { EReceiptColorName } from '@styles/utils/types';
function getTripReservationIcon(reservationType: ReservationType): IconAsset {
switch (reservationType) {
@@ -27,11 +27,11 @@ function getReservationsFromTripTransactions(transactions: Transaction[]): Reser
type TripEReceiptData = {
/** Icon asset associated with the type of trip reservation */
- tripIcon?: IconAsset,
+ tripIcon?: IconAsset;
/** EReceipt background color associated with the type of trip reservation */
- tripBGColor?: EReceiptColorName,
-}
+ tripBGColor?: EReceiptColorName;
+};
function getTripEReceiptData(transaction?: Transaction): TripEReceiptData {
const reservationType = transaction ? transaction.receipt?.reservationList?.[0]?.type : '';
From 44a368f7cd09575073433837bee635a0dd2cf833 Mon Sep 17 00:00:00 2001
From: cdOut <88325488+cdOut@users.noreply.github.com>
Date: Thu, 20 Jun 2024 17:04:47 +0200
Subject: [PATCH 3/7] correct type imports and lint
---
src/libs/TripReservationUtils.ts | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/libs/TripReservationUtils.ts b/src/libs/TripReservationUtils.ts
index 23a1743d65f4..140347a99ed7 100644
--- a/src/libs/TripReservationUtils.ts
+++ b/src/libs/TripReservationUtils.ts
@@ -1,4 +1,4 @@
-import {EReceiptColorName} from '@styles/utils/types';
+import type {EReceiptColorName} from '@styles/utils/types';
import * as Expensicons from '@src/components/Icon/Expensicons';
import CONST from '@src/CONST';
import type {Reservation, ReservationType} from '@src/types/onyx/Transaction';
From 85f4941b0c71952a64e352ec9fbe60a1ad1419d2 Mon Sep 17 00:00:00 2001
From: cdOut <88325488+cdOut@users.noreply.github.com>
Date: Thu, 20 Jun 2024 17:05:53 +0200
Subject: [PATCH 4/7] set correct icon for accommodation
---
src/libs/TripReservationUtils.ts | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/libs/TripReservationUtils.ts b/src/libs/TripReservationUtils.ts
index 140347a99ed7..e937979ae7b9 100644
--- a/src/libs/TripReservationUtils.ts
+++ b/src/libs/TripReservationUtils.ts
@@ -41,7 +41,7 @@ function getTripEReceiptData(transaction?: Transaction): TripEReceiptData {
case CONST.RESERVATION_TYPE.CAR:
return {tripIcon: Expensicons.Plane, tripBGColor: CONST.ERECEIPT_COLORS.PINK};
case CONST.RESERVATION_TYPE.HOTEL:
- return {tripIcon: Expensicons.Plane, tripBGColor: CONST.ERECEIPT_COLORS.YELLOW};
+ return {tripIcon: Expensicons.Bed, tripBGColor: CONST.ERECEIPT_COLORS.YELLOW};
default:
return {};
}
From 4d700b7292e1b782cfe021a52e8a8ba7613a4dda Mon Sep 17 00:00:00 2001
From: cdOut <88325488+cdOut@users.noreply.github.com>
Date: Fri, 21 Jun 2024 17:52:44 +0200
Subject: [PATCH 5/7] correct conditional for displaying the EReceipt icon
---
src/components/EReceiptThumbnail.tsx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/components/EReceiptThumbnail.tsx b/src/components/EReceiptThumbnail.tsx
index aebfff1f5a00..a8d636db460b 100644
--- a/src/components/EReceiptThumbnail.tsx
+++ b/src/components/EReceiptThumbnail.tsx
@@ -143,7 +143,7 @@ function EReceiptThumbnail({transaction, borderRadius, fileExtension, isReceiptT
fill={primaryColor}
/>
) : null}
- {tripIcon && isReceiptThumbnail ? (
+ {tripIcon ? (
Date: Wed, 26 Jun 2024 13:01:38 +0200
Subject: [PATCH 6/7] fix conditional for displaying travel ereceipt
---
src/components/EReceiptThumbnail.tsx | 2 +-
src/components/ReportActionItem/ReportActionItemImage.tsx | 2 +-
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/components/EReceiptThumbnail.tsx b/src/components/EReceiptThumbnail.tsx
index a8d636db460b..aebfff1f5a00 100644
--- a/src/components/EReceiptThumbnail.tsx
+++ b/src/components/EReceiptThumbnail.tsx
@@ -143,7 +143,7 @@ function EReceiptThumbnail({transaction, borderRadius, fileExtension, isReceiptT
fill={primaryColor}
/>
) : null}
- {tripIcon ? (
+ {tripIcon && isReceiptThumbnail ? (
Date: Wed, 3 Jul 2024 13:02:11 +0200
Subject: [PATCH 7/7] correct logic for displaying the trip receipt
---
src/components/EReceiptThumbnail.tsx | 2 +-
.../ReportActionItem/ReportActionItemImage.tsx | 14 +-------------
2 files changed, 2 insertions(+), 14 deletions(-)
diff --git a/src/components/EReceiptThumbnail.tsx b/src/components/EReceiptThumbnail.tsx
index aebfff1f5a00..a8d636db460b 100644
--- a/src/components/EReceiptThumbnail.tsx
+++ b/src/components/EReceiptThumbnail.tsx
@@ -143,7 +143,7 @@ function EReceiptThumbnail({transaction, borderRadius, fileExtension, isReceiptT
fill={primaryColor}
/>
) : null}
- {tripIcon && isReceiptThumbnail ? (
+ {tripIcon ? (