File Browser

This library is that user can view, drag and drop any item in the directory. The items is folder or file.

Get started

TMI

I don't want to generate any errors because of my systems when your and my project was overlapping the logic. So, I tell in advance about what I use.

When user is dragging object like folder or file, the dragged item will execute the below commands. The reason why send the data into droppable field is that they need to know who are come in the field.

onDragStart: (event: React.DragEvent<HTMLDivElement>) => {
  event.dataTransfer.setData('parent_uuid', currentNode.parent?.uuid || '');
  event.dataTransfer.setData(
    'type',
    currentNode.type === NodeType.File ? 'File' : 'Folder'
  );
  event.dataTransfer.setData('uuid', currentNode.uuid);
  event.dataTransfer.setData('name', currentNode.name);
};