Adding SortableContext during drag starts 1 row off from the correct row

[subtext916]

I am trying to create a timeline ui which enables SortableContext with verticalListSortingStrategy only if the user drags up or down more than 50px. When this happens, I conditionally add SortableContext but the problem I am having, is that it only reorders to the 2nd row, skipping the first one.
I am not sure, but it seems like because I am adding the SortableContext DURING the drag, it is not registering it until it is already over the row immediately below and thus the first time it changes the order, it jumps 2 rows. I will attach a video to demonstrate.
My question is: Is there something I can do in this situation?

[subtext916]

A simple example of the code I am working on is:
<ConditionalWrapper condition={reorderingEnabled} wrapper={(children) => ( <SortableContext items={medias} strategy={verticalListSortingStrategy}> {children} </SortableContext> )} >

and "ConditionalWrapper" is like:

export function ConditionalWrapper({ condition, wrapper, children }: ConditionalWrapperProps) { return condition ? wrapper(children) : children }

[subtext916]

WOQxX0AzEJNnLq2B6BaqwvPg34ZpeamM.1.mp4

[subtext916]

note: version is 6.0.8 but I also tried updating the version to 6.1.0 and the problem is still occurring.