fix: missing projectId in "More" mobile button + remove wc legacy

packages/connectkit/src/assets/logos.tsx

@@ -36,9 +36,6 @@ export const WalletConnect = ({ background = false, ...props }) => (
   </svg>
 );
 
-export const WalletConnectLegacy = ({ background = false, ...props }) =>
-  WalletConnect({ background, ...props });
-
 export const MetaMask = ({ background = false, ...props }) => (
   <svg
     {...props}
@@ -1276,7 +1273,6 @@ export default {
   Injected,
   OtherWallets,
   WalletConnect,
-  WalletConnectLegacy,
   MetaMask,
   Coinbase,
   Family,

packages/connectkit/src/hooks/useConnectors.ts

@@ -41,7 +41,7 @@ export function useWalletConnectConnector() {
     showQrModal: false,
   }
   */
-  return useConnector('walletConnect') ?? useConnector('walletConnectLegacy');
+  return useConnector('walletConnect');
 }
 export function useCoinbaseWalletConnector() {
   /*

packages/connectkit/src/hooks/useWalletConnectModal.tsx

@@ -19,26 +19,33 @@ export function useWalletConnectModal() {
       w3mcss.innerHTML = `w3m-modal, wcm-modal{ --wcm-z-index: 2147483647; --w3m-z-index:2147483647; }`;
       document.head.appendChild(w3mcss);
 
-      const clientConnector = connectors.find((c) =>
+      const clientConnector: Connector | undefined = connectors.find((c) =>
         isWalletConnectConnector(c.id)
       );
 
       if (clientConnector) {
-        const connector: CreateConnectorFn = walletConnect({
-          projectId: '',
-          showQrModal: true,
-        });
-
-        setIsOpen(true);
         try {
-          await connectAsync({ connector: connector });
+          const provider: any = await clientConnector.getProvider();
+          const projectId = provider.rpc.projectId;
+
+          const connector: CreateConnectorFn = walletConnect({
+            projectId,
+            showQrModal: true,
+          });
+
+          setIsOpen(true);
+          try {
+            await connectAsync({ connector: connector });
+          } catch (err) {
+            log('WalletConnect', err);
+          }
+          setIsOpen(false);
+
+          // remove modal styling
+          document.head.removeChild(w3mcss);
         } catch (err) {
-          log('WalletConnect', err);
+          log('Could not get WalletConnect provider', err);
         }
-        setIsOpen(false);
-
-        // remove modal styling
-        document.head.removeChild(w3mcss);
       } else {
         log('No WalletConnect connector available');
       }

packages/connectkit/src/utils/index.ts

@@ -78,7 +78,7 @@ function flattenChildren(children: React.ReactNode): ReactChildArray {
 }
 
 export const isWalletConnectConnector = (connectorId?: string) =>
-  connectorId === 'walletConnect' || connectorId === 'walletConnectLegacy';
+  connectorId === 'walletConnect';
 
 export const isMetaMaskConnector = (connectorId?: string) =>
   connectorId === 'metaMask';