ValentinH / react-easy-sort

A React component to sort items in lists or grids
https://ValentinH.github.io/react-easy-sort
MIT License
160 stars 25 forks source link

`allowDrag` prop not working on mobile devices #31

Closed devon66h closed 1 year ago

devon66h commented 1 year ago

Describe the bug Setting the prop allowDrag={false} works on desktop, but not on mobile devices.

This bug has been observed across both iOS and Android, and across Chrome, Safari & Firefox.

To Reproduce Steps to reproduce the behavior:

  1. Set allowDrag={false}
  2. Open hosted app on a mobile device
  3. Test to see if you're able to drag items

Expected behavior Expect dragging to be disabled on mobile devices

ValentinH commented 1 year ago

Hi, good catch!

Indeed, as touch events are attached in a different manner that the desktop ones, the allowDrag logic was not probably added for touch devices 🙈

The fix should be fairly easy: this whole block inside the useDrag() hook should be ignored if allowDrag is false https://github.com/ValentinH/react-easy-sort/blob/main/src/hooks.ts#L211-L223

Would you like to submit a PR for this?

devon66h commented 1 year ago

Hi, good catch!

Indeed, as touch events are attached in a different manner that the desktop ones, the allowDrag logic was not probably added for touch devices 🙈

The fix should be fairly easy: this whole block inside the useDrag() hook should be ignored if allowDrag is false https://github.com/ValentinH/react-easy-sort/blob/main/src/hooks.ts#L211-L223

Would you like to submit a PR for this?

@ValentinH Here ya go 😄 https://github.com/ValentinH/react-easy-sort/pull/32