Skip to content
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

Support react v19 #864

Open
benposnick opened this issue Dec 6, 2024 · 23 comments · May be fixed by #863
Open

Support react v19 #864

benposnick opened this issue Dec 6, 2024 · 23 comments · May be fixed by #863
Assignees

Comments

@benposnick
Copy link

Issue

We cannot upgrade to React 19 and Next 15 because of @hello-pangea/dnd dependency on React 18.

What version of React are you using?

Trying to upgrade to [email protected].

What version of @hello-pangea/dnd are you running?

We are using @hello-pangea/[email protected].

npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR!   react@"19.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^18.0.0" from @hello-pangea/[email protected]
npm ERR! node_modules/@hello-pangea/dnd
npm ERR!   @hello-pangea/dnd@"^17.0.0" from the root project
@kbehov
Copy link

kbehov commented Dec 8, 2024

I have the same problem, some temporary solution is to use --legacy-peer-deps, but i don't recommend it for production. I hope the lib will be soon updated

@100terres 100terres changed the title Cannot upgrade to React 19 and Next 15 because of @hello-pangea/dnd dependency on React 18 Support react v19 Dec 11, 2024
@100terres 100terres self-assigned this Dec 11, 2024
@100terres 100terres pinned this issue Dec 11, 2024
@100terres
Copy link
Collaborator

Hi @benposnick, I don't have an ETA on this yet, but I'll see what I can do. Hopefully, it won't be too complex to handle. I would like to run our test suite against both react v18 and v19.

@100terres 100terres linked a pull request Dec 11, 2024 that will close this issue
1 task
@benposnick
Copy link
Author

@100terres Thank you so much!!

@100terres
Copy link
Collaborator

I should be able to dedicate time to this issue in the next two weeks. I'm hoping to have something working in early January.

@TexLuciano
Copy link

very good to have feedback for this problem, this is the best lib for dragging

@ahmedyounes
Copy link

please guys 🙏

@Jonathan-W-Aitken
Copy link

by the looks of it, its the dependancy '[email protected]' thats behind

@AmithBV0606
Copy link

I should be able to dedicate time to this issue in the next two weeks. I'm hoping to have something working in early January.

@100terres Any updates? I'm still not able to use it React19...

@dafi
Copy link

dafi commented Jan 6, 2025

Something is escaping me...
I migrated 4 apps to React19 and Pangea works perfectly, obviously during the build phase I get warnings about dependencies but the d&d works fine

I use pnpm and below the package.json

"dependencies": {
    "@hello-pangea/dnd": "^17.0.0",
    "@types/node": "^22.10.2",
    "eslint-plugin-react-compiler": "19.0.0-beta-b2e8e9c-20241220",
    "fuse.js": "^7.0.0",
    "react": "^19.0.0",
    "react-dom": "^19.0.0"
  },
  "devDependencies": {
    "@stylistic/eslint-plugin": "^2.12.1",
    "@types/react": "^19.0.2",
    "@types/react-dom": "^19.0.2",
    "@typescript-eslint/eslint-plugin": "^8.18.2",
    "@vitejs/plugin-react": "^4.3.4",
    "eslint": "^9.17.0",
    "eslint-config-dafi": "^1.0.14",
    "eslint-import-resolver-typescript": "^3.7.0",
    "eslint-plugin-import": "^2.31.0",
    "eslint-plugin-jsdoc": "^50.6.1",
    "eslint-plugin-react": "^7.37.3",
    "eslint-plugin-react-hooks": "5.1.0",
    "eslint-plugin-react-refresh": "^0.4.16",
    "eslint-plugin-unicorn": "^56.0.1",
    "gh-pages": "^6.2.0",
    "globals": "^15.14.0",
    "stylelint": "^16.12.0",
    "stylelint-config-standard": "^36.0.1",
    "typescript": "^5.7.2",
    "typescript-eslint": "^8.18.2",
    "vite": "^6.0.6",
    "vitest": "^2.1.8"
  }

