\n
\n {\n handleSelectChainType(option);\n }}\n hasDeselectOption={false}\n />\n
\n\n {chainType === ChainType.MainNet && (\n
\n {\n \"You are using MainNet right now. Please be careful when you trying to send transactions.\"\n }\n
\n )}\n\n
\n {\"Pera Wallet\"} {\"Example dApp\"}\n
\n\n {!isConnectedToPeraWallet && (\n
\n
{\"Pera Connect Compact Mode: \"}
\n\n
\n
\n )}\n\n {accountInformationState.data && (\n
\n )}\n\n {isConnectedToPeraWallet && chainType === \"mainnet\" && (\n
\n )}\n\n
\n\n {isConnectedToPeraWallet && (\n
\n )}\n
\n );\n\n function handleCompactModeSwitch() {\n setConnectCompactMode(!isConnectCompactMode);\n\n localStorage.setItem(PERA_WALLET_LOCAL_STORAGE_KEYS.COMPACT_MODE, localStorage.getItem(PERA_WALLET_LOCAL_STORAGE_KEYS.COMPACT_MODE) === \"true\" ? \"false\" : \"true\");\n }\n\n function handleAddFunds() {\n if (accountAddress) {\n addFunds();\n\n peraOnRamp.on({\n OPT_IN_REQUEST: async ({accountAddress: addr, assetID}) => {\n try {\n const {transaction: txnsToSign} = await createAssetOptInTxn(\n chainType,\n addr,\n Number(assetID)\n );\n\n const transactions: SignerTransaction[] = txnsToSign.reduce(\n (acc, val) => acc.concat(val),\n []\n );\n\n const signedTxn = await peraWallet.signTransaction([transactions]);\n\n await clientForChain(chainType).sendRawTransaction(signedTxn).do();\n\n peraOnRamp.close();\n\n addFunds();\n } catch (error) {\n handleSetLog(`${error}`);\n }\n },\n ADD_FUNDS_COMPLETED: () => {\n handleSetLog(\"Add funds completed\");\n },\n ADD_FUNDS_FAILED: () => {\n handleSetLog(\"Add funds failed\");\n }\n });\n }\n }\n\n function addFunds() {\n if (accountAddress) {\n peraOnRamp\n .addFunds({\n accountAddress\n })\n .then(() => {\n handleSetLog(\"Funds added\");\n })\n .catch((e) => {\n handleSetLog(`${e}`);\n });\n }\n }\n\n async function handleConnectWalletClick() {\n try {\n const newAccounts = await peraWallet.connect();\n \n handleSetLog(\"Connected to Pera Wallet\");\n \n setAccountAddress(newAccounts[0]);\n } catch (e) {\n console.log(e);\n handleSetLog(`${e}`);\n }\n }\n\n function handleDisconnectWalletClick() {\n peraWallet.disconnect();\n\n setAccountAddress(null);\n }\n\n function handleSetLog(log: string) {\n displayToast({\n timeout: 10000,\n render() {\n return