diff --git a/src/routes/login/MetamaskLoginButton.js b/src/routes/login/MetamaskLoginButton.js index 567f4aa9..f20a706f 100644 --- a/src/routes/login/MetamaskLoginButton.js +++ b/src/routes/login/MetamaskLoginButton.js @@ -4,9 +4,11 @@ import MetaMaskOnboarding from "@metamask/onboarding"; import { useLazyGetMetamaskNonceQuery } from "../../app/services/auth"; import metamaskSvg from "../../assets/icons/metamask.svg?url"; import { StyledSocialButton } from "./styled"; +// import toast from "react-hot-toast"; export default function MetamaskLoginButton({ login }) { const [requesting, setRequesting] = useState(false); + const [accounts, setAccounts] = useState([]); const [getNonce] = useLazyGetMetamaskNonceQuery(); const onboarding = useRef(); @@ -14,21 +16,20 @@ export default function MetamaskLoginButton({ login }) { if (!onboarding.current) { onboarding.current = new MetaMaskOnboarding(); } - }, []); - const getSignature = async (address, nonce) => { - console.log("get sn"); - const signature = await ethereum.request({ - method: "personal_sign", - params: [nonce, address, "hello from rustchat"], - }); - return signature; - }; - const handleMetamaskLogin = async () => { + function handleNewAccounts(newAccounts) { + setAccounts(newAccounts); + } if (MetaMaskOnboarding.isMetaMaskInstalled()) { - setRequesting(true); - const [address] = await ethereum.request({ - method: "eth_requestAccounts", - }); + ethereum.on("accountsChanged", handleNewAccounts); + } + return () => { + if (MetaMaskOnboarding.isMetaMaskInstalled()) { + ethereum.removeListener("accountsChanged", handleNewAccounts); + } + }; + }, []); + useEffect(() => { + const startLoginWithMask = async (address) => { const { data: nonce, isSuccess } = await getNonce(address); if (isSuccess) { const signature = await getSignature(address, nonce); @@ -38,18 +39,53 @@ export default function MetamaskLoginButton({ login }) { signature, type: "metamask", }); + } + }; + if (MetaMaskOnboarding.isMetaMaskInstalled()) { + if (accounts.length > 0) { + // setButtonText(CONNECTED_TEXT); + const [address] = accounts; + startLoginWithMask(address); + setRequesting(true); + onboarding.current.stopOnboarding(); + } else { + // setButtonText(CONNECT_TEXT); setRequesting(false); } + } + }, [accounts]); + const getSignature = async (address, nonce) => { + console.log("get sn"); + const signature = await ethereum.request({ + method: "personal_sign", + params: [nonce, address, "hello from rustchat"], + }); + return signature; + }; + const handleMetamaskLogin = async () => { + console.log("wtfff", MetaMaskOnboarding.isMetaMaskInstalled()); + if (MetaMaskOnboarding.isMetaMaskInstalled()) { + setRequesting(true); + try { + const tmps = await ethereum.request({ + method: "eth_requestAccounts", + }); + setAccounts(tmps); + } catch (error) { + // toast.error(error.message); + ethereum.request({ + method: "wallet_requestPermissions", + params: [{ eth_accounts: {} }], + }); + // setRequesting(false); + } + setRequesting(false); } else { onboarding.current.startOnboarding(); } }; return ( - + meta mask icon Sign in with MetaMask