diff --git a/src/components/PairingModal.tsx b/src/components/PairingModal.tsx index bb24f9e..06ebbc5 100644 --- a/src/components/PairingModal.tsx +++ b/src/components/PairingModal.tsx @@ -11,7 +11,7 @@ import { web3wallet } from '../utils/wallet-connect/WalletConnectUtils'; import { useAccounts } from '../context/AccountsContext'; import { useWalletConnect } from '../context/WalletConnectContext'; import { EIP155_CHAINS } from '../utils/wallet-connect/EIP155Data'; -import { COSMOS_MAINNET_CHAINS } from '../utils/wallet-connect/COSMOSData'; +import { COSMOS_CHAINS } from '../utils/wallet-connect/COSMOSData'; const PairingModal = ({ visible, @@ -21,7 +21,9 @@ const PairingModal = ({ setToastVisible, }: PairingModalProps) => { const { accounts, currentIndex } = useAccounts(); + const [isLoading, setIsLoading] = useState(false); + const dappName = currentProposal?.params?.proposer?.metadata.name; const url = currentProposal?.params?.proposer?.metadata.url; const icon = currentProposal?.params.proposer?.metadata.icons[0]; @@ -80,7 +82,7 @@ const PairingModal = ({ const eip155Chains = Object.keys(EIP155_CHAINS); // cosmos - const cosmosChains = Object.keys(COSMOS_MAINNET_CHAINS); + const cosmosChains = Object.keys(COSMOS_CHAINS); // Set selected account as the first account in supported namespaces const sortedAccounts = Object.entries(accounts).reduce( @@ -160,6 +162,7 @@ const PairingModal = ({ const handleAccept = async () => { try { if (currentProposal && namespaces) { + setIsLoading(true); const { id } = currentProposal; await web3wallet!.approveSession({ @@ -168,6 +171,7 @@ const PairingModal = ({ }); const sessions = web3wallet!.getActiveSessions(); + setIsLoading(false); setActiveSessions(sessions); setModalVisible(false); setToastVisible(true); @@ -186,12 +190,14 @@ const PairingModal = ({ const handleReject = async () => { if (currentProposal) { + setIsLoading(true); const { id } = currentProposal; await web3wallet!.rejectSession({ id, reason: getSdkError('USER_REJECTED_METHODS'), }); + setIsLoading(false); setModalVisible(false); setCurrentProposal(undefined); setWalletConnectData({ @@ -215,11 +221,16 @@ const PairingModal = ({ /> )} + {dappName} {url} Connect to this site? - Chains: {walletConnectData.walletConnectChains} - + Chains: + {walletConnectData.walletConnectChains.map(chain => ( + + {chain} + + ))} Methods Requested: {walletConnectData.walletConnectMethods.map(method => ( @@ -237,18 +248,18 @@ const PairingModal = ({ ))} - - - - - - + + + + + + diff --git a/src/screens/SignRequest.tsx b/src/screens/SignRequest.tsx index 3286eb6..5fe8ad5 100644 --- a/src/screens/SignRequest.tsx +++ b/src/screens/SignRequest.tsx @@ -128,7 +128,8 @@ const SignRequest = ({ route }: SignRequestProps) => { }, [retrieveData, sanitizePath, route]); const handleWalletConnectRequest = async () => { - const { requestEvent } = route.params; + setIsLoading(true) + const { requestEvent } = route.params || {}; if (!account) { throw new Error('account not found'); @@ -147,6 +148,7 @@ const SignRequest = ({ route }: SignRequestProps) => { const { topic } = requestEvent; await web3wallet!.respondSessionRequest({ topic, response }); + setIsLoading(false) }; const handleIntent = async () => { @@ -174,13 +176,15 @@ const SignRequest = ({ route }: SignRequestProps) => { }; const rejectRequestHandler = async () => { - if (route.params.requestEvent) { - const response = rejectWalletConnectRequest(route.params.requestEvent); - const { topic } = route.params.requestEvent; + if (route.params?.requestEvent) { + setIsLoading(true); + const response = rejectWalletConnectRequest(route.params?.requestEvent); + const { topic } = route.params?.requestEvent; await web3wallet!.respondSessionRequest({ topic, response, }); + setIsLoading(true); } navigation.navigate('Laconic'); }; diff --git a/src/styles/stylesheet.js b/src/styles/stylesheet.js index 0c56df5..47c387f 100644 --- a/src/styles/stylesheet.js +++ b/src/styles/stylesheet.js @@ -137,6 +137,8 @@ const styles = StyleSheet.create({ buttonContainer: { flexDirection: 'row', marginLeft: 20, + marginTop: 20, + marginBottom: 20, justifyContent: 'space-evenly', }, badRequestContainer: { @@ -155,6 +157,7 @@ const styles = StyleSheet.create({ alignItems: 'center', justifyContent: 'center', marginBottom: 10, + paddingHorizontal: 20, }, modalContentContainer: { display: 'flex', @@ -186,6 +189,7 @@ const styles = StyleSheet.create({ alignItems: 'center', marginTop: 20, paddingHorizontal: 16, + marginBottom: 10, }, marginVertical8: { marginVertical: 8,