Feat/email login (#151)

reown-com · May 28, 2024 · 2c9d1a3 · 2c9d1a3
1 parent 1c52614
commit 2c9d1a3
Show file tree

Hide file tree

Showing 50 changed files with 1,315 additions and 636 deletions.
diff --git a/.github/actions/ci-setup/action.yml b/.github/actions/ci-setup/action.yml
@@ -36,4 +36,4 @@ runs:
       if: steps.yarn-cache.outputs.cache-hit != 'true'
       run: |
         cd ${{ inputs.root-path }}
-        yarn install --immutable
+        yarn install --immutable
diff --git a/Gemfile b/Gemfile
@@ -1,4 +1,4 @@
 source "https://rubygems.org"
 
 gem "fastlane"
-gem "cocoapods", '1.15.2'
+gem "cocoapods", '1.15.2'
diff --git a/dapps/W3MEthers/ios/Podfile.lock b/dapps/W3MEthers/ios/Podfile.lock
@@ -981,6 +981,10 @@ PODS:
     - React-Core
   - react-native-netinfo (11.2.1):
     - React-Core
+  - react-native-webview (13.8.2):
+    - glog
+    - RCT-Folly (= 2022.05.16.00)
+    - React-Core
   - React-nativeconfig (0.73.4)
   - React-NativeModulesApple (0.73.4):
     - glog
@@ -1221,6 +1225,7 @@ DEPENDENCIES:
   - react-native-get-random-values (from `../node_modules/react-native-get-random-values`)
   - react-native-mmkv (from `../node_modules/react-native-mmkv`)
   - "react-native-netinfo (from `../node_modules/@react-native-community/netinfo`)"
+  - react-native-webview (from `../node_modules/react-native-webview`)
   - React-nativeconfig (from `../node_modules/react-native/ReactCommon`)
   - React-NativeModulesApple (from `../node_modules/react-native/ReactCommon/react/nativemodule/core/platform/ios`)
   - React-perflogger (from `../node_modules/react-native/ReactCommon/reactperflogger`)
@@ -1343,6 +1348,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native-mmkv"
   react-native-netinfo:
     :path: "../node_modules/@react-native-community/netinfo"
+  react-native-webview:
+    :path: "../node_modules/react-native-webview"
   React-nativeconfig:
     :path: "../node_modules/react-native/ReactCommon"
   React-NativeModulesApple:
@@ -1446,6 +1453,7 @@ SPEC CHECKSUMS:
   react-native-get-random-values: 384787fd76976f5aec9465aff6fa9e9129af1e74
   react-native-mmkv: e97c0c79403fb94577e5d902ab1ebd42b0715b43
   react-native-netinfo: 8a7fd3f7130ef4ad2fb4276d5c9f8d3f28d2df3d
+  react-native-webview: cf835271e767f207e2d094275530b8690bdd777e
   React-nativeconfig: d7af5bae6da70fa15ce44f045621cf99ed24087c
   React-NativeModulesApple: 0123905d5699853ac68519607555a9a4f5c7b3ac
   React-perflogger: 8a1e1af5733004bdd91258dcefbde21e0d1faccd

diff --git a/dapps/W3MEthers/package.json b/dapps/W3MEthers/package.json
@@ -16,16 +16,18 @@
     "@react-native-clipboard/clipboard": "1.13.2",
     "@react-native-community/netinfo": "11.2.1",
     "@walletconnect/react-native-compat": "2.11.2",
-    "@web3modal/coinbase-ethers-react-native": "1.3.0",
-    "@web3modal/ethers-react-native": "1.3.0",
+    "@web3modal/coinbase-ethers-react-native": "1.4.0",
+    "@web3modal/email-ethers-react-native": "1.4.0",
+    "@web3modal/ethers-react-native": "1.4.0",
     "ethers": "6.10.0",
     "expo": "^50.0.0",
     "react": "18.2.0",
     "react-native": "0.73.4",
     "react-native-get-random-values": "1.10.0",
     "react-native-mmkv": "2.11.0",
     "react-native-modal": "13.0.1",
-    "react-native-svg": "14.1.0"
+    "react-native-svg": "14.1.0",
+    "react-native-webview": "13.8.2"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",

diff --git a/dapps/W3MEthers/src/App.tsx b/dapps/W3MEthers/src/App.tsx
@@ -13,14 +13,14 @@ import {
 import {FlexView, Text} from '@web3modal/ui-react-native';
 import {handleResponse} from '@coinbase/wallet-mobile-sdk';
 import {CoinbaseProvider} from '@web3modal/coinbase-ethers-react-native';
+import {EmailProvider} from '@web3modal/email-ethers-react-native';
 import {ENV_PROJECT_ID} from '@env';
 
 import {SignMessage} from './views/SignMessage';
 import {SendTransaction} from './views/SendTransaction';
 import {ReadContract} from './views/ReadContract';
 import {WriteContract} from './views/WriteContract';
 import {SignTypedDataV4} from './views/SignTypedDataV4';
-import {SignTypedData} from './views/SignTypedData';
 
 // 1. Get projectId at https://cloud.walletconnect.com
 const projectId = ENV_PROJECT_ID;
@@ -60,9 +60,11 @@ const coinbaseProvider = new CoinbaseProvider({
   rpcUrl: mainnet.rpcUrl,
 });
 
+const emailProvider = new EmailProvider({projectId, metadata});
+
 const config = defaultConfig({
   metadata,
-  coinbase: coinbaseProvider,
+  extraConnectors: [coinbaseProvider, emailProvider],
 });
 
 const clipboardClient = {
@@ -113,7 +115,6 @@ function App(): React.JSX.Element {
         <W3mButton balance="show" />
         <SignMessage />
         <SendTransaction />
-        <SignTypedData />
         <SignTypedDataV4 />
         <ReadContract />
         <WriteContract />

diff --git a/dapps/W3MEthers/src/views/SendTransaction.tsx b/dapps/W3MEthers/src/views/SendTransaction.tsx
@@ -26,7 +26,6 @@ export function SendTransaction() {
     setData(undefined);
     setError(false);
     setIsLoading(true);
-    setRequetsModalVisible(true);
 
     try {
       const ethersProvider = new BrowserProvider(walletProvider);
@@ -41,14 +40,16 @@ export function SendTransaction() {
       setData(txResponse.hash);
     } catch {
       setError(true);
+    } finally {
+      setIsLoading(false);
+      setRequetsModalVisible(true);
     }
-    setIsLoading(false);
   };
 
   return isConnected ? (
     <View>
-      <Button disabled={requestModalVisible} onPress={onPress}>
-        Send transaction
+      <Button disabled={requestModalVisible || isLoading} onPress={onPress}>
+        {isLoading ? 'Loading...' : 'Send transaction'}
       </Button>
 
       <RequestModal

diff --git a/dapps/W3MEthers/src/views/SignMessage.tsx b/dapps/W3MEthers/src/views/SignMessage.tsx
@@ -25,7 +25,6 @@ export function SignMessage() {
     setData(undefined);
     setError(false);
     setIsLoading(true);
-    setRequetsModalVisible(true);
 
     try {
       const ethersProvider = new BrowserProvider(walletProvider);
@@ -37,14 +36,16 @@ export function SignMessage() {
     } catch (e) {
       console.log(e);
       setError(true);
+    } finally {
+      setIsLoading(false);
+      setRequetsModalVisible(true);
     }
-    setIsLoading(false);
   };
 
   return isConnected ? (
     <View>
-      <Button disabled={requestModalVisible} onPress={onPress}>
-        Sign message
+      <Button disabled={requestModalVisible || isLoading} onPress={onPress}>
+        {isLoading ? 'Loading...' : 'Sign message'}
       </Button>
 
       <RequestModal

diff --git a/dapps/W3MEthers/src/views/SignTypedData.tsx b/dapps/W3MEthers/src/views/SignTypedData.tsx
diff --git a/dapps/W3MEthers/src/views/SignTypedDataV4.tsx b/dapps/W3MEthers/src/views/SignTypedDataV4.tsx
@@ -26,7 +26,6 @@ export function SignTypedDataV4() {
     setData(undefined);
     setError(false);
     setIsLoading(true);
-    setRequetsModalVisible(true);
 
     try {
       const ethersProvider = new BrowserProvider(walletProvider);
@@ -42,14 +41,16 @@ export function SignTypedDataV4() {
     } catch (e) {
       console.log(e);
       setError(true);
+    } finally {
+      setIsLoading(false);
+      setRequetsModalVisible(true);
     }
-    setIsLoading(false);
   };
 
   return isConnected ? (
     <View>
-      <Button disabled={requestModalVisible} onPress={onPress}>
-        Sign typed data (v4)
+      <Button disabled={requestModalVisible || isLoading} onPress={onPress}>
+        {isLoading ? 'Loading...' : 'Sign typed data'}
       </Button>
 
       <RequestModal

diff --git a/dapps/W3MEthers/src/views/WriteContract.tsx b/dapps/W3MEthers/src/views/WriteContract.tsx
@@ -26,7 +26,6 @@ export function WriteContract() {
     setData(undefined);
     setError(false);
     setIsLoading(true);
-    setRequetsModalVisible(true);
 
     try {
       const ethersProvider = new BrowserProvider(walletProvider);
@@ -39,14 +38,16 @@ export function WriteContract() {
       setData(response.toString());
     } catch {
       setError(true);
+    } finally {
+      setIsLoading(false);
+      setRequetsModalVisible(true);
     }
-    setIsLoading(false);
   };
 
   return isConnected ? (
     <View>
-      <Button disabled={requestModalVisible} onPress={onPress}>
-        Write contract
+      <Button disabled={requestModalVisible || isLoading} onPress={onPress}>
+        {isLoading ? 'Loading...' : 'Write contract'}
       </Button>
 
       <RequestModal