diff --git a/src/components/AuthLogin/AuthModal.tsx b/src/components/AuthLogin/AuthModal.tsx index d770dbf961b..446b751d451 100644 --- a/src/components/AuthLogin/AuthModal.tsx +++ b/src/components/AuthLogin/AuthModal.tsx @@ -1,6 +1,7 @@ import React, { useContext, useEffect } from "react"; import Modal from "react-modal"; import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; +import { useLocation } from "@docusaurus/router"; import styles from "./styles.module.css"; import global from "../ParserOpenRPC/global.module.css"; import Icon from "../Icon/Icon"; @@ -11,7 +12,7 @@ import { saveTokenString, getUserIdFromJwtToken, } from "../../lib/siwsrp/auth"; -import { DASHBOARD_URL, REQUEST_PARAMS } from "@site/src/lib/constants"; +import { DASHBOARD_URL, REQUEST_PARAMS, REF_PATH } from "@site/src/lib/constants"; import { MetamaskProviderContext } from "@site/src/theme/Root"; Modal.setAppElement("#__docusaurus"); @@ -130,15 +131,20 @@ const ConnectionErrorModal = ({ ); }; -const AuthModal = ({ - open, - setOpen, - step, - setStep, -}: AuthModalProps) => { +const AuthModal = ({ open, setOpen, step, setStep }: AuthModalProps) => { const { siteConfig } = useDocusaurusContext(); const { DASHBOARD_PREVIEW_URL, VERCEL_ENV } = siteConfig?.customFields || {}; - const { sdk, setWalletLinked, setWalletLinkUrl, metaMaskDisconnect, setProjects, setMetaMaskAccount, setMetaMaskProvider } = useContext(MetamaskProviderContext); + const { + sdk, + setWalletLinked, + setWalletLinkUrl, + metaMaskDisconnect, + setProjects, + setMetaMaskAccount, + setMetaMaskProvider, + } = useContext(MetamaskProviderContext); + const location = useLocation(); + const { pathname } = location; const login = async () => { setStep(AUTH_LOGIN_STEP.CONNECTING); @@ -155,10 +161,12 @@ const AuthModal = ({ const provider = sdk.getProvider(); setMetaMaskProvider(provider); } - + // Call Profile SDK API to retrieve Hydra Access Token & Wallet userProfile // Hydra Access Token will be used to fetch Infura API - const { accessToken, userProfile } = await authenticateAndAuthorize(VERCEL_ENV as string); + const { accessToken, userProfile } = await authenticateAndAuthorize( + VERCEL_ENV as string + ); const loginResponse = await ( await fetch( @@ -168,7 +176,7 @@ const AuthModal = ({ headers: { ...REQUEST_PARAMS().headers, hydra_token: accessToken, - token: 'true', + token: "true", }, body: JSON.stringify({ profileId: userProfile.profileId, @@ -189,7 +197,7 @@ const AuthModal = ({ step: data.step, mmAuthSession: localStorage.getItem(AUTH_WALLET_SESSION_NAME), walletPairing: data.pairing, - token: true + token: true, }) ).toString("base64"); @@ -239,8 +247,13 @@ const AuthModal = ({ setProjects(projects); setOpen(false); } catch (e: any) { - setStep(AUTH_LOGIN_STEP.CONNECTION_ERROR); - setOpen(true); + if (pathname.startsWith('/wallet/reference')) { + setStep(AUTH_LOGIN_STEP.CONNECTION_SUCCESS); + setOpen(true); + } else { + setStep(AUTH_LOGIN_STEP.CONNECTION_ERROR); + setOpen(true); + } } }; diff --git a/src/components/ParserOpenRPC/AuthBox/index.tsx b/src/components/ParserOpenRPC/AuthBox/index.tsx index 2d3facaf769..d5a1b634751 100644 --- a/src/components/ParserOpenRPC/AuthBox/index.tsx +++ b/src/components/ParserOpenRPC/AuthBox/index.tsx @@ -10,14 +10,14 @@ interface AuthBoxProps { } export const AuthBox = ({ isMetamaskNetwork = false }: AuthBoxProps) => { - const { metaMaskConnectHandler, metaMaskWalletIdConnectHandler } = useContext(MetamaskProviderContext); + const { metaMaskWalletIdConnectHandler } = useContext(MetamaskProviderContext); const connectHandler = () => { trackClickForSegment({ eventName: "Connect wallet", clickType: "Connect wallet", userExperience: "B", }); - isMetamaskNetwork ? metaMaskConnectHandler() : metaMaskWalletIdConnectHandler(); + metaMaskWalletIdConnectHandler(); }; return (
diff --git a/src/components/ParserOpenRPC/index.tsx b/src/components/ParserOpenRPC/index.tsx index 51e108ad573..110af47180b 100644 --- a/src/components/ParserOpenRPC/index.tsx +++ b/src/components/ParserOpenRPC/index.tsx @@ -18,6 +18,7 @@ import { import { AuthBox } from "@site/src/components/ParserOpenRPC/AuthBox"; import { MetamaskProviderContext } from "@site/src/theme/Root"; import ProjectsBox from "@site/src/components/ParserOpenRPC/ProjectsBox"; +import { REF_PATH } from "@site/src/lib/constants"; interface ParserProps { network: NETWORK_NAMES; @@ -36,8 +37,6 @@ interface ParserOpenRPCContextProps { export const ParserOpenRPCContext = createContext(null); -const REF_PATH = "/wallet/reference/new-reference"; - export default function ParserOpenRPC({ network, method, @@ -52,8 +51,9 @@ export default function ParserOpenRPC({ const [isDrawerContentFixed, setIsDrawerContentFixed] = useState(false); const [drawerLabel, setDrawerLabel] = useState(null); const [isComplexTypeView, setIsComplexTypeView] = useState(false); - const { metaMaskAccount, metaMaskProvider } = - useContext(MetamaskProviderContext); + const { metaMaskAccount, metaMaskProvider } = useContext( + MetamaskProviderContext + ); const { colorMode } = useColorMode(); const openModal = () => { setModalOpen(true); diff --git a/src/lib/constants.js b/src/lib/constants.js index 7458877b6dc..f70964657b9 100644 --- a/src/lib/constants.js +++ b/src/lib/constants.js @@ -6,9 +6,9 @@ export const DASHBOARD_URL = (DASHBOARD_PREVIEW_URL, VERCEL_ENV) => DASHBOARD_PR ? DASHBOARD_PREVIEW_URL : VERCEL_ENV === "production" ? PROD_APP_URL - : VERCEL_ENV === "preview" - ? STAGE_APP_URL - : DEV_APP_URL; + : STAGE_APP_URL; + +export const REF_PATH = "/wallet/reference/new-reference"; const TEST_TRANSACTIONS = { mainnet: { diff --git a/src/lib/siwsrp/auth.ts b/src/lib/siwsrp/auth.ts index 416312f3565..d4538607a0f 100644 --- a/src/lib/siwsrp/auth.ts +++ b/src/lib/siwsrp/auth.ts @@ -10,7 +10,7 @@ type HydraEnv = { }; const { AuthType, Env, getEnvUrls, JwtBearerAuth, Platform } = SDK; -let VERCEL_ENV = 'development' +let VERCEL_ENV: string export const AUTH_WALLET_SESSION_NAME = "auth.wallet.session"; export const AUTH_WALLET_TOKEN = "auth.wallet.token"; export const AUTH_WALLET_PROJECTS = "auth.wallet.projects"; @@ -18,19 +18,19 @@ export const AUTH_WALLET_PROJECTS = "auth.wallet.projects"; export const getHydraEnv = (): HydraEnv => { const platform = Platform.INFURA; - // if (VERCEL_ENV === "production") { + if (VERCEL_ENV === "production") { return { ...getEnvUrls(Env.PRD), env: Env.PRD, platform, }; - // } else { - // return { - // ...getEnvUrls(Env.DEV), - // env: Env.DEV, - // platform, - // }; - // } + } else { + return { + ...getEnvUrls(Env.DEV), + env: Env.DEV, + platform, + }; + } }; const storage: SDK.AuthStorageOptions = { diff --git a/src/theme/Root.tsx b/src/theme/Root.tsx index f8ece80b667..ffc0cf92dee 100644 --- a/src/theme/Root.tsx +++ b/src/theme/Root.tsx @@ -44,7 +44,6 @@ interface Project { interface IMetamaskProviderContext { projects: { [key: string]: Project }; setProjects: (arg: { [key: string]: Project }) => void; - metaMaskConnectHandler: () => Promise; metaMaskDisconnect: () => Promise; metaMaskWalletIdConnectHandler: () => Promise; userId: string | undefined; @@ -63,7 +62,6 @@ interface IMetamaskProviderContext { export const MetamaskProviderContext = createContext({ projects: {}, setProjects: () => {}, - metaMaskConnectHandler: () => new Promise(() => {}), metaMaskDisconnect: () => new Promise(() => {}), metaMaskWalletIdConnectHandler: () => new Promise(() => {}), userId: undefined, @@ -125,16 +123,6 @@ export const LoginProvider = ({ children }) => { } catch (e) {} }; - const metaMaskConnectHandler = async () => { - try { - const accounts = await sdk.connect(); - setMetaMaskAccount(accounts); - if (accounts && accounts.length > 0) { - setMetaMaskAccount(accounts[0]); - } - } catch (e) {} - }; - useEffect(() => { const provider = sdk?.getProvider(); setMetaMaskProvider(provider); @@ -224,7 +212,6 @@ export const LoginProvider = ({ children }) => { setMetaMaskAccount, projects, setProjects, - metaMaskConnectHandler, metaMaskDisconnect, metaMaskWalletIdConnectHandler, userId,