diff --git a/src/screens/activity/ActivityRow.tsx b/src/screens/activity/ActivityRow.tsx index 4de008144..8e844b684 100644 --- a/src/screens/activity/ActivityRow.tsx +++ b/src/screens/activity/ActivityRow.tsx @@ -52,6 +52,7 @@ export const ActivityBasicRow = ({ from = '', to = '', price, + id, } = activityDetails const { t } = useTranslation() @@ -88,6 +89,7 @@ export const ActivityBasicRow = ({ from, to, time: timeHumanFormatted, + hashId: id, }, contact: contact || { address }, }), @@ -103,6 +105,7 @@ export const ActivityBasicRow = ({ timeHumanFormatted, usdBalance, value, + id, ], ) diff --git a/src/screens/transactionSummary/TransactionSummaryComponent.tsx b/src/screens/transactionSummary/TransactionSummaryComponent.tsx index 041bfe862..55ff7c4ca 100644 --- a/src/screens/transactionSummary/TransactionSummaryComponent.tsx +++ b/src/screens/transactionSummary/TransactionSummaryComponent.tsx @@ -1,6 +1,6 @@ import { useMemo } from 'react' import { useTranslation } from 'react-i18next' -import { ScrollView, StyleSheet, View } from 'react-native' +import { Linking, ScrollView, StyleSheet, View } from 'react-native' import { useSafeAreaInsets } from 'react-native-safe-area-context' import Icon from 'react-native-vector-icons/FontAwesome5' import { RIFWallet } from '@rsksmart/rif-wallet-core' @@ -10,20 +10,24 @@ import { displayRoundBalance } from 'lib/utils' import { TokenBalance } from 'components/token' import { sharedColors, sharedStyles } from 'shared/constants' import { castStyle } from 'shared/utils' -import { AppButton, Typography } from 'components/index' +import { AppButton, AppTouchable, Typography } from 'components/index' import { WINDOW_HEIGHT, WINDOW_WIDTH } from 'src/ux/slides/Dimensions' import { useAppSelector } from 'store/storeUtils' import { isMyAddress } from 'components/address/lib' import { DollarIcon } from 'components/icons/DollarIcon' import { FullScreenSpinner } from 'components/fullScreenSpinner' import { getContactByAddress } from 'store/slices/contactsSlice' +import { getWalletSetting } from 'src/core/config' +import { SETTINGS } from 'src/core/types' +import { chainTypesById } from 'src/shared/constants/chainConstants' +import { selectChainId } from 'src/redux/slices/settingsSlice' +import { TokenImage } from '../home/TokenImage' import { TransactionStatus, transactionStatusDisplayText, transactionStatusToIconPropsMap, } from './transactionSummaryUtils' -import { TokenImage } from '../home/TokenImage' import { TransactionSummaryScreenProps } from '.' @@ -47,9 +51,10 @@ export const TransactionSummaryComponent = ({ isLoaded, FeeComponent, }: TransactionSummaryComponentProps) => { + const chainId = useAppSelector(selectChainId) const { bottom } = useSafeAreaInsets() const { t } = useTranslation() - const { status, tokenValue, fee, usdValue, time } = transaction + const { status, tokenValue, fee, usdValue, time, hashId } = transaction const iconObject = transactionStatusToIconPropsMap.get(status) const transactionStatusText = transactionStatusDisplayText.get(status) @@ -94,6 +99,15 @@ export const TransactionSummaryComponent = ({ [amIReceiver, usdValue.balance, fee.usdValue], ) + const openTransactionHash = () => { + const explorerUrl = getWalletSetting( + SETTINGS.EXPLORER_ADDRESS_URL, + chainTypesById[chainId], + ) + + Linking.openURL(`${explorerUrl}/tx/${hashId}`) + } + return ( {isLoaded === false && } @@ -239,6 +253,28 @@ export const TransactionSummaryComponent = ({ {contactToUse.address} + {/* transaction hash */} + {hashId && ( + + + Hash + + + + {hashId} + + + + )} @@ -305,6 +341,13 @@ const styles = StyleSheet.create({ flex: 3, alignSelf: 'flex-end', }), + hashId: castStyle.text({ + flex: 3, + alignSelf: 'flex-end', + }), + underline: castStyle.text({ + textDecorationLine: 'underline', + }), buttons: castStyle.view({ justifyContent: 'space-between', minHeight: 114, diff --git a/src/screens/transactionSummary/index.tsx b/src/screens/transactionSummary/index.tsx index a7f9e9c11..ae906771f 100644 --- a/src/screens/transactionSummary/index.tsx +++ b/src/screens/transactionSummary/index.tsx @@ -18,6 +18,7 @@ import { TransactionStatus } from './transactionSummaryUtils' export interface TransactionSummaryScreenProps { transaction: { + hashId?: string tokenValue: CurrencyValue usdValue: CurrencyValue fee: TokenFeeValueObject