@@ -59,35 +59,19 @@ export const AuthPage = () => {
);
},
}}>
-
{
- return (
-
-
- {
- localStorage.removeItem("tenantId");
- setHasSelectedTenantId(undefined);
- }}
- />
-
- );
- },
- }}>
-
- {getSuperTokensRoutesForReactRouterDom(
- reactRouterDom,
- [
- ThirdPartyEmailPasswordPreBuiltUI,
- ThirdPartyPasswordlessPreBuiltUI,
- EmailVerificationPreBuiltUI,
- ],
- getWebsiteBasePath()
- )}
-
-
-
+
+ {getSuperTokensRoutesForReactRouterDom(
+ reactRouterDom,
+ [
+ ThirdPartyPreBuiltUI,
+ EmailPasswordPreBuiltUI,
+ PasswordlessPreBuiltUI,
+ EmailVerificationPreBuiltUI,
+ ],
+ getWebsiteBasePath()
+ )}
+
+
);
} else {
return
;
diff --git a/examples/with-one-login-per-subdomain/api-server.js b/examples/with-one-login-per-subdomain/api-server.js
index 4707387fb..0967fb90e 100644
--- a/examples/with-one-login-per-subdomain/api-server.js
+++ b/examples/with-one-login-per-subdomain/api-server.js
@@ -4,8 +4,9 @@ let supertokens = require("supertokens-node");
let Session = require("supertokens-node/recipe/session");
let { verifySession } = require("supertokens-node/recipe/session/framework/express");
let { middleware, errorHandler } = require("supertokens-node/framework/express");
-let ThirdPartyEmailPassword = require("supertokens-node/recipe/thirdpartyemailpassword");
-let ThirdPartyPasswordless = require("supertokens-node/recipe/thirdpartypasswordless");
+let ThirdParty = require("supertokens-node/recipe/thirdparty");
+let EmailPassword = require("supertokens-node/recipe/emailpassword");
+let Passwordless = require("supertokens-node/recipe/passwordless");
let Dashboard = require("supertokens-node/recipe/dashboard");
let Multitenancy = require("supertokens-node/recipe/multitenancy");
let EmailVerification = require("supertokens-node/recipe/emailverification");
@@ -50,7 +51,7 @@ supertokens.init({
return [tenantId + ".example.com"];
},
}),
- ThirdPartyPasswordless.init({
+ Passwordless.init({
contactMethod: "EMAIL",
flowType: "USER_INPUT_CODE_AND_MAGIC_LINK",
emailDelivery: {
@@ -66,7 +67,7 @@ supertokens.init({
}),
},
}),
- ThirdPartyEmailPassword.init({
+ EmailPassword.init({
emailDelivery: {
override: (oI) => ({
...oI,
@@ -80,6 +81,7 @@ supertokens.init({
}),
},
}),
+ ThirdParty.init(),
Session.init(),
Dashboard.init(),
],
diff --git a/examples/with-one-login-per-subdomain/src/App.js b/examples/with-one-login-per-subdomain/src/App.js
index 99fe54f15..5c60d20c4 100644
--- a/examples/with-one-login-per-subdomain/src/App.js
+++ b/examples/with-one-login-per-subdomain/src/App.js
@@ -4,10 +4,12 @@ import { getSuperTokensRoutesForReactRouterDom } from "supertokens-auth-react/ui
import EmailVerification from "supertokens-auth-react/recipe/emailverification";
import { EmailVerificationPreBuiltUI } from "supertokens-auth-react/recipe/emailverification/prebuiltui";
import Multitenancy, { AllowedDomainsClaim } from "supertokens-auth-react/recipe/multitenancy";
-import ThirdPartyEmailPassword from "supertokens-auth-react/recipe/thirdpartyemailpassword";
-import ThirdPartyPasswordless from "supertokens-auth-react/recipe/thirdpartypasswordless";
-import { ThirdPartyEmailPasswordPreBuiltUI } from "supertokens-auth-react/recipe/thirdpartyemailpassword/prebuiltui";
-import { ThirdPartyPasswordlessPreBuiltUI } from "supertokens-auth-react/recipe/thirdpartypasswordless/prebuiltui";
+import ThirdParty from "supertokens-auth-react/recipe/thirdparty";
+import EmailPassword from "supertokens-auth-react/recipe/emailpassword";
+import Passwordless from "supertokens-auth-react/recipe/passwordless";
+import { ThirdPartyPreBuiltUI } from "supertokens-auth-react/recipe/thirdparty/prebuiltui";
+import { EmailPasswordPreBuiltUI } from "supertokens-auth-react/recipe/emailpassword/prebuiltui";
+import { PasswordlessPreBuiltUI } from "supertokens-auth-react/recipe/passwordless/prebuiltui";
import Session, { SessionAuth, getClaimValue } from "supertokens-auth-react/recipe/session";
import { Routes, BrowserRouter as Router, Route } from "react-router-dom";
import Home from "./Home";
@@ -33,8 +35,9 @@ SuperTokens.init({
}),
},
}),
- ThirdPartyEmailPassword.init(),
- ThirdPartyPasswordless.init({
+ ThirdParty.init(),
+ EmailPassword.init(),
+ Passwordless.init({
contactMethod: "EMAIL",
}),
Session.init({
@@ -68,8 +71,9 @@ function App() {
{getSuperTokensRoutesForReactRouterDom(require("react-router-dom"), [
- ThirdPartyEmailPasswordPreBuiltUI,
- ThirdPartyPasswordlessPreBuiltUI,
+ ThirdPartyPreBuiltUI,
+ EmailPasswordPreBuiltUI,
+ PasswordlessPreBuiltUI,
EmailVerificationPreBuiltUI,
])}
({
...oI,
getGlobalClaimValidators: ({ claimValidatorsAddedByOtherRecipes }) => {
- return [...claimValidatorsAddedByOtherRecipes, PhoneVerifiedClaim.validators.isTrue()];
+ return [
+ ...claimValidatorsAddedByOtherRecipes.filter(
+ (v) => v.id !== MultiFactorAuth.MultiFactorAuthClaim.id
+ ),
+ PhoneVerifiedClaim.validators.isTrue(),
+ ];
},
}),
},
diff --git a/examples/with-phone-password/src/Home/index.tsx b/examples/with-phone-password/src/Home/index.tsx
index d7bb0ecc3..4aac8fd3b 100644
--- a/examples/with-phone-password/src/Home/index.tsx
+++ b/examples/with-phone-password/src/Home/index.tsx
@@ -3,7 +3,7 @@ import Logout from "./Logout";
import SuccessView from "./SuccessView";
import { useSessionContext } from "supertokens-auth-react/recipe/session";
import { useNavigate } from "react-router-dom";
-import { signOut } from "supertokens-auth-react/recipe/emailpassword";
+import { signOut } from "supertokens-auth-react/recipe/session";
import { PhoneVerifiedClaim } from "../phoneVerifiedClaim";
export default function Home() {
diff --git a/examples/with-phone-password/src/PhoneVerification/index.tsx b/examples/with-phone-password/src/PhoneVerification/index.tsx
index fbdb220fa..00d045561 100644
--- a/examples/with-phone-password/src/PhoneVerification/index.tsx
+++ b/examples/with-phone-password/src/PhoneVerification/index.tsx
@@ -1,11 +1,14 @@
import { useState, useEffect } from "react";
import { useSessionContext } from "supertokens-auth-react/recipe/session";
-import { SignInUp, SignInUpTheme } from "supertokens-auth-react/recipe/passwordless/prebuiltui";
import * as reactRouterDom from "react-router-dom";
+import { AuthPage, AuthPageTheme, AuthPageThemeProps } from "supertokens-auth-react/ui";
+import Passwordless from "supertokens-auth-react/recipe/passwordless";
+import { PasswordlessPreBuiltUI } from "supertokens-auth-react/recipe/passwordless/prebuiltui";
-const CustomSignInUpTheme: typeof SignInUpTheme = (props) => {
+const CustomSignInUpTheme = (props: AuthPageThemeProps) => {
let [showDefaultUI, setShowDefaultUI] = useState(false);
const session = useSessionContext();
+
useEffect(() => {
let aborting = false;
async function effect() {
@@ -13,20 +16,37 @@ const CustomSignInUpTheme: typeof SignInUpTheme = (props) => {
return;
}
- let phoneNumber = session.accessTokenPayload.phoneNumber;
+ const phoneNumber = session.accessTokenPayload.phoneNumber;
+
// If don't have a phone number we show the default UI (which should be the phone form)
if (phoneNumber === undefined) {
setShowDefaultUI(true);
} else {
- // we start the OTP flow if it's not started already
- if (props.featureState.loginAttemptInfo === undefined) {
- await props.recipeImplementation.createCode({ phoneNumber, userContext: props.userContext });
- }
+ const attemptInfo = await Passwordless.getLoginAttemptInfo();
if (aborting) {
return;
}
- // if we have an OTP flow (or we just started one) we show the default UI which should be the OTP input
+ if (attemptInfo === undefined) {
+ const additionalAttemptInfo = {
+ lastResend: Date.now(),
+ contactMethod: "PHONE",
+ contactInfo: phoneNumber,
+ redirectToPath: "/dashboard",
+ };
+
+ const res = await Passwordless.createCode({
+ phoneNumber,
+ userContext: { additionalAttemptInfo },
+ });
+
+ if (res.status === "OK") {
+ props.rebuildAuthPage();
+ } else {
+ props.onError(res.reason ?? res.status);
+ }
+ }
+ // if we have an OTP flow (or we just tried to start one) we show the default UI which should be the OTP input
setShowDefaultUI(true);
}
}
@@ -34,10 +54,10 @@ const CustomSignInUpTheme: typeof SignInUpTheme = (props) => {
return () => {
aborting = true;
};
- }, []);
+ }, [session.loading]);
if (showDefaultUI) {
- return ;
+ return ;
}
return <>;
};
@@ -46,11 +66,15 @@ export default function PhoneVerification() {
const navigate = reactRouterDom.useNavigate();
return (
-
+
{
// @ts-ignore We ignore the error about missing props, since they'll be set by the feature component
}
-
+
);
}
diff --git a/examples/with-sign-in-up-split-emailpassword/src/App.js b/examples/with-sign-in-up-split-emailpassword/src/App.js
index bd487ddd7..012391ebe 100644
--- a/examples/with-sign-in-up-split-emailpassword/src/App.js
+++ b/examples/with-sign-in-up-split-emailpassword/src/App.js
@@ -1,8 +1,12 @@
import { useState, useEffect } from "react";
import "./App.css";
import SuperTokens, { SuperTokensWrapper } from "supertokens-auth-react";
-import { getSuperTokensRoutesForReactRouterDom } from "supertokens-auth-react/ui";
-import EmailPassword, { EmailPasswordComponentsOverrideProvider } from "supertokens-auth-react/recipe/emailpassword";
+import {
+ getSuperTokensRoutesForReactRouterDom,
+ AuthPage,
+ AuthRecipeComponentsOverrideContextProvider,
+} from "supertokens-auth-react/ui";
+import EmailPassword from "supertokens-auth-react/recipe/emailpassword";
import { EmailPasswordPreBuiltUI } from "supertokens-auth-react/recipe/emailpassword/prebuiltui";
import Session, { SessionAuth } from "supertokens-auth-react/recipe/session";
import Home from "./Home";
@@ -28,41 +32,23 @@ SuperTokens.init({
apiDomain: getApiDomain(), // TODO: Change to your app's API domain
websiteDomain: getWebsiteDomain(), // TODO: Change to your app's website domain
},
- recipeList: [
- EmailPassword.init({
- signInAndUpFeature: {
- disableDefaultImplementation: true, // this disables showing the default sign in + sign up component
-
- signInForm: {
- // hides the element that shows switch to the sign up form and the divider in the sign in UI
- style: `
- [data-supertokens~=headerSubtitle] {
- display: none;
- }
- [data-supertokens~=divider] {
- display: none;
- }
- `,
- },
- signUpForm: {
- // hides the element that shows switch to the sign in form
- style: `
- [data-supertokens~=headerSubtitle] {
- display: none;
- }
- `,
- },
- },
- getRedirectionURL: function (context) {
- if (context.action === "SIGN_IN_AND_UP") {
- // if the user is not logged in, we want to send
- // them to the sign in page.
- return "/signin";
- }
- },
- }),
- Session.init(),
- ],
+ disableAuthRoute: true,
+ style: `
+ [data-supertokens~=headerSubtitle] {
+ display: none;
+ }
+ [data-supertokens~=divider] {
+ display: none;
+ }
+ `,
+ getRedirectionURL: function (context) {
+ if (context.action === "TO_AUTH") {
+ // if the user is not logged in, we want to send
+ // them to the sign in page.
+ return "/signin";
+ }
+ },
+ recipeList: [EmailPassword.init(), Session.init()],
});
function App() {
@@ -70,59 +56,23 @@ function App() {
return (
- {
- /* if the user visits the /signin route, we want to show the
- default implementation. If thy visit the /signup
- route (which also renders the component),
- we want to show the sign up UI, so we set the query parm to ?show=signup
- which shows the sign up UI.
- */
- const [showUI, setShowUI] = useState(false);
- useEffect(() => {
- if (window.location.pathname === "/signin") {
- setShowUI(true);
- } else if (window.location.pathname === "/signup") {
- window.location.href = "/signup?show=signup";
- } else {
- setShowUI(true);
- }
- }, []);
- if (showUI) {
- return ;
- } else {
- return null;
- }
- },
- EmailPasswordSignUp_Override: ({ DefaultComponent, ...props }) => {
- /* if the user visits the /signup route, we want to show the
- default implementation. If thy visit the /signin?show=signup
- route, we want to show the sign in UI, so we redirect them to /signin
- which shows the sign in UI.
- */
- const [showUI, setShowUI] = useState(false);
- useEffect(() => {
- if (window.location.pathname === "/signup") {
- setShowUI(true);
- } else if (window.location.pathname === "/signin") {
- window.location.href = "/signin";
- } else {
- setShowUI(true);
- }
- }, []);
- if (showUI) {
- return ;
- } else {
- return null;
- }
- },
- EmailPasswordSignInHeader_Override: ({ DefaultComponent, ...props }) => {
- return (
+ AuthPageHeader_Override: ({ DefaultComponent, ...props }) => {
+ return props.isSignUp ? (
+
+
+ Click{" "}
+
+ here
+ {" "}
+ to sign in
+
Click{" "}
-
+
here
{" "}
to sign up
@@ -143,8 +93,8 @@ function App() {
path="/"
element={
/* This protects the "/" route so that it shows
-
only if the user is logged in.
- Else it redirects the user to "/auth" */
+
only if the user is logged in.
+ Else it redirects the user to "/auth" */
{
updateShowSessionExpiredPopup(true);
@@ -155,20 +105,26 @@ function App() {
}
/>
{/* we want to render the sign in component in /signin.
- We will override the component to only show the sign in
- UI on this route. See the init function call above for how to do this*/}
- } />
+ We will override the component to only show the sign in
+ UI on this route. See the init function call above for how to do this*/}
+ }
+ />
{/* we want to render the sign up component in /signup.
- We will override the component to only show the sign up
- UI on this route. See the init function call above for how to do this*/}
- } />
+ We will override the component to only show the sign up
+ UI on this route. See the init function call above for how to do this*/}
+ }
+ />
-
+
);
}
diff --git a/examples/with-sign-in-up-split-emailpassword/src/Home/index.js b/examples/with-sign-in-up-split-emailpassword/src/Home/index.js
index 9fe0d1733..3b232a4fd 100644
--- a/examples/with-sign-in-up-split-emailpassword/src/Home/index.js
+++ b/examples/with-sign-in-up-split-emailpassword/src/Home/index.js
@@ -3,7 +3,7 @@ import Logout from "./Logout";
import SuccessView from "./SuccessView";
import { useSessionContext } from "supertokens-auth-react/recipe/session";
import { useNavigate } from "react-router-dom";
-import { signOut } from "supertokens-auth-react/recipe/emailpassword";
+import { signOut } from "supertokens-auth-react/recipe/session";
export default function Home() {
const session = useSessionContext();
diff --git a/examples/with-supabase/config/backendConfig.ts b/examples/with-supabase/config/backendConfig.ts
index a8f4dd4f6..cf617714a 100644
--- a/examples/with-supabase/config/backendConfig.ts
+++ b/examples/with-supabase/config/backendConfig.ts
@@ -1,4 +1,5 @@
-import ThirdPartyEmailPasswordNode from "supertokens-node/recipe/thirdpartyemailpassword";
+import ThirdPartyNode from "supertokens-node/recipe/thirdparty";
+import EmailPasswordNode from "supertokens-node/recipe/emailpassword";
import SessionNode from "supertokens-node/recipe/session";
import EmailVerificationNode from "supertokens-node/recipe/emailverification";
import { appInfo } from "./appInfo";
@@ -18,60 +19,96 @@ export let backendConfig = (): TypeInput => {
EmailVerificationNode.init({
mode: "REQUIRED",
}),
- ThirdPartyEmailPasswordNode.init({
- providers: [
- // We have provided you with development keys which you can use for testing.
- // IMPORTANT: Please replace them with your own OAuth keys for production use.
- {
- config: {
- thirdPartyId: "google",
- clients: [
- {
- clientId: process.env.GOOGLE_CLIENT_ID,
- clientSecret: process.env.GOOGLE_CLIENT_SECRET,
- },
- ],
+ EmailPasswordNode.init({
+ override: {
+ apis: (originalImplementation) => ({
+ ...originalImplementation,
+
+ signUpPOST: async function (input) {
+ if (originalImplementation.signUpPOST === undefined) {
+ throw Error("Should never come here");
+ }
+
+ let response = await originalImplementation.signUpPOST(input);
+
+ if (response.status === "OK") {
+ // retrieve the accessTokenPayload from the user's session
+ const accessTokenPayload = response.session.getAccessTokenPayload();
+
+ // create a supabase client with the supabase_token from the accessTokenPayload
+ const supabase = getSupabase(accessTokenPayload.supabase_token);
+
+ // store the user's email mapped to their userId in Supabase
+ const { error } = await supabase
+ .from("users")
+ .insert({ email: response.user.emails[0], user_id: response.user.id });
+
+ if (error !== null) {
+ throw error;
+ }
+ }
+
+ return response;
},
- },
- {
- config: {
- thirdPartyId: "github",
- clients: [
- {
- clientId: process.env.GITHUB_CLIENT_ID,
- clientSecret: process.env.GITHUB_CLIENT_SECRET,
- },
- ],
+ }),
+ },
+ }),
+ ThirdPartyNode.init({
+ signInAndUpFeature: {
+ providers: [
+ // We have provided you with development keys which you can use for testing.
+ // IMPORTANT: Please replace them with your own OAuth keys for production use.
+ {
+ config: {
+ thirdPartyId: "google",
+ clients: [
+ {
+ clientId: process.env.GOOGLE_CLIENT_ID,
+ clientSecret: process.env.GOOGLE_CLIENT_SECRET,
+ },
+ ],
+ },
},
- },
- {
- config: {
- thirdPartyId: "apple",
- clients: [
- {
- clientId: process.env.APPLE_CLIENT_ID,
- additionalConfig: {
- keyId: process.env.APPLE_KEY_ID,
- privateKey: process.env.APPLE_PRIVATE_KEY.replace(/\\n/g, "\n"),
- teamId: process.env.APPLE_TEAM_ID,
+ {
+ config: {
+ thirdPartyId: "github",
+ clients: [
+ {
+ clientId: process.env.GITHUB_CLIENT_ID,
+ clientSecret: process.env.GITHUB_CLIENT_SECRET,
+ },
+ ],
+ },
+ },
+ {
+ config: {
+ thirdPartyId: "apple",
+ clients: [
+ {
+ clientId: process.env.APPLE_CLIENT_ID,
+ additionalConfig: {
+ keyId: process.env.APPLE_KEY_ID,
+ privateKey: process.env.APPLE_PRIVATE_KEY.replace(/\\n/g, "\n"),
+ teamId: process.env.APPLE_TEAM_ID,
+ },
},
- },
- ],
+ ],
+ },
},
- },
- ],
+ ],
+ },
override: {
apis: (originalImplementation) => {
return {
...originalImplementation,
- // the thirdPartySignInUpPost function handles sign up/in via Social login
- thirdPartySignInUpPOST: async function (input) {
- if (originalImplementation.thirdPartySignInUpPOST === undefined) {
+ // the signInUpPost function handles sign up/in via Social login
+ signInUpPOST: async function (input) {
+ if (originalImplementation.signInUpPOST === undefined) {
throw Error("Should never come here");
}
// call the sign up/in api for social login
- let response = await originalImplementation.thirdPartySignInUpPOST(input);
+ let response = await originalImplementation.signInUpPOST(input);
// check that there is no issue with sign up and that a new user is created
if (response.status === "OK" && response.createdNewRecipeUser) {
@@ -84,35 +121,7 @@ export let backendConfig = (): TypeInput => {
// store the user's email mapped to their userId in Supabase
const { error } = await supabase
.from("users")
- .insert({ email: response.user.email, user_id: response.user.id });
-
- if (error !== null) {
- throw error;
- }
- }
-
- return response;
- },
-
- // the emailPasswordSignUpPOST function handles sign up via Email-Password
- emailPasswordSignUpPOST: async function (input) {
- if (originalImplementation.emailPasswordSignUpPOST === undefined) {
- throw Error("Should never come here");
- }
-
- let response = await originalImplementation.emailPasswordSignUpPOST(input);
-
- if (response.status === "OK") {
- // retrieve the accessTokenPayload from the user's session
- const accessTokenPayload = response.session.getAccessTokenPayload();
-
- // create a supabase client with the supabase_token from the accessTokenPayload
- const supabase = getSupabase(accessTokenPayload.supabase_token);
-
- // store the user's email mapped to their userId in Supabase
- const { error } = await supabase
- .from("users")
- .insert({ email: response.user.email, user_id: response.user.id });
+ .insert({ email: response.user.emails[0], user_id: response.user.id });
if (error !== null) {
throw error;
diff --git a/examples/with-supabase/config/frontendConfig.ts b/examples/with-supabase/config/frontendConfig.ts
index 69e6f28e4..4c63549be 100644
--- a/examples/with-supabase/config/frontendConfig.ts
+++ b/examples/with-supabase/config/frontendConfig.ts
@@ -1,4 +1,5 @@
-import ThirdPartyEmailPasswordReact from "supertokens-auth-react/recipe/thirdpartyemailpassword";
+import ThirdPartyReact from "supertokens-auth-react/recipe/thirdparty";
+import EmailPasswordReact from "supertokens-auth-react/recipe/emailpassword";
import SessionReact from "supertokens-auth-react/recipe/session";
import EmailVerificationReact from "supertokens-auth-react/recipe/emailverification";
import { appInfo } from "./appInfo";
@@ -10,15 +11,16 @@ export let frontendConfig = () => {
EmailVerificationReact.init({
mode: "REQUIRED",
}),
- ThirdPartyEmailPasswordReact.init({
+ ThirdPartyReact.init({
signInAndUpFeature: {
providers: [
- ThirdPartyEmailPasswordReact.Google.init(),
- ThirdPartyEmailPasswordReact.Github.init(),
- ThirdPartyEmailPasswordReact.Apple.init(),
+ ThirdPartyReact.Google.init(),
+ ThirdPartyReact.Github.init(),
+ ThirdPartyReact.Apple.init(),
],
},
}),
+ EmailPasswordReact.init(),
SessionReact.init(),
],
};
diff --git a/examples/with-supabase/pages/auth/[[...path]].tsx b/examples/with-supabase/pages/auth/[[...path]].tsx
index 82392caec..adb50a706 100644
--- a/examples/with-supabase/pages/auth/[[...path]].tsx
+++ b/examples/with-supabase/pages/auth/[[...path]].tsx
@@ -5,18 +5,19 @@ import dynamic from "next/dynamic";
import SuperTokens from "supertokens-auth-react";
import { canHandleRoute, getRoutingComponent } from "supertokens-auth-react/ui";
import { EmailVerificationPreBuiltUI } from "supertokens-auth-react/recipe/emailverification/prebuiltui";
-import { ThirdPartyEmailPasswordPreBuiltUI } from "supertokens-auth-react/recipe/thirdpartyemailpassword/prebuiltui";
+import { ThirdPartyPreBuiltUI } from "supertokens-auth-react/recipe/thirdparty/prebuiltui";
+import { EmailPasswordPreBuiltUI } from "supertokens-auth-react/recipe/emailpassword/prebuiltui";
const SuperTokensComponentNoSSR = dynamic<{}>(
new Promise((res) =>
- res(() => getRoutingComponent([EmailVerificationPreBuiltUI, ThirdPartyEmailPasswordPreBuiltUI]))
+ res(() => getRoutingComponent([EmailVerificationPreBuiltUI, ThirdPartyPreBuiltUI, EmailPasswordPreBuiltUI]))
),
{ ssr: false }
);
export default function Auth() {
useEffect(() => {
- if (canHandleRoute([EmailVerificationPreBuiltUI, ThirdPartyEmailPasswordPreBuiltUI]) === false) {
+ if (canHandleRoute([EmailVerificationPreBuiltUI, ThirdPartyPreBuiltUI, EmailPasswordPreBuiltUI]) === false) {
SuperTokens.redirectToAuth();
}
}, []);
diff --git a/examples/with-supabase/pages/index.tsx b/examples/with-supabase/pages/index.tsx
index 43f86ceaa..55447005a 100644
--- a/examples/with-supabase/pages/index.tsx
+++ b/examples/with-supabase/pages/index.tsx
@@ -2,9 +2,8 @@ import React, { useState, useEffect } from "react";
import Head from "next/head";
import styles from "../styles/Home.module.css";
import { redirectToAuth } from "supertokens-auth-react";
-import ThirdPartyEmailPassword from "supertokens-auth-react/recipe/thirdpartyemailpassword";
import dynamic from "next/dynamic";
-import { useSessionContext, SessionAuth } from "supertokens-auth-react/recipe/session";
+import { useSessionContext, SessionAuth, signOut } from "supertokens-auth-react/recipe/session";
import { getSupabase } from "../utils/supabase";
export default function Home() {
@@ -46,7 +45,7 @@ function ProtectedPage() {
}, [sessionContext]);
async function logoutClicked() {
- await ThirdPartyEmailPassword.signOut();
+ await signOut();
redirectToAuth();
}
diff --git a/examples/with-svelte-react-thirdpartyemailpassword/server.js b/examples/with-svelte-react-thirdpartyemailpassword/server.js
index 0b6e2964b..457ed0bf5 100644
--- a/examples/with-svelte-react-thirdpartyemailpassword/server.js
+++ b/examples/with-svelte-react-thirdpartyemailpassword/server.js
@@ -2,7 +2,8 @@ const express = require("express");
const supertokens = require("supertokens-node");
const Session = require("supertokens-node/recipe/session");
const EmailVerification = require("supertokens-node/recipe/emailverification");
-const ThirdPartyEmailPassword = require("supertokens-node/recipe/thirdpartyemailpassword");
+const ThirdParty = require("supertokens-node/recipe/thirdparty");
+const EmailPassword = require("supertokens-node/recipe/emailpassword");
const { middleware, errorHandler } = require("supertokens-node/framework/express");
const cors = require("cors");
const Dashboard = require("supertokens-node/recipe/dashboard");
@@ -26,33 +27,37 @@ supertokens.init({
websiteDomain, // TODO: Change to your app's website domain
},
recipeList: [
- ThirdPartyEmailPassword.init({
- providers: [
- // We have provided you with development keys which you can use for testsing.
- // IMPORTANT: Please replace them with your own OAuth keys for production use.
- {
- config: {
- thirdPartyId: "google",
- clients: [
- {
- clientId: "1060725074195-kmeum4crr01uirfl2op9kd5acmi9jutn.apps.googleusercontent.com",
- clientSecret: "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",
- },
- ],
+ EmailPassword.init(),
+ ThirdParty.init({
+ signInAndUpFeature: {
+ providers: [
+ // We have provided you with development keys which you can use for testsing.
+ // IMPORTANT: Please replace them with your own OAuth keys for production use.
+ {
+ config: {
+ thirdPartyId: "google",
+ clients: [
+ {
+ clientId:
+ "1060725074195-kmeum4crr01uirfl2op9kd5acmi9jutn.apps.googleusercontent.com",
+ clientSecret: "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",
+ },
+ ],
+ },
},
- },
- {
- config: {
- thirdPartyId: "github",
- clients: [
- {
- clientId: "467101b197249757c71f",
- clientSecret: "e97051221f4b6426e8fe8d51486396703012f5bd",
- },
- ],
+ {
+ config: {
+ thirdPartyId: "github",
+ clients: [
+ {
+ clientId: "467101b197249757c71f",
+ clientSecret: "e97051221f4b6426e8fe8d51486396703012f5bd",
+ },
+ ],
+ },
},
- },
- ],
+ ],
+ },
}),
Session.init(), // initializes session features
Dashboard.init(),
diff --git a/examples/with-svelte-react-thirdpartyemailpassword/src/App.svelte b/examples/with-svelte-react-thirdpartyemailpassword/src/App.svelte
index 97f0d1e53..e568cb68f 100644
--- a/examples/with-svelte-react-thirdpartyemailpassword/src/App.svelte
+++ b/examples/with-svelte-react-thirdpartyemailpassword/src/App.svelte
@@ -4,12 +4,14 @@
import ReactDOM from "react-dom";
import SuperTokens from "supertokens-auth-react";
import { getRoutingComponent, canHandleRoute } from "supertokens-auth-react/ui";
- import ThirdPartyEmailPassword, {
+ import ThirdParty, {
Github,
Google,
signOut,
- } from "supertokens-auth-react/recipe/thirdpartyemailpassword";
- import { ThirdPartyEmailPasswordPreBuiltUI } from "supertokens-auth-react/recipe/thirdpartyemailpassword/prebuiltui";
+ } from "supertokens-auth-react/recipe/thirdparty";
+ import EmailPassword from "supertokens-auth-react/recipe/emailpassword";
+ import { ThirdPartyPreBuiltUI } from "supertokens-auth-react/recipe/thirdparty/prebuiltui";
+ import { EmailPasswordPreBuiltUI } from "supertokens-auth-react/recipe/emailpassword/prebuiltui";
import Session from "supertokens-auth-react/recipe/session";
import { Router, Route } from "svelte-navigator";
import { onMount } from "svelte";
@@ -22,7 +24,8 @@
websiteDomain: "http://localhost:8080", // TODO: Change to your app's website domain
},
recipeList: [
- ThirdPartyEmailPassword.init({
+ EmailPassword.init(),
+ ThirdParty.init({
signInAndUpFeature: {
providers: [Github.init(), Google.init()],
},
@@ -33,8 +36,8 @@
class SuperTokensComponent extends React.Component {
render() {
- if (canHandleRoute([ThirdPartyEmailPasswordPreBuiltUI])) {
- return getRoutingComponent([ThirdPartyEmailPasswordPreBuiltUI]);
+ if (canHandleRoute([ThirdPartyPreBuiltUI, EmailPasswordPreBuiltUI])) {
+ return getRoutingComponent([ThirdPartyPreBuiltUI, EmailPasswordPreBuiltUI]);
}
return "Route not found";
}
diff --git a/examples/with-svelte-react-thirdpartyemailpassword/src/Navbar.svelte b/examples/with-svelte-react-thirdpartyemailpassword/src/Navbar.svelte
index 3679733ca..25ca5cba9 100644
--- a/examples/with-svelte-react-thirdpartyemailpassword/src/Navbar.svelte
+++ b/examples/with-svelte-react-thirdpartyemailpassword/src/Navbar.svelte
@@ -1,7 +1,7 @@