fix: Test by connecting server/client directly to extension. Convert …

…between request(method, params) and request({method,params}).

src/components/endpoints/GetNetworkId.vue

@@ -2,101 +2,29 @@
 import Notifications from '@/components/Notification.vue'
 import useNotifications from '@/compositions/useNotifications'
 import useWeb3Connection from '@/compositions/useWeb3Connection'
-import { getSelectedNetworkConfig, setNetworkConfig } from '@/helpers/config'
+import {
+  getSelectedNetworkConfig,
+  NETWORKS,
+  setNetworkConfig,
+} from '@/helpers/config'
+import { NetworkInfo } from '@/interfaces/network'
 import { ref } from 'vue'
 import { hexToNumber, numberToHex } from 'web3-utils'
 
-export type NetworkInfo = {
-  id: string
-  name: string
-  isCustom: boolean
-  http: { url: string }
-  ws: { url: string }
-  chainId: string
-  relayer?: { url?: string }
-  explorer?: { url?: string }
-}
-
 const { notification, clearNotification, hasNotification, setNotification } =
   useNotifications()
 const web3 = useWeb3Connection()
 
 const defaultNetworkConfig = getSelectedNetworkConfig()
 const defaultNetwork: NetworkInfo = {
-  name: defaultNetworkConfig.name,
-  http: defaultNetworkConfig.rpc,
-  ws: {
-    url: 'wss://ws-rpc.testnet.lukso.network',
-  },
-  relayer: {
-    url: 'https://relayer.testnet.lukso.network/api',
-  },
-  explorer: defaultNetworkConfig.blockscout,
-  isCustom: false,
-  id: defaultNetworkConfig.name,
-  chainId: numberToHex(defaultNetworkConfig.chainId),
+  ...defaultNetworkConfig,
 }
 
 const networkId = ref('')
 const err = ref('')
 const activeNetwork = ref<NetworkInfo>(defaultNetwork)
 
