From 3882dca5a9feb841419ae44337e1fc07fb2cdc34 Mon Sep 17 00:00:00 2001 From: linna Date: Wed, 30 Oct 2024 16:45:05 -0400 Subject: [PATCH 01/31] chore: local dev changes updated --- examples/ui-demo/src/app/config.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/examples/ui-demo/src/app/config.tsx b/examples/ui-demo/src/app/config.tsx index accff74ead..84261e82bb 100644 --- a/examples/ui-demo/src/app/config.tsx +++ b/examples/ui-demo/src/app/config.tsx @@ -77,6 +77,7 @@ export const alchemyConfig = () => policyId: process.env.NEXT_PUBLIC_PAYMASTER_POLICY_ID, storage: cookieStorage, enablePopupOauth: true, + oauthCallbackUrl: "http://localhost:6288/callback", }, { illustrationStyle: DEFAULT_CONFIG.ui.illustrationStyle, From 0a638917a6cd862dd022dc7a9a8f681b4b00be7c Mon Sep 17 00:00:00 2001 From: linna Date: Mon, 4 Nov 2024 17:32:23 -0500 Subject: [PATCH 02/31] chore: wip oauth redirect with add passkey after signup --- .../components/auth/card/loading/oauth.tsx | 9 ++++-- .../react/src/components/auth/context.ts | 1 + account-kit/signer/src/client/index.ts | 4 ++- account-kit/signer/src/signer.ts | 30 ++++++++++++------- examples/ui-demo/src/app/config.tsx | 14 +++++++-- examples/ui-demo/src/app/sections.ts | 3 +- 6 files changed, 45 insertions(+), 16 deletions(-) diff --git a/account-kit/react/src/components/auth/card/loading/oauth.tsx b/account-kit/react/src/components/auth/card/loading/oauth.tsx index 9dbf963952..651c31d7eb 100644 --- a/account-kit/react/src/components/auth/card/loading/oauth.tsx +++ b/account-kit/react/src/components/auth/card/loading/oauth.tsx @@ -5,17 +5,22 @@ import { capitalize } from "../../../../utils.js"; import { useAuthContext } from "../../context.js"; import { useOAuthVerify } from "../../hooks/useOAuthVerify.js"; import { ConnectionError } from "../error/connection-error.js"; +import { useSigner } from "../../../../hooks/useSigner.js"; export const CompletingOAuth = () => { const { isConnected } = useSignerStatus(); const { setAuthStep, authStep } = useAuthContext("oauth_completing"); const { authenticate } = useOAuthVerify({ config: authStep.config }); + const signer = useSigner(); useEffect(() => { - if (isConnected) { + if (isConnected && authStep.createPasskeyAfter && signer!.isSignup) { + // TO DO: pull query param to check if isSignup + setAuthStep({ type: "passkey_create" }); + } else if (isConnected) { setAuthStep({ type: "complete" }); } - }, [isConnected, setAuthStep]); + }, [authStep.createPasskeyAfter, isConnected, setAuthStep, signer]); if (authStep.error) { return ( diff --git a/account-kit/react/src/components/auth/context.ts b/account-kit/react/src/components/auth/context.ts index 4636bd0c7f..d889eb4ad1 100644 --- a/account-kit/react/src/components/auth/context.ts +++ b/account-kit/react/src/components/auth/context.ts @@ -13,6 +13,7 @@ export type AuthStep = | { type: "oauth_completing"; config: Extract; + createPasskeyAfter?: boolean; error?: Error; } | { type: "initial"; error?: Error } diff --git a/account-kit/signer/src/client/index.ts b/account-kit/signer/src/client/index.ts index ac0ac61e5a..d454e2ed30 100644 --- a/account-kit/signer/src/client/index.ts +++ b/account-kit/signer/src/client/index.ts @@ -672,7 +672,9 @@ export class AlchemySignerWebClient extends BaseSignerClient if (this.oauthConfig) { return this.oauthConfig; } else if (mode === "redirect") { - return this.initOauth(); + const temp = this.initOauth(); + console.log("CLIENT ID", (await temp).authProviders[0].clientId); + return temp; } else { throw new Error( "enablePopupOauth must be set in configuration or signer.preparePopupOauth must be called before using popup-based OAuth login" diff --git a/account-kit/signer/src/signer.ts b/account-kit/signer/src/signer.ts index 207a2fb5df..ceefa0e94e 100644 --- a/account-kit/signer/src/signer.ts +++ b/account-kit/signer/src/signer.ts @@ -79,6 +79,7 @@ export type AlchemySignerParams = z.input; * A SmartAccountSigner that can be used with any SmartContractAccount */ export class AlchemyWebSigner extends BaseAlchemySigner { + public isSignup: boolean; /** * Initializes an instance with the provided Alchemy signer parameters after parsing them with a schema. * @@ -110,16 +111,23 @@ export class AlchemyWebSigner extends BaseAlchemySigner } else { client = params_.client; } - const { emailBundle, oauthBundle, oauthOrgId, oauthError, idToken } = - getAndRemoveQueryParams({ - emailBundle: "bundle", - // We don't need this, but we still want to remove it from the URL. - emailOrgId: "orgId", - oauthBundle: "alchemy-bundle", - oauthOrgId: "alchemy-org-id", - oauthError: "alchemy-error", - idToken: "alchemy-id-token", - }); + const { + emailBundle, + oauthBundle, + oauthOrgId, + oauthError, + idToken, + _isSignup, + } = getAndRemoveQueryParams({ + emailBundle: "bundle", + // We don't need this, but we still want to remove it from the URL. + emailOrgId: "orgId", + oauthBundle: "alchemy-bundle", + oauthOrgId: "alchemy-org-id", + oauthError: "alchemy-error", + idToken: "alchemy-id-token", + _isSignup: "aa-is-signup", + }); const initialError = oauthError != null @@ -128,6 +136,8 @@ export class AlchemyWebSigner extends BaseAlchemySigner super({ client, sessionConfig, initialError }); + this.isSignup = _isSignup === "true" ? true : false; + if (emailBundle) { this.authenticate({ type: "email", bundle: emailBundle }); } else if (oauthBundle && oauthOrgId && idToken) { diff --git a/examples/ui-demo/src/app/config.tsx b/examples/ui-demo/src/app/config.tsx index 84261e82bb..aba95469ec 100644 --- a/examples/ui-demo/src/app/config.tsx +++ b/examples/ui-demo/src/app/config.tsx @@ -86,8 +86,18 @@ export const alchemyConfig = () => [{ type: "email" }], [ { type: "passkey" }, - { type: "social", authProviderId: "google", mode: "popup" }, - { type: "social", authProviderId: "facebook", mode: "popup" }, + { + type: "social", + authProviderId: "google", + mode: "redirect", + redirectUrl: "http://localhost:3000", + }, + { + type: "social", + authProviderId: "facebook", + mode: "redirect", + redirectUrl: "http://localhost:3000", + }, ], ], addPasskeyOnSignup: DEFAULT_CONFIG.auth.addPasskey, diff --git a/examples/ui-demo/src/app/sections.ts b/examples/ui-demo/src/app/sections.ts index 90985f5d3f..f9c7e0d4ef 100644 --- a/examples/ui-demo/src/app/sections.ts +++ b/examples/ui-demo/src/app/sections.ts @@ -19,7 +19,8 @@ export function getSectionsForConfig( midSection.push({ type: "social", authProviderId: method as KnownAuthProvider, // TODO: extend for BYO auth provider - mode: "popup", + mode: "redirect", + redirectUrl: "http://localhost:3000", }); } } From bf02b3cf8dfd213db6c74359ea1fadbbba6280bc Mon Sep 17 00:00:00 2001 From: linna Date: Fri, 8 Nov 2024 11:05:24 -0500 Subject: [PATCH 03/31] chore: wip --- .../react/src/components/auth/card/index.tsx | 24 +++++++++++++++++-- .../components/auth/card/loading/oauth.tsx | 16 ++++++------- .../react/src/components/auth/context.ts | 2 +- account-kit/react/src/context.tsx | 6 +++++ 4 files changed, 36 insertions(+), 12 deletions(-) diff --git a/account-kit/react/src/components/auth/card/index.tsx b/account-kit/react/src/components/auth/card/index.tsx index f991672916..261dabf41c 100644 --- a/account-kit/react/src/components/auth/card/index.tsx +++ b/account-kit/react/src/components/auth/card/index.tsx @@ -17,7 +17,7 @@ import { Footer } from "../sections/Footer.js"; import { Step } from "./steps.js"; import { disconnect } from "@account-kit/core"; import { useAlchemyAccountContext } from "../../../context.js"; - +import { useSigner } from "../../../hooks/useSigner.js"; export type AuthCardProps = { className?: string; }; @@ -61,6 +61,7 @@ export const AuthCardContent = ({ const { status, isAuthenticating } = useSignerStatus(); const { authStep, setAuthStep } = useAuthContext(); const { config } = useAlchemyAccountContext(); + const signer = useSigner(); const didGoBack = useRef(false); @@ -124,11 +125,29 @@ export const AuthCardContent = ({ onAuthSuccess?.(); } else if (authStep.type !== "initial") { didGoBack.current = false; - } else if (!didGoBack.current && isAuthenticating) { + } else if ( + !didGoBack.current && + isAuthenticating && + status === "AUTHENTICATING_EMAIL" + ) { setAuthStep({ type: "email_completing", createPasskeyAfter: addPasskeyOnSignup, }); + } else if ( + !didGoBack.current && + isAuthenticating && + status === "AUTHENTICATING_OAUTH" + ) { + console.log(status); + console.log(isAuthenticating); + console.log(authStep.type); + console.log(addPasskeyOnSignup); + setAuthStep({ + type: "oauth_completing", + createPasskeyAfter: + addPasskeyOnSignup && signer?.isSignup ? true : false, + }); } }, [ authStep, @@ -139,6 +158,7 @@ export const AuthCardContent = ({ openAuthModal, closeAuthModal, addPasskeyOnSignup, + signer?.isSignup, ]); return ( diff --git a/account-kit/react/src/components/auth/card/loading/oauth.tsx b/account-kit/react/src/components/auth/card/loading/oauth.tsx index 651c31d7eb..3634603f7a 100644 --- a/account-kit/react/src/components/auth/card/loading/oauth.tsx +++ b/account-kit/react/src/components/auth/card/loading/oauth.tsx @@ -5,28 +5,26 @@ import { capitalize } from "../../../../utils.js"; import { useAuthContext } from "../../context.js"; import { useOAuthVerify } from "../../hooks/useOAuthVerify.js"; import { ConnectionError } from "../error/connection-error.js"; -import { useSigner } from "../../../../hooks/useSigner.js"; export const CompletingOAuth = () => { const { isConnected } = useSignerStatus(); const { setAuthStep, authStep } = useAuthContext("oauth_completing"); - const { authenticate } = useOAuthVerify({ config: authStep.config }); - const signer = useSigner(); + const { authenticate } = useOAuthVerify({ config: authStep.config! }); useEffect(() => { - if (isConnected && authStep.createPasskeyAfter && signer!.isSignup) { + if (isConnected && authStep.createPasskeyAfter) { // TO DO: pull query param to check if isSignup setAuthStep({ type: "passkey_create" }); } else if (isConnected) { setAuthStep({ type: "complete" }); } - }, [authStep.createPasskeyAfter, isConnected, setAuthStep, signer]); + }, [authStep.createPasskeyAfter, isConnected, setAuthStep]); if (authStep.error) { return ( setAuthStep({ type: "initial" })} /> @@ -36,15 +34,15 @@ export const CompletingOAuth = () => { return (
- +

{`Continue with ${capitalize( - authStep.config.authProviderId + authStep.config!.authProviderId )}`}

{`Follow the steps in the pop up window to sign in with ${capitalize( - authStep.config.authProviderId + authStep.config!.authProviderId )}`}

diff --git a/account-kit/react/src/components/auth/context.ts b/account-kit/react/src/components/auth/context.ts index d889eb4ad1..e6d7eabed2 100644 --- a/account-kit/react/src/components/auth/context.ts +++ b/account-kit/react/src/components/auth/context.ts @@ -12,7 +12,7 @@ export type AuthStep = | { type: "email_completing"; createPasskeyAfter?: boolean } | { type: "oauth_completing"; - config: Extract; + config?: Extract; createPasskeyAfter?: boolean; error?: Error; } diff --git a/account-kit/react/src/context.tsx b/account-kit/react/src/context.tsx index 63315b6871..f3f4d913ae 100644 --- a/account-kit/react/src/context.tsx +++ b/account-kit/react/src/context.tsx @@ -137,6 +137,12 @@ export const AlchemyAccountProvider = ( }; } + if (status === AlchemySignerStatus.AUTHENTICATING_OAUTH) { + return { + type: "oauth_completing", + }; + } + return { type: "initial", }; From 5d5951ae597a38e13bb9f73fc073ce6f860976cc Mon Sep 17 00:00:00 2001 From: Michael Moldoveanu Date: Fri, 8 Nov 2024 12:02:02 -0500 Subject: [PATCH 04/31] refactor: remove a few things so we can test redirect --- account-kit/react/src/components/auth/card/index.tsx | 2 +- account-kit/react/src/components/auth/context.ts | 2 +- account-kit/react/src/context.tsx | 5 ----- 3 files changed, 2 insertions(+), 7 deletions(-) diff --git a/account-kit/react/src/components/auth/card/index.tsx b/account-kit/react/src/components/auth/card/index.tsx index 261dabf41c..4af459895a 100644 --- a/account-kit/react/src/components/auth/card/index.tsx +++ b/account-kit/react/src/components/auth/card/index.tsx @@ -146,7 +146,7 @@ export const AuthCardContent = ({ setAuthStep({ type: "oauth_completing", createPasskeyAfter: - addPasskeyOnSignup && signer?.isSignup ? true : false, + addPasskeyOnSignup }); } }, [ diff --git a/account-kit/react/src/components/auth/context.ts b/account-kit/react/src/components/auth/context.ts index e6d7eabed2..d889eb4ad1 100644 --- a/account-kit/react/src/components/auth/context.ts +++ b/account-kit/react/src/components/auth/context.ts @@ -12,7 +12,7 @@ export type AuthStep = | { type: "email_completing"; createPasskeyAfter?: boolean } | { type: "oauth_completing"; - config?: Extract; + config: Extract; createPasskeyAfter?: boolean; error?: Error; } diff --git a/account-kit/react/src/context.tsx b/account-kit/react/src/context.tsx index f3f4d913ae..e2480e24d9 100644 --- a/account-kit/react/src/context.tsx +++ b/account-kit/react/src/context.tsx @@ -137,11 +137,6 @@ export const AlchemyAccountProvider = ( }; } - if (status === AlchemySignerStatus.AUTHENTICATING_OAUTH) { - return { - type: "oauth_completing", - }; - } return { type: "initial", From ee46248daa43427732beeff4f1ce87fadcd868af Mon Sep 17 00:00:00 2001 From: moldy Date: Fri, 8 Nov 2024 12:19:15 -0500 Subject: [PATCH 05/31] refactor: just render the pop-up on completed login for oauth --- .../react/src/components/auth/card/index.tsx | 22 +++++++++---------- .../src/components/auth/hooks/usePrevious.ts | 11 ++++++++++ 2 files changed, 22 insertions(+), 11 deletions(-) create mode 100644 account-kit/react/src/components/auth/hooks/usePrevious.ts diff --git a/account-kit/react/src/components/auth/card/index.tsx b/account-kit/react/src/components/auth/card/index.tsx index 4af459895a..4fa91ac54d 100644 --- a/account-kit/react/src/components/auth/card/index.tsx +++ b/account-kit/react/src/components/auth/card/index.tsx @@ -1,5 +1,6 @@ "use client"; +import { disconnect } from "@account-kit/core"; import { useCallback, useEffect, @@ -7,17 +8,16 @@ import { useRef, type PropsWithChildren, } from "react"; +import { useAlchemyAccountContext } from "../../../context.js"; import { useAuthConfig } from "../../../hooks/internal/useAuthConfig.js"; import { useAuthModal } from "../../../hooks/useAuthModal.js"; import { useElementHeight } from "../../../hooks/useElementHeight.js"; import { useSignerStatus } from "../../../hooks/useSignerStatus.js"; import { Navigation } from "../../navigation.js"; import { useAuthContext } from "../context.js"; +import { usePrevious } from "../hooks/usePrevious.js"; import { Footer } from "../sections/Footer.js"; import { Step } from "./steps.js"; -import { disconnect } from "@account-kit/core"; -import { useAlchemyAccountContext } from "../../../context.js"; -import { useSigner } from "../../../hooks/useSigner.js"; export type AuthCardProps = { className?: string; }; @@ -58,10 +58,10 @@ export const AuthCardContent = ({ showClose?: boolean; }) => { const { openAuthModal, closeAuthModal } = useAuthModal(); - const { status, isAuthenticating } = useSignerStatus(); + const { status, isAuthenticating, isConnected } = useSignerStatus(); + const previousStatus = usePrevious(status); const { authStep, setAuthStep } = useAuthContext(); const { config } = useAlchemyAccountContext(); - const signer = useSigner(); const didGoBack = useRef(false); @@ -136,17 +136,16 @@ export const AuthCardContent = ({ }); } else if ( !didGoBack.current && - isAuthenticating && - status === "AUTHENTICATING_OAUTH" + addPasskeyOnSignup && + isConnected && + previousStatus === "AUTHENTICATING_OAUTH" ) { console.log(status); console.log(isAuthenticating); console.log(authStep.type); console.log(addPasskeyOnSignup); setAuthStep({ - type: "oauth_completing", - createPasskeyAfter: - addPasskeyOnSignup + type: "passkey_create", }); } }, [ @@ -158,7 +157,8 @@ export const AuthCardContent = ({ openAuthModal, closeAuthModal, addPasskeyOnSignup, - signer?.isSignup, + isConnected, + previousStatus, ]); return ( diff --git a/account-kit/react/src/components/auth/hooks/usePrevious.ts b/account-kit/react/src/components/auth/hooks/usePrevious.ts new file mode 100644 index 0000000000..e4099a6f17 --- /dev/null +++ b/account-kit/react/src/components/auth/hooks/usePrevious.ts @@ -0,0 +1,11 @@ +import { useEffect, useRef } from "react"; + +export const usePrevious = (thing: T) => { + const previous = useRef(); + + useEffect(() => { + previous.current = thing; + }, [thing]); + + return previous.current; +}; From 13b1156fce08424349aec694b068c68d6021dd62 Mon Sep 17 00:00:00 2001 From: moldy Date: Fri, 8 Nov 2024 13:22:28 -0500 Subject: [PATCH 06/31] refactor: add new user signup event in signer --- account-kit/core/src/store/store.ts | 2 ++ account-kit/signer/src/base.ts | 23 ++++++++++++++++++-- account-kit/signer/src/signer.ts | 17 ++++++++++----- account-kit/signer/src/types.ts | 1 + examples/ui-demo/src/hooks/useBreakpoint.tsx | 8 +++---- 5 files changed, 39 insertions(+), 12 deletions(-) diff --git a/account-kit/core/src/store/store.ts b/account-kit/core/src/store/store.ts index 3fb082e481..f444a1bdf3 100644 --- a/account-kit/core/src/store/store.ts +++ b/account-kit/core/src/store/store.ts @@ -273,6 +273,8 @@ const addClientSideStoreListeners = (store: Store) => { })); }); + signer.on("newUserSignup", () => console.log("got new user signup")); + signer.on("connected", (user) => store.setState({ user })); signer.on("disconnected", () => { diff --git a/account-kit/signer/src/base.ts b/account-kit/signer/src/base.ts index 6ed409d9a7..b28afd7934 100644 --- a/account-kit/signer/src/base.ts +++ b/account-kit/signer/src/base.ts @@ -46,6 +46,7 @@ type AlchemySignerStore = { user: User | null; status: AlchemySignerStatus; error: ErrorInfo | null; + isNewUser?: boolean; }; type InternalStore = Mutate< @@ -152,6 +153,14 @@ export abstract class BaseAlchemySigner ), { fireImmediately: true } ); + case "newUserSignup": + return this.store.subscribe( + ({ isNewUser }) => isNewUser, + (isNewUser) => { + if (isNewUser) (listener as AlchemySignerEvents["newUserSignup"])(); + }, + { fireImmediately: true } + ); default: assertNever(event, `Unknown event type ${event}`); } @@ -715,6 +724,10 @@ export abstract class BaseAlchemySigner authenticatingType: "email", }); + // fire new user event + if (params.isNewUser) + this.store.setState({ isNewUser: params.isNewUser }); + return user; } }; @@ -777,8 +790,9 @@ export abstract class BaseAlchemySigner bundle, orgId, idToken, - }: Extract): Promise => - this.inner.completeAuthWithBundle({ + isNewUser, + }: Extract): Promise => { + const user = this.inner.completeAuthWithBundle({ bundle, orgId, connectedEventName: "connectedOauth", @@ -786,6 +800,11 @@ export abstract class BaseAlchemySigner idToken, }); + if (isNewUser) this.store.setState({ isNewUser }); + + return user; + }; + private registerListeners = () => { this.sessionManager.on("connected", (session) => { this.store.setState({ diff --git a/account-kit/signer/src/signer.ts b/account-kit/signer/src/signer.ts index ceefa0e94e..64585f152b 100644 --- a/account-kit/signer/src/signer.ts +++ b/account-kit/signer/src/signer.ts @@ -9,7 +9,7 @@ import { SessionManagerParamsSchema } from "./session/manager.js"; export type AuthParams = | { type: "email"; email: string; redirectParams?: URLSearchParams } - | { type: "email"; bundle: string; orgId?: string } + | { type: "email"; bundle: string; orgId?: string; isNewUser?: boolean } | { type: "passkey"; email: string; @@ -36,6 +36,7 @@ export type AuthParams = bundle: string; orgId: string; idToken: string; + isNewUser?: boolean; }; export type OauthProviderConfig = @@ -79,7 +80,6 @@ export type AlchemySignerParams = z.input; * A SmartAccountSigner that can be used with any SmartContractAccount */ export class AlchemyWebSigner extends BaseAlchemySigner { - public isSignup: boolean; /** * Initializes an instance with the provided Alchemy signer parameters after parsing them with a schema. * @@ -117,7 +117,7 @@ export class AlchemyWebSigner extends BaseAlchemySigner oauthOrgId, oauthError, idToken, - _isSignup, + isSignup, } = getAndRemoveQueryParams({ emailBundle: "bundle", // We don't need this, but we still want to remove it from the URL. @@ -126,7 +126,7 @@ export class AlchemyWebSigner extends BaseAlchemySigner oauthOrgId: "alchemy-org-id", oauthError: "alchemy-error", idToken: "alchemy-id-token", - _isSignup: "aa-is-signup", + isSignup: "aa-is-signup", }); const initialError = @@ -136,16 +136,21 @@ export class AlchemyWebSigner extends BaseAlchemySigner super({ client, sessionConfig, initialError }); - this.isSignup = _isSignup === "true" ? true : false; + const isNewUser = isSignup === "true"; if (emailBundle) { - this.authenticate({ type: "email", bundle: emailBundle }); + this.authenticate({ + type: "email", + bundle: emailBundle, + isNewUser, + }); } else if (oauthBundle && oauthOrgId && idToken) { this.authenticate({ type: "oauthReturn", bundle: oauthBundle, orgId: oauthOrgId, idToken, + isNewUser, }); } } diff --git a/account-kit/signer/src/types.ts b/account-kit/signer/src/types.ts index 8cf614af33..9e17a05329 100644 --- a/account-kit/signer/src/types.ts +++ b/account-kit/signer/src/types.ts @@ -2,6 +2,7 @@ import type { User } from "./client/types"; export type AlchemySignerEvents = { connected(user: User): void; + newUserSignup(): void; disconnected(): void; statusChanged(status: AlchemySignerStatus): void; errorChanged(error: ErrorInfo | undefined): void; diff --git a/examples/ui-demo/src/hooks/useBreakpoint.tsx b/examples/ui-demo/src/hooks/useBreakpoint.tsx index 51d72c1d9e..742ca6b03c 100644 --- a/examples/ui-demo/src/hooks/useBreakpoint.tsx +++ b/examples/ui-demo/src/hooks/useBreakpoint.tsx @@ -1,4 +1,4 @@ -import { useEffect, useState } from "react"; +import { useLayoutEffect, useState } from "react"; // Define the breakpoints based on Tailwind CSS defaults (or your custom Tailwind configuration) const breakpoints = { @@ -16,10 +16,10 @@ type Breakpoint = keyof typeof breakpoints; * * @returns {Breakpoint} The current active breakpoint */ -export const useBreakpoint = (): Breakpoint => { - const [currentBreakpoint, setCurrentBreakpoint] = useState("sm"); +export const useBreakpoint = (): Breakpoint | undefined => { + const [currentBreakpoint, setCurrentBreakpoint] = useState(); - useEffect(() => { + useLayoutEffect(() => { const getBreakpoint = (width: number): Breakpoint => { if (width >= breakpoints["2xl"]) return "2xl"; if (width >= breakpoints.xl) return "xl"; From 1101154bcd14721d801154ca85f755af6180f2d3 Mon Sep 17 00:00:00 2001 From: moldy Date: Fri, 8 Nov 2024 13:33:58 -0500 Subject: [PATCH 07/31] refactor: add hook to listen to signup events --- account-kit/core/src/store/store.ts | 3 ++- account-kit/react/src/context.tsx | 1 - .../react/src/hooks/internal/useNewUserSignup.ts | 15 +++++++++++++++ account-kit/react/src/hooks/useUiConfig.tsx | 13 +++++-------- 4 files changed, 22 insertions(+), 10 deletions(-) create mode 100644 account-kit/react/src/hooks/internal/useNewUserSignup.ts diff --git a/account-kit/core/src/store/store.ts b/account-kit/core/src/store/store.ts index f444a1bdf3..a7b57694c0 100644 --- a/account-kit/core/src/store/store.ts +++ b/account-kit/core/src/store/store.ts @@ -273,7 +273,8 @@ const addClientSideStoreListeners = (store: Store) => { })); }); - signer.on("newUserSignup", () => console.log("got new user signup")); + // TODO: handle this appropriately + // signer.on("newUserSignup", () => console.log("got new user signup")); signer.on("connected", (user) => store.setState({ user })); diff --git a/account-kit/react/src/context.tsx b/account-kit/react/src/context.tsx index e2480e24d9..63315b6871 100644 --- a/account-kit/react/src/context.tsx +++ b/account-kit/react/src/context.tsx @@ -137,7 +137,6 @@ export const AlchemyAccountProvider = ( }; } - return { type: "initial", }; diff --git a/account-kit/react/src/hooks/internal/useNewUserSignup.ts b/account-kit/react/src/hooks/internal/useNewUserSignup.ts new file mode 100644 index 0000000000..09c8af0b75 --- /dev/null +++ b/account-kit/react/src/hooks/internal/useNewUserSignup.ts @@ -0,0 +1,15 @@ +import { useEffect, useState } from "react"; +import { useSigner } from "../useSigner.js"; + +export function useNewUserSignup(): boolean { + const [isSignup, setIsSignup] = useState(false); + const signer = useSigner(); + + useEffect(() => { + if (!signer) return; + + signer.on("newUserSignup", () => setIsSignup(true)); + }, [signer]); + + return isSignup; +} diff --git a/account-kit/react/src/hooks/useUiConfig.tsx b/account-kit/react/src/hooks/useUiConfig.tsx index 38535a08e4..658f2b4b19 100644 --- a/account-kit/react/src/hooks/useUiConfig.tsx +++ b/account-kit/react/src/hooks/useUiConfig.tsx @@ -9,11 +9,11 @@ import { } from "react"; import { create, useStore, type StoreApi } from "zustand"; import { useShallow } from "zustand/react/shallow"; -import { IS_SIGNUP_QP } from "../components/constants.js"; import type { AlchemyAccountsUIConfig, AuthIllustrationStyle, } from "../types.js"; +import { useNewUserSignup } from "./internal/useNewUserSignup.js"; import { useSignerStatus } from "./useSignerStatus.js"; type AlchemyAccountsUIConfigWithDefaults = Omit< @@ -110,16 +110,13 @@ export function UiConfigProvider({ })) ); + const isSignup = useNewUserSignup(); + useEffect(() => { - const urlParams = new URLSearchParams(window.location.search); - if ( - isConnected && - addPasskeyOnSignup && - urlParams.get(IS_SIGNUP_QP) === "true" - ) { + if (isConnected && addPasskeyOnSignup && isSignup) { setModalOpen(true); } - }, [addPasskeyOnSignup, isConnected, setModalOpen]); + }, [addPasskeyOnSignup, isConnected, isSignup, setModalOpen]); return ( From c3aa3bfa9013982fc29bf92814722a3ccc081132 Mon Sep 17 00:00:00 2001 From: linna Date: Fri, 8 Nov 2024 13:35:07 -0500 Subject: [PATCH 08/31] chore: wip --- account-kit/react/src/components/auth/modal.tsx | 2 +- account-kit/react/src/hooks/useUiConfig.tsx | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/account-kit/react/src/components/auth/modal.tsx b/account-kit/react/src/components/auth/modal.tsx index bea70c0765..c97fc975af 100644 --- a/account-kit/react/src/components/auth/modal.tsx +++ b/account-kit/react/src/components/auth/modal.tsx @@ -8,7 +8,7 @@ export const AuthModal = () => { modalBaseClassName, })); const { isOpen, closeAuthModal } = useAuthModal(); - + console.trace(isOpen); return (
{ + console.trace(isOpen); set({ isModalOpen: isOpen }); }, updateConfig: (config: AlchemyAccountsUIConfig) => { From a559ab7b7db7ef02bc285ebb2e439067dd665fb8 Mon Sep 17 00:00:00 2001 From: moldy Date: Fri, 8 Nov 2024 13:41:14 -0500 Subject: [PATCH 09/31] refactor: use signup event to popup passkey create --- .../react/src/components/auth/card/index.tsx | 32 ++++++------------- 1 file changed, 10 insertions(+), 22 deletions(-) diff --git a/account-kit/react/src/components/auth/card/index.tsx b/account-kit/react/src/components/auth/card/index.tsx index 4fa91ac54d..0371ba4eba 100644 --- a/account-kit/react/src/components/auth/card/index.tsx +++ b/account-kit/react/src/components/auth/card/index.tsx @@ -10,6 +10,7 @@ import { } from "react"; import { useAlchemyAccountContext } from "../../../context.js"; import { useAuthConfig } from "../../../hooks/internal/useAuthConfig.js"; +import { useNewUserSignup } from "../../../hooks/internal/useNewUserSignup.js"; import { useAuthModal } from "../../../hooks/useAuthModal.js"; import { useElementHeight } from "../../../hooks/useElementHeight.js"; import { useSignerStatus } from "../../../hooks/useSignerStatus.js"; @@ -107,8 +108,10 @@ export const AuthCardContent = ({ }, [authStep, setAuthStep, config]); const onClose = useCallback(() => { - // Terminate any inflight authentication - disconnect(config); + if (!isConnected) { + // Terminate any inflight authentication + disconnect(config); + } if (authStep.type === "passkey_create") { setAuthStep({ type: "complete" }); @@ -116,7 +119,9 @@ export const AuthCardContent = ({ setAuthStep({ type: "initial" }); } closeAuthModal(); - }, [authStep.type, closeAuthModal, setAuthStep, config]); + }, [isConnected, authStep.type, closeAuthModal, config, setAuthStep]); + + const isNewUserSignup = useNewUserSignup(); useEffect(() => { if (authStep.type === "complete") { @@ -125,25 +130,7 @@ export const AuthCardContent = ({ onAuthSuccess?.(); } else if (authStep.type !== "initial") { didGoBack.current = false; - } else if ( - !didGoBack.current && - isAuthenticating && - status === "AUTHENTICATING_EMAIL" - ) { - setAuthStep({ - type: "email_completing", - createPasskeyAfter: addPasskeyOnSignup, - }); - } else if ( - !didGoBack.current && - addPasskeyOnSignup && - isConnected && - previousStatus === "AUTHENTICATING_OAUTH" - ) { - console.log(status); - console.log(isAuthenticating); - console.log(authStep.type); - console.log(addPasskeyOnSignup); + } else if (!didGoBack.current && isNewUserSignup) { setAuthStep({ type: "passkey_create", }); @@ -159,6 +146,7 @@ export const AuthCardContent = ({ addPasskeyOnSignup, isConnected, previousStatus, + isNewUserSignup, ]); return ( From f4a9d944d5c423b93aa92e9e561744a3a1542e69 Mon Sep 17 00:00:00 2001 From: moldy Date: Fri, 8 Nov 2024 14:03:15 -0500 Subject: [PATCH 10/31] fix: the modal was staying open --- .../react/src/components/auth/modal.tsx | 26 +++++++++++++++---- .../src/hooks/internal/useNewUserSignup.ts | 11 +++----- account-kit/react/src/hooks/useUiConfig.tsx | 20 -------------- 3 files changed, 25 insertions(+), 32 deletions(-) diff --git a/account-kit/react/src/components/auth/modal.tsx b/account-kit/react/src/components/auth/modal.tsx index c97fc975af..eb49b64273 100644 --- a/account-kit/react/src/components/auth/modal.tsx +++ b/account-kit/react/src/components/auth/modal.tsx @@ -1,14 +1,30 @@ +import { useCallback } from "react"; +import { useNewUserSignupEffect } from "../../hooks/internal/useNewUserSignup.js"; import { useAuthModal } from "../../hooks/useAuthModal.js"; +import { useSignerStatus } from "../../hooks/useSignerStatus.js"; import { useUiConfig } from "../../hooks/useUiConfig.js"; import { Dialog } from "../dialog/dialog.js"; import { AuthCardContent } from "./card/index.js"; export const AuthModal = () => { - const { modalBaseClassName } = useUiConfig(({ modalBaseClassName }) => ({ - modalBaseClassName, - })); - const { isOpen, closeAuthModal } = useAuthModal(); - console.trace(isOpen); + const { isConnected } = useSignerStatus(); + const { modalBaseClassName, addPasskeyOnSignup } = useUiConfig( + ({ modalBaseClassName, auth }) => ({ + modalBaseClassName, + addPasskeyOnSignup: auth?.addPasskeyOnSignup, + }) + ); + + const { isOpen, closeAuthModal, openAuthModal } = useAuthModal(); + + const handleSignup = useCallback(() => { + if (isConnected && addPasskeyOnSignup && !isOpen) { + openAuthModal(); + } + }, [addPasskeyOnSignup, isConnected, isOpen, openAuthModal]); + + useNewUserSignupEffect(handleSignup); + return (
(false); +export function useNewUserSignupEffect(onSignup: () => void) { const signer = useSigner(); useEffect(() => { if (!signer) return; - signer.on("newUserSignup", () => setIsSignup(true)); - }, [signer]); - - return isSignup; + signer.on("newUserSignup", onSignup); + }, [onSignup, signer]); } diff --git a/account-kit/react/src/hooks/useUiConfig.tsx b/account-kit/react/src/hooks/useUiConfig.tsx index ca8ac3e343..a5f6b6a826 100644 --- a/account-kit/react/src/hooks/useUiConfig.tsx +++ b/account-kit/react/src/hooks/useUiConfig.tsx @@ -3,7 +3,6 @@ import { createContext, useContext, - useEffect, useRef, type PropsWithChildren, } from "react"; @@ -13,8 +12,6 @@ import type { AlchemyAccountsUIConfig, AuthIllustrationStyle, } from "../types.js"; -import { useNewUserSignup } from "./internal/useNewUserSignup.js"; -import { useSignerStatus } from "./useSignerStatus.js"; type AlchemyAccountsUIConfigWithDefaults = Omit< Required, @@ -97,28 +94,11 @@ export function UiConfigProvider({ children, initialConfig, }: PropsWithChildren<{ initialConfig?: AlchemyAccountsUIConfig }>) { - const { isConnected } = useSignerStatus(); const storeRef = useRef>(); if (!storeRef.current) { storeRef.current = createUiConfigStore(initialConfig); } - const { setModalOpen, addPasskeyOnSignup } = useStore( - storeRef.current, - useShallow(({ setModalOpen, auth }) => ({ - setModalOpen, - addPasskeyOnSignup: auth?.addPasskeyOnSignup, - })) - ); - - const isSignup = useNewUserSignup(); - - useEffect(() => { - if (isConnected && addPasskeyOnSignup && isSignup) { - setModalOpen(true); - } - }, [addPasskeyOnSignup, isConnected, isSignup, setModalOpen]); - return ( {children} From 9b504a3f0ab2e971f58e1695d79c7f41b842ca97 Mon Sep 17 00:00:00 2001 From: moldy Date: Fri, 8 Nov 2024 14:05:22 -0500 Subject: [PATCH 11/31] fix: move setAuthStep in the correct card --- account-kit/react/src/components/auth/card/index.tsx | 8 -------- account-kit/react/src/components/auth/modal.tsx | 7 ++++++- 2 files changed, 6 insertions(+), 9 deletions(-) diff --git a/account-kit/react/src/components/auth/card/index.tsx b/account-kit/react/src/components/auth/card/index.tsx index 0371ba4eba..cc40965bc7 100644 --- a/account-kit/react/src/components/auth/card/index.tsx +++ b/account-kit/react/src/components/auth/card/index.tsx @@ -10,7 +10,6 @@ import { } from "react"; import { useAlchemyAccountContext } from "../../../context.js"; import { useAuthConfig } from "../../../hooks/internal/useAuthConfig.js"; -import { useNewUserSignup } from "../../../hooks/internal/useNewUserSignup.js"; import { useAuthModal } from "../../../hooks/useAuthModal.js"; import { useElementHeight } from "../../../hooks/useElementHeight.js"; import { useSignerStatus } from "../../../hooks/useSignerStatus.js"; @@ -121,8 +120,6 @@ export const AuthCardContent = ({ closeAuthModal(); }, [isConnected, authStep.type, closeAuthModal, config, setAuthStep]); - const isNewUserSignup = useNewUserSignup(); - useEffect(() => { if (authStep.type === "complete") { didGoBack.current = false; @@ -130,10 +127,6 @@ export const AuthCardContent = ({ onAuthSuccess?.(); } else if (authStep.type !== "initial") { didGoBack.current = false; - } else if (!didGoBack.current && isNewUserSignup) { - setAuthStep({ - type: "passkey_create", - }); } }, [ authStep, @@ -146,7 +139,6 @@ export const AuthCardContent = ({ addPasskeyOnSignup, isConnected, previousStatus, - isNewUserSignup, ]); return ( diff --git a/account-kit/react/src/components/auth/modal.tsx b/account-kit/react/src/components/auth/modal.tsx index eb49b64273..45a7355617 100644 --- a/account-kit/react/src/components/auth/modal.tsx +++ b/account-kit/react/src/components/auth/modal.tsx @@ -5,6 +5,7 @@ import { useSignerStatus } from "../../hooks/useSignerStatus.js"; import { useUiConfig } from "../../hooks/useUiConfig.js"; import { Dialog } from "../dialog/dialog.js"; import { AuthCardContent } from "./card/index.js"; +import { useAuthContext } from "./context.js"; export const AuthModal = () => { const { isConnected } = useSignerStatus(); @@ -15,13 +16,17 @@ export const AuthModal = () => { }) ); + const { setAuthStep } = useAuthContext(); const { isOpen, closeAuthModal, openAuthModal } = useAuthModal(); const handleSignup = useCallback(() => { if (isConnected && addPasskeyOnSignup && !isOpen) { openAuthModal(); + setAuthStep({ + type: "passkey_create", + }); } - }, [addPasskeyOnSignup, isConnected, isOpen, openAuthModal]); + }, [addPasskeyOnSignup, isConnected, isOpen, openAuthModal, setAuthStep]); useNewUserSignupEffect(handleSignup); From 0b592c0e8737dbc7099cf25b32ae70131df970cf Mon Sep 17 00:00:00 2001 From: moldy Date: Fri, 8 Nov 2024 14:08:54 -0500 Subject: [PATCH 12/31] fix: infinite subscribe loop --- account-kit/react/src/hooks/internal/useNewUserSignup.ts | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/account-kit/react/src/hooks/internal/useNewUserSignup.ts b/account-kit/react/src/hooks/internal/useNewUserSignup.ts index 1d624c736d..ed5c57a8a5 100644 --- a/account-kit/react/src/hooks/internal/useNewUserSignup.ts +++ b/account-kit/react/src/hooks/internal/useNewUserSignup.ts @@ -1,12 +1,17 @@ -import { useEffect } from "react"; +import { useEffect, useRef } from "react"; import { useSigner } from "../useSigner.js"; export function useNewUserSignupEffect(onSignup: () => void) { + const hasHandled = useRef(false); const signer = useSigner(); useEffect(() => { if (!signer) return; + if (hasHandled.current) return; - signer.on("newUserSignup", onSignup); + signer.on("newUserSignup", () => { + onSignup(); + hasHandled.current = true; + }); }, [onSignup, signer]); } From d2c862c526c3ee6403279427a05c92116c28a8c6 Mon Sep 17 00:00:00 2001 From: moldy Date: Fri, 8 Nov 2024 14:29:16 -0500 Subject: [PATCH 13/31] fix: don't open passkey create until logged in --- account-kit/react/src/components/auth/modal.tsx | 6 +++--- account-kit/react/src/hooks/internal/useNewUserSignup.ts | 8 ++++++-- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/account-kit/react/src/components/auth/modal.tsx b/account-kit/react/src/components/auth/modal.tsx index 45a7355617..bf943edefe 100644 --- a/account-kit/react/src/components/auth/modal.tsx +++ b/account-kit/react/src/components/auth/modal.tsx @@ -20,15 +20,15 @@ export const AuthModal = () => { const { isOpen, closeAuthModal, openAuthModal } = useAuthModal(); const handleSignup = useCallback(() => { - if (isConnected && addPasskeyOnSignup && !isOpen) { + if (addPasskeyOnSignup && !isOpen) { openAuthModal(); setAuthStep({ type: "passkey_create", }); } - }, [addPasskeyOnSignup, isConnected, isOpen, openAuthModal, setAuthStep]); + }, [addPasskeyOnSignup, isOpen, openAuthModal, setAuthStep]); - useNewUserSignupEffect(handleSignup); + useNewUserSignupEffect(handleSignup, isConnected); return ( diff --git a/account-kit/react/src/hooks/internal/useNewUserSignup.ts b/account-kit/react/src/hooks/internal/useNewUserSignup.ts index ed5c57a8a5..95e980ada6 100644 --- a/account-kit/react/src/hooks/internal/useNewUserSignup.ts +++ b/account-kit/react/src/hooks/internal/useNewUserSignup.ts @@ -1,11 +1,15 @@ import { useEffect, useRef } from "react"; import { useSigner } from "../useSigner.js"; -export function useNewUserSignupEffect(onSignup: () => void) { +export function useNewUserSignupEffect( + onSignup: () => void, + enabled?: boolean +) { const hasHandled = useRef(false); const signer = useSigner(); useEffect(() => { + if (!enabled) return; if (!signer) return; if (hasHandled.current) return; @@ -13,5 +17,5 @@ export function useNewUserSignupEffect(onSignup: () => void) { onSignup(); hasHandled.current = true; }); - }, [onSignup, signer]); + }, [enabled, onSignup, signer]); } From 998463ecb772d8707bb04d64cf9143d8e50768d1 Mon Sep 17 00:00:00 2001 From: linna Date: Fri, 8 Nov 2024 17:29:50 -0500 Subject: [PATCH 14/31] chore: remove local dev callback url --- examples/ui-demo/src/app/config.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/examples/ui-demo/src/app/config.tsx b/examples/ui-demo/src/app/config.tsx index aba95469ec..bb5d736325 100644 --- a/examples/ui-demo/src/app/config.tsx +++ b/examples/ui-demo/src/app/config.tsx @@ -77,7 +77,6 @@ export const alchemyConfig = () => policyId: process.env.NEXT_PUBLIC_PAYMASTER_POLICY_ID, storage: cookieStorage, enablePopupOauth: true, - oauthCallbackUrl: "http://localhost:6288/callback", }, { illustrationStyle: DEFAULT_CONFIG.ui.illustrationStyle, From 85edb03b9107c75e774076cd127c8f03eb3b07ad Mon Sep 17 00:00:00 2001 From: linna Date: Mon, 11 Nov 2024 16:16:11 -0500 Subject: [PATCH 15/31] chore: removes unecessary bangs and refactors for readability --- .../components/auth/card/loading/oauth.tsx | 19 ++++++++++--------- .../react/src/components/auth/modal.tsx | 4 ++-- .../src/hooks/internal/useNewUserSignup.ts | 5 +---- 3 files changed, 13 insertions(+), 15 deletions(-) diff --git a/account-kit/react/src/components/auth/card/loading/oauth.tsx b/account-kit/react/src/components/auth/card/loading/oauth.tsx index 3634603f7a..fc9bff3e6f 100644 --- a/account-kit/react/src/components/auth/card/loading/oauth.tsx +++ b/account-kit/react/src/components/auth/card/loading/oauth.tsx @@ -9,14 +9,15 @@ import { ConnectionError } from "../error/connection-error.js"; export const CompletingOAuth = () => { const { isConnected } = useSignerStatus(); const { setAuthStep, authStep } = useAuthContext("oauth_completing"); - const { authenticate } = useOAuthVerify({ config: authStep.config! }); + const { authenticate } = useOAuthVerify({ config: authStep.config }); useEffect(() => { - if (isConnected && authStep.createPasskeyAfter) { - // TO DO: pull query param to check if isSignup - setAuthStep({ type: "passkey_create" }); - } else if (isConnected) { - setAuthStep({ type: "complete" }); + if (isConnected) { + if (authStep.createPasskeyAfter) { + setAuthStep({ type: "passkey_create" }); + } else { + setAuthStep({ type: "complete" }); + } } }, [authStep.createPasskeyAfter, isConnected, setAuthStep]); @@ -34,15 +35,15 @@ export const CompletingOAuth = () => { return (
- +

{`Continue with ${capitalize( - authStep.config!.authProviderId + authStep.config.authProviderId )}`}

{`Follow the steps in the pop up window to sign in with ${capitalize( - authStep.config!.authProviderId + authStep.config.authProviderId )}`}

diff --git a/account-kit/react/src/components/auth/modal.tsx b/account-kit/react/src/components/auth/modal.tsx index bf943edefe..6da25f4acb 100644 --- a/account-kit/react/src/components/auth/modal.tsx +++ b/account-kit/react/src/components/auth/modal.tsx @@ -1,5 +1,5 @@ import { useCallback } from "react"; -import { useNewUserSignupEffect } from "../../hooks/internal/useNewUserSignup.js"; +import { useNewUserSignup } from "../../hooks/internal/useNewUserSignup.js"; import { useAuthModal } from "../../hooks/useAuthModal.js"; import { useSignerStatus } from "../../hooks/useSignerStatus.js"; import { useUiConfig } from "../../hooks/useUiConfig.js"; @@ -28,7 +28,7 @@ export const AuthModal = () => { } }, [addPasskeyOnSignup, isOpen, openAuthModal, setAuthStep]); - useNewUserSignupEffect(handleSignup, isConnected); + useNewUserSignup(handleSignup, isConnected); return ( diff --git a/account-kit/react/src/hooks/internal/useNewUserSignup.ts b/account-kit/react/src/hooks/internal/useNewUserSignup.ts index 95e980ada6..0fd78af89a 100644 --- a/account-kit/react/src/hooks/internal/useNewUserSignup.ts +++ b/account-kit/react/src/hooks/internal/useNewUserSignup.ts @@ -1,10 +1,7 @@ import { useEffect, useRef } from "react"; import { useSigner } from "../useSigner.js"; -export function useNewUserSignupEffect( - onSignup: () => void, - enabled?: boolean -) { +export function useNewUserSignup(onSignup: () => void, enabled?: boolean) { const hasHandled = useRef(false); const signer = useSigner(); From a8538320ae6cb0d916e3cb4bd0707f4a41f863a6 Mon Sep 17 00:00:00 2001 From: linna Date: Tue, 12 Nov 2024 12:34:03 -0500 Subject: [PATCH 16/31] chore: removes unused usePrevious hook --- account-kit/react/src/components/auth/card/index.tsx | 3 --- .../react/src/components/auth/hooks/usePrevious.ts | 11 ----------- 2 files changed, 14 deletions(-) delete mode 100644 account-kit/react/src/components/auth/hooks/usePrevious.ts diff --git a/account-kit/react/src/components/auth/card/index.tsx b/account-kit/react/src/components/auth/card/index.tsx index cc40965bc7..5711e8ac08 100644 --- a/account-kit/react/src/components/auth/card/index.tsx +++ b/account-kit/react/src/components/auth/card/index.tsx @@ -15,7 +15,6 @@ import { useElementHeight } from "../../../hooks/useElementHeight.js"; import { useSignerStatus } from "../../../hooks/useSignerStatus.js"; import { Navigation } from "../../navigation.js"; import { useAuthContext } from "../context.js"; -import { usePrevious } from "../hooks/usePrevious.js"; import { Footer } from "../sections/Footer.js"; import { Step } from "./steps.js"; export type AuthCardProps = { @@ -59,7 +58,6 @@ export const AuthCardContent = ({ }) => { const { openAuthModal, closeAuthModal } = useAuthModal(); const { status, isAuthenticating, isConnected } = useSignerStatus(); - const previousStatus = usePrevious(status); const { authStep, setAuthStep } = useAuthContext(); const { config } = useAlchemyAccountContext(); @@ -138,7 +136,6 @@ export const AuthCardContent = ({ closeAuthModal, addPasskeyOnSignup, isConnected, - previousStatus, ]); return ( diff --git a/account-kit/react/src/components/auth/hooks/usePrevious.ts b/account-kit/react/src/components/auth/hooks/usePrevious.ts deleted file mode 100644 index e4099a6f17..0000000000 --- a/account-kit/react/src/components/auth/hooks/usePrevious.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { useEffect, useRef } from "react"; - -export const usePrevious = (thing: T) => { - const previous = useRef(); - - useEffect(() => { - previous.current = thing; - }, [thing]); - - return previous.current; -}; From 60602201dce73a57c4c9f3d67fc596c33dde0f38 Mon Sep 17 00:00:00 2001 From: linna Date: Tue, 12 Nov 2024 17:00:45 -0500 Subject: [PATCH 17/31] fix: update useNewUserSignup to remove listener on dismount and when dependencies change --- .../react/src/hooks/internal/useNewUserSignup.ts | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/account-kit/react/src/hooks/internal/useNewUserSignup.ts b/account-kit/react/src/hooks/internal/useNewUserSignup.ts index 0fd78af89a..b4e422dd1f 100644 --- a/account-kit/react/src/hooks/internal/useNewUserSignup.ts +++ b/account-kit/react/src/hooks/internal/useNewUserSignup.ts @@ -8,11 +8,15 @@ export function useNewUserSignup(onSignup: () => void, enabled?: boolean) { useEffect(() => { if (!enabled) return; if (!signer) return; - if (hasHandled.current) return; - signer.on("newUserSignup", () => { - onSignup(); - hasHandled.current = true; - }); + const handleSignup = () => { + if (!hasHandled.current) { + hasHandled.current = true; + onSignup(); + } + }; + + const stopListening = signer.on("newUserSignup", handleSignup); + return stopListening; }, [enabled, onSignup, signer]); } From c0e796a098915c5d11e8071bf71a79fff7407a36 Mon Sep 17 00:00:00 2001 From: linna Date: Tue, 12 Nov 2024 17:06:57 -0500 Subject: [PATCH 18/31] docs: link related discussion to TODO --- account-kit/core/src/store/store.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/account-kit/core/src/store/store.ts b/account-kit/core/src/store/store.ts index a7b57694c0..ae03d51433 100644 --- a/account-kit/core/src/store/store.ts +++ b/account-kit/core/src/store/store.ts @@ -273,7 +273,7 @@ const addClientSideStoreListeners = (store: Store) => { })); }); - // TODO: handle this appropriately + // TODO: handle this appropriately, see https://github.com/alchemyplatform/aa-sdk/pull/1140#discussion_r1837265706 // signer.on("newUserSignup", () => console.log("got new user signup")); signer.on("connected", (user) => store.setState({ user })); From e1dda2f68d6fa122e5e91e775172dba72b82282f Mon Sep 17 00:00:00 2001 From: linna Date: Tue, 12 Nov 2024 17:22:15 -0500 Subject: [PATCH 19/31] refactor: adds emitNewUserEvent wrapper --- account-kit/signer/src/base.ts | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/account-kit/signer/src/base.ts b/account-kit/signer/src/base.ts index b28afd7934..cba51d3496 100644 --- a/account-kit/signer/src/base.ts +++ b/account-kit/signer/src/base.ts @@ -725,8 +725,7 @@ export abstract class BaseAlchemySigner }); // fire new user event - if (params.isNewUser) - this.store.setState({ isNewUser: params.isNewUser }); + this.emitNewUserEvent(params.isNewUser!); return user; } @@ -800,7 +799,7 @@ export abstract class BaseAlchemySigner idToken, }); - if (isNewUser) this.store.setState({ isNewUser }); + this.emitNewUserEvent(isNewUser!); return user; }; @@ -850,6 +849,10 @@ export abstract class BaseAlchemySigner }); }); }; + + private emitNewUserEvent = (isNewUser: boolean) => { + if (isNewUser) this.store.setState({ isNewUser }); + }; } function toErrorInfo(error: unknown): ErrorInfo { From 8d10d7009642905e5a184c6d79702123baeefcf0 Mon Sep 17 00:00:00 2001 From: linna Date: Tue, 12 Nov 2024 17:24:26 -0500 Subject: [PATCH 20/31] chore: restore oauth mode to popup --- examples/ui-demo/src/app/config.tsx | 14 ++------------ 1 file changed, 2 insertions(+), 12 deletions(-) diff --git a/examples/ui-demo/src/app/config.tsx b/examples/ui-demo/src/app/config.tsx index bb5d736325..accff74ead 100644 --- a/examples/ui-demo/src/app/config.tsx +++ b/examples/ui-demo/src/app/config.tsx @@ -85,18 +85,8 @@ export const alchemyConfig = () => [{ type: "email" }], [ { type: "passkey" }, - { - type: "social", - authProviderId: "google", - mode: "redirect", - redirectUrl: "http://localhost:3000", - }, - { - type: "social", - authProviderId: "facebook", - mode: "redirect", - redirectUrl: "http://localhost:3000", - }, + { type: "social", authProviderId: "google", mode: "popup" }, + { type: "social", authProviderId: "facebook", mode: "popup" }, ], ], addPasskeyOnSignup: DEFAULT_CONFIG.auth.addPasskey, From 78e37ed0022282795b1c1b06e494daf3b90ef24b Mon Sep 17 00:00:00 2001 From: Linna <38363056+linnall@users.noreply.github.com> Date: Wed, 13 Nov 2024 10:35:10 -0500 Subject: [PATCH 21/31] chore: remove logging Co-authored-by: Michael Moldoveanu --- account-kit/react/src/hooks/useUiConfig.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/account-kit/react/src/hooks/useUiConfig.tsx b/account-kit/react/src/hooks/useUiConfig.tsx index a5f6b6a826..cdbac4db8a 100644 --- a/account-kit/react/src/hooks/useUiConfig.tsx +++ b/account-kit/react/src/hooks/useUiConfig.tsx @@ -47,7 +47,6 @@ export function createUiConfigStore( ...initialConfig, isModalOpen: false, setModalOpen: (isOpen: boolean) => { - console.trace(isOpen); set({ isModalOpen: isOpen }); }, updateConfig: (config: AlchemyAccountsUIConfig) => { From 1975bddfca5dc66030d3591813fff50e3c65135b Mon Sep 17 00:00:00 2001 From: Linna <38363056+linnall@users.noreply.github.com> Date: Wed, 13 Nov 2024 10:36:22 -0500 Subject: [PATCH 22/31] chore: remove logging Co-authored-by: Michael Moldoveanu --- account-kit/signer/src/client/index.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/account-kit/signer/src/client/index.ts b/account-kit/signer/src/client/index.ts index d454e2ed30..ac0ac61e5a 100644 --- a/account-kit/signer/src/client/index.ts +++ b/account-kit/signer/src/client/index.ts @@ -672,9 +672,7 @@ export class AlchemySignerWebClient extends BaseSignerClient if (this.oauthConfig) { return this.oauthConfig; } else if (mode === "redirect") { - const temp = this.initOauth(); - console.log("CLIENT ID", (await temp).authProviders[0].clientId); - return temp; + return this.initOauth(); } else { throw new Error( "enablePopupOauth must be set in configuration or signer.preparePopupOauth must be called before using popup-based OAuth login" From d952810f1a6da0a3e611b9b52221a8e782a3dd7b Mon Sep 17 00:00:00 2001 From: linna Date: Wed, 13 Nov 2024 10:54:31 -0500 Subject: [PATCH 23/31] chore: reset oauth mode to popup --- examples/ui-demo/src/app/sections.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/examples/ui-demo/src/app/sections.ts b/examples/ui-demo/src/app/sections.ts index 200b2ab356..34251b5776 100644 --- a/examples/ui-demo/src/app/sections.ts +++ b/examples/ui-demo/src/app/sections.ts @@ -27,8 +27,7 @@ export function getSectionsForConfig( midSection.push({ type: "social", authProviderId: method as KnownAuthProvider, // TODO: extend for BYO auth provider - mode: "redirect", - redirectUrl: "http://localhost:3000", + mode: "popup", }); } } From 640a7de3dd529e6239c276605a7fcb4eee2493d1 Mon Sep 17 00:00:00 2001 From: linna Date: Wed, 13 Nov 2024 11:22:14 -0500 Subject: [PATCH 24/31] fix: handle undefined isNewUser within emitNewUserEvent wrapper --- account-kit/signer/src/base.ts | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/account-kit/signer/src/base.ts b/account-kit/signer/src/base.ts index cba51d3496..ecd2a973ae 100644 --- a/account-kit/signer/src/base.ts +++ b/account-kit/signer/src/base.ts @@ -725,7 +725,7 @@ export abstract class BaseAlchemySigner }); // fire new user event - this.emitNewUserEvent(params.isNewUser!); + this.emitNewUserEvent(params.isNewUser); return user; } @@ -799,7 +799,7 @@ export abstract class BaseAlchemySigner idToken, }); - this.emitNewUserEvent(isNewUser!); + this.emitNewUserEvent(isNewUser); return user; }; @@ -850,7 +850,8 @@ export abstract class BaseAlchemySigner }); }; - private emitNewUserEvent = (isNewUser: boolean) => { + private emitNewUserEvent = (isNewUser?: boolean) => { + // assumes that if isNewUser is undefined it is a returning user if (isNewUser) this.store.setState({ isNewUser }); }; } From 1adcbd7dfc9df33531e6a9791420cc220c6bc2eb Mon Sep 17 00:00:00 2001 From: linna Date: Wed, 13 Nov 2024 11:31:45 -0500 Subject: [PATCH 25/31] chore: remove unnecessary bang --- account-kit/react/src/components/auth/card/loading/oauth.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/account-kit/react/src/components/auth/card/loading/oauth.tsx b/account-kit/react/src/components/auth/card/loading/oauth.tsx index fc9bff3e6f..c592832c58 100644 --- a/account-kit/react/src/components/auth/card/loading/oauth.tsx +++ b/account-kit/react/src/components/auth/card/loading/oauth.tsx @@ -25,7 +25,7 @@ export const CompletingOAuth = () => { return ( setAuthStep({ type: "initial" })} /> From d72fa1ac32f03960cdac6f00c3dc544cb6e2d6ba Mon Sep 17 00:00:00 2001 From: linna Date: Wed, 13 Nov 2024 17:04:13 -0500 Subject: [PATCH 26/31] feat: sets up event for client to emit to trigger signer to emit new user event --- account-kit/signer/src/base.ts | 5 +++++ account-kit/signer/src/client/index.ts | 2 ++ account-kit/signer/src/client/types.ts | 1 + 3 files changed, 8 insertions(+) diff --git a/account-kit/signer/src/base.ts b/account-kit/signer/src/base.ts index ecd2a973ae..5b07fb2a3d 100644 --- a/account-kit/signer/src/base.ts +++ b/account-kit/signer/src/base.ts @@ -843,6 +843,11 @@ export abstract class BaseAlchemySigner } })(); + // trigger new user event on signer from client + this.inner.on("newUserSignupClient", () => { + this.emitNewUserEvent(true); + }); + this.store.setState({ status, error: null, diff --git a/account-kit/signer/src/client/index.ts b/account-kit/signer/src/client/index.ts index c4f0a80d5a..aa9c55199a 100644 --- a/account-kit/signer/src/client/index.ts +++ b/account-kit/signer/src/client/index.ts @@ -471,9 +471,11 @@ export class AlchemySignerWebClient extends BaseSignerClient alchemyBundle: bundle, alchemyOrgId: orgId, alchemyIdToken: idToken, + alchemyIsSignup: isSignup, alchemyError, } = event.data; if (bundle && orgId && idToken) { + if (isSignup === true) this.eventEmitter.emit("newUserSignupClient"); cleanup(); popup?.close(); this.completeAuthWithBundle({ diff --git a/account-kit/signer/src/client/types.ts b/account-kit/signer/src/client/types.ts index c0c980e3d6..87e76e9cb8 100644 --- a/account-kit/signer/src/client/types.ts +++ b/account-kit/signer/src/client/types.ts @@ -142,6 +142,7 @@ export type AuthenticatingEventMetadata = { export type AlchemySignerClientEvents = { connected(user: User): void; + newUserSignupClient(): void; authenticating(data: AuthenticatingEventMetadata): void; connectedEmail(user: User, bundle: string): void; connectedPasskey(user: User): void; From 995a210856d31e3561072945a00a6255304f462e Mon Sep 17 00:00:00 2001 From: linna Date: Thu, 14 Nov 2024 14:02:37 -0500 Subject: [PATCH 27/31] chore: adds logging --- account-kit/react/src/components/auth/modal.tsx | 1 + account-kit/react/src/hooks/useAuthModal.ts | 5 ++++- account-kit/signer/src/base.ts | 1 + account-kit/signer/src/client/index.ts | 7 +++++-- 4 files changed, 11 insertions(+), 3 deletions(-) diff --git a/account-kit/react/src/components/auth/modal.tsx b/account-kit/react/src/components/auth/modal.tsx index 6da25f4acb..21e4b9a057 100644 --- a/account-kit/react/src/components/auth/modal.tsx +++ b/account-kit/react/src/components/auth/modal.tsx @@ -21,6 +21,7 @@ export const AuthModal = () => { const handleSignup = useCallback(() => { if (addPasskeyOnSignup && !isOpen) { + console.log("handling sign up"); openAuthModal(); setAuthStep({ type: "passkey_create", diff --git a/account-kit/react/src/hooks/useAuthModal.ts b/account-kit/react/src/hooks/useAuthModal.ts index 17fc83185a..e8b378fc8e 100644 --- a/account-kit/react/src/hooks/useAuthModal.ts +++ b/account-kit/react/src/hooks/useAuthModal.ts @@ -33,7 +33,10 @@ export const useAuthModal = () => { ); const openAuthModal = useCallback(() => setModalOpen(true), [setModalOpen]); - const closeAuthModal = useCallback(() => setModalOpen(false), [setModalOpen]); + const closeAuthModal = useCallback(() => { + console.log("closing modal"); + setModalOpen(false); + }, [setModalOpen]); return { isOpen, diff --git a/account-kit/signer/src/base.ts b/account-kit/signer/src/base.ts index 5b07fb2a3d..9537e34b50 100644 --- a/account-kit/signer/src/base.ts +++ b/account-kit/signer/src/base.ts @@ -845,6 +845,7 @@ export abstract class BaseAlchemySigner // trigger new user event on signer from client this.inner.on("newUserSignupClient", () => { + console.log("event triggered by client"); this.emitNewUserEvent(true); }); diff --git a/account-kit/signer/src/client/index.ts b/account-kit/signer/src/client/index.ts index aa9c55199a..296835ba68 100644 --- a/account-kit/signer/src/client/index.ts +++ b/account-kit/signer/src/client/index.ts @@ -2,7 +2,6 @@ import { BaseError, ConnectionConfigSchema } from "@aa-sdk/core"; import { getWebAuthnAttestation } from "@turnkey/http"; import { IframeStamper } from "@turnkey/iframe-stamper"; import { WebauthnStamper } from "@turnkey/webauthn-stamper"; -import { z } from "zod"; import { getDefaultScopeAndClaims, getOauthNonce } from "../oauth.js"; import type { AuthParams, OauthMode } from "../signer.js"; import { base64UrlEncode } from "../utils/base64UrlEncode.js"; @@ -20,6 +19,7 @@ import type { User, } from "./types.js"; import { OAuthProvidersError } from "../errors.js"; +import { z } from "zod"; const CHECK_CLOSE_INTERVAL = 500; @@ -475,7 +475,10 @@ export class AlchemySignerWebClient extends BaseSignerClient alchemyError, } = event.data; if (bundle && orgId && idToken) { - if (isSignup === true) this.eventEmitter.emit("newUserSignupClient"); + if (isSignup || true) { + this.eventEmitter.emit("newUserSignupClient"); + console.log("we emitted an event from the client!"); + } cleanup(); popup?.close(); this.completeAuthWithBundle({ From aa12a59722d550840cb59e52eb3243876acbb14d Mon Sep 17 00:00:00 2001 From: moldy Date: Thu, 14 Nov 2024 16:07:22 -0500 Subject: [PATCH 28/31] fix: solve the race condition on new user signup --- .../src/components/auth/card/loading/oauth.tsx | 8 ++------ account-kit/react/src/components/auth/modal.tsx | 12 ++++++------ account-kit/react/src/hooks/useAuthModal.ts | 2 +- account-kit/signer/src/base.ts | 1 - account-kit/signer/src/client/index.ts | 17 ++++++++++------- examples/embedded-accounts-quickstart | 2 +- 6 files changed, 20 insertions(+), 22 deletions(-) diff --git a/account-kit/react/src/components/auth/card/loading/oauth.tsx b/account-kit/react/src/components/auth/card/loading/oauth.tsx index 6a1ceef5fb..b243af8a36 100644 --- a/account-kit/react/src/components/auth/card/loading/oauth.tsx +++ b/account-kit/react/src/components/auth/card/loading/oauth.tsx @@ -1,3 +1,4 @@ +import { OauthCancelledError } from "@account-kit/signer"; import { useEffect } from "react"; import { useSignerStatus } from "../../../../hooks/useSignerStatus.js"; import { ContinueWithOAuth } from "../../../../icons/oauth.js"; @@ -5,7 +6,6 @@ import { capitalize } from "../../../../utils.js"; import { useAuthContext } from "../../context.js"; import { useOAuthVerify } from "../../hooks/useOAuthVerify.js"; import { ConnectionError } from "../error/connection-error.js"; -import { OauthCancelledError } from "@account-kit/signer"; export const CompletingOAuth = () => { const { isConnected } = useSignerStatus(); @@ -15,11 +15,7 @@ export const CompletingOAuth = () => { useEffect(() => { if (isConnected) { - if (authStep.createPasskeyAfter) { - setAuthStep({ type: "passkey_create" }); - } else { - setAuthStep({ type: "complete" }); - } + setAuthStep({ type: "complete" }); } else if (oauthWasCancelled) { setAuthStep({ type: "initial" }); } diff --git a/account-kit/react/src/components/auth/modal.tsx b/account-kit/react/src/components/auth/modal.tsx index 21e4b9a057..3d343fce09 100644 --- a/account-kit/react/src/components/auth/modal.tsx +++ b/account-kit/react/src/components/auth/modal.tsx @@ -1,8 +1,8 @@ import { useCallback } from "react"; import { useNewUserSignup } from "../../hooks/internal/useNewUserSignup.js"; import { useAuthModal } from "../../hooks/useAuthModal.js"; -import { useSignerStatus } from "../../hooks/useSignerStatus.js"; import { useUiConfig } from "../../hooks/useUiConfig.js"; +import { useSignerStatus } from "../../index.js"; import { Dialog } from "../dialog/dialog.js"; import { AuthCardContent } from "./card/index.js"; import { useAuthContext } from "./context.js"; @@ -16,20 +16,20 @@ export const AuthModal = () => { }) ); - const { setAuthStep } = useAuthContext(); + const { setAuthStep, authStep } = useAuthContext(); const { isOpen, closeAuthModal, openAuthModal } = useAuthModal(); const handleSignup = useCallback(() => { - if (addPasskeyOnSignup && !isOpen) { - console.log("handling sign up"); + if (addPasskeyOnSignup) { openAuthModal(); + setAuthStep({ type: "passkey_create", }); } - }, [addPasskeyOnSignup, isOpen, openAuthModal, setAuthStep]); + }, [addPasskeyOnSignup, openAuthModal, setAuthStep]); - useNewUserSignup(handleSignup, isConnected); + useNewUserSignup(handleSignup, isConnected && authStep.type === "complete"); return ( diff --git a/account-kit/react/src/hooks/useAuthModal.ts b/account-kit/react/src/hooks/useAuthModal.ts index e8b378fc8e..c455732eaf 100644 --- a/account-kit/react/src/hooks/useAuthModal.ts +++ b/account-kit/react/src/hooks/useAuthModal.ts @@ -34,7 +34,7 @@ export const useAuthModal = () => { const openAuthModal = useCallback(() => setModalOpen(true), [setModalOpen]); const closeAuthModal = useCallback(() => { - console.log("closing modal"); + console.trace("closing modal"); setModalOpen(false); }, [setModalOpen]); diff --git a/account-kit/signer/src/base.ts b/account-kit/signer/src/base.ts index 9537e34b50..5b07fb2a3d 100644 --- a/account-kit/signer/src/base.ts +++ b/account-kit/signer/src/base.ts @@ -845,7 +845,6 @@ export abstract class BaseAlchemySigner // trigger new user event on signer from client this.inner.on("newUserSignupClient", () => { - console.log("event triggered by client"); this.emitNewUserEvent(true); }); diff --git a/account-kit/signer/src/client/index.ts b/account-kit/signer/src/client/index.ts index 296835ba68..5437ac467e 100644 --- a/account-kit/signer/src/client/index.ts +++ b/account-kit/signer/src/client/index.ts @@ -2,6 +2,8 @@ import { BaseError, ConnectionConfigSchema } from "@aa-sdk/core"; import { getWebAuthnAttestation } from "@turnkey/http"; import { IframeStamper } from "@turnkey/iframe-stamper"; import { WebauthnStamper } from "@turnkey/webauthn-stamper"; +import { z } from "zod"; +import { OAuthProvidersError } from "../errors.js"; import { getDefaultScopeAndClaims, getOauthNonce } from "../oauth.js"; import type { AuthParams, OauthMode } from "../signer.js"; import { base64UrlEncode } from "../utils/base64UrlEncode.js"; @@ -18,8 +20,6 @@ import type { OauthParams, User, } from "./types.js"; -import { OAuthProvidersError } from "../errors.js"; -import { z } from "zod"; const CHECK_CLOSE_INTERVAL = 500; @@ -462,6 +462,7 @@ export class AlchemySignerWebClient extends BaseSignerClient "_blank", "popup,width=500,height=600" ); + const eventEmitter = this.eventEmitter; return new Promise((resolve, reject) => { const handleMessage = (event: MessageEvent) => { if (!event.data) { @@ -475,10 +476,6 @@ export class AlchemySignerWebClient extends BaseSignerClient alchemyError, } = event.data; if (bundle && orgId && idToken) { - if (isSignup || true) { - this.eventEmitter.emit("newUserSignupClient"); - console.log("we emitted an event from the client!"); - } cleanup(); popup?.close(); this.completeAuthWithBundle({ @@ -487,7 +484,13 @@ export class AlchemySignerWebClient extends BaseSignerClient connectedEventName: "connectedOauth", idToken, authenticatingType: "oauth", - }).then(resolve, reject); + }).then((user) => { + if (isSignup) { + eventEmitter.emit("newUserSignupClient"); + } + + resolve(user); + }, reject); } else if (alchemyError) { cleanup(); popup?.close(); diff --git a/examples/embedded-accounts-quickstart b/examples/embedded-accounts-quickstart index e4d61eb57c..63d936ebe9 160000 --- a/examples/embedded-accounts-quickstart +++ b/examples/embedded-accounts-quickstart @@ -1 +1 @@ -Subproject commit e4d61eb57c094b0c566dfe8570fe04e11365e260 +Subproject commit 63d936ebe94c65e5a12e41805bee1a5e9a29ed96 From 529fe0ab0c0ac895bea4ada82ff541ffe4933c52 Mon Sep 17 00:00:00 2001 From: linna Date: Thu, 14 Nov 2024 18:00:10 -0500 Subject: [PATCH 29/31] refactor: changes newUserSignupClient to newUserSignup --- account-kit/signer/src/base.ts | 2 +- account-kit/signer/src/client/index.ts | 2 +- account-kit/signer/src/client/types.ts | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/account-kit/signer/src/base.ts b/account-kit/signer/src/base.ts index 5b07fb2a3d..b07cbc107b 100644 --- a/account-kit/signer/src/base.ts +++ b/account-kit/signer/src/base.ts @@ -844,7 +844,7 @@ export abstract class BaseAlchemySigner })(); // trigger new user event on signer from client - this.inner.on("newUserSignupClient", () => { + this.inner.on("newUserSignup", () => { this.emitNewUserEvent(true); }); diff --git a/account-kit/signer/src/client/index.ts b/account-kit/signer/src/client/index.ts index 5437ac467e..c4875ae728 100644 --- a/account-kit/signer/src/client/index.ts +++ b/account-kit/signer/src/client/index.ts @@ -486,7 +486,7 @@ export class AlchemySignerWebClient extends BaseSignerClient authenticatingType: "oauth", }).then((user) => { if (isSignup) { - eventEmitter.emit("newUserSignupClient"); + eventEmitter.emit("newUserSignup"); } resolve(user); diff --git a/account-kit/signer/src/client/types.ts b/account-kit/signer/src/client/types.ts index 87e76e9cb8..152c611f98 100644 --- a/account-kit/signer/src/client/types.ts +++ b/account-kit/signer/src/client/types.ts @@ -142,7 +142,7 @@ export type AuthenticatingEventMetadata = { export type AlchemySignerClientEvents = { connected(user: User): void; - newUserSignupClient(): void; + newUserSignup(): void; authenticating(data: AuthenticatingEventMetadata): void; connectedEmail(user: User, bundle: string): void; connectedPasskey(user: User): void; From e7a76d3ddbbabd82039e723e1254ac6a5b75758c Mon Sep 17 00:00:00 2001 From: Linna <38363056+linnall@users.noreply.github.com> Date: Thu, 14 Nov 2024 18:08:31 -0500 Subject: [PATCH 30/31] chore: remove console trace Co-authored-by: Michael Moldoveanu --- account-kit/react/src/hooks/useAuthModal.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/account-kit/react/src/hooks/useAuthModal.ts b/account-kit/react/src/hooks/useAuthModal.ts index c455732eaf..06d4fcc6a7 100644 --- a/account-kit/react/src/hooks/useAuthModal.ts +++ b/account-kit/react/src/hooks/useAuthModal.ts @@ -34,7 +34,6 @@ export const useAuthModal = () => { const openAuthModal = useCallback(() => setModalOpen(true), [setModalOpen]); const closeAuthModal = useCallback(() => { - console.trace("closing modal"); setModalOpen(false); }, [setModalOpen]); From e3467bae9991faa6b7f39ad1f9765c71039b895c Mon Sep 17 00:00:00 2001 From: linna Date: Thu, 14 Nov 2024 18:10:41 -0500 Subject: [PATCH 31/31] chore: remove empty line --- account-kit/react/src/components/auth/modal.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/account-kit/react/src/components/auth/modal.tsx b/account-kit/react/src/components/auth/modal.tsx index 3d343fce09..04317b7bb1 100644 --- a/account-kit/react/src/components/auth/modal.tsx +++ b/account-kit/react/src/components/auth/modal.tsx @@ -22,7 +22,6 @@ export const AuthModal = () => { const handleSignup = useCallback(() => { if (addPasskeyOnSignup) { openAuthModal(); - setAuthStep({ type: "passkey_create", });