Keep Draggable on Droppable until some operations are performed

[ParthPatwalaTA]

Bug or feature request?

Question

Expected behavior

Keep Draggable component in droppable until operations are performed. Is it possible to do this ? Yes - how can i achieve this?

Actual behavior

Normal Drag and Drop is working fine. Now if we were to add API request or some complex operation, when we drop draggable item, it goes back to original position then comes back on droppable after operation is performed.

What version of React are you

16.5.2

What version of react-beautiful-dnd are you running?

10.0.3

What browser are you using?

Chrome

[treshugart]

Is it possible to optimistically perform the async operation and revert the drag if it's not successful? I would think this would be okay for most scenarios.

[ParthPatwalaTA]

@treshugart
This works if there is no 3rd party request call which takes time to perform validations. So on that time, we want to check if we really want to drop item here, if not then don't drop here. Otherwise, drop here and remove from the original location. So between that time draggable goes to its original location and after some seconds, we move it to the new location.
One thing we can do is, we actually need to perform drop operation in App level so it just drops then check conditions and if it's false then move it back to original position. But I don't think this is the optimal solution.
Let me know your thoughts on this.

[treshugart]

One thing we can do is, we actually need to perform drop operation in App level so it just drops then check conditions and if it's false then move it back to original position. But I don't think this is the optimal solution.

That's sorta what I meant by optimistically performing the async op. I would generally lean towards this unless it's an operation that could have negative effects if reverted later.

In terms of digging deeper in this issue, I'd be going beyond my understanding of the internals. Alex, the maintainer, will be back from holiday soon. See #1010 for more details.

[alexreardon]

Here are some things you can do @ParthPatwalaTA:

1. Set isDropDisabled to false on everything. When the drag starts, do your third party calls and only enable the drop zones that you want
2. Do some post drag third party validation (like you are now). You might want to message that validation failed, and what the validation was and then roll back.

Having the validation service as a third party thing is complicated. Ideally you compute where something can move before the drag even starts - this is what we do in Jira.

Does that help @ParthPatwalaTA ?

[ParthPatwalaTA]

@alexreardon I'm trying to build a time tracking App. In this App, let's say you have a week view and you will add time like 10:00-20:00, 11:00-18:00 on a single date-block. So I've added draggable time-blocks with this library to simply drag and drop the time on week's particular date.
So Here there will be 7 date-blocks on which we can drop multiple time-blocks.

I can get data to insert only when I drop time-block on a particular date-block.

At this moment, I want to make a 3rd party call to see if time already exists or not for a particular date. So in that process, time-blocks shift backs to the original position and if there is no error then it moves back to the destination position.

@alexreardon can you give any suggestions on this to make this simpler?
Thanks.