From 129870528d024831326e0422222ba390e8fa9057 Mon Sep 17 00:00:00 2001 From: Ankit Tiwari Date: Sat, 2 Dec 2023 13:51:17 +0530 Subject: [PATCH] feat: Add getRedirectionURL docs --- .../frontend-hooks/redirection-callback.mdx | 2 +- .../embed-sign-in-up-form.mdx | 34 +++++++++++++++++++ .../frontend-hooks/redirection-callback.mdx | 2 +- .../embed-sign-in-up-form.mdx | 34 +++++++++++++++++++ .../further-reading/passwordless-login.mdx | 4 +-- .../frontend-hooks/redirection-callback.mdx | 2 +- .../embed-sign-in-up-form.mdx | 34 +++++++++++++++++++ .../frontend-hooks/redirection-callback.mdx | 2 +- .../embed-sign-in-up-form.mdx | 34 +++++++++++++++++++ .../frontend-hooks/redirection-callback.mdx | 2 +- .../embed-sign-in-up-form.mdx | 34 +++++++++++++++++++ .../further-reading/passwordless-login.mdx | 4 +-- 12 files changed, 177 insertions(+), 11 deletions(-) diff --git a/v2/emailpassword/advanced-customizations/frontend-hooks/redirection-callback.mdx b/v2/emailpassword/advanced-customizations/frontend-hooks/redirection-callback.mdx index 41d3dde59..384a4221a 100644 --- a/v2/emailpassword/advanced-customizations/frontend-hooks/redirection-callback.mdx +++ b/v2/emailpassword/advanced-customizations/frontend-hooks/redirection-callback.mdx @@ -9,7 +9,7 @@ import TabItem from '@theme/TabItem'; # Redirection Callback Hook -This function is used to change where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. +This function is used to change where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. If you're embedding the sign in / up components in a popup and wish to disable redirection entirely, simply return `null`. diff --git a/v2/emailpassword/common-customizations/embed-sign-in-up-form.mdx b/v2/emailpassword/common-customizations/embed-sign-in-up-form.mdx index 0324be4ab..8aee6726f 100644 --- a/v2/emailpassword/common-customizations/embed-sign-in-up-form.mdx +++ b/v2/emailpassword/common-customizations/embed-sign-in-up-form.mdx @@ -128,4 +128,38 @@ SuperTokens.init({ }) ``` + + +## Step 4: Prevent redirection after SignIn / Up + +Upon successful login, SuperTokens redirects the user to the return value of `getRedirectionURL` provided in the recipe config. By default or when returning `undefined` from `getRedirectionURL`, the user is redirected to the `/` route. If you wish to completely prevent redirection, return `null` instead. + + + + +```tsx +import SuperTokens from "supertokens-auth-react"; +import EmailPassword from "supertokens-auth-react/recipe/emailpassword"; + +SuperTokens.init({ + appInfo: { + apiDomain: "...", + appName: "...", + websiteDomain: "..." + }, + recipeList: [ + EmailPassword.init({ + //highlight-start + getRedirectionURL: async (context) => { + // Prevent redirection after successful sign in/up by returning null. + if (context.action === "SUCCESS") { + return null; + }; + }, + //highlight-end + }) + ], +}) +``` + \ No newline at end of file diff --git a/v2/passwordless/advanced-customizations/frontend-hooks/redirection-callback.mdx b/v2/passwordless/advanced-customizations/frontend-hooks/redirection-callback.mdx index e122c405c..c4fc57bce 100644 --- a/v2/passwordless/advanced-customizations/frontend-hooks/redirection-callback.mdx +++ b/v2/passwordless/advanced-customizations/frontend-hooks/redirection-callback.mdx @@ -9,7 +9,7 @@ import TabItem from '@theme/TabItem'; # Redirection Callback Hook -This function is used to change where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. +This function is used to change where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. If you're embedding the sign in / up components in a popup and wish to disable redirection entirely, simply return `null`. diff --git a/v2/passwordless/common-customizations/embed-sign-in-up-form.mdx b/v2/passwordless/common-customizations/embed-sign-in-up-form.mdx index 9427779d7..5a815a7f3 100644 --- a/v2/passwordless/common-customizations/embed-sign-in-up-form.mdx +++ b/v2/passwordless/common-customizations/embed-sign-in-up-form.mdx @@ -132,4 +132,38 @@ SuperTokens.init({ }) ``` + + +## Step 4: Prevent redirection after SignIn / Up + +Upon successful login, SuperTokens redirects the user to the return value of `getRedirectionURL` provided in the recipe config. By default or when returning `undefined` from `getRedirectionURL`, the user is redirected to the `/` route. If you wish to completely prevent redirection, return `null` instead. + + + + +```tsx +import SuperTokens from "supertokens-auth-react"; +import Passwordless from "supertokens-auth-react/recipe/passwordless"; + +SuperTokens.init({ + appInfo: { + apiDomain: "...", + appName: "...", + websiteDomain: "..." + }, + recipeList: [ + Passwordless.init({ + //highlight-start + getRedirectionURL: async (context) => { + // Prevent redirection after successful sign in/up by returning null. + if (context.action === "SUCCESS") { + return null; + }; + }, + //highlight-end + }) + ], +}) +``` + \ No newline at end of file diff --git a/v2/passwordless/pre-built-ui/further-reading/passwordless-login.mdx b/v2/passwordless/pre-built-ui/further-reading/passwordless-login.mdx index 6b353fb63..1ca8e6188 100644 --- a/v2/passwordless/pre-built-ui/further-reading/passwordless-login.mdx +++ b/v2/passwordless/pre-built-ui/further-reading/passwordless-login.mdx @@ -93,9 +93,7 @@ Entering an incorrect OTP too many times results in the user being navigated bac There is a edge case wherein the end user get's both an OTP and a magic link, and whilst viewing the enter OTP screen, then also click on the magic link separately. The magic link click will open a new tab and will consume the link to log the user in. -Since the user is logged in, the enter OTP screen will change to show the UI as shown below - -Magic link and OTP at the same time +Since the user is logged in, the enter OTP screen will automatically redirect to the return value of the `getRedirectUrl` function provided in the recipe config, which defaults to `/`. ## Default email and SMS template diff --git a/v2/thirdparty/advanced-customizations/frontend-hooks/redirection-callback.mdx b/v2/thirdparty/advanced-customizations/frontend-hooks/redirection-callback.mdx index 6993e04a6..b46b2b088 100644 --- a/v2/thirdparty/advanced-customizations/frontend-hooks/redirection-callback.mdx +++ b/v2/thirdparty/advanced-customizations/frontend-hooks/redirection-callback.mdx @@ -9,7 +9,7 @@ import TabItem from '@theme/TabItem'; # Redirection Callback Hook -This function is used to overwrite where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. +This function is used to change where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. If you're embedding the sign in / up components in a popup and wish to disable redirection entirely, simply return `null`. diff --git a/v2/thirdparty/common-customizations/embed-sign-in-up-form.mdx b/v2/thirdparty/common-customizations/embed-sign-in-up-form.mdx index c739a1621..457d1aec0 100644 --- a/v2/thirdparty/common-customizations/embed-sign-in-up-form.mdx +++ b/v2/thirdparty/common-customizations/embed-sign-in-up-form.mdx @@ -128,4 +128,38 @@ SuperTokens.init({ }) ``` + + +## Step 4: Prevent redirection after SignIn / Up + +Upon successful login, SuperTokens redirects the user to the return value of `getRedirectionURL` provided in the recipe config. By default or when returning `undefined` from `getRedirectionURL`, the user is redirected to the `/` route. If you wish to completely prevent redirection, return `null` instead. + + + + +```tsx +import SuperTokens from "supertokens-auth-react"; +import ThirdParty from "supertokens-auth-react/recipe/thirdparty"; + +SuperTokens.init({ + appInfo: { + apiDomain: "...", + appName: "...", + websiteDomain: "..." + }, + recipeList: [ + ThirdParty.init({ + //highlight-start + getRedirectionURL: async (context) => { + // Prevent redirection after successful sign in/up by returning null. + if (context.action === "SUCCESS") { + return null; + }; + }, + //highlight-end + }) + ], +}) +``` + \ No newline at end of file diff --git a/v2/thirdpartyemailpassword/advanced-customizations/frontend-hooks/redirection-callback.mdx b/v2/thirdpartyemailpassword/advanced-customizations/frontend-hooks/redirection-callback.mdx index 9e74fa4da..907dd49ce 100644 --- a/v2/thirdpartyemailpassword/advanced-customizations/frontend-hooks/redirection-callback.mdx +++ b/v2/thirdpartyemailpassword/advanced-customizations/frontend-hooks/redirection-callback.mdx @@ -9,7 +9,7 @@ import TabItem from '@theme/TabItem'; # Redirection Callback Hook -This function is used to change where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. +This function is used to change where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. If you're embedding the sign in / up components in a popup and wish to disable redirection entirely, simply return `null`. diff --git a/v2/thirdpartyemailpassword/common-customizations/embed-sign-in-up-form.mdx b/v2/thirdpartyemailpassword/common-customizations/embed-sign-in-up-form.mdx index a823ab478..1ad9ef38b 100644 --- a/v2/thirdpartyemailpassword/common-customizations/embed-sign-in-up-form.mdx +++ b/v2/thirdpartyemailpassword/common-customizations/embed-sign-in-up-form.mdx @@ -130,4 +130,38 @@ SuperTokens.init({ }) ``` + + +## Step 4: Prevent redirection after SignIn / Up + +Upon successful login, SuperTokens redirects the user to the return value of `getRedirectionURL` provided in the recipe config. By default or when returning `undefined` from `getRedirectionURL`, the user is redirected to the `/` route. If you wish to completely prevent redirection, return `null` instead. + + + + +```tsx +import SuperTokens from "supertokens-auth-react"; +import ThirdPartyEmailPassword from "supertokens-auth-react/recipe/thirdpartyemailpassword"; + +SuperTokens.init({ + appInfo: { + apiDomain: "...", + appName: "...", + websiteDomain: "..." + }, + recipeList: [ + ThirdPartyEmailPassword.init({ + //highlight-start + getRedirectionURL: async (context) => { + // Prevent redirection after successful sign in/up by returning null. + if (context.action === "SUCCESS") { + return null; + }; + }, + //highlight-end + }) + ], +}) +``` + \ No newline at end of file diff --git a/v2/thirdpartypasswordless/advanced-customizations/frontend-hooks/redirection-callback.mdx b/v2/thirdpartypasswordless/advanced-customizations/frontend-hooks/redirection-callback.mdx index 9741393bb..3bf645ead 100644 --- a/v2/thirdpartypasswordless/advanced-customizations/frontend-hooks/redirection-callback.mdx +++ b/v2/thirdpartypasswordless/advanced-customizations/frontend-hooks/redirection-callback.mdx @@ -9,7 +9,7 @@ import TabItem from '@theme/TabItem'; # Redirection Callback Hook -This function is used to change where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. +This function is used to change where the user is redirected to post certain actions. For example, you can use this to redirect a user to a specific URL post sign in / up. If you're embedding the sign in / up components in a popup and wish to disable redirection entirely, simply return `null`. diff --git a/v2/thirdpartypasswordless/common-customizations/embed-sign-in-up-form.mdx b/v2/thirdpartypasswordless/common-customizations/embed-sign-in-up-form.mdx index e1363ea9a..44f4943e3 100644 --- a/v2/thirdpartypasswordless/common-customizations/embed-sign-in-up-form.mdx +++ b/v2/thirdpartypasswordless/common-customizations/embed-sign-in-up-form.mdx @@ -132,4 +132,38 @@ SuperTokens.init({ }) ``` + + +## Step 4: Prevent redirection after SignIn / Up + +Upon successful login, SuperTokens redirects the user to the return value of `getRedirectionURL` provided in the recipe config. By default or when returning `undefined` from `getRedirectionURL`, the user is redirected to the `/` route. If you wish to completely prevent redirection, return `null` instead. + + + + +```tsx +import SuperTokens from "supertokens-auth-react"; +import ThirdPartyPasswordless from "supertokens-auth-react/recipe/thirdpartypasswordless"; + +SuperTokens.init({ + appInfo: { + apiDomain: "...", + appName: "...", + websiteDomain: "..." + }, + recipeList: [ + ThirdPartyPasswordless.init({ + //highlight-start + getRedirectionURL: async (context) => { + // Prevent redirection after successful sign in/up by returning null. + if (context.action === "SUCCESS") { + return null; + }; + }, + //highlight-end + }) + ], +}) +``` + \ No newline at end of file diff --git a/v2/thirdpartypasswordless/pre-built-ui/further-reading/passwordless-login.mdx b/v2/thirdpartypasswordless/pre-built-ui/further-reading/passwordless-login.mdx index fc7a955c4..b2353eeed 100644 --- a/v2/thirdpartypasswordless/pre-built-ui/further-reading/passwordless-login.mdx +++ b/v2/thirdpartypasswordless/pre-built-ui/further-reading/passwordless-login.mdx @@ -93,9 +93,7 @@ Entering an incorrect OTP too many times results in the user being navigated bac There is a edge case wherein the end user get's both an OTP and a magic link, and whilst viewing the enter OTP screen, then also click on the magic link separately. The magic link click will open a new tab and will consume the link to log the user in. -Since the user is logged in, the enter OTP screen will change to show the UI as shown below - -Magic link and OTP at the same time +Since the user is logged in, the enter OTP screen will automatically redirect to the return value of the `getRedirectUrl` function provided in the recipe config, which defaults to `/`. ## Default email and SMS template