feat: wallet connection via deeplink (#405)

Co-authored-by: Gancho Radkov <[email protected]>

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

@@ -3,11 +3,12 @@ import PageHeader from '@/components/PageHeader'
 import QrReader from '@/components/QrReader'
 import { web3wallet } from '@/utils/WalletConnectUtil'
 import { Button, Input, Loading, Text } from '@nextui-org/react'
-import { Fragment, useState } from 'react'
+import { Fragment, useMemo, useState } from 'react'
 import { styledToast } from '@/utils/HelperUtil'
 import ModalStore from '@/store/ModalStore'
 
-export default function WalletConnectPage() {
+export default function WalletConnectPage(params: { deepLink?: string }) {
+  const { deepLink } = params
   const [uri, setUri] = useState('')
   const [loading, setLoading] = useState(false)
 
@@ -38,6 +39,12 @@ export default function WalletConnectPage() {
     }
   }
 
+  useMemo(() => {
+    if (deepLink) {
+      onConnect(deepLink)
+    }
+  }, [deepLink])
+
   return (
     <Fragment>
       <PageHeader title="WalletConnect" />

advanced/wallets/react-wallet-v2/src/pages/wc.tsx

@@ -0,0 +1,22 @@
+import { Text } from '@nextui-org/react'
+import { Fragment } from 'react'
+import { useRouter } from 'next/router'
+import WalletConnectPage from './walletconnect'
+
+export default function DeepLinkPairingPage() {
+  const router = useRouter()
+
+  const uri = router.query.uri as string
+
+  if (!uri) {
+    return (
+      <Fragment>
+        <Text css={{ opacity: '0.5', textAlign: 'center', marginTop: '$20' }}>
+          No URI provided via `?uri=` params
+        </Text>
+      </Fragment>
+    )
+  }
+
+  return <WalletConnectPage deepLink={uri} />
+}