Dragging an event in the RTL month view calendar gets confused to the wrong side

[eeefg650]

Check that this is really a bug

• [X] I confirm

Reproduction link

https://drive.google.com/file/d/1kKL80YCJLrz6q0Y1GJeWzlwNgkccJ-OA/view?usp=share_link

Bug description

Calendar Drag and Drop month view always drags event from most left column.

It is important to note that in the "week" & "day" view it works properly.

Expected Behavior

While dragging, I expect the event to hover over the date which I am selecting.

Actual Behavior

No response

react-big-calendar version

1.5.2

React version

18.2.0

Platform/Target and Browser Versions

chrome 107.0.5304.107 microsoft edge

Validations

• [X] Read the docs.
• [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
• [X] Make sure this is a react-big-calendar issue and not an implementation issue

Would you like to open a PR for this bug?

• [ ] I'm willing to open a PR

[bu6n]

Can you provide a reproduction link, your code or a video?

[eeefg650]

Can you provide a reproduction link, your code or a video?

Yes, hope that will be helpful: https://drive.google.com/file/d/1kKL80YCJLrz6q0Y1GJeWzlwNgkccJ-OA/view?usp=share_link

[eeefg650]

Can you provide a reproduction link, your code or a video?

I would greatly appreciate your help, I tried every option but unfortunately without any success.

[bu6n]

That's probably a bug in the dragAndDrop add-on. It's probably just that no-one ever used it that way. Maybe you can try to debug it. It should be somewhere near here: https://github.com/jquense/react-big-calendar/blob/master/src/addons/dragAndDrop/WeekWrapper.js#L62

[eeefg650]

That's probably a bug in the dragAndDrop add-on. It's probably just that no-one ever used it that way. Maybe you can try to debug it. It should be somewhere near here: https://github.com/jquense/react-big-calendar/blob/master/src/addons/dragAndDrop/WeekWrapper.js#L62

Thanks for you response! how do i get access to that all events?

[bu6n]

Don't understand your question. If you want to try to fix the bug, you could clone the repo locally, modify an existing Storybook story and then try to debug.

[eeefg650]

Don't understand your question. If you want to try to fix the bug, you could clone the repo locally, modify an existing Storybook story and then try to debug.

I was clone the repo, but still without any result to solve this. Maybe is it possible to use an external library, to perform a drag? for example to use react-beautiful-dnd

[eeefg650]

That's probably a bug in the dragAndDrop add-on. It's probably just that no-one ever used it that way. Maybe you can try to debug it. It should be somewhere near here: https://github.com/jquense/react-big-calendar/blob/master/src/addons/dragAndDrop/WeekWrapper.js#L62

Can you explain me exactly how to debug in this area with storybook ? I was trying to debug there for hours, but I feel like I got a little lost there.

[bu6n]

You can start a local storybook with

npm install
npm run storybook

or

yarn
yarn storybook

You can try to take an example with DnD, modify it directly or duplicate it, add the rtl props and then change the files (add console.log for example). Storybook should rebuild on saved files.

[eeefg650]

You can start a local storybook with

npm install
npm run storybook

or

yarn
yarn storybook

You can try to take an example with DnD, modify it directly or duplicate it, add the rtl props and then change the files (add console.log for example). Storybook should rebuild on saved files.

How can I change the files?

[bu6n]

With a text editor?

[eeefg650]

With a text editor?

I mean I tried to edit the source code through the node moduels but there was no effect.

[bu6n]

That's not really a good way to do it. Try cloning this repository and making the changes in it until you find the problem.