From 252b45e8bec72c4abcb5bb525ccabfc96cfe120c Mon Sep 17 00:00:00 2001 From: Yashovardhan Agrawal Date: Thu, 2 Nov 2023 13:21:37 +0530 Subject: [PATCH] Fix email passwordless 2fa setup --- .../src/App.tsx | 61 ++++++------------- .../src/tkey.ts | 2 +- 2 files changed, 20 insertions(+), 43 deletions(-) diff --git a/tkey-web/2fa-examples/tkey-react-sfa-auth0-github-email-passwordless-example/src/App.tsx b/tkey-web/2fa-examples/tkey-react-sfa-auth0-github-email-passwordless-example/src/App.tsx index 9f2d0347..0d941bb2 100644 --- a/tkey-web/2fa-examples/tkey-react-sfa-auth0-github-email-passwordless-example/src/App.tsx +++ b/tkey-web/2fa-examples/tkey-react-sfa-auth0-github-email-passwordless-example/src/App.tsx @@ -3,7 +3,7 @@ import React, { useEffect, useState } from "react"; import "./App.css"; import { CustomFactorsModuleType } from "./constants"; import swal from "sweetalert"; -import { ethereumPrivateKeyProvider, tKey } from "./tkey"; +import { ethereumPrivateKeyProvider, tKey, clientId } from "./tkey"; import Web3 from "web3"; import SfaServiceProvider from "@tkey/service-provider-sfa"; import { WebStorageModule } from "@tkey/web-storage"; @@ -13,10 +13,21 @@ import TorusSdk from "@toruslabs/customauth"; import BN from "bn.js"; + + import { useAuth0 } from "@auth0/auth0-react"; import { signInWithEmailLink, isSignInWithEmailLink, sendSignInLinkToEmail } from "firebase/auth"; export const wcVerifier = "wallet-connect-test"; export const BACKEND_URL = "https://wc-admin.web3auth.com"; + + +const torusdirectsdk = new TorusSdk({ + baseUrl: `${window.location.origin}/serviceworker`, + enableLogging: true, + network: "sapphire_mainnet", + web3AuthClientId: clientId, +} as any); + function App() { const [user, setUser] = useState(null); const [privateKey, setPrivateKey] = useState(); @@ -27,7 +38,6 @@ function App() { const [emailIdToken, setEmailIdToken] = useState(null); const { getIdTokenClaims, loginWithPopup } = useAuth0(); - const [torusdirectsdk, setTorusdirectsdk] = useState(); const verifier = "w3a-auth0-github"; // Init Service Provider inside the useEffect Method @@ -39,18 +49,7 @@ function App() { } catch (error) { console.error(error); } - - const torusdirectsdk = new TorusSdk({ - baseUrl: window.location.origin, - // user will be redirect to auth page after login - redirectPathName: "auth", - enableLogging: true, - uxMode: "popup", - network: "testnet", - web3AuthClientId: "torus-default", - } as any); - await torusdirectsdk.init({ skipSw: true }); - setTorusdirectsdk(torusdirectsdk); + await torusdirectsdk.init(); }; init(); const ethProvider = async () => { @@ -67,29 +66,6 @@ function App() { ethProvider(); }, [privateKey]); - // if signed by email passwordless, then we should login again with the IdToken - // derived from auth0 - - useEffect(() => { - (async () => { - if (isSignInWithEmailLink(auth, window.location.href)) { - const { sub } = parseToken(idToken!); - setUser(sub); - - const OAuthShareKey = await (tKey.serviceProvider as SfaServiceProvider).connect({ - verifier, - verifierId: sub, - idToken: idToken!, - }); - - uiConsole("OAuthShareKey", OAuthShareKey); - setOAuthShare(OAuthShareKey); - - initializeNewKey(); - } - })(); - }, []); - const parseToken = (token: any) => { try { const base64Url = token.split(".")[1]; @@ -118,8 +94,9 @@ function App() { console.log(idToken); // get sub value from firebase id token - const { sub } = parseToken(idToken); - setUser(sub); + const parsedToken = parseToken(idToken!); + const {sub} = parsedToken; + setUser(parsedToken); const OAuthShareKey = await (tKey.serviceProvider as SfaServiceProvider).connect({ verifier, @@ -320,7 +297,7 @@ function App() { }; const setupEmailPasswordless = async () => { try { - if (!torusdirectsdk) { + if (!torusdirectsdk.isInitialized) { uiConsole("torusdirectsdk not initialized yet"); return; } @@ -330,7 +307,7 @@ function App() { // Triggering Login using Service Provider ==> opens the popup const loginRes = await torusdirectsdk.triggerLogin({ typeOfLogin: "jwt", - verifier: wcVerifier, + verifier: "email-passwordless-web3auth", jwtParams: { domain: "https://wc-auth.web3auth.com", verifierIdField: "name", @@ -368,7 +345,7 @@ function App() { // Triggering Login using customAuth const loginRes = await torusdirectsdk.triggerLogin({ typeOfLogin: "jwt", - verifier: wcVerifier, + verifier: "email-passwordless-web3auth", jwtParams: { domain: "https://wc-auth.web3auth.com", verifierIdField: "name", diff --git a/tkey-web/2fa-examples/tkey-react-sfa-auth0-github-email-passwordless-example/src/tkey.ts b/tkey-web/2fa-examples/tkey-react-sfa-auth0-github-email-passwordless-example/src/tkey.ts index 9d180f66..f21f9fde 100644 --- a/tkey-web/2fa-examples/tkey-react-sfa-auth0-github-email-passwordless-example/src/tkey.ts +++ b/tkey-web/2fa-examples/tkey-react-sfa-auth0-github-email-passwordless-example/src/tkey.ts @@ -6,7 +6,7 @@ import { ShareTransferModule } from "@tkey/share-transfer"; import { ShareSerializationModule } from "@tkey/share-serialization"; import { EthereumPrivateKeyProvider } from "@web3auth/ethereum-provider"; import { WebStorageModule } from "@tkey/web-storage"; -const clientId = "BEglQSgt4cUWcj6SKRdu5QkOXTsePmMcusG5EAoyjyOYKlVRjIF1iCNnMOTfpzCiunHRrMui8TIwQPXdkQ8Yxuk"; // get from https://dashboard.web3auth.io +export const clientId = "BEglQSgt4cUWcj6SKRdu5QkOXTsePmMcusG5EAoyjyOYKlVRjIF1iCNnMOTfpzCiunHRrMui8TIwQPXdkQ8Yxuk"; // get from https://dashboard.web3auth.io const chainConfig = { chainId: "0x1",