feat: updates WC version (AstarNetwork#1278)

* fix: update WC version

* fix: enable desktop WC for staging utl

* fix: updated WC ID

* fix: updated WalletConnectModal method

package.json

@@ -50,7 +50,7 @@
     "@quasar/app-webpack": "^3.11.2",
     "@quasar/extras": "^1.16.7",
     "@vue/apollo-composable": "^4.0.0-beta.4",
-    "@walletconnect/ethereum-provider": "^2.11.0",
+    "@walletconnect/ethereum-provider": "^2.12.2",
     "@walletconnect/modal": "^2.6.2",
     "animate.css": "^4.1.1",
     "apr-tools": "^0.1.3",

src/hooks/helper/wallet.ts

@@ -11,15 +11,15 @@ import { supportEvmWalletObj, SupportWallet, supportWalletObj } from 'src/config
 import { EVM, rpcUrls } from 'src/config/web3';
 import { ETHEREUM_EXTENSION } from 'src/modules/account';
 import { EthereumProvider } from 'src/hooks/types/CustomSignature';
-import { deepLink } from 'src/links';
+import { deepLink, productionOrigin } from 'src/links';
 import { addTxHistories } from 'src/modules/account';
 import { HistoryTxType } from 'src/modules/account/index';
 import { showError } from 'src/modules/extrinsic';
 import { SubstrateAccount } from 'src/store/general/state';
 import { container } from 'src/v2/common';
 import { Symbols } from 'src/v2/symbols';
 import { Dispatch } from 'vuex';
-import { WalletConnectModal } from '@walletconnect/modal';
+import { WalletConnectModal, WalletConnectModalConfig } from '@walletconnect/modal';
 
 declare global {
   interface Window {
@@ -291,15 +291,15 @@ const initWcProvider = async (): Promise<typeof WcEthereumProvider> => {
   const astarZkEvm = providerEndpoints[endpointKey.ASTAR_ZKEVM];
 
   // Memo: this can be committed as it can be exposed on the browser anyway
-  const projectId = 'c236cca5c68248680dd7d0bf30fefbb5';
+  const projectId = '7424c1d6f096393092e9755dff0bb5f2';
+  const isProductionPage = window.location.origin === productionOrigin;
 
   // Ref: https://docs.walletconnect.com/advanced/walletconnectmodal/options#explorerrecommendedwalletids-optional
-  // Memo: disabled 'desktop wallet' section as it doesn't work for our zkEVM wallet. We might want to filter the wallet by ids in the future
+  // Memo: disabled 'desktop wallet' section for production page as it doesn't work for our zkEVM wallet. We might want to filter the wallet by ids in the future
   new WalletConnectModal({
     projectId,
-    explorerRecommendedWalletIds: 'NONE',
-    // explorerExcludedWalletIds: 'ALL',
-  });
+    explorerRecommendedWalletIds: isProductionPage ? 'NONE' : 'ALL',
+  } as WalletConnectModalConfig);
 
   // Ref: https://docs.walletconnect.com/advanced/providers/ethereum
   const provider = (await WcEthereumProvider.init({