Dragging parent into a child - critical issue

[Arthur-Ruthenberg]

When a parent folder is being dragged into a child there is no check to prohibit this from happening. This causes the entire subtree to disappear.

[jameskerr]

Uh oh.

Well, there is code that prevents this from happening (ass you can see it in this demo, but there must be hole somewhere. Would you mind posting the options that you are passing to the <Tree> component? Also what version of the code are you on?

Since this is a controlled component, you'll be handing the "move" operation in your own code. You can make a check there. That can be a workaround until I discover the bug.

[Arthur-Ruthenberg]

Try dragging a folder to the end of one of it's children. For example - House of Tully beneath Caitlin

I did implement a failsafe within my onmove function, but I guess it should be prohibited by the drag movement. The functionality that calculates the drop position - the blue underline.

[jameskerr]

Yup, I can reproduce. Thanks for reporting it. I'll find the bug now and fix it in the next release. I'm glad there's a workaround for you.

[rimzzlabs]

Hi there, Im curently have a data list like this:

type Tree = {
  uuid: string
  name: string
  parent_id: number
  type: 'FOLDER' | 'FILE'
  selected?: boolean
  children?: Tree[]
}

And the component:

export default function FolderList = (props: Tree[]) => {
 return  (
 <Tree
  width='75%'
  idAccessor='uuid'
  indent={12}
  data={props.dataList}
  onMove={(e) => console.info(e)}
  >
   {Node}
 </Tree>
)
}

and how do I implement the drag and drop function? I tried using the inline function and console.log the parameters, but nothing appear on my web browser console

[Arthur-Ruthenberg]

@rizkimcitra

if I am not mistaken, you are not using the onMove property properly Check the constructor of what it is supposed to get Also I'd suggest you look for the example of the implementation. You can learn a lot from it :)