From d8339b2979f12b465350edc39dd4437567500a15 Mon Sep 17 00:00:00 2001
From: Ashoat Tevosyan <ashoat@comm.app>
Date: Sat, 7 Oct 2023 00:36:04 -0400
Subject: [PATCH] [landing] Reduce code duplication in landing/siwe.react.js

Summary: This code is completely duplicated from `lib/utils/wagmi-utils.js`.

Test Plan:
1. In my local environment, make sure that mobile SIWE still works with Rainbow wallet (mobile SIWE uses `landing`, but web SIWE doesn't)
2. In combination with other diffs in the stack, I tested the following on both my local environment, and in a staging environment for my keyserver on comm.domains:
  - Mobile sign in with Rainbow wallet using Rainbow login
  - Mobile sign in with Rainbow wallet using WalletConnect login
  - Web sign in with Rainbow wallet using Rainbow login
  - Web sign in with Rainbow wallet using WalletConnect login
  - Web sign in with Metamask wallet

Reviewers: rohan, atul, ginsu

Reviewed By: atul

Subscribers: tomek, wyilio

Differential Revision: https://phab.comm.dev/D9432
---
 landing/siwe.react.js    | 36 +++++++-----------------------------
 lib/utils/wagmi-utils.js |  8 +-------
 2 files changed, 8 insertions(+), 36 deletions(-)

diff --git a/landing/siwe.react.js b/landing/siwe.react.js
index 678cc6506b..7fd782a0ca 100644
--- a/landing/siwe.react.js
+++ b/landing/siwe.react.js
@@ -5,16 +5,8 @@ import {
   RainbowKitProvider,
   darkTheme,
   useModalState,
-  connectorsForWallets,
 } from '@rainbow-me/rainbowkit';
 import '@rainbow-me/rainbowkit/styles.css';
-import {
-  injectedWallet,
-  rainbowWallet,
-  metaMaskWallet,
-  walletConnectWallet,
-  // eslint-disable-next-line import/extensions
-} from '@rainbow-me/rainbowkit/wallets';
 import invariant from 'invariant';
 import _merge from 'lodash/fp/merge.js';
 import * as React from 'react';
@@ -29,32 +21,14 @@ import {
 } from 'lib/utils/siwe-utils.js';
 import {
   WagmiENSCacheProvider,
-  configureWagmiChains,
-  createWagmiClient,
+  wagmiClient,
+  wagmiChains,
 } from 'lib/utils/wagmi-utils.js';
 
 import { SIWEContext } from './siwe-context.js';
 import css from './siwe.css';
 import { useMonitorForWalletConnectModal } from './walletconnect-hooks.js';
 
-const { chains, provider } = configureWagmiChains(process.env.COMM_ALCHEMY_KEY);
-
-const wallets = [injectedWallet({ chains })];
-const projectId = process.env.COMM_WALLETCONNECT_KEY;
-if (projectId) {
-  wallets.push(
-    rainbowWallet({ chains, projectId }),
-    metaMaskWallet({ chains, projectId }),
-    walletConnectWallet({ chains, projectId }),
-  );
-}
-
-const connectors = connectorsForWallets([
-  { groupName: 'Recommended', wallets },
-]);
-
-const wagmiClient = createWagmiClient({ connectors, provider });
-
 function postMessageToNativeWebView(message: SIWEWebViewMessage) {
   window.ReactNativeWebView?.postMessage?.(JSON.stringify(message));
 }
@@ -188,7 +162,11 @@ function SIWEWrapper(): React.Node {
   return (
     <WagmiConfig client={wagmiClient}>
       <WagmiENSCacheProvider>
-        <RainbowKitProvider theme={theme} modalSize="compact" chains={chains}>
+        <RainbowKitProvider
+          theme={theme}
+          modalSize="compact"
+          chains={wagmiChains}
+        >
           <SIWE />
         </RainbowKitProvider>
       </WagmiENSCacheProvider>
diff --git a/lib/utils/wagmi-utils.js b/lib/utils/wagmi-utils.js
index bf6788daca..0ae571b1e0 100644
--- a/lib/utils/wagmi-utils.js
+++ b/lib/utils/wagmi-utils.js
@@ -76,10 +76,4 @@ function WagmiENSCacheProvider(props: Props): React.Node {
   );
 }
 
-export {
-  configureWagmiChains,
-  createWagmiClient,
-  wagmiClient,
-  wagmiChains,
-  WagmiENSCacheProvider,
-};
+export { wagmiClient, wagmiChains, WagmiENSCacheProvider };