Update chat, sign, core, logger, utils, sync (#169)

* Update chat, sign, core, logger, utils, sync

* Remove extensions

wallets/react-wallet-chat/package.json

@@ -15,9 +15,12 @@
     "@json-rpc-tools/utils": "1.7.6",
     "@nextui-org/react": "1.0.8-beta.5",
     "@solana/web3.js": "1.43.0",
-    "@walletconnect/chat-client": "^0.3.2",
-    "@walletconnect/sign-client": "2.0.0-rc.4",
-    "@walletconnect/utils": "2.0.0-rc.4",
+    "@walletconnect/chat-client": "^0.7.0",
+    "@walletconnect/core": "^2.7.7",
+    "@walletconnect/logger": "^2.0.1",
+    "@walletconnect/sign-client": "^2.7.7",
+    "@walletconnect/sync-client": "^0.3.4",
+    "@walletconnect/utils": "^2.7.7",
     "@web3modal/core": "^2.0.0-beta.7",
     "@web3modal/standalone": "^2.0.0-beta.7",
     "@web3modal/ui": "^2.0.0-beta.7",
@@ -38,7 +41,7 @@
   "devDependencies": {
     "@types/node": "17.0.35",
     "@types/react": "18.0.9",
-    "@walletconnect/types": "2.0.0-rc.4",
+    "@walletconnect/types": "^2.7.7",
     "eslint": "8.15.0",
     "eslint-config-next": "12.1.6",
     "eslint-config-prettier": "8.5.0",

wallets/react-wallet-chat/src/components/SessionChainCard.tsx

@@ -42,22 +42,8 @@ export default function SessionChainCard({ namespace }: IProps) {
   return (
     <Fragment>
       {chains.map(chainId => {
-        const extensionMethods: SessionTypes.Namespace['methods'] = []
-        const extensionEvents: SessionTypes.Namespace['events'] = []
-
-        namespace.extension?.map(({ accounts, methods, events }) => {
-          accounts.forEach(account => {
-            const [type, chain] = account.split(':')
-            const chainId = `${type}:${chain}`
-            if (chains.includes(chainId)) {
-              extensionMethods.push(...methods)
-              extensionEvents.push(...events)
-            }
-          })
-        })
-
-        const allMethods = [...namespace.methods, ...extensionMethods]
-        const allEvents = [...namespace.events, ...extensionEvents]
+        const allMethods = [...namespace.methods]
+        const allEvents = [...namespace.events]
         // @ts-expect-error
         const rgb = CHAIN_METADATA[chainId]?.rgb
 

wallets/react-wallet-chat/src/components/SessionProposalChainCard.tsx

@@ -31,19 +31,9 @@ interface IProps {
 export default function SessionProposalChainCard({ requiredNamespace }: IProps) {
   return (
     <Fragment>
-      {requiredNamespace.chains.map(chainId => {
-        const extensionMethods: ProposalTypes.RequiredNamespace['methods'] = []
-        const extensionEvents: ProposalTypes.RequiredNamespace['events'] = []
-
-        requiredNamespace.extension?.map(({ chains, methods, events }) => {
-          if (chains.includes(chainId)) {
-            extensionMethods.push(...methods)
-            extensionEvents.push(...events)
-          }
-        })
-
-        const allMethods = [...requiredNamespace.methods, ...extensionMethods]
-        const allEvents = [...requiredNamespace.events, ...extensionEvents]
+      {requiredNamespace.chains?.map(chainId => {
+        const allMethods = [...requiredNamespace.methods]
+        const allEvents = [...requiredNamespace.events]
         // @ts-expect-error
         const rgb = CHAIN_METADATA[chainId]?.rgb
 

wallets/react-wallet-chat/src/hooks/useWalletConnectEventsManager.ts

@@ -25,12 +25,20 @@ export default function useWalletConnectEventsManager(initialized: boolean) {
       console.log('session_request', requestEvent)
       const { topic, params } = requestEvent
       const { request } = params
-      const requestSession = signClient.session.get(topic)
+      const session = signClient.session.get(topic)
+      const requestSession = {
+        ...session,
+        optionalNamespaces: {},
+        pairingTopic: session.topic
+      }
 
       switch (request.method) {
         case EIP155_SIGNING_METHODS.ETH_SIGN:
         case EIP155_SIGNING_METHODS.PERSONAL_SIGN:
-          return ModalStore.open('SessionSignModal', { requestEvent, requestSession })
+          return ModalStore.open('SessionSignModal', {
+            requestEvent,
+            requestSession
+          })
 
         case EIP155_SIGNING_METHODS.ETH_SIGN_TYPED_DATA:
         case EIP155_SIGNING_METHODS.ETH_SIGN_TYPED_DATA_V3:
@@ -61,8 +69,6 @@ export default function useWalletConnectEventsManager(initialized: boolean) {
    *****************************************************************************/
   useEffect(() => {
     if (initialized) {
-      signClient.on('session_proposal', onSessionProposal)
-      signClient.on('session_request', onSessionRequest)
       // TODOs
       signClient.on('session_ping', data => console.log('ping', data))
       signClient.on('session_event', data => console.log('event', data))

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

@@ -1,8 +1,11 @@
 import SignClient from '@walletconnect/sign-client'
 import { ChatClient, IChatClient } from '@walletconnect/chat-client'
+import { ISyncClient, SyncClient, SyncStore } from '@walletconnect/sync-client'
+import { Core } from '@walletconnect/core'
 
 export let signClient: SignClient
 export let chatClient: IChatClient
+export let syncClient: ISyncClient
 
 export async function createSignClient() {
   signClient = await SignClient.init({
@@ -19,10 +22,22 @@ export async function createSignClient() {
 
 // FIXME: update relayUrl here to not hardcode local relay.
 export async function createChatClient() {
-  chatClient = await ChatClient.init({
-    logger: 'debug',
-    keyseverUrl: 'https://keys.walletconnect.com',
-    projectId: process.env.NEXT_PUBLIC_PROJECT_ID,
+  const projectId = process.env.NEXT_PUBLIC_PROJECT_ID
+
+  const core = new Core({ projectId })
+
+  syncClient = await SyncClient.init({
+    core,
+    projectId,
     relayUrl: process.env.NEXT_PUBLIC_RELAY_URL ?? 'wss://relay.walletconnect.com'
   })
+
+  chatClient = await ChatClient.init({
+    logger: 'debug',
+    keyserverUrl: 'https://keys.walletconnect.com',
+    projectId: projectId ?? '',
+    relayUrl: process.env.NEXT_PUBLIC_RELAY_URL ?? 'wss://relay.walletconnect.com',
+    syncClient,
+    SyncStoreController: SyncStore
+  })
 }

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

@@ -52,7 +52,7 @@ export default function SessionProposalModal() {
       const namespaces: SessionTypes.Namespaces = {}
       Object.keys(requiredNamespaces).forEach(key => {
         const accounts: string[] = []
-        requiredNamespaces[key].chains.map(chain => {
+        requiredNamespaces[key].chains?.map(chain => {
           selectedAccounts[key].map(acc => accounts.push(`${chain}:${acc}`))
         })
         namespaces[key] = {