Currently, clerkjs bundles its own React dependency and uses its own React instance to render the prebuilt components, even if React is already bundled with the user's app. A required step to support true SSR for clerk-js is to make React a peer dependency, instead of a direct one.
However, that'd make clerkjs use the app's React instance, so we need to make sure that our prebuilt components work properly with the latest React release.
As part of this task, we should:
[ ] Update clerkjs to use React18
[ ] Build clerkjs. If the build fails, document and try to solve any issues.
[ ] Document any type-related issues.
[ ] Run the test suite. If it fails, document the cause and try to resolve.
[ ] Manually go trough all major auth flows we support, spot any issues and document the actions we need to take.
We expect that React's dev mode idempotency check might cause some of our components to break, especially those that rely on useEffects to start the auth flows (eg: calling signUp.create on render etc.). For more context, see:
Please note that this task is not about making clerkjs work inside a React18 app! We've already confirmed that it does work since clerkjs is still using its own React17 instance. The purpose of this task is to help us understand what issues we'd face if we were to drop the direct React dependency.
Making the necessary code changes is not part of this task. Let's create a detailed design doc explaining any issues and possible solutions and then discuss to figure out the next steps :)
Currently,
clerkjs
bundles its own React dependency and uses its own React instance to render the prebuilt components, even if React is already bundled with the user's app. A required step to support true SSR forclerk-js
is to make React a peer dependency, instead of a direct one.However, that'd make
clerkjs
use the app's React instance, so we need to make sure that our prebuilt components work properly with the latest React release.As part of this task, we should:
clerkjs
to use React18clerkjs
. If the build fails, document and try to solve any issues.We expect that React's dev mode idempotency check might cause some of our components to break, especially those that rely on
useEffects
to start the auth flows (eg: callingsignUp.create
on render etc.). For more context, see:Please note that this task is not about making
clerkjs
work inside a React18 app! We've already confirmed that it does work sinceclerkjs
is still using its own React17 instance. The purpose of this task is to help us understand what issues we'd face if we were to drop the direct React dependency.Making the necessary code changes is not part of this task. Let's create a detailed design doc explaining any issues and possible solutions and then discuss to figure out the next steps :)