diff --git a/.changeset/tall-dryers-hide.md b/.changeset/tall-dryers-hide.md new file mode 100644 index 00000000000..8debd92c02d --- /dev/null +++ b/.changeset/tall-dryers-hide.md @@ -0,0 +1,7 @@ +--- +'@clerk/clerk-js': minor +'@clerk/shared': minor +'@clerk/types': minor +--- + +[Billing Beta] Replace `redirectUrl` with `navigate` in `checkout.finalize()` diff --git a/packages/clerk-js/src/core/modules/checkout/instance.ts b/packages/clerk-js/src/core/modules/checkout/instance.ts index c316332ffe9..cd8ad389a34 100644 --- a/packages/clerk-js/src/core/modules/checkout/instance.ts +++ b/packages/clerk-js/src/core/modules/checkout/instance.ts @@ -2,6 +2,7 @@ import type { __experimental_CheckoutCacheState, __experimental_CheckoutInstance, __experimental_CheckoutOptions, + SetActiveNavigate, } from '@clerk/types'; import type { Clerk } from '../../clerk'; @@ -62,9 +63,9 @@ function createCheckoutInstance( }); }; - const finalize = (params?: { redirectUrl: string }) => { - const { redirectUrl } = params || {}; - return clerk.setActive({ session: clerk.session?.id, redirectUrl }); + const finalize = (params?: { navigate?: SetActiveNavigate }) => { + const { navigate } = params || {}; + return clerk.setActive({ session: clerk.session?.id, navigate }); }; const clear = () => manager.clearCheckout(); diff --git a/packages/shared/src/react/hooks/__tests__/useCheckout.type.spec.ts b/packages/shared/src/react/hooks/__tests__/useCheckout.type.spec.ts index d238dd3dbd4..fc4ad905655 100644 --- a/packages/shared/src/react/hooks/__tests__/useCheckout.type.spec.ts +++ b/packages/shared/src/react/hooks/__tests__/useCheckout.type.spec.ts @@ -5,6 +5,7 @@ import type { CommerceCheckoutResource, CommerceSubscriptionPlanPeriod, ConfirmCheckoutParams, + SetActiveNavigate, } from '@clerk/types'; import { describe, expectTypeOf, it } from 'vitest'; @@ -89,7 +90,7 @@ describe('useCheckout type tests', () => { expectTypeOf().returns.resolves.toEqualTypeOf(); expectTypeOf().returns.resolves.toEqualTypeOf(); expectTypeOf().returns.toBeVoid(); - expectTypeOf().parameter(0).toEqualTypeOf<{ redirectUrl: string } | undefined>(); + expectTypeOf().parameter(0).toEqualTypeOf<{ navigate?: SetActiveNavigate } | undefined>(); expectTypeOf().returns.toEqualTypeOf<__experimental_CheckoutCacheState>(); }); @@ -245,7 +246,9 @@ describe('useCheckout type tests', () => { expectTypeOf().toEqualTypeOf<__experimental_CheckoutInstance['confirm']>(); expectTypeOf().toEqualTypeOf<__experimental_CheckoutInstance['start']>(); expectTypeOf().toEqualTypeOf<() => void>(); - expectTypeOf().toEqualTypeOf<(params?: { redirectUrl: string }) => void>(); + expectTypeOf().toEqualTypeOf< + (params?: { navigate?: SetActiveNavigate }) => void + >(); expectTypeOf().toEqualTypeOf<() => __experimental_CheckoutCacheState>(); }); }); diff --git a/packages/shared/src/react/hooks/useCheckout.ts b/packages/shared/src/react/hooks/useCheckout.ts index 0aee53f26d4..465d5531f67 100644 --- a/packages/shared/src/react/hooks/useCheckout.ts +++ b/packages/shared/src/react/hooks/useCheckout.ts @@ -2,6 +2,7 @@ import type { __experimental_CheckoutCacheState, __experimental_CheckoutInstance, CommerceCheckoutResource, + SetActiveNavigate, } from '@clerk/types'; import { useMemo, useSyncExternalStore } from 'react'; @@ -57,7 +58,7 @@ type __experimental_UseCheckoutReturn = { confirm: __experimental_CheckoutInstance['confirm']; start: __experimental_CheckoutInstance['start']; clear: () => void; - finalize: (params?: { redirectUrl: string }) => void; + finalize: (params?: { navigate?: SetActiveNavigate }) => void; getState: () => __experimental_CheckoutCacheState; isStarting: boolean; isConfirming: boolean; diff --git a/packages/types/src/clerk.ts b/packages/types/src/clerk.ts index a9105e5b64e..f3a37e4bb87 100644 --- a/packages/types/src/clerk.ts +++ b/packages/types/src/clerk.ts @@ -92,7 +92,7 @@ export type __experimental_CheckoutInstance = { confirm: (params: ConfirmCheckoutParams) => Promise; start: () => Promise; clear: () => void; - finalize: (params?: { redirectUrl: string }) => Promise; + finalize: (params?: { navigate?: SetActiveNavigate }) => Promise; subscribe: (listener: (state: __experimental_CheckoutCacheState) => void) => () => void; getState: () => __experimental_CheckoutCacheState; };