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

Improve dragging between adjacent blocks #56463

Closed
andrewserong opened this issue Nov 23, 2023 · 1 comment · Fixed by #56466
Closed

Improve dragging between adjacent blocks #56463

andrewserong opened this issue Nov 23, 2023 · 1 comment · Fixed by #56466
Labels
[Feature] Drag and Drop Drag and drop functionality when working with blocks [Type] Bug An existing feature does not function as intended

Comments

@andrewserong
Copy link
Contributor

Part of #33683

The problem

Currently it can be very hard (or impossible) to drag a block between two adjacent blocks. When dragging over a block, the calculations are very specific to the edge of the elements you're dragging over, so when two blocks are adjacent, there's often no breathing room or threshold to allow someone to drag between the two adjacent blocks. Here's an example screengrab:

2023-11-23.14.06.15.mp4

In the above screengrab, the drag is considered either as the last child of the top block, or the first child of the bottom block.

A possible solution

Can we add in a threshold of some kind when dragging toward the edge of blocks, that detects how close we are to the edge of the overall rootClientId, and if we're within a threshold of the edge of that block (say, within 15px or so), then consider the drop target position to be before or after that root / container block, rather than within it.

Ideally, something like this should make dragging and dropping feel a little more forgiving, rather than the user needing to be super precise in order to drag between blocks.

Some places to look

In the drag and drop code, take a look at the getDropTargetPosition logic, and further down in that file, the callback passed to useThrottle within useBlockDropZone. Perhaps we can examine distances between the cursor position and the very edge of the container block, and deliberately set before/after based on a threshold of some kind.

@andrewserong
Copy link
Contributor Author

Started a (very early) WIP over in #56466 that seems promising. It's very hacked together for now, as the drop indicator line visual feedback hasn't been implemented yet, but I think the overall direction might work!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Drag and Drop Drag and drop functionality when working with blocks [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant