Optimized agg verifier example

Web3Auth · Sep 20, 2023 · 321e1a2 · 321e1a2
1 parent afca871
commit 321e1a2
Showing 1 changed file with 25 additions and 41 deletions.
diff --git a/single-factor-auth-web/sfa-react-auth0-agg-verifier-example/src/App.tsx b/single-factor-auth-web/sfa-react-auth0-agg-verifier-example/src/App.tsx
@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 
 // Import Single Factor Auth SDK for no redirect flow
 import { Web3Auth } from "@web3auth/single-factor-auth";
-import { CHAIN_NAMESPACES, IProvider } from "@web3auth/base";
+import { CHAIN_NAMESPACES } from "@web3auth/base";
 import { EthereumPrivateKeyProvider } from "@web3auth/ethereum-provider";
 import { GoogleLogin, CredentialResponse, googleLogout } from '@react-oauth/google';
 
@@ -11,11 +11,6 @@ import { GoogleLogin, CredentialResponse, googleLogout } from '@react-oauth/goog
 import RPC from "./evm.ethers";
 
 import { useAuth0 } from "@auth0/auth0-react";
-// import { auth } from './FireBaseConfig';
-// import {
-//   GoogleAuthProvider,
-//   signInWithPopup,
-// } from "firebase/auth";
 
 import "./App.css";
 
@@ -36,32 +31,27 @@ const chainConfig = {
   tickerName: "Ethereum",
 };
 
+// Initialising Web3Auth Single Factor Auth SDK
+const web3authSfa = new Web3Auth({
+  clientId, // Get your Client ID from Web3Auth Dashboard
+  web3AuthNetwork: "testnet", // ["cyan", "testnet"]
+  usePnPKey: false, // Setting this to true returns the same key as PnP Web SDK, By default, this SDK returns CoreKitKey.
+});
+const ethereumPrivateKeyProvider = new EthereumPrivateKeyProvider({
+  config: { chainConfig },
+});
+
 function App() {
-  const [web3authSFAuth, setWeb3authSFAuth] = useState<Web3Auth | null>(null);
   const [usesSfaSDK, setUsesSfaSDK] = useState(false);
   const [idToken, setIdToken] = useState<string | null>(null);
   const [loading, setLoading] = useState(false);
   const [isLoggedIn, setIsLoggedIn] = useState(false);
-  const [provider, setProvider] = useState<IProvider | null>(
-    null
-  );
   const { getIdTokenClaims, loginWithPopup } = useAuth0();
 
   useEffect(() => {
     const init = async () => {
       try {
-        // Initialising Web3Auth Single Factor Auth SDK
-        const web3authSfa = new Web3Auth({
-          clientId, // Get your Client ID from Web3Auth Dashboard
-          web3AuthNetwork: "testnet", // ["cyan", "testnet"]
-          usePnPKey: false, // Setting this to true returns the same key as PnP Web SDK, By default, this SDK returns CoreKitKey.
-        });
-        setWeb3authSFAuth(web3authSfa);
-        const provider = new EthereumPrivateKeyProvider({
-          config: { chainConfig },
-        });
-
-        web3authSfa.init(provider);
+        web3authSfa.init(ethereumPrivateKeyProvider);
       } catch (error) {
         console.error(error);
       }
@@ -84,7 +74,7 @@ function App() {
   const loginAuth0GitHub = async () => {
     // trying logging in with the Single Factor Auth SDK
     try {
-      if (!web3authSFAuth) {
+      if (!web3authSfa) {
         uiConsole("Web3Auth Single Factor Auth SDK not initialized yet");
         return;
       }
@@ -100,15 +90,12 @@ function App() {
           idToken: idToken!,
         }
       ]
-      const web3authSfaprovider = await web3authSFAuth.connect({
+      await web3authSfa.connect({
         verifier,
         verifierId: email,
         idToken: idToken!,
         subVerifierInfoArray,
       });
-      if (web3authSfaprovider) {
-        setProvider(web3authSfaprovider);
-      }
       setUsesSfaSDK(true);
       setLoading(false);
       setIsLoggedIn(true);
@@ -122,7 +109,7 @@ function App() {
 
   const onSuccess = async (response: CredentialResponse) => {
     try {
-      if (!web3authSFAuth) {
+      if (!web3authSfa) {
         uiConsole("Web3Auth Single Factor Auth SDK not initialized yet");
         return;
       }
@@ -137,15 +124,12 @@ function App() {
           idToken: idToken!,
         }
       ]
-      const web3authSfaprovider = await web3authSFAuth.connect({
+      await web3authSfa.connect({
         verifier,
         verifierId: email,
         idToken: idToken!,
         subVerifierInfoArray,
       });
-      if (web3authSfaprovider) {
-        setProvider(web3authSfaprovider);
-      }
       setUsesSfaSDK(true);
       setLoading(false);
       setIsLoggedIn(true);
@@ -172,49 +156,49 @@ function App() {
       console.log(
         "You are directly using Single Factor Auth SDK to login the user, hence the Web3Auth logout function won't work for you. You can logout the user directly from your login provider, or just clear the provider object."
       );
-      web3authSFAuth?.logout();
+      web3authSfa?.logout();
       googleLogout();
       setIsLoggedIn(false);
       return;
     }
   };
 
   const getAccounts = async () => {
-    if (!provider) {
+    if (!web3authSfa.provider) {
       uiConsole("No provider found");
       return;
     }
-    const rpc = new RPC(provider!);
+    const rpc = new RPC(web3authSfa.provider);
     const userAccount = await rpc.getAccounts();
     uiConsole(userAccount);
   };
 
   const getBalance = async () => {
-    if (!provider) {
+    if (!web3authSfa.provider) {
       uiConsole("No provider found");
       return;
     }
-    const rpc = new RPC(provider!);
+    const rpc = new RPC(web3authSfa.provider);
     const balance = await rpc.getBalance();
     uiConsole(balance);
   };
 
   const signMessage = async () => {
-    if (!provider) {
+    if (!web3authSfa.provider) {
       uiConsole("No provider found");
       return;
     }
-    const rpc = new RPC(provider!);
+    const rpc = new RPC(web3authSfa.provider);
     const result = await rpc.signMessage();
     uiConsole(result);
   };
 
   const sendTransaction = async () => {
-    if (!provider) {
+    if (!web3authSfa.provider) {
       uiConsole("No provider found");
       return;
     }
-    const rpc = new RPC(provider!);
+    const rpc = new RPC(web3authSfa.provider);
     const result = await rpc.signAndSendTransaction();
     uiConsole(result);
   };