diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx index 552b51350e09..f84f89f39196 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx @@ -125,6 +125,8 @@ function MoneyRequestReportPreview({ // We only want to highlight the new expenses if the screen is focused. const newTransactionIDs = isFocused ? new Set(newTransactions.map((transaction) => transaction.transactionID)) : undefined; + const transactionPreviewContainerStyles = [styles.h100, reportPreviewStyles.transactionPreviewCarouselStyle]; + const renderItem: ListRenderItem = ({item}) => ( ); diff --git a/src/components/ReportActionItem/TransactionPreview/index.tsx b/src/components/ReportActionItem/TransactionPreview/index.tsx index 084958e29888..1f0371340c03 100644 --- a/src/components/ReportActionItem/TransactionPreview/index.tsx +++ b/src/components/ReportActionItem/TransactionPreview/index.tsx @@ -1,5 +1,5 @@ import {useRoute} from '@react-navigation/native'; -import React, {useCallback, useMemo} from 'react'; +import React, {memo, useCallback, useMemo} from 'react'; import type {GestureResponderEvent} from 'react-native'; import {usePersonalDetails, useSession} from '@components/OnyxListItemProvider'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; @@ -68,7 +68,7 @@ function TransactionPreview(props: TransactionPreviewProps) { const sessionAccountID = session?.accountID; const areThereDuplicates = allDuplicateIDs.length > 0 && duplicates.length > 0 && allDuplicateIDs.length === duplicates.length; - const transactionDetails = useMemo(() => getTransactionDetails(transaction), [transaction]); + const transactionDetails = getTransactionDetails(transaction); const {amount: requestAmount, currency: requestCurrency} = transactionDetails ?? {}; const showContextMenu = (event: GestureResponderEvent) => { @@ -83,11 +83,10 @@ function TransactionPreview(props: TransactionPreviewProps) { clearIOUError(chatReportID); }, [chatReportID]); - const navigateToReviewFields = useCallback(() => { + const navigateToReviewFields = () => Navigation.navigate( getReviewNavigationRoute(Navigation.getActiveRoute(), route.params?.threadReportID, transaction, duplicates, policy, policyCategories, policyTags ?? {}, transactionReport), ); - }, [route.params?.threadReportID, transaction, duplicates, policy, policyCategories, policyTags, transactionReport]); const transactionPreview = transaction; @@ -162,4 +161,4 @@ function TransactionPreview(props: TransactionPreviewProps) { ); } -export default TransactionPreview; +export default memo(TransactionPreview);