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

Fix bug with window scroll container #806

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

akhmadullin
Copy link

Problem

There were some issues about incorrect sorting behavior in grid list with enabled useWindowAsScrollContainer, for example, #577.

When prop useWindowAsScrollContainer is set to true, sorting in grid list does not work properly:

useWindowAsScrollContainer.bug.mp4

Solution

Such behavior is caused because of using root html element as scrolling container. Scrolling container's width is used for counting of new coordinates of list item during sorting. html element has width much more, than grid list container element, new coordinates counts wrong, that's why we can see incorrect sorting behavior.

This PR fixes issue with incorrect sorting by using width of grid container instead of using width of html element, where it's needed.

The result of this fix:

useWindowAsScrollContainer.bug.fixed.mp4

@codesandbox-ci
Copy link

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 70b02b4:

Sandbox Source
react-sortable-hoc-starter Configuration

@lavish0000
Copy link

@akhmadullin , I want to fix this in my implementation, I don't know when this PR will be merged.
Do you have a fix that I can apply on my code directly ?
I would really appreciate this, If you could help me with this.

@akhmadullin
Copy link
Author

@lavish0000, unfortunately, I don't.

I didn't find solution, that could fix this behavior and could be implemented directly in project, that uses react-sortable-hoc.

The only solution, that I found - fix behavior inside react-sortable-hoc.

@clauderic (author of the lib) direct all development efforts towards new lib - @dnd-kit, but maybe he will find some time to review this PR.

@lavish0000
Copy link

OK, Got it. Thanks @akhmadullin for the reply.

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

Successfully merging this pull request may close these issues.

2 participants