diff --git a/src/App.tsx b/src/App.tsx index 321e454..95a0a82 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -11,6 +11,7 @@ import { } from '@react-navigation/native-stack'; import { getSdkError } from '@walletconnect/utils'; import { Web3WalletTypes } from '@walletconnect/web3wallet'; +import { formatJsonRpcResult } from '@json-rpc-tools/utils'; import PairingModal from './components/PairingModal'; import { useWalletConnect } from './context/WalletConnectContext'; @@ -28,6 +29,9 @@ import { getSignParamsMessage } from './utils/wallet-connect/Helpers'; import ApproveTransaction from './screens/ApproveTransaction'; import AddNetwork from './screens/AddNetwork'; import { COSMOS, EIP155 } from './utils/constants'; +import { retrieveNetworksData } from './utils/accounts'; +import { useNetworks } from './context/NetworksContext'; +import { NETWORK_METHODS } from './utils/wallet-connect/common-data'; const Stack = createNativeStackNavigator(); @@ -36,7 +40,8 @@ const App = (): React.JSX.Element => { useNavigation>(); const { setActiveSessions } = useWalletConnect(); - const { accounts } = useAccounts(); + const { accounts, setCurrentIndex } = useAccounts(); + const { networksData, selectedNetwork, setSelectedNetwork } = useNetworks(); const [modalVisible, setModalVisible] = useState(false); const [toastVisible, setToastVisible] = useState(false); const [currentProposal, setCurrentProposal] = useState< @@ -61,12 +66,44 @@ const App = (): React.JSX.Element => { const onSessionRequest = useCallback( async (requestEvent: Web3WalletTypes.SessionRequest) => { - const { topic, params } = requestEvent; + const { topic, params, id } = requestEvent; const { request } = params; const requestSessionData = web3wallet!.engine.signClient.session.get(topic); switch (request.method) { + case NETWORK_METHODS.GET_NETWORKS: + const retrievedNetworks = await retrieveNetworksData(); + const currentNetworkId = networksData.find( + networkData => networkData.networkId === selectedNetwork.networkId, + )?.networkId; + + const formattedResponse = formatJsonRpcResult(id, { + retrievedNetworks, + currentNetworkId, + }); + + await web3wallet!.respondSessionRequest({ + topic, + response: formattedResponse, + }); + break; + + case NETWORK_METHODS.CHANGE_NETWORK: + const network = request.params[0]; + setCurrentIndex(0); + setSelectedNetwork(network); + + const response = formatJsonRpcResult(id, { + response: 'true', + }); + + await web3wallet!.respondSessionRequest({ + topic, + response: response, + }); + break; + case EIP155_SIGNING_METHODS.ETH_SEND_TRANSACTION: navigation.navigate('ApproveTransaction', { transaction: request.params[0], @@ -83,8 +120,8 @@ const App = (): React.JSX.Element => { requestEvent, requestSessionData, }); - break; + case 'cosmos_signDirect': const message = { txbody: TxBody.toJSON( @@ -109,8 +146,8 @@ const App = (): React.JSX.Element => { requestEvent, requestSessionData, }); - break; + case 'cosmos_signAmino': navigation.navigate('SignRequest', { namespace: COSMOS, @@ -119,7 +156,6 @@ const App = (): React.JSX.Element => { requestEvent, requestSessionData, }); - break; case 'cosmos_sendTokens': @@ -128,14 +164,19 @@ const App = (): React.JSX.Element => { requestEvent, requestSessionData, }); - break; default: throw new Error('Invalid method'); } }, - [navigation], + [ + navigation, + networksData, + setSelectedNetwork, + setCurrentIndex, + selectedNetwork, + ], ); const onSessionDelete = useCallback(() => { diff --git a/src/components/Accounts.tsx b/src/components/Accounts.tsx index f6b6d05..506f95b 100644 --- a/src/components/Accounts.tsx +++ b/src/components/Accounts.tsx @@ -17,6 +17,7 @@ import { EIP155_SIGNING_METHODS } from '../utils/wallet-connect/EIP155Data'; import { COSMOS_METHODS } from '../utils/wallet-connect/COSMOSData'; import { useNetworks } from '../context/NetworksContext'; import { COSMOS, EIP155 } from '../utils/constants'; +import { NETWORK_METHODS } from '../utils/wallet-connect/common-data'; const Accounts = ({ currentIndex, updateIndex }: AccountsProps) => { const navigation = @@ -63,6 +64,7 @@ const Accounts = ({ currentIndex, updateIndex }: AccountsProps) => { // TODO: Debug optional namespace methods and events being required for approval methods: [ ...Object.values(EIP155_SIGNING_METHODS), + ...Object.values(NETWORK_METHODS), ...(combinedNamespaces.eip155?.methods ?? []), ], events: [...(combinedNamespaces.eip155?.events ?? [])], @@ -84,6 +86,7 @@ const Accounts = ({ currentIndex, updateIndex }: AccountsProps) => { chains: [namespaceChainId], methods: [ ...Object.values(COSMOS_METHODS), + ...Object.values(NETWORK_METHODS), ...(combinedNamespaces.cosmos?.methods ?? []), ], events: [...(combinedNamespaces.cosmos?.events ?? [])], diff --git a/src/components/NetworkDropdown.tsx b/src/components/NetworkDropdown.tsx index adabc58..c1a0a34 100644 --- a/src/components/NetworkDropdown.tsx +++ b/src/components/NetworkDropdown.tsx @@ -7,23 +7,20 @@ import styles from '../styles/stylesheet'; import { useNetworks } from '../context/NetworksContext'; const NetworkDropdown = ({ updateNetwork }: NetworkDropdownProps) => { - const { networksData } = useNetworks(); + const { networksData, selectedNetwork, setSelectedNetwork } = useNetworks(); const [expanded, setExpanded] = useState(false); - const [selectedNetwork, setSelectedNetwork] = useState( - networksData[0].networkName, - ); const handleNetworkPress = (networksData: NetworksDataState) => { updateNetwork(networksData); - setSelectedNetwork(networksData.networkName); + setSelectedNetwork(networksData); setExpanded(false); }; return ( setExpanded(!expanded)}> {networksData.map(networkData => ( diff --git a/src/components/PairingModal.tsx b/src/components/PairingModal.tsx index a0278c4..45daa41 100644 --- a/src/components/PairingModal.tsx +++ b/src/components/PairingModal.tsx @@ -15,6 +15,7 @@ import { EIP155_SIGNING_METHODS } from '../utils/wallet-connect/EIP155Data'; import { COSMOS_METHODS } from '../utils/wallet-connect/COSMOSData'; import { useNetworks } from '../context/NetworksContext'; import { COSMOS, EIP155 } from '../utils/constants'; +import { NETWORK_METHODS } from '../utils/wallet-connect/common-data'; const PairingModal = ({ visible, @@ -102,6 +103,7 @@ const PairingModal = ({ // TODO: Debug optional namespace methods and events being required for approval methods: [ ...Object.values(EIP155_SIGNING_METHODS), + ...Object.values(NETWORK_METHODS), ...(optionalNamespaces.eip155?.methods ?? []), ...(requiredNamespaces.eip155?.methods ?? []), ], @@ -126,6 +128,7 @@ const PairingModal = ({ chains: [namespaceChainId], methods: [ ...Object.values(COSMOS_METHODS), + ...Object.values(NETWORK_METHODS), ...(optionalNamespaces.cosmos?.methods ?? []), ...(requiredNamespaces.cosmos?.methods ?? []), ], diff --git a/src/context/NetworksContext.tsx b/src/context/NetworksContext.tsx index ceb60ca..75f28be 100644 --- a/src/context/NetworksContext.tsx +++ b/src/context/NetworksContext.tsx @@ -11,10 +11,8 @@ const NetworksContext = createContext<{ setNetworksData: React.Dispatch>; networkType: string; setNetworkType: (networkType: string) => void; - selectedNetwork?: NetworksDataState; - setSelectedNetwork: React.Dispatch< - React.SetStateAction - >; + selectedNetwork: NetworksDataState; + setSelectedNetwork: React.Dispatch>; }>({ currentIndex: 0, setCurrentIndex: () => {}, @@ -35,7 +33,9 @@ const NetworksProvider = ({ children }: { children: any }) => { const [networksData, setNetworksData] = useState([]); const [currentIndex, setCurrentIndex] = useState(0); const [networkType, setNetworkType] = useState(EIP155); - const [selectedNetwork, setSelectedNetwork] = useState(); + const [selectedNetwork, setSelectedNetwork] = useState( + {} as NetworksDataState, + ); useEffect(() => { const fetchData = async () => { @@ -47,7 +47,7 @@ const NetworksProvider = ({ children }: { children: any }) => { } const retrievedNewNetworks = await retrieveNetworksData(); setNetworksData(retrievedNewNetworks); - setSelectedNetwork(retrievedNetworks[0]); + setSelectedNetwork(retrievedNewNetworks[0]); }; fetchData(); diff --git a/src/utils/accounts.ts b/src/utils/accounts.ts index e0b7389..1f548cb 100644 --- a/src/utils/accounts.ts +++ b/src/utils/accounts.ts @@ -138,14 +138,13 @@ const storeNetworkData = async ( const updatedNetworks: NetworksDataState[] = [ ...retrievedNetworks, - { networkId: networkId, ...networkData }, + { ...networkData, networkId: String(networkId) }, ]; await setInternetCredentials( 'networks', '_', JSON.stringify(updatedNetworks), ); - return updatedNetworks; }; diff --git a/src/utils/wallet-connect/common-data.ts b/src/utils/wallet-connect/common-data.ts new file mode 100644 index 0000000..a44912e --- /dev/null +++ b/src/utils/wallet-connect/common-data.ts @@ -0,0 +1,4 @@ +export const NETWORK_METHODS = { + GET_NETWORKS: 'getNetworks', + CHANGE_NETWORK: 'changeNetwork', +};