-const networks = [
-  {
-    name: 'Lukso Testnet',
-    http: {
-      url: 'https://rpc.testnet.lukso.network/',
-    },
-    ws: {
-      url: 'wss://ws-rpc.testnet.lukso.network',
-    },
-    relayer: {
-      url: 'https://relayer.testnet.lukso.network/api',
-    },
-    explorer: {
-      url: 'https://explorer.execution.testnet.lukso.network/tx/{transactionId}/internal-transactions',
-    },
-    isCustom: false,
-    id: 'testnet',
-    chainId: '0x1069',
-  },
-  {
-    name: 'Lukso Mainnet',
-    http: {
-      url: 'https://rpc.mainnet.lukso.network/',
-    },
-    ws: {
-      url: 'wss://ws-rpc.mainnet.lukso.network',
-    },
-    relayer: {
-      url: 'https://relayer.mainnet.lukso.network/api',
-    },
-    explorer: {
-      url: 'https://explorer.execution.mainnet.lukso.network/tx/{transactionId}/internal-transactions',
-    },
-    isCustom: false,
-    id: 'mainnet',
-    chainId: '0x2a',
-  },
-  {
-    name: 'Base Sepolia',
-    http: {
-      url: 'https://base-sepolia-rpc.publicnode.com/',
-    },
-    ws: {
-      url: 'wss://base-sepolia-rpc.publicnode.com',
-    },
-    relayer: {
-      url: undefined,
-    },
-    explorer: {
-      url: 'https://sepolia.basescan.org/tx/{transactionId}',
-    },
-    isCustom: false,
-    id: 'base-sepolia',
-    chainId: '0x14a34',
-  },
-]
+const networks = Object.values(NETWORKS)
 
 const getNetworkId = async () => {
   clearNotification()
@@ -129,8 +57,8 @@ const changeNetwork = async () => {
 const changeDappNetwork = async () => {
   try {
     let currentChainId = getSelectedNetworkConfig().chainId
-    if (numberToHex(currentChainId) !== activeNetwork.value.chainId) {
-      setNetworkConfig(hexToNumber(activeNetwork.value.chainId) as number)
+    if (currentChainId !== activeNetwork.value.chainId) {
+      setNetworkConfig(activeNetwork.value.chainId)
       currentChainId = getSelectedNetworkConfig().chainId
     }
     location.reload()
@@ -148,7 +76,7 @@ const addNetwork = async () => {
         {
           chainId: activeNetwork.value.chainId,
           chainName: activeNetwork.value.name,
-          rpcUrls: [activeNetwork.value.http.url],
+          rpcUrls: [activeNetwork.value.rpc.url],
         },
       ],
     })

src/compositions/useWeb3Connection.ts

@@ -18,6 +18,60 @@ import EthereumProvider from '@walletconnect/ethereum-provider/dist/types/Ethere
 import Web3 from 'web3'
 import { ContractOptions, Contract } from 'web3-eth-contract'
 import { EthereumProviderError } from 'eth-rpc-errors'
+import { createServer, createClient } from '@lukso/embedded-provider'
+import {
+  JSONRPCErrorResponse,
+  JSONRPCResponse,
+  JSONRPCSuccessResponse,
+} from 'json-rpc-2.0'
+const oldProvider = window.lukso
+const server = createServer()
+server.addMethod('exampleMethod', params => {
+  console.log('params', params)
+  return `Hello, ${params.name}!`
+})
+server.applyMiddleware(async (next, request) => {
+  const { method, params, id, jsonrpc } = request
+  try {
+    console.log('request', request)
+    const response = await oldProvider.request({ method, params })
+    console.log('response', response)
+    return { id, jsonrpc, result: response } as JSONRPCSuccessResponse
+  } catch (error) {
+    console.error(error)
+    console.log({ id, jsonrpc, error } as JSONRPCErrorResponse)
+  }
+  console.log('request', request)
+  if (request.method === 'exampleMethod2') {
+    console.log('exampleMethod2')
+    return {
+      jsonrpc,
+      id,
+      result: { message: 'Hello, World!' } as any,
+    } as JSONRPCSuccessResponse
+  }
+  return await next(request)
+})
+
+const client = createClient()
+// client.request('exampleMethod', { name: 'World' }).then(result => {
+//   console.log('result', result)
+// })
+// client.request('exampleMethod2', { name: 'World' }).then(result => {
+//   console.log('result2', result)
+// })
+const oldRequest = client.request.bind(client)
+client.request = (method, params) => {
+  if (typeof method === 'string') {
+    return oldRequest(method, params)
+  }
+  const { method: _method, params: _params } = method as {
+    method: string
+    params: unknown[]
+  }
+  return oldRequest(_method, _params)
+}
+window.lukso = client
 
 const web3Onboard = useWeb3Onboard()
 const web3WalletConnectV2 = useWalletConnectV2()

src/helpers/config.ts

@@ -59,6 +59,81 @@ export const NETWORKS: { [K in NetworkType]: NetworkInfo } = {
     // ERC721
     erc721TokenWithEip165: '0x57b8e4f3C96180088652dc361473bB91266bb080',
   },
+  mainnet: {
+    name: 'mainnet',
+    rpc: {
+      url: 'https://rpc.mainnet.lukso.network',
+    },
+    cache: {
+      url: 'https://erc725cache.mainnet.lukso.network/graphql',
+    },
+    ipfs: {
+      url: 'https://api.universalprofile.cloud/api/v0',
+    },
+    blockscout: {
+      url: 'https://explorer.execution.mainnet.lukso.network',
+    },
+    chainId: 42,
+
+    // The sample values are currently just junk.
+    sampleEoA: '0xD634fc59DE7fCb60677322B2B114Ab70756e70be',
+    sampleUP: '0x21CFF5BCe6F7845734fCC3915FEeaC7C7D89588D',
+    sampleSC: '0xb4c93158DDC3043D4Cd8270d6fDC3232ba21eD32',
+    errorContract: '0xFDb952E4dC30A1C55F76cdC2Ca14c13cFb69E62c',
+    // ERC20
+    erc20TokenWithEip165: '0xb4c93158DDC3043D4Cd8270d6fDC3232ba21eD32',
+    erc20TokenWithoutEip165: '0xB29c50a9F3D90FA3aDF394f2960BD6D8e0Ff5E9D',
+    // ERC777
+    erc777TokenWithEip165: '0xC719f454C8F9a0C7eEC4203B21766B88d8a5B073',
+    erc777TokenWithoutEip165: '0xD7549C70A6122cA01043831f0f0c65152C4877d6',
+    // LSP7
+    lsp7TokenDivisible: '0x28682Ff854Cb885eB690780f794CD632D94289B8',
+    lsp7TokenNonDivisible: '0x085E969a80e374E9627CceC9630e030b1EDdC42b',
+    // ERC721
+    erc721TokenWithEip165: '0x57b8e4f3C96180088652dc361473bB91266bb080',
+  },
+  base_sepolia: {
+    name: 'Base Sepolia',
+    rpc: {
+      url: 'https://base-sepolia-rpc.publicnode.com/',
+    },
+    ipfs: {
+      url: 'https://api.universalprofile.cloud/api/v0',
+    },
+    ws: {
+      url: 'wss://base-sepolia-rpc.publicnode.com',
+    },
+    relayer: {
+      url: undefined,
+    },
+    explorer: {
+      url: 'https://sepolia.basescan.org/tx/{transactionId}',
+    },
+    isCustom: false,
+    id: 'base-sepolia',
+    chainId: 84532,
+  },
+  base: {
+    name: 'Base',
+    rpc: {
+      url: 'https://base-rpc.publicnode.com/',
+    },
+    ipfs: {
+      url: 'https://api.universalprofile.cloud/api/v0',
+    },
+    ws: {
+      url: 'wss://base-rpc.publicnode.com',
+    },
+    relayer: {
+      url: undefined,
+    },
+    explorer: {
+      url: 'https://basescan.org/tx/{transactionId}',
+    },
+    isCustom: false,
+    id: 'base',
+    chainId: 8453,
+  },
 }
 
 export const PRIVATE_KEY =

src/interfaces/network.d.ts

@@ -1,4 +1,4 @@
-export type NetworkType = 'testnet'
+export type NetworkType = 'testnet' | 'mainnet'
 
 export type NetworkInfo = {
   name: string

src/views/Home.vue

@@ -14,34 +14,8 @@ import ImportProfile from '@/components/endpoints/ImportProfile.vue'
 import GetNetworkId from '@/components/endpoints/GetNetworkId.vue'
 import Transfer from '@/components/endpoints/Transfer.vue'
 import Mint from '@/components/endpoints/Mint.vue'
-import { createServer, createClient } from '@lukso/embedded-provider'
 
 const hasExtension = computed(() => !!window.lukso)
-
-const server = createServer()
-server.addMethod('exampleMethod', params => {
-  console.log('params', params)
-  return `Hello, ${params.name}!`
-})
-server.applyMiddleware((next, request) => {
-  console.log('request', request)
-  if (request.method === 'exampleMethod2') {
-    console.log('exampleMethod2')
-    return Promise.resolve({
-      ...request,
-      result: { message: 'Hello, World!' },
-    }) as ReturnType<typeof next>
-  }
-  return next(request)
-})
-
-const client = createClient()
-client.request('exampleMethod', { name: 'World' }).then(result => {
-  console.log('result', result)
-})
-client.request('exampleMethod2', { name: 'World' }).then(result => {
-  console.log('result2', result)
-})
 </script>
 
 <template>