feat!: make the mfa screens do success redirection if the next array…

… is empty (#851) * feat!: make the mfa screens do success redirection if the next array is empty * feat: self-review fixes * docs: update example apps * chore: bump version and size limit
supertokens · Aug 23, 2024 · 7990896 · 7990896
1 parent 989f6b2
commit 7990896
Show file tree

Hide file tree

Showing 28 changed files with 547 additions and 222 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [unreleased]
 
+### Breaking changes
+
+-   Changed `redirectToFactor` to accept an object instead of multiple arguments.
+-   Changed `redirectToFactorChooser` to accept an object instead of multiple arguments.
+-   Made MFA related screens do a success redirection if MFA is already completed and the `stepUp` query param is not set to `true`.
+    -   `redirectToFactorChooser` now accepts a `stepUp` option to set the `stepUp` query param.
+    -   `redirectToFactor` now accepts a `stepUp` option to set the `stepUp` query param.
+
 ## [0.45.1] - 2024-08-09
 
 ### Changes

diff --git a/examples/for-tests-react-16/src/App.js b/examples/for-tests-react-16/src/App.js
@@ -514,9 +514,13 @@ export function DashboardHelper({ redirectOnLogout, ...props } = {}) {
             <a
                 className="goToFactorChooser"
                 onClick={() => {
-                    return MultiFactorAuth.redirectToFactorChooser(true, undefined, props.history);
+                    return MultiFactorAuth.redirectToFactorChooser({
+                        redirectBack: true,
+                        stepUp: true,
+                        navigate: props.history,
+                    });
                 }}>
-                MFA chooser
+                MFA chooser (step up)
             </a>
         </div>
     );

diff --git a/examples/for-tests/src/App.js b/examples/for-tests/src/App.js
@@ -686,9 +686,13 @@ export function DashboardHelper({ redirectOnLogout, ...props } = {}) {
             <a
                 className="goToFactorChooser"
                 onClick={() => {
-                    return MultiFactorAuth.redirectToFactorChooser(true, undefined, props.history);
+                    return MultiFactorAuth.redirectToFactorChooser({
+                        redirectBack: true,
+                        stepUp: true,
+                        navigate: props.history,
+                    });
                 }}>
-                MFA chooser
+                MFA chooser (step up)
             </a>
         </div>
     );

diff --git a/examples/with-multifactorauth-phone-chooser/frontend/package.json b/examples/with-multifactorauth-phone-chooser/frontend/package.json
@@ -15,7 +15,7 @@
         "react-dom": "^18.2.0",
         "react-router-dom": "^6.2.1",
         "react-scripts": "5.0.1",
-        "supertokens-auth-react": "latest",
+        "supertokens-auth-react": "github:supertokens/supertokens-auth-react#feat/mfa_redirect",
         "supertokens-web-js": "latest",
         "typescript": "^4.8.2",
         "web-vitals": "^2.1.4"

diff --git a/examples/with-multifactorauth-phone-chooser/frontend/src/Home/CallAPIView.tsx b/examples/with-multifactorauth-phone-chooser/frontend/src/Home/CallAPIView.tsx
@@ -13,7 +13,12 @@ export default function CallAPIView() {
     }
 
     async function goToPhoneSetup() {
-        await MultiFactorAuth.redirectToFactor(MultiFactorAuth.FactorIds.OTP_PHONE, true, true, navigate);
+        await MultiFactorAuth.redirectToFactor({
+            factorId: MultiFactorAuth.FactorIds.OTP_PHONE,
+            forceSetup: true,
+            redirectBack: true,
+            navigate,
+        });
     }
 
     return (

diff --git a/examples/with-multifactorauth-phone-chooser/frontend/src/SelectPhone/index.tsx b/examples/with-multifactorauth-phone-chooser/frontend/src/SelectPhone/index.tsx
@@ -16,10 +16,19 @@ export default function SelectPhone() {
             if (res.status === 200) {
                 const loadedInfo = await res.clone().json();
                 if (loadedInfo.user.phoneNumbers.length === 0) {
-                    await MultiFactorAuth.redirectToFactor(MultiFactorAuth.FactorIds.OTP_PHONE, true, false, nav);
+                    await MultiFactorAuth.redirectToFactor({
+                        factorId: MultiFactorAuth.FactorIds.OTP_PHONE,
+                        forceSetup: true,
+                        redirectBack: false,
+                        navigate: nav,
+                    });
                 } else if (loadedInfo.user.phoneNumbers.length === 1) {
                     await Passwordless.createCode({ phoneNumber: loadedInfo.user.phoneNumbers[0] });
-                    await MultiFactorAuth.redirectToFactor(MultiFactorAuth.FactorIds.OTP_PHONE, false, false, nav);
+                    await MultiFactorAuth.redirectToFactor({
+                        factorId: MultiFactorAuth.FactorIds.OTP_PHONE,
+                        redirectBack: false,
+                        navigate: nav,
+                    });
                 } else {
                     setUserInfo(loadedInfo);
                 }
@@ -65,12 +74,11 @@ export default function SelectPhone() {
                                                 hasOtherPhoneNumbers: true,
                                             },
                                         });
-                                        return MultiFactorAuth.redirectToFactor(
-                                            MultiFactorAuth.FactorIds.OTP_PHONE,
-                                            false,
-                                            false,
-                                            nav
-                                        );
+                                        return MultiFactorAuth.redirectToFactor({
+                                            factorId: MultiFactorAuth.FactorIds.OTP_PHONE,
+                                            redirectBack: false,
+                                            navigate: nav,
+                                        });
                                     }
                                 })
                                 .catch(setError);

diff --git a/examples/with-multifactorauth-recovery-codes/frontend/src/RecoveryCode/index.tsx b/examples/with-multifactorauth-recovery-codes/frontend/src/RecoveryCode/index.tsx
@@ -17,7 +17,12 @@ export default function RecoveryCode() {
         if (reset.data.status !== "OK") {
             setError("Recovery code not found");
         } else {
-            await MultiFactorAuth.redirectToFactor("totp", true, false, nav);
+            await MultiFactorAuth.redirectToFactor({
+                factorId: "totp",
+                forceSetup: true,
+                redirectBack: false,
+                navigate: nav,
+            });
         }
     }
 

diff --git a/lib/build/genericComponentOverrideContext.js b/lib/build/genericComponentOverrideContext.js
diff --git a/lib/build/multifactorauth-shared2.js b/lib/build/multifactorauth-shared2.js
diff --git a/lib/build/multifactorauth.js b/lib/build/multifactorauth.js
diff --git a/lib/build/multifactorauthprebuiltui.js b/lib/build/multifactorauthprebuiltui.js