From 3267844c5f9873a7571ceb1af42e3b81268cf72a Mon Sep 17 00:00:00 2001 From: LautaroPetaccio Date: Thu, 31 Oct 2024 16:36:21 -0300 Subject: [PATCH] feat: Use Magic OAuth V2 to log in --- package-lock.json | 25 ++++++++++++++++--- package.json | 3 ++- .../Pages/CallbackPage/CallbackPage.tsx | 4 +-- src/components/Pages/LoginPage/utils.ts | 6 ++--- 4 files changed, 28 insertions(+), 10 deletions(-) diff --git a/package-lock.json b/package-lock.json index 363b3eb..36c184f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,8 @@ "@dcl/schemas": "^9.8.0", "@dcl/single-sign-on-client": "^0.1.0", "@dcl/ui-env": "^1.4.0", - "@magic-ext/oauth": "^15.1.1", + "@magic-ext/oauth": "^22.16.0", + "@magic-ext/oauth2": "^9.16.0", "@well-known-components/fetch-component": "^2.0.2", "ajv": "^8.12.0", "classnames": "^2.3.2", @@ -2056,9 +2057,17 @@ } }, "node_modules/@magic-ext/oauth": { - "version": "15.5.0", - "resolved": "https://registry.npmjs.org/@magic-ext/oauth/-/oauth-15.5.0.tgz", - "integrity": "sha512-q9k5IrFwzaVLJauoHmnj11r7bJQ22PZ41CEys3GmDpLB5Xz5iavqB2vyGkZz1r7bU48i5ZqK0qyvQe7it4j4YA==", + "version": "22.16.0", + "resolved": "https://registry.npmjs.org/@magic-ext/oauth/-/oauth-22.16.0.tgz", + "integrity": "sha512-X477smuZt3c5XI81vvMjdnLe27HjBaHyqj8Oso2OU7EbEMACY3vEcRjure5fwJOiKBmGaV48o48dSvf0J/k78A==", + "dependencies": { + "crypto-js": "^3.3.0" + } + }, + "node_modules/@magic-ext/oauth2": { + "version": "9.16.0", + "resolved": "https://registry.npmjs.org/@magic-ext/oauth2/-/oauth2-9.16.0.tgz", + "integrity": "sha512-+ixOFjjLZtbk7GgRdzfGKpREGZUyqpIjXDftUjNOlgbaroBBjqrVj4scnzz06VQwCuiWotZ4ZU1vSFz/NszotQ==", "dependencies": { "crypto-js": "^3.3.0" } @@ -6208,6 +6217,14 @@ "mitt": "^3.0.1" } }, + "node_modules/decentraland-connect/node_modules/@magic-ext/oauth": { + "version": "15.6.0", + "resolved": "https://registry.npmjs.org/@magic-ext/oauth/-/oauth-15.6.0.tgz", + "integrity": "sha512-OBLxdPUvL+kW/DIxH8V5Fp4rjkV7LdFfVkRHdy6dPBhdbJjpD9/XOReNZnWa45OHx7+OOl1OocPtXn9hEAFoyQ==", + "dependencies": { + "crypto-js": "^3.3.0" + } + }, "node_modules/decentraland-connect/node_modules/tslib": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", diff --git a/package.json b/package.json index 260779f..52ae5b6 100644 --- a/package.json +++ b/package.json @@ -29,7 +29,8 @@ "@dcl/schemas": "^9.8.0", "@dcl/single-sign-on-client": "^0.1.0", "@dcl/ui-env": "^1.4.0", - "@magic-ext/oauth": "^15.1.1", + "@magic-ext/oauth": "^22.16.0", + "@magic-ext/oauth2": "^9.16.0", "@well-known-components/fetch-component": "^2.0.2", "ajv": "^8.12.0", "classnames": "^2.3.2", diff --git a/src/components/Pages/CallbackPage/CallbackPage.tsx b/src/components/Pages/CallbackPage/CallbackPage.tsx index 51afc6d..d141b43 100644 --- a/src/components/Pages/CallbackPage/CallbackPage.tsx +++ b/src/components/Pages/CallbackPage/CallbackPage.tsx @@ -38,7 +38,7 @@ export const CallbackPage = () => { // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore // eslint-disable-next-line @typescript-eslint/naming-convention - const { OAuthExtension } = await import('@magic-ext/oauth') + const { OAuthExtension } = await import('@magic-ext/oauth2') const magic = new Magic(MAGIC_KEY, { extensions: [new OAuthExtension()] @@ -46,7 +46,7 @@ export const CallbackPage = () => { try { setConnectionModalState(ConnectionModalState.VALIDATING_SIGN_IN) - await magic?.oauth.getRedirectResult() + await magic?.oauth2.getRedirectResult() setConnectionModalState(ConnectionModalState.WAITING_FOR_CONFIRMATION) } catch (error) { console.log(error) diff --git a/src/components/Pages/LoginPage/utils.ts b/src/components/Pages/LoginPage/utils.ts index f2445cd..ad45ff9 100644 --- a/src/components/Pages/LoginPage/utils.ts +++ b/src/components/Pages/LoginPage/utils.ts @@ -1,4 +1,4 @@ -import { OAuthProvider } from '@magic-ext/oauth' +import type { OAuthProvider } from '@magic-ext/oauth2' import { ethers } from 'ethers' import { AuthIdentity, Authenticator } from '@dcl/crypto' import { ProviderType } from '@dcl/schemas/dist/dapps/provider-type' @@ -57,7 +57,7 @@ export async function connectToProvider(connectionOption: ConnectionOptionType): // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore // eslint-disable-next-line @typescript-eslint/naming-convention - const { OAuthExtension } = await import('@magic-ext/oauth') + const { OAuthExtension } = await import('@magic-ext/oauth2') const magic = new Magic(MAGIC_KEY, { extensions: [new OAuthExtension()] }) @@ -65,7 +65,7 @@ export async function connectToProvider(connectionOption: ConnectionOptionType): const url = new URL(window.location.href) url.pathname = '/auth/callback' - await magic.oauth.loginWithRedirect({ + await magic?.oauth2.loginWithRedirect({ provider: connectionOption === ConnectionOptionType.X ? 'twitter' : (connectionOption as OAuthProvider), redirectURI: url.href })