Configure email and SMS behavior
Customize how the email and SMS are sent in your frontend application.
Changing email / SMS resend time interval
You can set resendEmailOrSMSGapInSeconds to establish a minimum delay before the frontend allows the user to click the “Resend” button.
This limit is only enforced on the client-side. For API rate-limiting please check out the deployment section.
import SuperTokens from "supertokens-auth-react";
import Passwordless from "supertokens-auth-react/recipe/passwordless";
import Session from "supertokens-auth-react/recipe/session";
SuperTokens.init({
appInfo: {
apiDomain: "...",
appName: "...",
websiteDomain: "...",
},
recipeList: [
Passwordless.init({
contactMethod: "EMAIL_OR_PHONE", // This example will work with any contactMethod.
signInUpFeature: {
// The default value is 15 seconds
resendEmailOrSMSGapInSeconds: 60,
},
}),
Session.init({
/* ... */
}),
],
});// this goes in the auth route config of your frontend app (once the pre-built UI script has been loaded)
supertokensUIInit({
appInfo: {
apiDomain: "...",
appName: "...",
websiteDomain: "...",
},
recipeList: [
supertokensUIPasswordless.init({
contactMethod: "EMAIL_OR_PHONE", // This example will work with any contactMethod.
signInUpFeature: {
// The default value is 15 seconds
resendEmailOrSMSGapInSeconds: 60,
},
}),
supertokensUISession.init({
/* ... */
}),
],
});Setting default country for phone inputs
Since your delivery method is email, this section is not relevant. If you would still like to see the content, you can resubmit your desired configuration by clicking on the button above.
By default, there is no default country selected. This means that users have to select / type in their phone number international code when signing in / signing up.
If you would like to set a default country (for all users), then you should use the defaultCountry configuration:
import SuperTokens from "supertokens-auth-react";
import Passwordless from "supertokens-auth-react/recipe/passwordless";
import Session from "supertokens-auth-react/recipe/session";
SuperTokens.init({
appInfo: {
apiDomain: "...",
appName: "...",
websiteDomain: "...",
},
recipeList: [
Passwordless.init({
contactMethod: "PHONE",
signInUpFeature: {
/*
* Must be a two-letter ISO country code (e.g.: "US")
*/
defaultCountry: "HU",
},
}),
Session.init({
/* ... */
}),
],
});// this goes in the auth route config of your frontend app (once the pre-built UI script has been loaded)
supertokensUIInit({
appInfo: {
apiDomain: "...",
appName: "...",
websiteDomain: "...",
},
recipeList: [
supertokensUIPasswordless.init({
contactMethod: "PHONE",
signInUpFeature: {
/*
* Must be a two-letter ISO country code (e.g.: "US")
*/
defaultCountry: "HU",
},
}),
supertokensUISession.init({
/* ... */
}),
],
});By default, there is no default country selected. This means that users have to select / type in their phone number international code when signing in / signing up.
If you would like to set a default country (for all users), then you should use the defaultCountry configuration:
import SuperTokens from "supertokens-auth-react";
import Passwordless from "supertokens-auth-react/recipe/passwordless";
import Session from "supertokens-auth-react/recipe/session";
SuperTokens.init({
appInfo: {
apiDomain: "...",
appName: "...",
websiteDomain: "...",
},
recipeList: [
Passwordless.init({
contactMethod: "EMAIL_OR_PHONE",
signInUpFeature: {
/*
* Must be a two-letter ISO country code (e.g.: "US")
*/
defaultCountry: "HU",
},
}),
Session.init({
/* ... */
}),
],
});// this goes in the auth route config of your frontend app (once the pre-built UI script has been loaded)
supertokensUIInit({
appInfo: {
apiDomain: "...",
appName: "...",
websiteDomain: "...",
},
recipeList: [
supertokensUIPasswordless.init({
contactMethod: "EMAIL_OR_PHONE",
signInUpFeature: {
/*
* Must be a two-letter ISO country code (e.g.: "US")
*/
defaultCountry: "HU",
},
}),
supertokensUISession.init({
/* ... */
}),
],
});