I don't use React19 compiler also because it hasn't been released yet

Do you have a use case to reproduce some incompatibility between Pangea 17 and React19?

@thomasfire
Copy link

Do you have a use case to reproduce some incompatibility between Pangea 17 and React19?

Did the bundle size increase? I remember trying similar thing, but the bundle size increased by ~100KB and I decided to wait for the patch. Felt like React was included twice~

@dafi
Copy link

dafi commented Jan 6, 2025

Do you have a use case to reproduce some incompatibility between Pangea 17 and React19?

Did the bundle size increase? I remember trying similar thing, but the bundle size increased by 100KB and I decided to wait for the patch. Felt like React was included twice

+15kb but obviously depends on project complexity

  • @hello-pangea/dnd 17.0.0
  • react 18.3.1
  • react-dom 18.3.1

dist/index.html 0.80 kB │ gzip: 0.41 kB
dist/assets/index-DLNgG_EK.css 14.44 kB │ gzip: 3.32 kB
dist/assets/index-vVUt4hSs.js 302.46 kB │ gzip: 95.69 kB

  • @hello-pangea/dnd 17.0.0
  • react 19.0.0
  • react-dom 19.0.0

dist/index.html 0.80 kB │ gzip: 0.41 kB
dist/assets/index-THD8Yueu.css 15.04 kB │ gzip: 3.47 kB
dist/assets/index-C22ElCJb.js 348.83 kB │ gzip: 110.17 kB

@100terres
Copy link
Collaborator

@100terres Any updates? I'm still not able to use it React19...

@AmithBV0606 Thanks for your patience! I'm working on it as we speak and doing my best to release an update as soon as possible. As mentioned earlier, I'm aiming for early January, but please understand that I'm dedicating my personal time outside of work hours to this, so it may take a little longer. That said, if you're in a hurry, feel free to fork the project, add support for React v19 yourself and open a pull request. This is an open-source project, and your contributions are always welcome! Thanks again for your understanding.

@100terres
Copy link
Collaborator

I'm in the process of removing certain dependencies to make it easier to add support for React v19.

@100terres
Copy link
Collaborator

I have a branch where the whole CI works with React v19. Next step: I need to make it run against both React v18 and v19.

@benposnick
Copy link
Author

benposnick commented Jan 20, 2025

Do you have a rough idea of how long this might take? "Next step: I need to make it run against both React v18 and v19."

This is our last dependency that is incompatible with React 19, and we're trying to upgrade to React 19 so we can get Next 15's Turborepo to speed up our slow hot reloads. Not sure if you have a recommendation of anything I could add as an override in the meantime so we can do our React 19 upgrade, in the event that you think the last step for you might take a few weeks. Not sure if the upgrade for you is more complex than just updating the peerDependencies in the package.json to get React 19 compatibility.

Thanks for your open-source contributions - really appreciate it! This is such a great library for DnD.

@100terres
Copy link
Collaborator

@benposnick

Do you have a rough idea of how long this might take?

This month.

@100terres
Copy link
Collaborator

I should be able to release a beta version soon.

@100terres
Copy link
Collaborator

100terres commented Jan 22, 2025

PR opened merged: #883

@100terres
Copy link
Collaborator

You can give it a try:

npm install @hello-pangea/[email protected]

see:

@benposnick let me know if it works as expected or not.

@haffi96
Copy link

haffi96 commented Jan 24, 2025

You can give it a try:

npm install @hello-pangea/[email protected]

see:

@benposnick let me know if it works as expected or not.

This worked for me! 👏🏽

@donorman
Copy link

You can give it a try:

npm install @hello-pangea/[email protected]

Seem to work as expected, good work!

@benposnick
Copy link
Author

Thank you @100terres!!

@Rathalin
Copy link

I'm using React 19 and it work's like a charm. Thank you for putting in all the effort to upgrade it! 👏

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.