important

This is a contributors guide and NOT a user guide. Please visit these docs if you are using or evaluating SuperTokens.

Use configurable callbacks to redirect on claim validation success/failure

Status

This is just a proposal so far, it hasn't been accepted and needs further discussion.

Status:: proposed
Deciders:: rishabhpoddar, porcellus
Proposed by:: porcellus
Created:: 2022-11-28

Context and Problem Statement#

Apps have to handle redirection if a claim fails and also handle redirecting back if necessary. E.g.:

While using a custom 2FA claim, the app has to check if there is a validation error for the claim in the invalidClaims array and handle redirection.
On the 2FA page, the app has to check if that validation error disappeared (so the user successfully logged in using 2FA)

Considered Options#

Recommend creating wrapper components
Add a callback that returns a react component to render on failure
Add callbacks (onFailure, onSuccess) that returns a string (or undefined) we can redirect to
Add a separate component that handles these checks/mapping

Decision Outcome#

Add callbacks (onFailure, onSuccess) that returns a string (or undefined) we can redirect to.

We've also decided to add a default access denied screen where we can redirect in case of an unhandled claim failure.

this is triggered when a claim fails without a defined onFailure CB
this could get: overridden as a component, overridden with getRedirectToPath in the session init

Pros and Cons of the Options#

Recommend creating wrapper components#

This can be too involved for some devs

Add a callback that returns a react component to render on failure#

Not obvious where it will render in case of a global validator (i.e.: it could show up multiple times)

Does not work during a `validateClaims` call

Add callbacks (onFailure, onSuccess) that returns a string (or undefined) we can redirect to#

In this case we embed the contact info in the link which enables us to show the sign in screen but we can delay the consume (on the FE) until the validation info is fetched.

Very simple

Configured in the same place where you are adding the validator

The callbacks will be called many times

The order of validators will be important (and can cause non-obvious changes)

Add a separate component that handles these checks/mapping#

Very specific and easy to understand

Configured in multiple places: the claims are could be during init (or this component), while the redirection can only be configured in this component

It introduces a new wrapper which will require a bit more understanding from devs