feat: create soulname modal, walletconnect fixes

masa-finance · Jul 28, 2023 · 62fa247 · 62fa247
1 parent fc7cd80
commit 62fa247
Show file tree

Hide file tree

Showing 6 changed files with 75 additions and 20 deletions.
diff --git a/src/refactor/masanew.stories.tsx b/src/refactor/masanew.stories.tsx
@@ -564,7 +564,7 @@ const TemplateNewMasaState = (props: Args) => (
   <MasaProvider
     config={{
       allowedWallets: ['metamask', 'walletconnect'],
-      forceChain: 'celo',
+      forceChain: 'alfajores',
       allowedNetworkNames: [
         'goerli',
         'ethereum',

diff --git a/src/refactor/ui/components/modals/create-credit-score/create-credit-score.tsx b/src/refactor/ui/components/modals/create-credit-score/create-credit-score.tsx
@@ -1,9 +1,6 @@
 import React, { useCallback, useState } from 'react';
-/* import { MasaLoading } from '../../masa-loading'; */
-/* import { useCreditScores } from '../../../../masa/use-credit-scores'; */
 import NiceModal from '@ebay/nice-modal-react';
 import { useCreditScoreCreate } from '../../../../masa/use-credit-scores-create';
-/* import { useIdentity } from '../../../../masa/use-identity'; */
 
 import { Modal } from '../modal';
 

diff --git a/src/refactor/wallet-client/constants.ts b/src/refactor/wallet-client/constants.ts
@@ -6,13 +6,19 @@ import {
 import { Valora } from '@celo/rainbowkit-celo/wallets';
 import type { Wallet } from '@rainbow-me/rainbowkit';
 import type { Chain } from 'wagmi';
+import { NetworkName } from '@masa-finance/masa-sdk';
 
 export const PROJECT_ID = '04a4088bf7ff775c3de808412c291cc0';
 
 export const walletConnectorsList: Record<
-  string,
+  'metamask' | 'valora' | 'walletconnect',
   (chains: Chain[]) => { groupName: string; wallets: Wallet[] }
-> = {
+> & {
+  walletconnect: (
+    chains: Chain[],
+    networkName?: NetworkName
+  ) => { groupName: string; wallets: Wallet[] };
+} = {
   metamask: (chains: Chain[]) => ({
     groupName: 'Recommended',
     wallets: [
@@ -25,17 +31,33 @@ export const walletConnectorsList: Record<
     wallets: [Valora({ chains, projectId: PROJECT_ID })],
   }),
 
-  walletconnect: (chains: Chain[]) => {
-    console.log('CHAINS', {
-      chains,
-      filtered: chains.filter((ch) => ch.name === 'Celo'),
-    });
+  walletconnect: (
+    chains: Chain[]
+    // networkName?: NetworkName
+  ) => {
+    console.log('x');
+    // const singleChain = chains.filter(
+    //   (ch: Chain) => ch.network === getWagmiNetworkName(networkName)
+    // );
+    // const sortedChains = [
+    //   ...singleChain,
+    //   ...chains.filter(
+    //     (ch: Chain) => ch.network !== getWagmiNetworkName(networkName)
+    //   ),
+    // ];
+    // console.log('CHAINS', {
+    //   SupportedNetworks,
+
+    //   singleChain,
+    //   sortedChains,
+    //   networkName,
+    // });
     return {
       groupName: 'WalletConnect',
       wallets: [
         walletConnectWallet({
           projectId: PROJECT_ID,
-          chains: chains.filter((chain: Chain) => chain.name === 'Celo'),
+          chains,
           options: {
             qrcode: true,
             projectId: PROJECT_ID,

diff --git a/src/refactor/wallet-client/utils.ts b/src/refactor/wallet-client/utils.ts
@@ -65,9 +65,7 @@ export const correctNetworkListForWagmi = (networkList: NetworkName[]) => {
 
   return networkListCorrectedForWagmi;
 };
-export const getRainbowkitChains = (
-  networkList?: NetworkName[]
-) => {
+export const getRainbowkitChains = (networkList?: NetworkName[]) => {
   if (!networkList || (networkList && networkList.length === 0)) {
     return rainbowkitChains;
   }
@@ -134,3 +132,27 @@ export const getChainIdNetworkMap = (chains?: Chain[]) => {
 
   return chainIdNetworkMap;
 };
+
+export const getWagmiNetworkName = (masaNetworkName?: NetworkName) => {
+  if (masaNetworkName === 'ethereum') return 'homestead';
+  if (masaNetworkName === 'alfajores') return 'celo-alfajores';
+  return masaNetworkName;
+};
+
+export const getChainsSortedByForcedNetwork = (
+  chains: Chain[],
+  forceChain?: NetworkName
+) => {
+  if (!forceChain) return chains;
+  const singleChain = chains.filter(
+    (ch: Chain) => ch.network === getWagmiNetworkName(forceChain)
+  );
+  const sortedChains = [
+    ...singleChain,
+    ...chains.filter(
+      (ch: Chain) => ch.network !== getWagmiNetworkName(forceChain)
+    ),
+  ];
+
+  return sortedChains;
+};
diff --git a/src/refactor/wallet-client/wagmi-rainbowkit-provider.tsx b/src/refactor/wallet-client/wagmi-rainbowkit-provider.tsx
@@ -10,7 +10,7 @@ import { jsonRpcProvider } from 'wagmi/providers/jsonRpc';
 import type { ReactNode } from 'react';
 import React, { useMemo } from 'react';
 
-import { getRainbowkitChains } from './utils';
+import { getChainsSortedByForcedNetwork, getRainbowkitChains } from './utils';
 import { walletConnectorsList } from './constants';
 import { useConfig } from '../base-provider';
 
@@ -21,10 +21,15 @@ export interface WagmiRainbowkitProviderProps {
 export const WagmiRainbowkitProvider = ({
   children,
 }: WagmiRainbowkitProviderProps) => {
-  const { allowedNetworkNames, allowedWallets, rainbowkitConfig } = useConfig();
+  const { allowedNetworkNames, allowedWallets, rainbowkitConfig, forceChain } =
+    useConfig();
   const rainbowkitChains = useMemo(
-    () => getRainbowkitChains(allowedNetworkNames),
-    [allowedNetworkNames]
+    () =>
+      getChainsSortedByForcedNetwork(
+        getRainbowkitChains(allowedNetworkNames),
+        forceChain
+      ),
+    [allowedNetworkNames, forceChain]
   );
 
   const { chains, provider, webSocketProvider } = configureChains(
@@ -39,8 +44,14 @@ export const WagmiRainbowkitProvider = ({
   );
 
   const walletConnectors =
-    allowedWallets?.map((wallet: string) => {
+    allowedWallets?.map((wallet: 'metamask' | 'valora' | 'walletconnect') => {
       if (walletConnectorsList[wallet]) {
+        // if (wallet === 'walletconnect') {
+        //   return walletConnectorsList.walletconnect(
+        //     chains,
+        //     forceChain
+        //   ) as unknown as WalletList;
+        // }
         const walletListFunc = walletConnectorsList[wallet];
         return walletListFunc(chains) as unknown as WalletList;
       }

diff --git a/src/refactor/wallet-client/wallet/use-wallet.ts b/src/refactor/wallet-client/wallet/use-wallet.ts
@@ -43,6 +43,9 @@ const useWallet = () => {
       setPreviousAddress(undefined); // skipcq: JS-W1042
       setCompareAddress(undefined); // skipcq: JS-W1042
       setPreviousAddress(undefined); // skipcq: JS-W1042
+      if (typeof window !== 'undefined') {
+        window.localStorage.removeItem('walletconnect');
+      }
     }
 
     if (compareAddress !== address) {