Merge pull request #836 from supertokens/feat/update_mfa_redirections

update how we redirect to factors to match v0.46 in auth-react

v2/mfa/step-up-auth.mdx

@@ -542,19 +542,23 @@ To redirect the user to as factor challenge page and then navigate them back to
 import MultiFactorAuth from 'supertokens-auth-react/recipe/multifactorauth';
 
 async function redirectToTotpSetupScreen() {
-    MultiFactorAuth.redirectToFactor(MultiFactorAuth.FactorIds.TOTP, false, true)
+    MultiFactorAuth.redirectToFactor({
+        factorId: "totp",
+        stepUp: true,
+        redirectBack: true,
+    })
 }
 ```
 
-- In the snippet above, we redirect to the [TOTP factor setup screen](https://master--6571be2867f75556541fde98.chromatic.com/?path=/story/totp-mfa--device-setup). The second argument represents a boolean for `forceSetup` which we set to false since we do not want to ask the user to create a new device. The third arg is also `true` since we want to redirect back to the current page after the user has finished setting up the device.
-- You can also just redirect the user to `/{websiteBasePath}/mfa/totp?redirectToPath={currentPath}` if you don't want to use the above function.
+- In the snippet above, we redirect to the [TOTP factor setup screen](https://master--6571be2867f75556541fde98.chromatic.com/?path=/story/totp-mfa--device-setup). We set the `stepUp` argument to `true` otherwise the MFA screen would detect that the user has already completed basic MFA requirements and would not show the verification screen. The `redirectBack` argument is set to `true` since we want to redirect back to the current page after the user has finished setting up the device.
+- You can also just redirect the user to `/{websiteBasePath}/mfa/totp?setup=true&redirectToPath={currentPath}` if you don't want to use the above function.
 
 
 </TabItem>
 
 <TabItem value="angular">
 
-In order to add a new device, you can redirect the user to `/{websiteBasePath}/mfa/totp?redirectToPath={currentPath}` from your settings page. This will show the [TOTP factor setup screen](https://master--6571be2867f75556541fde98.chromatic.com/?path=/story/totp-mfa--device-setup) to the user. The `redirectToPath` query param will also tell our SDK to redirect the user back to the current page after they have finished creating the device.
+In order to add a new device, you can redirect the user to `/{websiteBasePath}/mfa/totp?setup=true&redirectToPath={currentPath}` from your settings page. This will show the [TOTP factor setup screen](https://master--6571be2867f75556541fde98.chromatic.com/?path=/story/totp-mfa--device-setup) to the user. The `redirectToPath` query param will also tell our SDK to redirect the user back to the current page after they have finished creating the device.
 
 </TabItem>
 
@@ -613,7 +617,7 @@ function InvalidClaimHandler(props: React.PropsWithChildren<any>) {
 
     let totpCompletedTime = claimValue.value?.c[MultiFactorAuth.FactorIds.TOTP]
     if (totpCompletedTime === undefined || totpCompletedTime < (DateProviderReference.getReferenceOrThrow().dateProvider.now() - 1000 * 60 * 5)) {
-        return <div>You need to complete TOTP before seeing this page. Please <a href={"/auth/mfa/totp?redirectToPath=" + window.location.pathname}>click here</a> to finish to proceed.</div>
+        return <div>You need to complete TOTP before seeing this page. Please <a href={"/auth/mfa/totp?stepUp=true&redirectToPath=" + window.location.pathname}>click here</a> to finish to proceed.</div>
     }
 
     // the user has finished TOTP, so we can render the children

v2/mfa/totp/totp-for-opt-in-users.mdx

@@ -548,11 +548,15 @@ In order to add a new device, you can call the following function from the front
 import MultiFactorAuth from 'supertokens-auth-react/recipe/multifactorauth';
 
 async function redirectToTotpSetupScreen() {
-    MultiFactorAuth.redirectToFactor("totp", true, true)
+    MultiFactorAuth.redirectToFactor({
+        factorId: "totp",
+        forceSetup: true,
+        redirectBack: true,
+    })
 }
 ```
 
-- In the snippet above, we redirect to the [TOTP factor setup screen](https://6571be2867f75556541fde98-xieqfaxuuo.chromatic.com/?path=/story/totp-mfa--device-setup-with-single-next-option). The second argument represents a boolean for `forceSetup` which we set to true since we want the user to setup a new TOTP device. The third arg is also `true` since we want to redirect back to the current page after the user has finished setting up the device.
+- In the snippet above, we redirect to the [TOTP factor setup screen](https://6571be2867f75556541fde98-xieqfaxuuo.chromatic.com/?path=/story/totp-mfa--device-setup-with-single-next-option). We set the `forceSetup` to `true` since we want the user to setup a new TOTP device. The `redirectBack` boolean is also `true` since we want to redirect back to the current page after the user has finished setting up the device.
 - You can also just redirect the user to `/{websiteBasePath}/mfa/totp?setup=true&redirectToPath={currentPath}` if you don't want to use the above function.
 
 

v2/src/plugins/codeTypeChecking/jsEnv/package.json

@@ -56,13 +56,13 @@
     "react-router-dom5": "npm:react-router-dom@^5.3.0",
     "socket.io": "^4.6.1",
     "socketio": "^1.0.0",
-    "supertokens-auth-react": "^0.44.0",
-    "supertokens-auth-react-script": "github:supertokens/supertokens-auth-react#0.44",
+    "supertokens-auth-react": "^0.46.0",
+    "supertokens-auth-react-script": "github:supertokens/supertokens-auth-react#0.46",
     "supertokens-node": "^20.0.0",
     "supertokens-node7": "npm:[email protected]",
     "supertokens-react-native": "^5.0.0",
-    "supertokens-web-js": "^0.12.0",
-    "supertokens-web-js-script": "github:supertokens/supertokens-web-js#0.12",
+    "supertokens-web-js": "^0.13.0",
+    "supertokens-web-js-script": "github:supertokens/supertokens-web-js#0.13",
     "supertokens-website": "^20.0.1",
     "supertokens-website-script": "github:supertokens/supertokens-website#20.0",
     "typescript": "^4.9.5",