feat: just works (#261)

* feat: implements just works in example dapp

* feat: implements just works in example wallet

* feat: adds toast on app pairing attempt

* chore: updates canary

* refactor: resets app only after successful disconnect

* chore: updates wallet canary

* fix: modal state

* chore: updates canary to rc

* fix: session update & session events

* fix: fixes accounts changed and updates canary

* chore: updates dapp canary

* chore: updates examples to latest

---------

Co-authored-by: Gancho Radkov <ganchoradkov@gmail.com>

dapps/react-dapp-v2/package.json

@@ -3,7 +3,7 @@
   "version": "2.3.3",
   "private": true,
   "scripts": {
-    "dev": "next dev",
+    "dev": "next dev -p 3000",
     "build": "next build",
     "start": "next start",
     "lint": "next lint",
@@ -20,9 +20,9 @@
     "@polkadot/util-crypto": "^10.1.2",
     "@solana/web3.js": "^1.36.0",
     "@walletconnect/encoding": "^1.0.1",
-    "@walletconnect/sign-client": "2.9.1",
+    "@walletconnect/sign-client": "2.10.0",
-    "@walletconnect/types": "2.9.1",
+    "@walletconnect/types": "2.10.0",
-    "@walletconnect/utils": "2.9.1",
+    "@walletconnect/utils": "2.10.0",
     "@web3modal/standalone": "2.4.3",
     "axios": "^0.21.1",
     "blockies-ts": "^1.0.0",
@@ -37,6 +37,7 @@
     "qr-image": "^3.2.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
+    "react-hot-toast": "^2.4.1",
     "react-scripts": "^4.0.3",
     "solana-wallet": "^1.0.1",
     "styled-components": "^5.2.0",

dapps/react-dapp-v2/src/contexts/ClientContext.tsx

@@ -1,6 +1,8 @@
 import Client from "@walletconnect/sign-client";
 import { PairingTypes, SessionTypes } from "@walletconnect/types";
 import { Web3Modal } from "@web3modal/standalone";
+import { RELAYER_EVENTS } from "@walletconnect/core";
+import toast from "react-hot-toast";
 
 import { PublicKey } from "@solana/web3.js";
 import {
@@ -155,7 +157,6 @@ export function ClientContextProvider({
           "optionalNamespaces config for connect:",
           optionalNamespaces
         );
-
         const { uri, approval } = await client.connect({
           pairingTopic: pairing?.topic,
           requiredNamespaces,
@@ -179,6 +180,9 @@ export function ClientContextProvider({
         setPairings(client.pairing.getAll({ active: true }));
       } catch (e) {
         console.error(e);
+        toast.error((e as Error).message, {
+          position: "bottom-left",
+        });
         // ignore rejection
       } finally {
         // close modal in case it was open
@@ -202,11 +206,13 @@ export function ClientContextProvider({
         reason: getSdkError("USER_DISCONNECTED"),
       });
     } catch (error) {
-      console.error("SignClient.disconnect failed:", error);
+      toast.error((error as Error).message, {
-    } finally {
+        position: "bottom-left",
+      });
+      return;
+    }
     // Reset app state after disconnect.
     reset();
-    }
   }, [client, session]);
 
   const _subscribeToEvents = useCallback(
@@ -323,12 +329,30 @@ export function ClientContextProvider({
   useEffect(() => {
     if (!client) {
       createClient();
-    } else if (prevRelayerValue.current !== relayerRegion) {
+    } else if (
+      prevRelayerValue.current &&
+      prevRelayerValue.current !== relayerRegion
+    ) {
       client.core.relayer.restartTransport(relayerRegion);
       prevRelayerValue.current = relayerRegion;
     }
   }, [createClient, relayerRegion, client]);
 
+  useEffect(() => {
+    if (!client) return;
+    client.core.relayer.on(RELAYER_EVENTS.connect, () => {
+      toast.success("Network connection is restored!", {
+        position: "bottom-left",
+      });
+    });
+
+    client.core.relayer.on(RELAYER_EVENTS.disconnect, () => {
+      toast.error("Network connection lost.", {
+        position: "bottom-left",
+      });
+    });
+  }, [client]);
+
   const value = useMemo(
     () => ({
       pairings,

dapps/react-dapp-v2/src/pages/_app.tsx

@@ -1,6 +1,7 @@
 import "../styles/globals.css";
 import type { AppProps } from "next/app";
 import { createGlobalStyle } from "styled-components";
+import { Toaster } from "react-hot-toast";
 
 import { ClientContextProvider } from "../contexts/ClientContext";
 import { JsonRpcContextProvider } from "../contexts/JsonRpcContext";
@@ -15,6 +16,7 @@ const GlobalStyle = createGlobalStyle`
 function MyApp({ Component, pageProps }: AppProps) {
   return (
     <>
+      <Toaster />
       <Metadata />
       <GlobalStyle />
       <ChainDataContextProvider>

dapps/react-dapp-v2/yarn.lock

@@ -3414,6 +3414,28 @@
     "@typescript-eslint/types" "5.59.7"
     eslint-visitor-keys "^3.3.0"
 
+"@walletconnect/core@2.10.0":
+  version "2.10.0"
+  resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-2.10.0.tgz#b659de4dfb374becd938964abd4f2150d410e617"
+  integrity sha512-Z8pdorfIMueuiBXLdnf7yloiO9JIiobuxN3j0OTal+MYc4q5/2O7d+jdD1DAXbLi1taJx3x60UXT/FPVkjIqIQ==
+  dependencies:
+    "@walletconnect/heartbeat" "1.2.1"
+    "@walletconnect/jsonrpc-provider" "1.0.13"
+    "@walletconnect/jsonrpc-types" "1.0.3"
+    "@walletconnect/jsonrpc-utils" "1.0.8"
+    "@walletconnect/jsonrpc-ws-connection" "1.0.13"
+    "@walletconnect/keyvaluestorage" "^1.0.2"
+    "@walletconnect/logger" "^2.0.1"
+    "@walletconnect/relay-api" "^1.0.9"
+    "@walletconnect/relay-auth" "^1.0.4"
+    "@walletconnect/safe-json" "^1.0.2"
+    "@walletconnect/time" "^1.0.2"
+    "@walletconnect/types" "2.10.0"
+    "@walletconnect/utils" "2.10.0"
+    events "^3.3.0"
+    lodash.isequal "4.5.0"
+    uint8arrays "^3.1.0"
+
 "@walletconnect/core@2.8.6":
   version "2.8.6"
   resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-2.8.6.tgz#1db6acae36437dbe7357be7767f1faeda5d4ca6c"
@@ -3436,28 +3458,6 @@
     lodash.isequal "4.5.0"
     uint8arrays "^3.1.0"
 
-"@walletconnect/core@2.9.1":
-  version "2.9.1"
-  resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-2.9.1.tgz#1a333933750f5f933d9b7788a8dae44ce1173063"
-  integrity sha512-xyWeP0eLhEEDQAVJSmqs4n/AClKUM+8os2ZFe7BTuw1tFYjeLNVDtKCHziVOSTh8wEChMsKSGKA4zerQoH8mAQ==
-  dependencies:
-    "@walletconnect/heartbeat" "1.2.1"
-    "@walletconnect/jsonrpc-provider" "1.0.13"
-    "@walletconnect/jsonrpc-types" "1.0.3"
-    "@walletconnect/jsonrpc-utils" "1.0.8"
-    "@walletconnect/jsonrpc-ws-connection" "1.0.13"
-    "@walletconnect/keyvaluestorage" "^1.0.2"
-    "@walletconnect/logger" "^2.0.1"
-    "@walletconnect/relay-api" "^1.0.9"
-    "@walletconnect/relay-auth" "^1.0.4"
-    "@walletconnect/safe-json" "^1.0.2"
-    "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.9.1"
-    "@walletconnect/utils" "2.9.1"
-    events "^3.3.0"
-    lodash.isequal "4.5.0"
-    uint8arrays "^3.1.0"
-
 "@walletconnect/encoding@^1.0.1":
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/@walletconnect/encoding/-/encoding-1.0.2.tgz#cb3942ad038d6a6bf01158f66773062dd25724da"
@@ -3571,19 +3571,19 @@
   dependencies:
     tslib "1.14.1"
 
-"@walletconnect/sign-client@2.9.1":
+"@walletconnect/sign-client@2.10.0":
-  version "2.9.1"
+  version "2.10.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/sign-client/-/sign-client-2.9.1.tgz#e4aa9c7b15849f450fdd1b03754a7517cb5c8811"
+  resolved "https://registry.yarnpkg.com/@walletconnect/sign-client/-/sign-client-2.10.0.tgz#0fee8f12821e37783099f0c7bd64e6efdfbd9d86"
-  integrity sha512-Z7tFRrJ9btA1vU427vsjUS6cPlHQVcTWdKH90khEc2lv3dB6mU8FNO0VJsw+I2D7CW7WaMWF3nnj6Z1FfotbDg==
+  integrity sha512-hbDljDS53kR/It3oXD91UkcOsT6diNnW5+Zzksm0YEfwww5dop/YfNlcdnc8+jKUhWOL/YDPNQCjzsCSNlVzbw==
   dependencies:
-    "@walletconnect/core" "2.9.1"
+    "@walletconnect/core" "2.10.0"
     "@walletconnect/events" "^1.0.1"
     "@walletconnect/heartbeat" "1.2.1"
     "@walletconnect/jsonrpc-utils" "1.0.8"
     "@walletconnect/logger" "^2.0.1"
     "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.9.1"
+    "@walletconnect/types" "2.10.0"
-    "@walletconnect/utils" "2.9.1"
+    "@walletconnect/utils" "2.10.0"
     events "^3.3.0"
 
 "@walletconnect/sign-client@~2.8.1":
@@ -3608,6 +3608,18 @@
   dependencies:
     tslib "1.14.1"
 
+"@walletconnect/types@2.10.0":
+  version "2.10.0"
+  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-2.10.0.tgz#5d63235b49e03d609521402a4b49627dbc4ed514"
+  integrity sha512-kSTA/WZnbKdEbvbXSW16Ty6dOSzOZCHnGg6JH7q1MuraalD2HuNg00lVVu7QAZ/Rj1Gn9DAkrgP5Wd5a8Xq//Q==
+  dependencies:
+    "@walletconnect/events" "^1.0.1"
+    "@walletconnect/heartbeat" "1.2.1"
+    "@walletconnect/jsonrpc-types" "1.0.3"
+    "@walletconnect/keyvaluestorage" "^1.0.2"
+    "@walletconnect/logger" "^2.0.1"
+    events "^3.3.0"
+
 "@walletconnect/types@2.8.6", "@walletconnect/types@~2.8.1":
   version "2.8.6"
   resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-2.8.6.tgz#71426144db3fa693170a95f89f5d6e594ab2d901"
@@ -3620,17 +3632,25 @@
     "@walletconnect/logger" "^2.0.1"
     events "^3.3.0"
 
-"@walletconnect/types@2.9.1":
+"@walletconnect/utils@2.10.0":
-  version "2.9.1"
+  version "2.10.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-2.9.1.tgz#cb32ff396cc8880a7395f28716d1e82f407e1372"
+  resolved "https://registry.yarnpkg.com/@walletconnect/utils/-/utils-2.10.0.tgz#6918d12180d797b8bd4a19fb2ff128e394e181d6"
-  integrity sha512-xbGgTPuD6xsb7YMvCESBIH55cjB86QAnnVL50a/ED42YkQzDsOdJ0VGTbrm0tG5cxUOF933rpxZQjxGdP+ovww==
+  integrity sha512-9GRyEz/7CJW+G04RvrjPET5k7hOEsB9b3fF9cWDk/iDCxSWpbkU/hv/urRB36C+gvQMAZgIZYX3dHfzJWkY/2g==
   dependencies:
-    "@walletconnect/events" "^1.0.1"
+    "@stablelib/chacha20poly1305" "1.0.1"
-    "@walletconnect/heartbeat" "1.2.1"
+    "@stablelib/hkdf" "1.0.1"
-    "@walletconnect/jsonrpc-types" "1.0.3"
+    "@stablelib/random" "^1.0.2"
-    "@walletconnect/keyvaluestorage" "^1.0.2"
+    "@stablelib/sha256" "1.0.1"
-    "@walletconnect/logger" "^2.0.1"
+    "@stablelib/x25519" "^1.0.3"
-    events "^3.3.0"
+    "@walletconnect/relay-api" "^1.0.9"
+    "@walletconnect/safe-json" "^1.0.2"
+    "@walletconnect/time" "^1.0.2"
+    "@walletconnect/types" "2.10.0"
+    "@walletconnect/window-getters" "^1.0.1"
+    "@walletconnect/window-metadata" "^1.0.1"
+    detect-browser "5.3.0"
+    query-string "7.1.3"
+    uint8arrays "^3.1.0"
 
 "@walletconnect/utils@2.8.6":
   version "2.8.6"
@@ -3652,26 +3672,6 @@
     query-string "7.1.3"
     uint8arrays "^3.1.0"
 
-"@walletconnect/utils@2.9.1":
-  version "2.9.1"
-  resolved "https://registry.yarnpkg.com/@walletconnect/utils/-/utils-2.9.1.tgz#92abc24b3af3ead42a3864e019dbf2f651ab2e47"
-  integrity sha512-tXeQVebF5oPBvhdmuUyVSkSIBYx/egIi4czav1QrnUpwrUS1LsrFhyWBxSbhN7TXY287ULWkEf6aFpWOHdp5EA==
-  dependencies:
-    "@stablelib/chacha20poly1305" "1.0.1"
-    "@stablelib/hkdf" "1.0.1"
-    "@stablelib/random" "^1.0.2"
-    "@stablelib/sha256" "1.0.1"
-    "@stablelib/x25519" "^1.0.3"
-    "@walletconnect/relay-api" "^1.0.9"
-    "@walletconnect/safe-json" "^1.0.2"
-    "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.9.1"
-    "@walletconnect/window-getters" "^1.0.1"
-    "@walletconnect/window-metadata" "^1.0.1"
-    detect-browser "5.3.0"
-    query-string "7.1.3"
-    uint8arrays "^3.1.0"
-
 "@walletconnect/window-getters@^1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@walletconnect/window-getters/-/window-getters-1.0.1.tgz#f36d1c72558a7f6b87ecc4451fc8bd44f63cbbdc"
@@ -7764,6 +7764,11 @@ globby@^6.1.0:
     pify "^2.0.0"
     pinkie-promise "^2.0.0"
 
+goober@^2.1.10:
+  version "2.1.13"
+  resolved "https://registry.yarnpkg.com/goober/-/goober-2.1.13.tgz#e3c06d5578486212a76c9eba860cbc3232ff6d7c"
+  integrity sha512-jFj3BQeleOoy7t93E9rZ2de+ScC4lQICLwiAQmKMg9F6roKGaLSHoCDYKkWlSafg138jejvq/mTdvmnwDQgqoQ==
+
 gopd@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c"
@@ -11991,6 +11996,13 @@ react-error-overlay@^6.0.9:
   resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.11.tgz#92835de5841c5cf08ba00ddd2d677b6d17ff9adb"
   integrity sha512-/6UZ2qgEyH2aqzYZgQPxEnz33NJ2gNsnHA2o5+o4wW9bLM/JYQitNP9xPhsXwC08hMMovfGe/8retsdDsczPRg==
 
+react-hot-toast@^2.4.1:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/react-hot-toast/-/react-hot-toast-2.4.1.tgz#df04295eda8a7b12c4f968e54a61c8d36f4c0994"
+  integrity sha512-j8z+cQbWIM5LY37pR6uZR6D4LfseplqnuAO4co4u8917hBUvXlEqyP1ZzqVLcqoyUesZZv/ImreoCeHVDpE5pQ==
+  dependencies:
+    goober "^2.1.10"
+
 react-is@^16.13.1, react-is@^16.7.0:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"

wallets/react-wallet-v2/package.json

@@ -24,8 +24,8 @@
     "@solana/web3.js": "1.43.0",
     "@taquito/signer": "^15.1.0",
     "@taquito/taquito": "^15.1.0",
-    "@walletconnect/sign-client": "2.9.1",
+    "@walletconnect/sign-client": "2.10.0",
-    "@walletconnect/utils": "2.9.1",
+    "@walletconnect/utils": "2.10.0",
     "bs58": "5.0.0",
     "cosmos-wallet": "1.2.0",
     "ethers": "5.6.6",
@@ -36,6 +36,7 @@
     "react": "17.0.2",
     "react-code-blocks": "0.0.9-0",
     "react-dom": "17.0.2",
+    "react-hot-toast": "^2.4.1",
     "react-qr-reader-es6": "2.2.1-2",
     "solana-wallet": "^1.0.2",
     "tronweb": "^4.4.0",
@@ -44,7 +45,7 @@
   "devDependencies": {
     "@types/node": "17.0.35",
     "@types/react": "18.0.9",
-    "@walletconnect/types": "2.9.0",
+    "@walletconnect/types": "2.10.0",
     "eslint": "8.15.0",
     "eslint-config-next": "12.1.6",
     "eslint-config-prettier": "8.5.0",

wallets/react-wallet-v2/src/components/AccountCard.tsx

@@ -16,7 +16,7 @@ interface Props {
   chainId: string
 }
 
-export default function AccountCard({ name, logo, rgb, address, chainId }: Props) {
+export default function AccountCard({ name, logo, rgb, address = '', chainId }: Props) {
   const [copied, setCopied] = useState(false)
   const { activeChainId, account } = useSnapshot(SettingsStore.state)
   function onCopy() {
@@ -38,7 +38,7 @@ export default function AccountCard({ name, logo, rgb, address, chainId }: Props
           {name}
         </Text>
         <Text weight="light" size={13} css={{ marginLeft: '$9' }}>
-          {truncate(address, 19)}
+          {address ? truncate(address, 19) : '<no address available>'}
         </Text>
       </div>
 

wallets/react-wallet-v2/src/components/AccountPicker.tsx

@@ -14,6 +14,7 @@ export default function AccountPicker() {
 
   function onSelect(value: string) {
     const account = Number(value)
+    console.log('account', account)
     SettingsStore.setAccount(account)
     SettingsStore.setEIP155Address(eip155Addresses[account])
     SettingsStore.setCosmosAddress(cosmosAddresses[account])
@@ -26,7 +27,12 @@ export default function AccountPicker() {
   }
 
   return (
-    <select value={account} onChange={e => onSelect(e.currentTarget.value)} aria-label="addresses" data-testid="account-picker">
+    <select
+      value={account}
+      onChange={e => onSelect(e.currentTarget.value)}
+      aria-label="addresses"
+      data-testid="account-picker"
+    >
       <option value={0}>Account 1</option>
       <option value={1}>Account 2</option>
     </select>

wallets/react-wallet-v2/src/components/Modal.tsx

@@ -14,12 +14,24 @@ import SessionSignTypedDataModal from '@/views/SessionSignTypedDataModal'
 import SessionUnsuportedMethodModal from '@/views/SessionUnsuportedMethodModal'
 import { Modal as NextModal } from '@nextui-org/react'
 import { useSnapshot } from 'valtio'
+import { useCallback } from 'react'
 
 export default function Modal() {
   const { open, view } = useSnapshot(ModalStore.state)
+  // handle the modal being closed by click outside
+  const onClose = useCallback(() => {
+    if (open) {
+      ModalStore.close()
+    }
+  }, [open])
 
   return (
-    <NextModal blur open={open} style={{ border: '1px solid rgba(139, 139, 139, 0.4)' }}>
+    <NextModal
+      blur
+      onClose={onClose}
+      open={open}
+      style={{ border: '1px solid rgba(139, 139, 139, 0.4)' }}
+    >
       {view === 'SessionProposalModal' && <SessionProposalModal />}
       {view === 'SessionSignModal' && <SessionRequestModal />}
       {view === 'SessionSignTypedDataModal' && <SessionSignTypedDataModal />}

wallets/react-wallet-v2/src/pages/_app.tsx

@@ -1,10 +1,16 @@
+import { Toaster } from 'react-hot-toast'
+import { useEffect } from 'react'
+import { createTheme, NextUIProvider } from '@nextui-org/react'
+
 import Layout from '@/components/Layout'
 import Modal from '@/components/Modal'
 import useInitialization from '@/hooks/useInitialization'
 import useWalletConnectEventsManager from '@/hooks/useWalletConnectEventsManager'
-import { createTheme, NextUIProvider } from '@nextui-org/react'
+import { signClient } from '@/utils/WalletConnectUtil'
+import { RELAYER_EVENTS } from '@walletconnect/core'
 import { AppProps } from 'next/app'
 import '../../public/main.css'
+import { styledToast } from '@/utils/HelperUtil'
 
 export default function App({ Component, pageProps }: AppProps) {
   // Step 1 - Initialize wallets and wallet connect client
@@ -12,10 +18,20 @@ export default function App({ Component, pageProps }: AppProps) {
 
   // Step 2 - Once initialized, set up wallet connect event manager
   useWalletConnectEventsManager(initialized)
+  useEffect(() => {
+    if (!initialized) return
+    signClient.core.relayer.on(RELAYER_EVENTS.connect, () => {
+      styledToast('Network connection is restored!', 'success')
+    })
 
+    signClient.core.relayer.on(RELAYER_EVENTS.disconnect, () => {
+      styledToast('Network connection lost.', 'error')
+    })
+  }, [initialized])
   return (
     <NextUIProvider theme={createTheme({ type: 'dark' })}>
       <Layout initialized={initialized}>
+        <Toaster />
         <Component {...pageProps} />
       </Layout>
 

wallets/react-wallet-v2/src/pages/walletconnect.tsx

@@ -4,6 +4,7 @@ import QrReader from '@/components/QrReader'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Input, Loading, Text } from '@nextui-org/react'
 import { Fragment, useState } from 'react'
+import { styledToast } from '@/utils/HelperUtil'
 
 export default function WalletConnectPage() {
   const [uri, setUri] = useState('')
@@ -13,8 +14,8 @@ export default function WalletConnectPage() {
     try {
       setLoading(true)
       await signClient.pair({ uri })
-    } catch (err: unknown) {
+    } catch (error) {
-      alert(err)
+      styledToast((error as Error).message, 'error')
     } finally {
       setUri('')
       setLoading(false)

wallets/react-wallet-v2/src/utils/HelperUtil.ts

@@ -1,3 +1,4 @@
+import toast from 'react-hot-toast'
 import { COSMOS_MAINNET_CHAINS, TCosmosChain } from '@/data/COSMOSData'
 import { EIP155_CHAINS, TEIP155Chain } from '@/data/EIP155Data'
 import { MULTIVERSX_CHAINS, TMultiversxChain } from '@/data/MultiversxData'
@@ -173,3 +174,25 @@ export function getVerifyStatus(context?: Verify.Context) {
       return '❓ Unknown'
   }
 }
+
+export function styledToast(message: string, type: string) {
+  if (type === 'success') {
+    toast.success(message, {
+      position: 'bottom-left',
+      style: {
+        borderRadius: '10px',
+        background: '#333',
+        color: '#fff'
+      }
+    })
+  } else if (type === 'error') {
+    toast.error(message, {
+      position: 'bottom-left',
+      style: {
+        borderRadius: '10px',
+        background: '#333',
+        color: '#fff'
+      }
+    })
+  }
+}

wallets/react-wallet-v2/src/utils/WalletConnectUtil.ts

@@ -24,48 +24,49 @@ export async function createSignClient(relayerRegionURL: string) {
 }
 
 export async function updateSignClientChainId(chainId: string, address: string) {
+  console.log('chainId', chainId, address)
   // get most recent session
-  const session = signClient.session.getAll()[0]
+  const sessions = signClient.session.getAll()
-  if (!session) return
+  if (!sessions) return
-
+  const namespace = chainId.split(':')[0]
-  // if chainId does not exist in session, an update is required first
+  sessions.forEach(async session => {
-  if (!session.namespaces[chainId]) {
-    const newNamespace = {
-      [chainId]: {
-        accounts: [`${chainId}:${address}`],
-        methods: [
-          'eth_sendTransaction',
-          'eth_signTransaction',
-          'eth_sign',
-          'personal_sign',
-          'eth_signTypedData'
-        ],
-        events: ['chainChanged', 'accountsChanged']
-      }
-    }
-    try {
-      // need to wait for update to finish before emit
     await signClient.update({
       topic: session.topic,
-        namespaces: { ...session.namespaces, ...newNamespace }
+      namespaces: {
+        ...session.namespaces,
+        [namespace]: {
+          ...session.namespaces[namespace],
+          chains: [
+            ...new Set([chainId].concat(Array.from(session.namespaces[namespace].chains || [])))
+          ],
+          accounts: [
+            ...new Set(
+              [`${chainId}:${address}`].concat(Array.from(session.namespaces[namespace].accounts))
+            )
+          ]
+        }
+      }
     })
-    } catch (err: unknown) {
+    await new Promise(resolve => setTimeout(resolve, 1000))
-      console.error(`Failed to update session: ${err}`)
-    }
-  }
 
-  const payload = {
+    const chainChanged = {
       topic: session.topic,
       event: {
         name: 'chainChanged',
-      data: [address]
+        data: parseInt(chainId.split(':')[1])
+      },
+      chainId: chainId
+    }
+
+    const accountsChanged = {
+      topic: session.topic,
+      event: {
+        name: 'accountsChanged',
+        data: [`${chainId}:${address}`]
       },
       chainId
     }
-
+    await signClient.emit(chainChanged)
-  try {
+    await signClient.emit(accountsChanged)
-    signClient.emit(payload)
+  })
-  } catch (err: unknown) {
-    console.error(`Failed to emit chainChanged event: ${err}`)
-  }
 }

wallets/react-wallet-v2/src/views/SessionProposalModal.tsx

@@ -18,7 +18,8 @@ import {
   isMultiversxChain,
   isTronChain,
   isTezosChain,
-  isKadenaChain
+  isKadenaChain,
+  styledToast
 } from '@/utils/HelperUtil'
 import { solanaAddresses } from '@/utils/SolanaWalletUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
@@ -109,11 +110,16 @@ export default function SessionProposalModal() {
 
       console.log('approving namespaces:', namespaces)
 
+      try {
         await signClient.approve({
           id,
           relayProtocol: relays[0].protocol,
           namespaces
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
     }
     ModalStore.close()
   }
@@ -121,10 +127,15 @@ export default function SessionProposalModal() {
   // Hanlde reject action
   async function onReject() {
     if (proposal) {
+      try {
         await signClient.reject({
           id,
           reason: getSdkError('USER_REJECTED_METHODS')
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
     }
     ModalStore.close()
   }
@@ -227,7 +238,7 @@ export default function SessionProposalModal() {
   return (
     <Fragment>
       <RequestModalContainer title="Session Proposal">
-        <ProjectInfoCard metadata={proposer.metadata}/>
+        <ProjectInfoCard metadata={proposer.metadata} />
 
         <Divider y={2} />
         {Object.keys(requiredNamespaces).length != 0 ? <Text h4>Required Namespaces</Text> : null}
@@ -235,7 +246,10 @@ export default function SessionProposalModal() {
           return (
             <Fragment key={chain}>
               <Text css={{ marginBottom: '$5' }}>{`Review ${chain} permissions`}</Text>
-              <SessionProposalChainCard requiredNamespace={requiredNamespaces[chain]} data-testid={`session-proposal-card-req-${chain}`}/>
+              <SessionProposalChainCard
+                requiredNamespace={requiredNamespaces[chain]}
+                data-testid={`session-proposal-card-req-${chain}`}
+              />
               {renderAccountSelection(`required:${chain}`, true)}
               <Divider y={2} />
             </Fragment>
@@ -250,7 +264,10 @@ export default function SessionProposalModal() {
             return (
               <Fragment key={chain}>
                 <Text css={{ marginBottom: '$5' }}>{`Review ${chain} permissions`}</Text>
-                <SessionProposalChainCard requiredNamespace={optionalNamespaces[chain]} data-testid={`session-proposal-card-opt-${chain}`}/>
+                <SessionProposalChainCard
+                  requiredNamespace={optionalNamespaces[chain]}
+                  data-testid={`session-proposal-card-opt-${chain}`}
+                />
                 {renderAccountSelection(`optional:${chain}`, false)}
                 <Divider y={2} />
               </Fragment>

wallets/react-wallet-v2/src/views/SessionSendTransactionModal.tsx

@@ -5,6 +5,7 @@ import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
 import { approveEIP155Request, rejectEIP155Request } from '@/utils/EIP155RequestHandlerUtil'
+import { styledToast } from '@/utils/HelperUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Divider, Loading, Modal, Text } from '@nextui-org/react'
 import { Fragment, useState } from 'react'
@@ -31,11 +32,16 @@ export default function SessionSendTransactionModal() {
   async function onApprove() {
     if (requestEvent) {
       setLoading(true)
+      try {
         const response = await approveEIP155Request(requestEvent)
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -44,10 +50,15 @@ export default function SessionSendTransactionModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectEIP155Request(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/src/views/SessionSignCosmosModal.tsx

@@ -5,6 +5,7 @@ import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
 import { approveCosmosRequest, rejectCosmosRequest } from '@/utils/CosmosRequestHandler'
+import { styledToast } from '@/utils/HelperUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Divider, Modal, Text } from '@nextui-org/react'
 import { Fragment } from 'react'
@@ -27,10 +28,15 @@ export default function SessionSignCosmosModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approveCosmosRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -39,10 +45,15 @@ export default function SessionSignCosmosModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectCosmosRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/src/views/SessionSignKadenaModal.tsx

@@ -4,7 +4,7 @@ import RequestDetailsCard from '@/components/RequestDetalilsCard'
 import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
-import { convertHexToUtf8, getSignParamsMessage } from '@/utils/HelperUtil'
+import { convertHexToUtf8, getSignParamsMessage, styledToast } from '@/utils/HelperUtil'
 import { approveKadenaRequest, rejectKadenaRequest } from '@/utils/KadenaRequestHandlerUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Col, Divider, Modal, Row, Text } from '@nextui-org/react'
@@ -31,10 +31,15 @@ export default function SessionSignKadenaModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approveKadenaRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -43,10 +48,15 @@ export default function SessionSignKadenaModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectKadenaRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/src/views/SessionSignModal.tsx

@@ -4,7 +4,7 @@ import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
 import { approveEIP155Request, rejectEIP155Request } from '@/utils/EIP155RequestHandlerUtil'
-import { getSignParamsMessage } from '@/utils/HelperUtil'
+import { getSignParamsMessage, styledToast } from '@/utils/HelperUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Col, Divider, Modal, Row, Text } from '@nextui-org/react'
 import { Fragment } from 'react'
@@ -30,10 +30,15 @@ export default function SessionSignModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approveEIP155Request(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -42,10 +47,15 @@ export default function SessionSignModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectEIP155Request(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -64,7 +74,9 @@ export default function SessionSignModal() {
         <Row>
           <Col>
             <Text h5>Message</Text>
-            <Text color="$gray400" data-testid="request-message-text">{message}</Text>
+            <Text color="$gray400" data-testid="request-message-text">
+              {message}
+            </Text>
           </Col>
         </Row>
 

wallets/react-wallet-v2/src/views/SessionSignMultiversxModal.tsx

@@ -4,7 +4,11 @@ import RequesDetailsCard from '@/components/RequestDetalilsCard'
 import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
-import { approveMultiversxRequest, rejectMultiversxRequest } from '@/utils/MultiversxRequestHandlerUtil'
+import { styledToast } from '@/utils/HelperUtil'
+import {
+  approveMultiversxRequest,
+  rejectMultiversxRequest
+} from '@/utils/MultiversxRequestHandlerUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Divider, Modal, Text } from '@nextui-org/react'
 import { Fragment } from 'react'
@@ -27,10 +31,15 @@ export default function SessionSignMultiversxModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approveMultiversxRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -39,10 +48,15 @@ export default function SessionSignMultiversxModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectMultiversxRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/src/views/SessionSignNearModal.tsx

@@ -10,6 +10,7 @@ import { NEAR_SIGNING_METHODS } from '@/data/NEARData'
 import { transactions } from 'near-api-js'
 import { Button, Divider, Modal, Text } from '@nextui-org/react'
 import { Fragment } from 'react'
+import { styledToast } from '@/utils/HelperUtil'
 
 export default function SessionSignNearModal() {
   // Get request and wallet data from store
@@ -140,10 +141,15 @@ export default function SessionSignNearModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approveNearRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -152,10 +158,15 @@ export default function SessionSignNearModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectNearRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/src/views/SessionSignPolkadotModal.tsx

@@ -4,6 +4,7 @@ import RequesDetailsCard from '@/components/RequestDetalilsCard'
 import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
+import { styledToast } from '@/utils/HelperUtil'
 import { approvePolkadotRequest, rejectPolkadotRequest } from '@/utils/PolkadotRequestHandlerUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Divider, Modal, Text } from '@nextui-org/react'
@@ -27,10 +28,15 @@ export default function SessionSignPolkadotModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approvePolkadotRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -39,10 +45,15 @@ export default function SessionSignPolkadotModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectPolkadotRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/src/views/SessionSignSolanaModal.tsx

@@ -4,6 +4,7 @@ import RequesDetailsCard from '@/components/RequestDetalilsCard'
 import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
+import { styledToast } from '@/utils/HelperUtil'
 import { approveSolanaRequest, rejectSolanaRequest } from '@/utils/SolanaRequestHandlerUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Divider, Modal, Text } from '@nextui-org/react'
@@ -27,10 +28,15 @@ export default function SessionSignSolanaModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approveSolanaRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -39,10 +45,15 @@ export default function SessionSignSolanaModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectSolanaRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/src/views/SessionSignTezosModal.tsx

@@ -4,6 +4,7 @@ import RequesDetailsCard from '@/components/RequestDetalilsCard'
 import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
+import { styledToast } from '@/utils/HelperUtil'
 import { approveTezosRequest, rejectTezosRequest } from '@/utils/TezosRequestHandlerUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Divider, Modal, Text } from '@nextui-org/react'
@@ -27,10 +28,15 @@ export default function SessionSignTezosModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approveTezosRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -39,10 +45,15 @@ export default function SessionSignTezosModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectTezosRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/src/views/SessionSignTronModal.tsx

@@ -4,6 +4,7 @@ import RequesDetailsCard from '@/components/RequestDetalilsCard'
 import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
+import { styledToast } from '@/utils/HelperUtil'
 import { approveTronRequest, rejectTronRequest } from '@/utils/TronRequestHandlerUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Divider, Modal, Text } from '@nextui-org/react'
@@ -27,10 +28,15 @@ export default function SessionSignTronModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approveTronRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -39,10 +45,15 @@ export default function SessionSignTronModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectTronRequest(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/src/views/SessionSignTypedDataModal.tsx

@@ -5,7 +5,7 @@ import RequestMethodCard from '@/components/RequestMethodCard'
 import RequestModalContainer from '@/components/RequestModalContainer'
 import ModalStore from '@/store/ModalStore'
 import { approveEIP155Request, rejectEIP155Request } from '@/utils/EIP155RequestHandlerUtil'
-import { getSignTypedDataParamsData } from '@/utils/HelperUtil'
+import { getSignTypedDataParamsData, styledToast } from '@/utils/HelperUtil'
 import { signClient } from '@/utils/WalletConnectUtil'
 import { Button, Divider, Modal, Text } from '@nextui-org/react'
 import { Fragment } from 'react'
@@ -31,10 +31,15 @@ export default function SessionSignTypedDataModal() {
   async function onApprove() {
     if (requestEvent) {
       const response = await approveEIP155Request(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }
@@ -43,10 +48,15 @@ export default function SessionSignTypedDataModal() {
   async function onReject() {
     if (requestEvent) {
       const response = rejectEIP155Request(requestEvent)
+      try {
         await signClient.respond({
           topic,
           response
         })
+      } catch (e) {
+        styledToast((e as Error).message, 'error')
+        return
+      }
       ModalStore.close()
     }
   }

wallets/react-wallet-v2/yarn.lock

@@ -2523,10 +2523,10 @@
   version "0.3.1"
   resolved "https://codeload.github.com/ecadlabs/axios-fetch-adapter/tar.gz/167684f522e90343b9f3439d9a43ac571e2396f6"
 
-"@walletconnect/core@2.9.1":
+"@walletconnect/core@2.10.0":
-  version "2.9.1"
+  version "2.10.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-2.9.1.tgz#1a333933750f5f933d9b7788a8dae44ce1173063"
+  resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-2.10.0.tgz#b659de4dfb374becd938964abd4f2150d410e617"
-  integrity sha512-xyWeP0eLhEEDQAVJSmqs4n/AClKUM+8os2ZFe7BTuw1tFYjeLNVDtKCHziVOSTh8wEChMsKSGKA4zerQoH8mAQ==
+  integrity sha512-Z8pdorfIMueuiBXLdnf7yloiO9JIiobuxN3j0OTal+MYc4q5/2O7d+jdD1DAXbLi1taJx3x60UXT/FPVkjIqIQ==
   dependencies:
     "@walletconnect/heartbeat" "1.2.1"
     "@walletconnect/jsonrpc-provider" "1.0.13"
@@ -2539,8 +2539,8 @@
     "@walletconnect/relay-auth" "^1.0.4"
     "@walletconnect/safe-json" "^1.0.2"
     "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.9.1"
+    "@walletconnect/types" "2.10.0"
-    "@walletconnect/utils" "2.9.1"
+    "@walletconnect/utils" "2.10.0"
     events "^3.3.0"
     lodash.isequal "4.5.0"
     uint8arrays "^3.1.0"
@@ -2649,19 +2649,19 @@
   dependencies:
     tslib "1.14.1"
 
-"@walletconnect/sign-client@2.9.1":
+"@walletconnect/sign-client@2.10.0":
-  version "2.9.1"
+  version "2.10.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/sign-client/-/sign-client-2.9.1.tgz#e4aa9c7b15849f450fdd1b03754a7517cb5c8811"
+  resolved "https://registry.yarnpkg.com/@walletconnect/sign-client/-/sign-client-2.10.0.tgz#0fee8f12821e37783099f0c7bd64e6efdfbd9d86"
-  integrity sha512-Z7tFRrJ9btA1vU427vsjUS6cPlHQVcTWdKH90khEc2lv3dB6mU8FNO0VJsw+I2D7CW7WaMWF3nnj6Z1FfotbDg==
+  integrity sha512-hbDljDS53kR/It3oXD91UkcOsT6diNnW5+Zzksm0YEfwww5dop/YfNlcdnc8+jKUhWOL/YDPNQCjzsCSNlVzbw==
   dependencies:
-    "@walletconnect/core" "2.9.1"
+    "@walletconnect/core" "2.10.0"
     "@walletconnect/events" "^1.0.1"
     "@walletconnect/heartbeat" "1.2.1"
     "@walletconnect/jsonrpc-utils" "1.0.8"
     "@walletconnect/logger" "^2.0.1"
     "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.9.1"
+    "@walletconnect/types" "2.10.0"
-    "@walletconnect/utils" "2.9.1"
+    "@walletconnect/utils" "2.10.0"
     events "^3.3.0"
 
 "@walletconnect/time@^1.0.2":
@@ -2671,10 +2671,10 @@
   dependencies:
     tslib "1.14.1"
 
-"@walletconnect/types@2.9.0":
+"@walletconnect/types@2.10.0":
-  version "2.9.0"
+  version "2.10.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-2.9.0.tgz#6e5dfdc7212c1ec4ab49a1ec409c743e16093f72"
+  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-2.10.0.tgz#5d63235b49e03d609521402a4b49627dbc4ed514"
-  integrity sha512-ORopsMfSRvUYqtjKKd6scfg8o4/aGebipLxx92AuuUgMTERSU6cGmIrK6rdLu7W6FBJkmngPLEGc9mRqAb9Lug==
+  integrity sha512-kSTA/WZnbKdEbvbXSW16Ty6dOSzOZCHnGg6JH7q1MuraalD2HuNg00lVVu7QAZ/Rj1Gn9DAkrgP5Wd5a8Xq//Q==
   dependencies:
     "@walletconnect/events" "^1.0.1"
     "@walletconnect/heartbeat" "1.2.1"
@@ -2683,22 +2683,10 @@
     "@walletconnect/logger" "^2.0.1"
     events "^3.3.0"
 
-"@walletconnect/types@2.9.1":
+"@walletconnect/utils@2.10.0":
-  version "2.9.1"
+  version "2.10.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-2.9.1.tgz#cb32ff396cc8880a7395f28716d1e82f407e1372"
+  resolved "https://registry.yarnpkg.com/@walletconnect/utils/-/utils-2.10.0.tgz#6918d12180d797b8bd4a19fb2ff128e394e181d6"
-  integrity sha512-xbGgTPuD6xsb7YMvCESBIH55cjB86QAnnVL50a/ED42YkQzDsOdJ0VGTbrm0tG5cxUOF933rpxZQjxGdP+ovww==
+  integrity sha512-9GRyEz/7CJW+G04RvrjPET5k7hOEsB9b3fF9cWDk/iDCxSWpbkU/hv/urRB36C+gvQMAZgIZYX3dHfzJWkY/2g==
-  dependencies:
-    "@walletconnect/events" "^1.0.1"
-    "@walletconnect/heartbeat" "1.2.1"
-    "@walletconnect/jsonrpc-types" "1.0.3"
-    "@walletconnect/keyvaluestorage" "^1.0.2"
-    "@walletconnect/logger" "^2.0.1"
-    events "^3.3.0"
-
-"@walletconnect/utils@2.9.1":
-  version "2.9.1"
-  resolved "https://registry.yarnpkg.com/@walletconnect/utils/-/utils-2.9.1.tgz#92abc24b3af3ead42a3864e019dbf2f651ab2e47"
-  integrity sha512-tXeQVebF5oPBvhdmuUyVSkSIBYx/egIi4czav1QrnUpwrUS1LsrFhyWBxSbhN7TXY287ULWkEf6aFpWOHdp5EA==
   dependencies:
     "@stablelib/chacha20poly1305" "1.0.1"
     "@stablelib/hkdf" "1.0.1"
@@ -2708,7 +2696,7 @@
     "@walletconnect/relay-api" "^1.0.9"
     "@walletconnect/safe-json" "^1.0.2"
     "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.9.1"
+    "@walletconnect/types" "2.10.0"
     "@walletconnect/window-getters" "^1.0.1"
     "@walletconnect/window-metadata" "^1.0.1"
     detect-browser "5.3.0"
@@ -4213,6 +4201,11 @@ globby@^11.1.0:
     merge2 "^1.4.1"
     slash "^3.0.0"
 
+goober@^2.1.10:
+  version "2.1.13"
+  resolved "https://registry.yarnpkg.com/goober/-/goober-2.1.13.tgz#e3c06d5578486212a76c9eba860cbc3232ff6d7c"
+  integrity sha512-jFj3BQeleOoy7t93E9rZ2de+ScC4lQICLwiAQmKMg9F6roKGaLSHoCDYKkWlSafg138jejvq/mTdvmnwDQgqoQ==
+
 good-listener@^1.2.2:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/good-listener/-/good-listener-1.2.2.tgz#d53b30cdf9313dffb7dc9a0d477096aa6d145c50"
@@ -5388,6 +5381,13 @@ react-dom@17.0.2:
     object-assign "^4.1.1"
     scheduler "^0.20.2"
 
+react-hot-toast@^2.4.1:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/react-hot-toast/-/react-hot-toast-2.4.1.tgz#df04295eda8a7b12c4f968e54a61c8d36f4c0994"
+  integrity sha512-j8z+cQbWIM5LY37pR6uZR6D4LfseplqnuAO4co4u8917hBUvXlEqyP1ZzqVLcqoyUesZZv/ImreoCeHVDpE5pQ==
+  dependencies:
+    goober "^2.1.10"
+
 react-is@^16.13.1, react-is@^16.7.0:
   version "16.13.1"
   resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"