minop1205 / react-dnd-treeview

A draggable / droppable React-based treeview component. You can use render props to create each node freely.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Feature Request: Initialize a subset of folders as open

johno opened this issue Β· comments

Firstly, thanks for this awesome library! We're using it for a new feature at Components AI and it's working great. πŸ™

I'm wondering if you'd be interested in being able to specify whether folders are open/closed as part of the tree data on load. Our use case is we want to store the state of the tree in the database so that when you reopen a document that state is preserved.

Hypothetically, it could be an isOpen boolean or something similar that tells the tree view to initialize the folder as open:

[
  {
    "id": 1,
    "parent": 0,
    "isOpen": true,
    "droppable": true,
    "text": "Folder 1"
  },
  {
    "id": 2,
    "parent": 1,
    "text": "File 1-1"
  },
  {
    "id": 3,
    "parent": 1,
    "text": "File 1-2"
  }
]

Anyway, thanks again for your hard work, and looking forward to your thoughts!

@johno Thank you for your comment.
Please use the initialOpen option to specify the open/closed state of a node when mounting the Tree.
The initialOpen can be a boolean value or an array of node IDs.

API Reference:
https://github.com/minop1205/react-dnd-treeview#component-api

CodeSandbox:
https://codesandbox.io/s/issue-105-7f25d1?file=/src/App.jsx

Ohhhh, totally missed that it takes an array. That's my mistake. Ofc you've already got this case implemented, thank you!