- 
                Notifications
    You must be signed in to change notification settings 
- Fork 403
Implement waitlist hook with signal primitives #7097
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: vincent-and-the-doctor
Are you sure you want to change the base?
Implement waitlist hook with signal primitives #7097
Conversation
This commit introduces the Waitlist resource, enabling users to join a waitlist via email. It includes new hooks for accessing and interacting with the waitlist functionality in React applications. Co-authored-by: bryce <bryce@clerk.dev>
Co-authored-by: bryce <bryce@clerk.dev>
Co-authored-by: bryce <bryce@clerk.dev>
| Cursor Agent can help with this pull request. Just  | 
| 
 | 
| The latest updates on your projects. Learn more about Vercel for GitHub. 
 | 
| Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the  You can disable this status message by setting the  ✨ Finishing touches🧪 Generate unit tests (beta)
 Comment  | 
Co-authored-by: bryce <bryce@clerk.dev>
| get __internal_waitlist() { | ||
| if (!this._waitlistInstance) { | ||
| this._waitlistInstance = new Waitlist(null); | ||
| this.waitlistResourceSignal({ resource: this._waitlistInstance }); | ||
| } | ||
| return this._waitlistInstance; | ||
| } | 
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The proxy layer needed a way to access a waitlist instance, and so this property was added. It would be nice if there was a way to avoid having to do this though... 🤔
…hook-with-signal-primitives-3ad1
Description
This PR introduces the
useWaitlist()hook, a new signal-backed hook in@clerk/reactthat enables developers to build custom waitlist UIs with reactive state management. It follows the pattern ofuseSignIn()anduseSignUp(), exposingwaitlist(resource),errors, andfetchStatus.The
Waitlistresource in@clerk/clerk-jshas been integrated with the signal system, providing aWaitlistFutureinstance for reactive updates. TheStateclass now manages a lazily initialized, singletonWaitlistinstance, ensuring its independence from theClientresource and proper signal propagation.An integration test has been added to validate the hook's functionality, including joining the waitlist, error handling, and loading states.
To test the changes, run the new integration test:
pnpm playwright test integration/tests/custom-flows/waitlist.test.tsChecklist
pnpm testruns as expected.pnpm buildruns as expected.Type of change