fix: recoilizeRoot error in react 18

[boenfu]

Types of changes

• [x] Bugfix (change which fixes an issue)
• [ ] New feature (change which adds functionality)
• [ ] Refactor (change which changes the codebase without affecting its external behavior)
• [ ] Non-breaking change (fix or feature that would causes existing functionality to work as expected)
• [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)

Purpose

React 18 can use

Approach

change find source root fiber method

Resources

{
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "recoil": "^0.7.3",
}

Screenshot(s)

it's work.

[sunel-pyt]

This is working as expected

[tienne]

Any progress?

[vip30]

Would like to try this if this is merged

[mwitteveen]

Can we merge this? I am not able to use recolize until this is fixed.

[kjmin-dev]

Same issue with Recoilize:3.1.6 and React 18.2.0. we need any progress of this work

[MatejFacko]

Any update on this?

[dsvgit]

Is this PR ready to merge?

[suzdalnitski]

This is such a bummer, the inability to use with React 18 makes this library useless.

[prescottprue]

Any update on this?

[stelladraco27]

Please, god

[andyWynyard]

Is this good to go, if so could this be merged?

[stelladraco27]

This can be merged. If you need this patch ASAP you can patch the module locally, I got tired of waiting and did that. If people are interested I can post a short tutorial here.

[suzdalnitski]

@stelladraco27 please do, many would find this extremely helpful!

[stelladraco27]

Sorry for the wait on my solution as we wait for this to be merged, here it is!

Step 1) Make sure recoilize is installed! If you were lucky to get the module installed before this issue arose, you are good for the next step! If you are stuck with errors trying to install recoilize use the command npm install recoilize --force.

Step 2) Install patch-package and edit your package.json This package will allow you to patch the fix in this pull request instead of waiting for the owner of recoilize. Install the package with npm install patch-package. You could go into your node modules, find recoilize, and fix the problem there, but none of your changes would persist, thats why we need this package. Make sure you add "postinstall": "patch-package" to your package.json file in the "scripts" area.

Step 3) Edit the node module before you patch it Go to /node-modules/recoilize in your project and make the changes this pull request makes to the module. I looked at the change log and made the changes they did, but I think you can just override the original file with the file from the pr, all that matters is that the changes are made.

Step 4) Patch the module! Now that the changes are made you should be able to simply run the command npx patch-package recoilize.

Step 5) You should be good to go!

[emregca]

trying to manually add the dependency by using the staging url, considering it seems to be merged, but end up getting the following error with nextjs:

./src/pages/_app.tsx:24:19
Module not found: Can't resolve 'recoilize'
  22 |     const RecoilizeDebugger = dynamic(
  23 |         () => {
> 24 |             return import('recoilize')
     |                   ^
  25 |         },
  26 |         { ssr: false }
  27 |     )

https://nextjs.org/docs/messages/module-not-found

no static analysis warnings, as i do use @types/recoilize

ended up doing what @stelladraco27 described and worked (with pnpm's patching), thank you

[svagi]

Howdy 👋 Do you have any ETA when this will be released? Thank you.

[joey-ma]

Sorry for the wait on my solution as we wait for this to be merged, here it is!

Step 1) Make sure recoilize is installed! If you were lucky to get the module installed before this issue arose, you are good for the next step! If you are stuck with errors trying to install recoilize use the command npm install recoilize --force.

Step 2) Install patch-package and edit your package.json This package will allow you to patch the fix in this pull request instead of waiting for the owner of recoilize. Install the package with npm install patch-package. You could go into your node modules, find recoilize, and fix the problem there, but none of your changes would persist, thats why we need this package. Make sure you add "postinstall": "patch-package" to your package.json file in the "scripts" area.

Step 3) Edit the node module before you patch it Go to /node-modules/recoilize in your project and make the changes this pull request makes to the module. I looked at the change log and made the changes they did, but I think you can just override the original file with the file from the pr, all that matters is that the changes are made.

Step 4) Patch the module! Now that the changes are made you should be able to simply run the command npx patch-package recoilize.

Step 5) You should be good to go!

Very cool @stelladraco27! @svagi I'm afraid it'll be up to the next Recoilize team to take a closer look. I took a look but honestly don't have the time to dig deeper. Even though I merged the PR, the staging branch was intentional so that prior instructions would not be affected. Once the next Recoilize team can make sure nothing breaks before merging into master, hopefully it'll be incorporated into the next release.