fullcalendar / fullcalendar-react

The official React Component for FullCalendar
https://fullcalendar.io/docs/react
MIT License
2.09k stars 110 forks source link

Can't drag, create or edit events with next.js #159

Closed butterfly-valley closed 3 years ago

butterfly-valley commented 3 years ago

Bug Reports

On a next.js app I can't drag, edit or create events with editable={true}. The body tag does not toggle between empty class and 'fc-unselectable' upon mouse dragging like it usually would so it seems like a css issue.

To reproduce please follow the steps below:

git clone 'https://github.com/butterfly-valley/text-react-fcallendar.git' npm install npm or yarn next dev

It is an empty project with just bare minimum to reproduce the behaviour.

acerix commented 3 years ago

Some workarounds are needed for Next, does it work using the example project?

https://github.com/fullcalendar/fullcalendar-example-projects/tree/master/next

butterfly-valley commented 3 years ago

Yes, I applied the workarounds to get it going, you can safely clone and run the project.

29/11/2021, в 21:19, Dylan Ferris @.***>

 Some workarounds are needed for Next, does it work using the example project?

https://github.com/fullcalendar/fullcalendar-example-projects/tree/master/next

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe. Triage notifications on the go with GitHub Mobile for iOS or Android.

butterfly-valley commented 3 years ago

Sorry, did not get to the _app.tsx and css part. Will try tomorrow and report.

29/11/2021, в 21:19, Dylan Ferris @.***>:

 Some workarounds are needed for Next, does it work using the example project?

https://github.com/fullcalendar/fullcalendar-example-projects/tree/master/next

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe. Triage notifications on the go with GitHub Mobile for iOS or Android.

butterfly-valley commented 3 years ago

So I have added a babel.config.js and imported the styles into _app.js, but the issue remains with next@12.0.4 at least. The example project runs fine but is somewhat outdated when it comes to its dependencies. I have updated the repo for you to try my setup. Thanks for looking into this.

acerix commented 3 years ago

I just checked your demo and noticed the "interaction" plugin is missing, that's required for event dragging:

https://fullcalendar.io/docs/editable#required-plugin