From 5e332b82b6bf85ba66f1741a0e42958c9efe4b0f Mon Sep 17 00:00:00 2001 From: einaralex Date: Wed, 7 Feb 2024 23:20:16 +0000 Subject: [PATCH] chore: update demo to use onrampkit 3.0.0 --- package.json | 2 +- src/store/accountAbstractionContext.tsx | 40 ++++++------- src/utils/snippets.ts | 15 ++--- yarn.lock | 77 +++++++++++++++++++++---- 4 files changed, 92 insertions(+), 42 deletions(-) diff --git a/package.json b/package.json index e0938e5..510296a 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ "@mui/material": "^5.14.19", "@safe-global/account-abstraction-kit-poc": "2.0.0", "@safe-global/auth-kit": "2.0.0", - "@safe-global/onramp-kit": "2.0.0", + "@safe-global/onramp-kit": "3.0.0", "@safe-global/protocol-kit": "2.0.0", "@safe-global/relay-kit": "2.0.0", "@safe-global/safe-react-components": "^2.0.6", diff --git a/src/store/accountAbstractionContext.tsx b/src/store/accountAbstractionContext.tsx index e061c3d..91fbbb8 100644 --- a/src/store/accountAbstractionContext.tsx +++ b/src/store/accountAbstractionContext.tsx @@ -3,7 +3,7 @@ import { ethers } from 'ethers' import AccountAbstraction from '@safe-global/account-abstraction-kit-poc' import { SafeAuthInitOptions, SafeAuthPack } from '@safe-global/auth-kit' -import { MoneriumPack, StripePack } from '@safe-global/onramp-kit' +import { MoneriumPack, SafeMoneriumClient, StripePack } from '@safe-global/onramp-kit' import { GelatoRelayPack } from '@safe-global/relay-kit' import { RelayResponse as GelatoRelayResponse } from '@gelatonetwork/relay-sdk' import Safe, { EthersAdapter } from '@safe-global/protocol-kit' @@ -216,6 +216,7 @@ const AccountAbstractionProvider = ({ children }: { children: JSX.Element }) => const pack = new MoneriumPack({ clientId: process.env.REACT_APP_MONERIUM_CLIENT_ID || '', + redirectUrl: process.env.REACT_APP_MONERIUM_REDIRECT_URL || '', environment: 'sandbox' }) @@ -227,21 +228,9 @@ const AccountAbstractionProvider = ({ children }: { children: JSX.Element }) => })() }, [web3Provider, safeSelected]) - const startMoneriumFlow = useCallback( - async (authCode?: string, refreshToken?: string) => { - if (!moneriumPack) return - - localStorage.setItem(MONERIUM_SELECTED_SAFE, safeSelected) - - const moneriumClient = await moneriumPack.open({ - redirectUrl: process.env.REACT_APP_MONERIUM_REDIRECT_URL, - authCode, - refreshToken - }) - + const fetchData = useCallback( + async (moneriumClient: SafeMoneriumClient) => { if (moneriumClient.bearerProfile) { - localStorage.setItem(MONERIUM_TOKEN, moneriumClient.bearerProfile.refresh_token) - const authContext = await moneriumClient.getAuthContext() const profile = await moneriumClient.getProfile(authContext.defaultProfile) const balances = await moneriumClient.getBalances(authContext.defaultProfile) @@ -249,9 +238,19 @@ const AccountAbstractionProvider = ({ children }: { children: JSX.Element }) => setMoneriumInfo(getMoneriumInfo(safeSelected, authContext, profile, balances)) } }, - [moneriumPack, safeSelected] + [safeSelected] ) + const startMoneriumFlow = useCallback(async () => { + if (!moneriumPack) return + + localStorage.setItem(MONERIUM_SELECTED_SAFE, safeSelected) + + const moneriumClient = await moneriumPack.open({ initiateAuthFlow: true }) + + fetchData(moneriumClient) + }, [moneriumPack, safeSelected, fetchData]) + const closeMoneriumFlow = useCallback(() => { moneriumPack?.close() localStorage.removeItem(MONERIUM_TOKEN) @@ -259,11 +258,12 @@ const AccountAbstractionProvider = ({ children }: { children: JSX.Element }) => }, [moneriumPack]) useEffect(() => { - const authCode = new URLSearchParams(window.location.search).get('code') || undefined - const refreshToken = localStorage.getItem(MONERIUM_TOKEN) || undefined + ;(async () => { + const moneriumClient = (await moneriumPack?.open()) as SafeMoneriumClient - if (authCode || refreshToken) startMoneriumFlow(authCode, refreshToken) - }, [startMoneriumFlow]) + fetchData(moneriumClient) + })() + }, [moneriumPack, fetchData]) // TODO: add disconnect owner wallet logic ? diff --git a/src/utils/snippets.ts b/src/utils/snippets.ts index a12b2f9..0b8ffca 100644 --- a/src/utils/snippets.ts +++ b/src/utils/snippets.ts @@ -72,6 +72,7 @@ const safeSdk = await Safe.create({ const moneriumPack = new MoneriumPack({ clientId: process.env.REACT_APP_MONERIUM_CLIENT_ID || '', + redirectUrl: 'http://localhost:3000', environment: 'sandbox' }) @@ -79,21 +80,17 @@ await moneriumPack.init({ safeSdk }) -const moneriumClient = await moneriumPack.open({ - redirectUrl: 'http://localhost:3000', - authCode, - refreshToken -}) +// On-click action to initiate the authorization flow, this will redirect the user to login to Monerium. +await moneriumPack.open({ initiateAuthFlow: true }) + +// On render action to check if the user is already authorized, if so we can get the Monerium client directly. +const moneriumClient = await moneriumPack.open() const authContext = await moneriumClient.getAuthContext() const profile = await moneriumClient.getProfile(authContext.defaultProfile) const balances = await moneriumClient.getBalances() const orders = await moneriumClient.getOrders() -if (moneriumClient.bearerProfile) { - localStorage.setItem(MONERIUM_TOKEN, moneriumClient.bearerProfile.refresh_token) -} - moneriumPack.subscribe(OrderState.pending, (notification) => { console.log(notification.meta.state) }) diff --git a/yarn.lock b/yarn.lock index a560960..f0bb90d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2136,10 +2136,12 @@ semver "^7.5.4" superstruct "^1.0.3" -"@monerium/sdk@2.6.5": - version "2.6.5" - resolved "https://registry.yarnpkg.com/@monerium/sdk/-/sdk-2.6.5.tgz#ccb84ef96420f008e6e67bd146d710ba204a0b8f" - integrity sha512-fEAJk2gNuirzub2IacICQ2khONeHpUD1LbEtq1RXBDPRusCmftDYufQRnv6oQBSw+prTHGnvzo2gU/0q4HszEw== +"@monerium/sdk@^2.9.0": + version "2.11.0" + resolved "https://registry.yarnpkg.com/@monerium/sdk/-/sdk-2.11.0.tgz#d926609bcbd9c2c87a3b3c755c71da35c47f0cd8" + integrity sha512-GyNKnlpLu+jsp7cV/FsR4G993Y5zix0cCQu5c574M24wGzw7aK+uWEphRK9/DKCwR590Y9IXmnYcxQMLp4ahag== + dependencies: + crypto-js "^4.2.0" "@mui/base@5.0.0-beta.25": version "5.0.0-beta.25" @@ -2273,6 +2275,11 @@ resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.3.2.tgz#6f26dbc8fbc7205873ce3cee2f690eba0d421b39" integrity sha512-MVC8EAQp7MvEcm30KWENFjgR+Mkmf+D189XJTkFIlwohU5hcBbn1ZkKq7KVTi2Hme3PMGF390DaL52beVrIihQ== +"@noble/hashes@^1.3.3": + version "1.3.3" + resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.3.3.tgz#39908da56a4adc270147bb07968bf3b16cfe1699" + integrity sha512-V7/fPHgl+jsVPXqqeOzT8egNj2iBIVt+ECeMMG8TdcnTikP3oaBtUVqpT/gYCR68aEBJSF+XbYUxStjbFMqIIA== + "@noble/secp256k1@1.7.1", "@noble/secp256k1@~1.7.0": version "1.7.1" resolved "https://registry.yarnpkg.com/@noble/secp256k1/-/secp256k1-1.7.1.tgz#b251c70f824ce3ca7f8dc3df08d58f005cc0507c" @@ -2380,6 +2387,16 @@ ethers "^6.7.1" node-fetch "^2.7.0" +"@safe-global/api-kit@^2.1.0": + version "2.1.0" + resolved "https://registry.yarnpkg.com/@safe-global/api-kit/-/api-kit-2.1.0.tgz#ae87aadf15d508549fbb115e601317d568a6a11a" + integrity sha512-pobd2UtvmuUVXn42u6IEW/Lm6ltYx0JBR7qKBigcK3XtNNffYHsS8qIKoDYmG9GG34b+pPLOyLtENcgrYLpzvw== + dependencies: + "@safe-global/protocol-kit" "^3.0.0" + "@safe-global/safe-core-sdk-types" "^4.0.0" + ethers "^6.7.1" + node-fetch "^2.7.0" + "@safe-global/auth-kit@2.0.0": version "2.0.0" resolved "https://registry.yarnpkg.com/@safe-global/auth-kit/-/auth-kit-2.0.0.tgz#d4ad31f5d14d753b9d0be9250ac8e928ee10b759" @@ -2390,15 +2407,15 @@ "@web3auth/safeauth-embed" "^0.0.0" ethers "^6.7.1" -"@safe-global/onramp-kit@2.0.0": - version "2.0.0" - resolved "https://registry.yarnpkg.com/@safe-global/onramp-kit/-/onramp-kit-2.0.0.tgz#12f6847c5e51ef5973c6f9bd2cfe250c5f169142" - integrity sha512-B82BM/1IEptt5OHjS+bEYiAVD0hKpu82cBpVow675xSjmhNMkRxu9LdXIWgY6PYTgSIx2RZfujLOw3aOOmUMkg== +"@safe-global/onramp-kit@3.0.0": + version "3.0.0" + resolved "https://registry.yarnpkg.com/@safe-global/onramp-kit/-/onramp-kit-3.0.0.tgz#b27fe4ec0a5d9e46b13a3fe6cb710e8eb392359f" + integrity sha512-BxWOtrxGMZoMDKnPRX5z251f0Kj0x/NvFYNLhQuMca4DmRq50IY7TH6UHUyfTm0i+7cF1h++k3jdUoY5eMOEwA== dependencies: - "@monerium/sdk" "2.6.5" - "@safe-global/api-kit" "^2.0.0" - "@safe-global/protocol-kit" "^2.0.0" - "@safe-global/safe-core-sdk-types" "^3.0.0" + "@monerium/sdk" "^2.9.0" + "@safe-global/api-kit" "^2.1.0" + "@safe-global/protocol-kit" "^3.0.0" + "@safe-global/safe-core-sdk-types" "^4.0.0" "@stripe/crypto" "^0.0.4" "@stripe/stripe-js" "^1.54.2" ethers "^6.7.1" @@ -2417,6 +2434,20 @@ web3-core "^1.10.3" web3-utils "^1.10.3" +"@safe-global/protocol-kit@^3.0.0": + version "3.0.0" + resolved "https://registry.yarnpkg.com/@safe-global/protocol-kit/-/protocol-kit-3.0.0.tgz#9db15a214bf307af81b082eab329b33642d5acd8" + integrity sha512-0x/VqxWQvjUpkK9VeO/llfYMNoUV/Zngq3PKD8mC3H40v/KzOa2jUSgwxkTiRJRxH1cjuwAG+tXcdVluk73Wfw== + dependencies: + "@noble/hashes" "^1.3.3" + "@safe-global/safe-deployments" "^1.32.0" + ethereumjs-util "^7.1.5" + ethers "^6.7.1" + semver "^7.5.4" + web3 "^1.10.3" + web3-core "^1.10.3" + web3-utils "^1.10.3" + "@safe-global/relay-kit@2.0.0", "@safe-global/relay-kit@^2.0.0": version "2.0.0" resolved "https://registry.yarnpkg.com/@safe-global/relay-kit/-/relay-kit-2.0.0.tgz#542cf6916296973ba1df501dd56a245f2a42a1ac" @@ -2436,6 +2467,16 @@ web3-core "^1.10.3" web3-utils "^1.10.3" +"@safe-global/safe-core-sdk-types@^4.0.0": + version "4.0.0" + resolved "https://registry.yarnpkg.com/@safe-global/safe-core-sdk-types/-/safe-core-sdk-types-4.0.0.tgz#68f6206d14cac077986f99d8c9b75348d63cf5f3" + integrity sha512-KZPkCK3Ttnt3nSqn+M/rkkaY6ZZXy/vBC8lvI3lp3Y8SRgERdIymgLYqiizs+JTT9FZk+IFwfCaZz+4gFqvmpw== + dependencies: + "@safe-global/safe-deployments" "^1.32.0" + ethers "^6.7.1" + web3-core "^1.10.3" + web3-utils "^1.10.3" + "@safe-global/safe-deployments@^1.28.0": version "1.28.0" resolved "https://registry.yarnpkg.com/@safe-global/safe-deployments/-/safe-deployments-1.28.0.tgz#9984b513999e5a1cd4449ed2c1ba9a66cb5b223c" @@ -2443,6 +2484,13 @@ dependencies: semver "^7.3.7" +"@safe-global/safe-deployments@^1.32.0": + version "1.32.0" + resolved "https://registry.yarnpkg.com/@safe-global/safe-deployments/-/safe-deployments-1.32.0.tgz#3632194d883aa07bd446a6e530e825ba022c9b76" + integrity sha512-7RXmnBrUzJ9+Iat74yx3Gel0kygmsaWjJhqr+0Fy8mkP5ly/6dTZ/2ize1pv3j9Yal04NTOqXbaJG4JnbTANQw== + dependencies: + semver "^7.3.7" + "@safe-global/safe-react-components@^2.0.6": version "2.0.6" resolved "https://registry.yarnpkg.com/@safe-global/safe-react-components/-/safe-react-components-2.0.6.tgz#795a3506b84806e43a50171e71ad5bde3a36f012" @@ -4883,6 +4931,11 @@ crypto-browserify@^3.12.0: randombytes "^2.0.0" randomfill "^1.0.3" +crypto-js@^4.2.0: + version "4.2.0" + resolved "https://registry.yarnpkg.com/crypto-js/-/crypto-js-4.2.0.tgz#4d931639ecdfd12ff80e8186dba6af2c2e856631" + integrity sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q== + crypto-random-string@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-2.0.0.tgz#ef2a7a966ec11083388369baa02ebead229b30d5"