fix(clerk-js,types): Reuse existing sign-up if available

clerk · Dec 6, 2024 · a13c8a4 · a13c8a4
1 parent 10c447d
commit a13c8a4
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 2 deletions.
diff --git a/.changeset/purple-foxes-develop.md b/.changeset/purple-foxes-develop.md
@@ -0,0 +1,6 @@
+---
+'@clerk/clerk-js': minor
+'@clerk/types': minor
+---
+
+Introduced an `upsert` method to the `SignUp` resource, which reuses the existing sign-up attempt ID if it exists. This was an obvious oversight in the ticket flow, so `SignUpStart` has been updated to use this instead.
diff --git a/packages/clerk-js/src/core/resources/SignUp.ts b/packages/clerk-js/src/core/resources/SignUp.ts
@@ -367,6 +367,10 @@ export class SignUp extends BaseResource implements SignUpResource {
     });
   };
 
+  upsert = (params: SignUpCreateParams | SignUpUpdateParams): Promise<SignUpResource> => {
+    return this.id ? this.update(params) : this.create(params);
+  };
+
   validatePassword: ReturnType<typeof createValidatePassword> = (password, cb) => {
     if (SignUp.clerk.__unstable__environment?.userSettings.passwordSettings) {
       return createValidatePassword({

diff --git a/packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx b/packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx
@@ -216,7 +216,14 @@ function _SignUpStart(): JSX.Element {
     if (fields.ticket) {
       const noop = () => {};
       // fieldsToSubmit: Constructing a fake fields object for strategy.
-      fieldsToSubmit.push({ id: 'strategy', value: 'ticket', setValue: noop, onChange: noop, setError: noop } as any);
+      fieldsToSubmit.push({
+        id: 'strategy',
+        value: 'ticket',
+        clearFeedback: noop,
+        setValue: noop,
+        onChange: noop,
+        setError: noop,
+      } as any);
     }
 
     // In case of emailOrPhone (both email & phone are optional) and neither of them is provided,
@@ -236,7 +243,7 @@ function _SignUpStart(): JSX.Element {
     const redirectUrlComplete = ctx.afterSignUpUrl || '/';
 
     return signUp
-      .create(buildRequest(fieldsToSubmit))
+      .upsert(buildRequest(fieldsToSubmit))
       .then(res =>
         completeSignUpFlow({
           signUp: res,

diff --git a/packages/types/src/signUp.ts b/packages/types/src/signUp.ts
@@ -66,6 +66,8 @@ export interface SignUpResource extends ClerkResource {
 
   update: (params: SignUpUpdateParams) => Promise<SignUpResource>;
 
+  upsert: (params: SignUpCreateParams | SignUpUpdateParams) => Promise<SignUpResource>;
+
   prepareVerification: (params: PrepareVerificationParams) => Promise<SignUpResource>;
 
   attemptVerification: (params: AttemptVerificationParams) => Promise<SignUpResource>;