Skip to main content
Version: Next

<ThirdPartyEmailPasswordAuth />

About#

The ThirdPartyEmailPasswordAuth component is used to wrap any component that requires authentication in an application.

import SuperTokens from "supertokens-auth-react";class App extends React.Component {    render() {        return (            <ThirdPartyEmailPasswordAuth>                <Dashboard />            </ThirdPartyEmailPasswordAuth>        );    }}
  • ThirdPartyEmailPasswordAuth takes a prop called requireAuth which if set to false, will show the Dashboard component even if the user is not logged in.
  • ThirdPartyEmailPasswordAuth also creates a "Session context" which provides the following object to all children components:
    {    doesSessionExist: boolean,    userId: string,    jwtPayload: any /*JSON object set on the backend*/}
  • ThirdPartyEmailPasswordAuth will update the session, because it uses SessionAuth underneath. Read more about session updates in SessionAuth guide.

Handle session expiry#

If you pass a function to onSessionExpired prop, it will be called whenever the session expires.

const App = () => {    return (        <ThirdPartyEmailPasswordAuth            onSessionExpired={notifyUserAndDisplayPopup}>            <MyComponent />        </ThirdPartyEmailPasswordAuth>    )}
caution

You will need to redirect the user to the login screen in the callback you provide to onSessionExpired.

What type of UI do you want to use?
Custom UI
Pre built UI