From e00f75529de97647e53c60a8275611f78b381ccb Mon Sep 17 00:00:00 2001 From: Ilias Trichopoulos Date: Thu, 19 Dec 2024 15:53:31 +0100 Subject: [PATCH] Migrate mw WalletConnectSessionRequestModal props Related to #947 Also see: https://github.com/alephium/alephium-frontend/pull/1026#pullrequestreview-2512003381 --- .../walletConnect/WalletConnectContext.tsx | 290 ++++---------- .../WalletConnectSessionRequestModal.tsx | 358 +++++++++++------- 2 files changed, 298 insertions(+), 350 deletions(-) diff --git a/apps/mobile-wallet/src/contexts/walletConnect/WalletConnectContext.tsx b/apps/mobile-wallet/src/contexts/walletConnect/WalletConnectContext.tsx index c407e55d5..74b995c7a 100644 --- a/apps/mobile-wallet/src/contexts/walletConnect/WalletConnectContext.tsx +++ b/apps/mobile-wallet/src/contexts/walletConnect/WalletConnectContext.tsx @@ -30,8 +30,7 @@ import { walletConnectClientInitialized, walletConnectClientInitializeFailed, walletConnectClientInitializing, - walletConnectClientMaxRetriesReached, - WalletConnectError + walletConnectClientMaxRetriesReached } from '@alephium/shared' import { useInterval } from '@alephium/shared-react' import { ALPH } from '@alephium/token-list' @@ -39,17 +38,11 @@ import { formatChain, RelayMethod } from '@alephium/walletconnect-provider' import { ApiRequestArguments, SignDeployContractTxParams, - SignDeployContractTxResult, SignExecuteScriptTxParams, - SignExecuteScriptTxResult, SignMessageParams, - SignMessageResult, SignTransferTxParams, - SignTransferTxResult, - SignUnsignedTxParams, - SignUnsignedTxResult + SignUnsignedTxParams } from '@alephium/web3' -import { SignResult } from '@alephium/web3/dist/src/api/api-alephium' import { IWalletKit, WalletKit } from '@reown/walletkit' import { Core, @@ -87,10 +80,8 @@ import { buildTransferTransaction } from '~/api/transactions' import SpinnerModal from '~/components/SpinnerModal' -import useFundPasswordGuard from '~/features/fund-password/useFundPasswordGuard' import { openModal } from '~/features/modals/modalActions' import { useAppDispatch, useAppSelector } from '~/hooks/redux' -import { useBiometricsAuthGuard } from '~/hooks/useBiometrics' import { selectAddressIds } from '~/store/addressesSlice' import { CallContractTxData, @@ -99,7 +90,6 @@ import { SignUnsignedTxData, TransferTxData } from '~/types/transactions' -import { SessionRequestData } from '~/types/walletConnect' import { showExceptionToast, showToast } from '~/utils/layout' import { sleep } from '~/utils/misc' @@ -112,6 +102,11 @@ interface WalletConnectContextValue { unpairFromDapp: (pairingTopic: string) => Promise activeSessions: SessionTypes.Struct[] refreshActiveSessions: () => void + respondToWalletConnect: (event: SessionRequestEvent, response: EngineTypes.RespondParams['response']) => Promise + respondToWalletConnectWithError: ( + sessionRequestEvent: SessionRequestEvent, + error: ReturnType + ) => Promise resetWalletConnectClientInitializationAttempts: () => void resetWalletConnectStorage: () => void @@ -123,6 +118,8 @@ const initialValues: WalletConnectContextValue = { unpairFromDapp: () => Promise.resolve(), activeSessions: [], refreshActiveSessions: () => null, + respondToWalletConnectWithError: () => Promise.resolve(), + respondToWalletConnect: () => Promise.resolve(), resetWalletConnectClientInitializationAttempts: () => null, resetWalletConnectStorage: () => null @@ -145,18 +142,13 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode const appState = useRef(AppState.currentState) const dispatch = useAppDispatch() const walletConnectClientStatus = useAppSelector((s) => s.clients.walletConnect.status) - const { triggerBiometricsAuthGuard } = useBiometricsAuthGuard() - const { triggerFundPasswordAuthGuard } = useFundPasswordGuard() const { t } = useTranslation() const [walletConnectClient, setWalletConnectClient] = useState() const [activeSessions, setActiveSessions] = useState([]) - const [sessionRequestEvent, setSessionRequestEvent] = useState() - const [sessionRequestData, setSessionRequestData] = useState() const [loading, setLoading] = useState('') const [walletConnectClientInitializationAttempts, setWalletConnectClientInitializationAttempts] = useState(0) - const activeSessionMetadata = activeSessions.find((s) => s.topic === sessionRequestEvent?.topic)?.peer.metadata const isWalletConnectClientReady = isWalletConnectEnabled && walletConnectClient && walletConnectClientStatus === 'initialized' @@ -265,13 +257,6 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode [walletConnectClient, cleanStorage] ) - const respondToWalletConnectWithSuccess = useCallback( - async (event: SessionRequestEvent, result: SignResult) => { - await respondToWalletConnect(event, { id: event.id, jsonrpc: '2.0', result }) - }, - [respondToWalletConnect] - ) - const respondToWalletConnectWithError = useCallback( async (event: SessionRequestEvent, error: ReturnType) => await respondToWalletConnect(event, { id: event.id, jsonrpc: '2.0', error }), @@ -342,59 +327,6 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode [refreshActiveSessions, walletConnectClient] ) - const handleApprovePress = useCallback( - async ( - sendTransaction: () => Promise< - SignExecuteScriptTxResult | SignDeployContractTxResult | SignTransferTxResult | undefined - > - ) => { - if (!sessionRequestEvent) return - - triggerBiometricsAuthGuard({ - settingsToCheck: 'transactions', - successCallback: () => - triggerFundPasswordAuthGuard({ - successCallback: async () => { - setLoading('Approving...') - - try { - const signResult = await sendTransaction() - - if (!signResult) { - console.log('⏳ DID NOT GET A SIGNATURE RESULT, INFORMING DAPP THAT SESSION REQUEST FAILED...') - await respondToWalletConnectWithError(sessionRequestEvent, { - message: 'Sending transaction failed', - code: WALLETCONNECT_ERRORS.TRANSACTION_SEND_FAILED - }) - console.log('✅ INFORMING: DONE!') - } else { - console.log('⏳ INFORMING DAPP THAT SESSION REQUEST SUCCEEDED...') - await respondToWalletConnectWithSuccess(sessionRequestEvent, signResult) - console.log('✅ INFORMING: DONE!') - } - } catch (e) { - console.error('❌ INFORMING: FAILED.') - } finally { - console.log('👉 RESETTING SESSION REQUEST EVENT.') - setSessionRequestEvent(undefined) - setSessionRequestData(undefined) - setLoading('') - showToast({ text1: t('dApp request approved'), text2: t('You can go back to your browser.') }) - } - } - }) - }) - }, - [ - respondToWalletConnectWithError, - respondToWalletConnectWithSuccess, - sessionRequestEvent, - t, - triggerBiometricsAuthGuard, - triggerFundPasswordAuthGuard - ] - ) - const onSessionProposal = useCallback( async (proposalEvent: SessionProposalEvent) => { console.log('📣 RECEIVED EVENT PROPOSAL TO CONNECT TO A DAPP!') @@ -571,89 +503,6 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode return subscription.remove }, [isWalletConnectEnabled]) - const handleSignSuccess = useCallback( - async (result: SignMessageResult | SignUnsignedTxResult) => { - if (!sessionRequestEvent) return - - console.log('⏳ INFORMING DAPP THAT SESSION REQUEST SUCCEEDED...') - await respondToWalletConnectWithSuccess(sessionRequestEvent, result) - console.log('✅ INFORMING: DONE!') - - console.log('👉 RESETTING SESSION REQUEST EVENT.') - setSessionRequestEvent(undefined) - setSessionRequestData(undefined) - showToast({ text1: t('dApp request approved'), text2: t('You can go back to your browser.') }) - }, - [respondToWalletConnectWithSuccess, sessionRequestEvent, t] - ) - - const handleRejectPress = useCallback(async () => { - if (!sessionRequestEvent) return - - try { - console.log('⏳ INFORMING DAPP THAT SESSION REQUEST FAILED...') - await respondToWalletConnectWithError(sessionRequestEvent, getSdkError('USER_REJECTED')) - console.log('✅ INFORMING: DONE!') - } catch (e) { - console.error('❌ INFORMING: FAILED.') - } finally { - console.log('👉 RESETTING SESSION REQUEST EVENT.') - setSessionRequestEvent(undefined) - setSessionRequestData(undefined) - showToast({ text1: t('dApp request rejected'), text2: t('You can go back to your browser.'), type: 'info' }) - } - }, [respondToWalletConnectWithError, sessionRequestEvent, t]) - - const handleSendTxOrSignFail = useCallback( - async (error: WalletConnectError) => { - if (!sessionRequestEvent) return - - try { - console.log('⏳ INFORMING DAPP THAT SESSION REQUEST FAILED...') - await respondToWalletConnectWithError(sessionRequestEvent, error) - console.log('✅ INFORMING: DONE!') - } catch (e) { - console.error('❌ INFORMING: FAILED.') - } finally { - console.log('👉 RESETTING SESSION REQUEST EVENT.') - setSessionRequestEvent(undefined) - setSessionRequestData(undefined) - } - }, - [respondToWalletConnectWithError, sessionRequestEvent] - ) - - const openWalletConnectSessionRequestModal = useCallback( - () => - sessionRequestData && - walletConnectClient && - dispatch( - openModal({ - name: 'WalletConnectSessionRequestModal', - props: { - requestData: sessionRequestData, - onApprove: handleApprovePress, - onReject: handleRejectPress, - onSendTxOrSignFail: handleSendTxOrSignFail, - onSignSuccess: handleSignSuccess, - metadata: activeSessionMetadata, - sessionRequestEvent - } - }) - ), - [ - activeSessionMetadata, - dispatch, - handleApprovePress, - handleRejectPress, - handleSendTxOrSignFail, - handleSignSuccess, - sessionRequestData, - sessionRequestEvent, - walletConnectClient - ] - ) - const onSessionRequest = useCallback( async (requestEvent: SignClientTypes.EventArguments['session_request']) => { if (!walletConnectClient) return @@ -696,15 +545,21 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode console.log('✅ BUILDING TX: DONE!') setLoading('') - setSessionRequestData({ - type: 'transfer', - wcData: wcTxData, - unsignedTxData: buildTransactionTxResult - }) - setSessionRequestEvent(requestEvent) - console.log('⏳ OPENING MODAL TO APPROVE TX...') - openWalletConnectSessionRequestModal() + + dispatch( + openModal({ + name: 'WalletConnectSessionRequestModal', + props: { + requestEvent, + requestData: { + type: 'transfer', + wcData: wcTxData, + unsignedTxData: buildTransactionTxResult + } + } + }) + ) break } @@ -739,15 +594,21 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode console.log('✅ BUILDING TX: DONE!') setLoading('') - setSessionRequestData({ - type: 'deploy-contract', - wcData: wcTxData, - unsignedTxData: buildDeployContractTxResult - }) - setSessionRequestEvent(requestEvent) - console.log('⏳ OPENING MODAL TO APPROVE TX...') - openWalletConnectSessionRequestModal() + + dispatch( + openModal({ + name: 'WalletConnectSessionRequestModal', + props: { + requestEvent, + requestData: { + type: 'deploy-contract', + wcData: wcTxData, + unsignedTxData: buildDeployContractTxResult + } + } + }) + ) break } @@ -794,15 +655,21 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode console.log('✅ BUILDING TX: DONE!') setLoading('') - setSessionRequestData({ - type: 'call-contract', - wcData: wcTxData, - unsignedTxData: buildCallContractTxResult - }) - setSessionRequestEvent(requestEvent) - console.log('⏳ OPENING MODAL TO APPROVE TX...') - openWalletConnectSessionRequestModal() + + dispatch( + openModal({ + name: 'WalletConnectSessionRequestModal', + props: { + requestEvent, + requestData: { + type: 'call-contract', + wcData: wcTxData, + unsignedTxData: buildCallContractTxResult + } + } + }) + ) break } @@ -824,14 +691,20 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode messageHasher } - setSessionRequestData({ - type: 'sign-message', - wcData: signData - }) - setSessionRequestEvent(requestEvent) - console.log('⏳ OPENING MODAL TO SIGN MESSAGE...') - openWalletConnectSessionRequestModal() + + dispatch( + openModal({ + name: 'WalletConnectSessionRequestModal', + props: { + requestEvent, + requestData: { + type: 'sign-message', + wcData: signData + } + } + }) + ) break } @@ -860,15 +733,21 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode console.log('✅ DECODING TX: DONE!') setLoading('') - setSessionRequestData({ - type: 'sign-unsigned-tx', - wcData: wcTxData, - unsignedTxData: decodedResult - }) - setSessionRequestEvent(requestEvent) - console.log('⏳ OPENING MODAL TO SIGN UNSIGNED TX...') - openWalletConnectSessionRequestModal() + + dispatch( + openModal({ + name: 'WalletConnectSessionRequestModal', + props: { + requestEvent, + requestData: { + type: 'sign-unsigned-tx', + wcData: wcTxData, + unsignedTxData: decodedResult + } + } + }) + ) break } @@ -924,14 +803,7 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode // The `addresses` dependency causes re-rendering when any property of an Address changes, even though we only need // the `hash` and the `publicKey`. Creating a selector that extracts those 3 doesn't help. // Using addressIds fixes the problem, but now the api/transactions.ts file becomes dependant on the store file. - [ - walletConnectClient, - respondToWalletConnectWithError, - addressIds, - openWalletConnectSessionRequestModal, - handleApiResponse, - t - ] + [addressIds, dispatch, handleApiResponse, respondToWalletConnectWithError, t, walletConnectClient] ) useEffect(() => { @@ -1025,7 +897,9 @@ export const WalletConnectContextProvider = ({ children }: { children: ReactNode activeSessions, refreshActiveSessions, resetWalletConnectClientInitializationAttempts, - resetWalletConnectStorage + resetWalletConnectStorage, + respondToWalletConnectWithError, + respondToWalletConnect }} > {children} diff --git a/apps/mobile-wallet/src/contexts/walletConnect/WalletConnectSessionRequestModal.tsx b/apps/mobile-wallet/src/contexts/walletConnect/WalletConnectSessionRequestModal.tsx index 79f62e4c5..5886d19cd 100644 --- a/apps/mobile-wallet/src/contexts/walletConnect/WalletConnectSessionRequestModal.tsx +++ b/apps/mobile-wallet/src/contexts/walletConnect/WalletConnectSessionRequestModal.tsx @@ -30,8 +30,8 @@ import { SignUnsignedTxResult, transactionSign } from '@alephium/web3' -import { SessionTypes } from '@walletconnect/types' -import { useEffect } from 'react' +import { getSdkError } from '@walletconnect/utils' +import { useState } from 'react' import { useTranslation } from 'react-i18next' import { Image } from 'react-native' import styled from 'styled-components/native' @@ -48,50 +48,44 @@ import ExpandableRow from '~/components/ExpandableRow' import { ModalScreenTitle, ScreenSection } from '~/components/layout/Screen' import Surface from '~/components/layout/Surface' import Row from '~/components/Row' +import SpinnerModal from '~/components/SpinnerModal' import { useWalletConnectContext } from '~/contexts/walletConnect/WalletConnectContext' +import useFundPasswordGuard from '~/features/fund-password/useFundPasswordGuard' import BottomModal from '~/features/modals/BottomModal' import { closeModal } from '~/features/modals/modalActions' import { ModalContent } from '~/features/modals/ModalContent' import { ModalBaseProp } from '~/features/modals/modalTypes' import withModal from '~/features/modals/withModal' import { useAppDispatch, useAppSelector } from '~/hooks/redux' +import { useBiometricsAuthGuard } from '~/hooks/useBiometrics' import { getAddressAsymetricKey } from '~/persistent-storage/wallet' import { selectAddressByHash } from '~/store/addressesSlice' import { transactionSent } from '~/store/transactions/transactionsActions' import { SessionRequestData } from '~/types/walletConnect' -import { showExceptionToast } from '~/utils/layout' +import { showExceptionToast, showToast } from '~/utils/layout' import { getTransactionAssetAmounts } from '~/utils/transactions' interface WalletConnectSessionRequestModalProps { requestData: T - onApprove: ( - sendTransaction: () => Promise< - SignTransferTxResult | SignExecuteScriptTxResult | SignDeployContractTxResult | undefined - > - ) => Promise - onReject: () => Promise - onSendTxOrSignFail: (error: WalletConnectError) => Promise - onSignSuccess: (result: SignMessageResult) => Promise - metadata?: SessionTypes.Struct['peer']['metadata'] - sessionRequestEvent?: SessionRequestEvent + requestEvent: SessionRequestEvent } const WalletConnectSessionRequestModal = withModal( ({ id, requestData, - onApprove, - onReject, - onSendTxOrSignFail, - onSignSuccess, - metadata, - sessionRequestEvent + requestEvent }: WalletConnectSessionRequestModalProps & ModalBaseProp) => { const dispatch = useAppDispatch() - const { walletConnectClient } = useWalletConnectContext() + const { walletConnectClient, respondToWalletConnect, respondToWalletConnectWithError, activeSessions } = + useWalletConnectContext() const signAddress = useAppSelector((s) => selectAddressByHash(s, requestData.wcData.fromAddress)) const { t } = useTranslation() + const { triggerBiometricsAuthGuard } = useBiometricsAuthGuard() + const { triggerFundPasswordAuthGuard } = useFundPasswordGuard() + const [loading, setLoading] = useState('') + const metadata = activeSessions.find((s) => s.topic === requestEvent?.topic)?.peer.metadata const isSignRequest = requestData.type === 'sign-message' || requestData.type === 'sign-unsigned-tx' const fees = !isSignRequest ? BigInt(requestData.unsignedTxData.gasAmount) * BigInt(requestData.unsignedTxData.gasPrice) @@ -100,17 +94,12 @@ const WalletConnectSessionRequestModal = withModal( const handleManualClose = () => { console.log('👉 CLOSING MODAL.') - if (sessionRequestEvent && walletConnectClient && walletConnectClient?.getPendingSessionRequests().length > 0) { + if (requestEvent && walletConnectClient && walletConnectClient?.getPendingSessionRequests().length > 0) { console.log('👉 USER CLOSED THE MODAL WITHOUT REJECTING/APPROVING SO WE NEED TO REJECT.') onReject() } } - // Close modal if the session request event becomes undefined - useEffect(() => { - if (sessionRequestEvent === undefined) dispatch(closeModal({ id })) - }, [dispatch, id, sessionRequestEvent]) - const handleApprovePress = () => onApprove(sendTransaction) const sendTransaction = async () => { @@ -271,132 +260,217 @@ const WalletConnectSessionRequestModal = withModal( } } + const onSignSuccess = async (result: SignMessageResult | SignUnsignedTxResult) => { + if (!requestEvent) return + + console.log('⏳ INFORMING DAPP THAT SESSION REQUEST SUCCEEDED...') + await respondToWalletConnect(requestEvent, { id: requestEvent.id, jsonrpc: '2.0', result }) + console.log('✅ INFORMING: DONE!') + + console.log('👉 RESETTING SESSION REQUEST EVENT.') + showToast({ text1: t('dApp request approved'), text2: t('You can go back to your browser.') }) + } + + const onReject = async () => { + try { + console.log('⏳ INFORMING DAPP THAT SESSION REQUEST FAILED...') + await respondToWalletConnectWithError(requestEvent, getSdkError('USER_REJECTED')) + console.log('✅ INFORMING: DONE!') + } catch (e) { + console.error('❌ INFORMING: FAILED.') + } finally { + showToast({ text1: t('dApp request rejected'), text2: t('You can go back to your browser.'), type: 'info' }) + dispatch(closeModal({ id })) + } + } + + const onSendTxOrSignFail = async (error: WalletConnectError) => { + try { + console.log('⏳ INFORMING DAPP THAT SESSION REQUEST FAILED...') + await respondToWalletConnectWithError(requestEvent, error) + console.log('✅ INFORMING: DONE!') + } catch (e) { + console.error('❌ INFORMING: FAILED.') + } finally { + dispatch(closeModal({ id })) + } + } + + const onApprove = async ( + sendTransaction: () => Promise< + SignExecuteScriptTxResult | SignDeployContractTxResult | SignTransferTxResult | undefined + > + ) => { + if (!requestEvent) return + + triggerBiometricsAuthGuard({ + settingsToCheck: 'transactions', + successCallback: () => + triggerFundPasswordAuthGuard({ + successCallback: async () => { + setLoading('Approving...') + + try { + const signResult = await sendTransaction() + + if (!signResult) { + console.log('⏳ DID NOT GET A SIGNATURE RESULT, INFORMING DAPP THAT SESSION REQUEST FAILED...') + await respondToWalletConnectWithError(requestEvent, { + message: 'Sending transaction failed', + code: WALLETCONNECT_ERRORS.TRANSACTION_SEND_FAILED + }) + console.log('✅ INFORMING: DONE!') + } else { + console.log('⏳ INFORMING DAPP THAT SESSION REQUEST SUCCEEDED...') + await respondToWalletConnect(requestEvent, { + id: requestEvent.id, + jsonrpc: '2.0', + result: signResult + }) + console.log('✅ INFORMING: DONE!') + } + } catch (e) { + console.error('❌ INFORMING: FAILED.') + } finally { + console.log('👉 RESETTING SESSION REQUEST EVENT.') + setLoading('') + showToast({ text1: t('dApp request approved'), text2: t('You can go back to your browser.') }) + dispatch(closeModal({ id })) + } + } + }) + }) + } + return ( - - - {metadata && ( - - {metadata.icons && metadata.icons.length > 0 && metadata.icons[0] && ( - - )} - - { + <> + + + {metadata && ( + + {metadata.icons && metadata.icons.length > 0 && metadata.icons[0] && ( + + )} + { - transfer: t('Transfer request'), - 'call-contract': t('Smart contract request'), - 'deploy-contract': t('Smart contract request'), - 'sign-message': t('Sign message'), - 'sign-unsigned-tx': t('Sign unsigned transaction') - }[requestData.type] - } - - {metadata.url && ( - - {t('from {{ url }}', { url: metadata.url })} - - )} - - )} - - - {(requestData.type === 'transfer' || requestData.type === 'call-contract') && - requestData.wcData.assetAmounts && - requestData.wcData.assetAmounts.length > 0 && ( - - - {requestData.wcData.assetAmounts.map(({ id, amount }) => - amount ? : null - )} - - + { + transfer: t('Transfer request'), + 'call-contract': t('Smart contract request'), + 'deploy-contract': t('Smart contract request'), + 'sign-message': t('Sign message'), + 'sign-unsigned-tx': t('Sign unsigned transaction') + }[requestData.type] + } + + {metadata.url && ( + + {t('from {{ url }}', { url: metadata.url })} + )} - - - + + )} + + + {(requestData.type === 'transfer' || requestData.type === 'call-contract') && + requestData.wcData.assetAmounts && + requestData.wcData.assetAmounts.length > 0 && ( + + + {requestData.wcData.assetAmounts.map(({ id, amount }) => + amount ? : null + )} + + + )} + + + - {requestData.type === 'deploy-contract' || requestData.type === 'call-contract' ? ( - metadata?.url && ( + {requestData.type === 'deploy-contract' || requestData.type === 'call-contract' ? ( + metadata?.url && ( + + {metadata.url} + + ) + ) : requestData.type === 'transfer' ? ( - {metadata.url} + - ) - ) : requestData.type === 'transfer' ? ( - - - - ) : null} - - {requestData.type === 'deploy-contract' && ( - <> - {!!requestData.wcData.initialAlphAmount?.amount && ( - - + ) : null} + + {requestData.type === 'deploy-contract' && ( + <> + {!!requestData.wcData.initialAlphAmount?.amount && ( + + + + )} + {requestData.wcData.issueTokenAmount && ( + + {requestData.wcData.issueTokenAmount} + + )} + + )} + + {(requestData.type === 'deploy-contract' || requestData.type === 'call-contract') && ( + + {t('Bytecode')} + + } + > + + {requestData.wcData.bytecode} - )} - {requestData.wcData.issueTokenAmount && ( - - {requestData.wcData.issueTokenAmount} + + )} + {requestData.type === 'sign-unsigned-tx' && ( + <> + + {requestData.unsignedTxData.unsignedTx.txId} - )} - - )} - - {(requestData.type === 'deploy-contract' || requestData.type === 'call-contract') && ( - - {t('Bytecode')} - - } - > - - {requestData.wcData.bytecode} - - - )} - {requestData.type === 'sign-unsigned-tx' && ( - <> - - {requestData.unsignedTxData.unsignedTx.txId} - - - {requestData.wcData.unsignedTx} + + {requestData.wcData.unsignedTx} + + + )} + {requestData.type === 'sign-message' && ( + + {requestData.wcData.message} - - )} - {requestData.type === 'sign-message' && ( - - {requestData.wcData.message} - - )} - - - {fees !== undefined && ( - - - - {t('Estimated fees')} - - - + )} + + + {fees !== undefined && ( + + + + {t('Estimated fees')} + + + + + )} + + +