fix(clerk-js): Navigate back to the continue step when editing the id…

…entifier (#1870)
clerk · Oct 16, 2023 · 81b63e3 · 81b63e3
1 parent a46d6fe
commit 81b63e3
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 3 deletions.
diff --git a/.changeset/quiet-points-applaud.md b/.changeset/quiet-points-applaud.md
@@ -0,0 +1,5 @@
+---
+'@clerk/clerk-js': minor
+---
+
+Add new `/sign-up/continue/verify-phone-number` and `/sign-up/continue/verify-email-address` routes in order to allow navigating back to the `/sign-up/continue` step when editing the extra identifier that is provided in the `/sign-up/continue` step.
diff --git a/packages/clerk-js/src/ui/components/SignUp/SignUp.tsx b/packages/clerk-js/src/ui/components/SignUp/SignUp.tsx
@@ -56,7 +56,21 @@ function SignUpRoutes(): JSX.Element {
           />
         </Route>
         <Route path='continue'>
-          <SignUpContinue />
+          <Route
+            path='verify-email-address'
+            canActivate={clerk => !!clerk.client.signUp.emailAddress}
+          >
+            <SignUpVerifyEmail />
+          </Route>
+          <Route
+            path='verify-phone-number'
+            canActivate={clerk => !!clerk.client.signUp.phoneNumber}
+          >
+            <SignUpVerifyPhone />
+          </Route>
+          <Route index>
+            <SignUpContinue />
+          </Route>
         </Route>
         <Route index>
           <SignUpStart />

diff --git a/packages/clerk-js/src/ui/components/SignUp/SignUpContinue.tsx b/packages/clerk-js/src/ui/components/SignUp/SignUpContinue.tsx
@@ -143,8 +143,8 @@ function _SignUpContinue() {
       .then(res =>
         completeSignUpFlow({
           signUp: res,
-          verifyEmailPath: '../verify-email-address',
-          verifyPhonePath: '../verify-phone-number',
+          verifyEmailPath: './verify-email-address',
+          verifyPhonePath: './verify-phone-number',
           handleComplete: () => clerk.setActive({ session: res.createdSessionId, beforeEmit: navigateAfterSignUp }),
           navigate,
         }),