what I got from the background is pre-sorted infinite-level classification tree data. I want to show it in the antd tree component. I can"t get it out without a solid foundation, so I sincerely ask for advice.

pre-sorted infinite-level classification tree data pre-sorting algorithm

const treeData = [{
  "key": 1,
  "lft": 1,
  "rgt": 62,
  "depth": 0,
  "title": "1",
},
  {
    "key": 2,
    "lft": 2,
    "rgt": 21,
    "depth": 1,
    "title": "1-1",
  },
  {
    "key": 15,
    "lft": 3,
    "rgt": 4,
    "depth": 2,
    "title": "1-1-1",
  },
  {
    "key": 16,
    "lft": 5,
    "rgt": 6,
    "depth": 2,
    "title": "1-1-2",
  },
  {
    "key": 17,
    "lft": 7,
    "rgt": 8,
    "depth": 2,
    "title": "1-1-3",
  },
  {
    "key": 18,
    "lft": 9,
    "rgt": 10,
    "depth": 2,
    "title": "1-1-4",
  },
  {
    "key": 19,
    "lft": 11,
    "rgt": 12,
    "depth": 2,
    "title": "1-1-5",
  },
  {
    "key": 20,
    "lft": 13,
    "rgt": 14,
    "depth": 2,
    "title": "1-1-6",
  },
  {
    "key": 21,
    "lft": 15,
    "rgt": 16,
    "depth": 2,
    "title": "1-1-7",
  },
  {
    "key": 22,
    "lft": 17,
    "rgt": 18,
    "depth": 2,
    "title": "1-1-8",
  },
  {
    "key": 23,
    "lft": 19,
    "rgt": 20,
    "depth": 2,
    "title": "1-1-9",
  },
  {
    "key": 3,
    "lft": 22,
    "rgt": 23,
    "depth": 1,
    "title": "1-2",
  },
  {
    "key": 4,
    "lft": 24,
    "rgt": 27,
    "depth": 1,
    "title": "1-3",
  },
  {
    "key": 24,
    "lft": 25,
    "rgt": 26,
    "depth": 2,
    "title": "1-3-1",
  },
  {
    "key": 5,
    "lft": 28,
    "rgt": 29,
    "depth": 1,
    "title": "1-4",
  },
  {
    "key": 6,
    "lft": 30,
    "rgt": 35,
    "depth": 1,
    "title": "1-5",
  },
  {
    "key": 25,
    "lft": 31,
    "rgt": 32,
    "depth": 2,
    "title": "1-5-1",
  },
  {
    "key": 26,
    "lft": 33,
    "rgt": 34,
    "depth": 2,
    "title": "1-5-2",
  },
  {
    "key": 7,
    "lft": 36,
    "rgt": 37,
    "depth": 1,
    "title": "1-6",
  },
  {
    "key": 8,
    "lft": 38,
    "rgt": 41,
    "depth": 1,
    "title": "1-7",
  },
  {
    "key": 27,
    "lft": 39,
    "rgt": 40,
    "depth": 2,
    "title": "1-7-1",
  },
  {
    "key": 9,
    "lft": 42,
    "rgt": 45,
    "depth": 1,
    "title": "1-8",
  },
  {
    "key": 28,
    "lft": 43,
    "rgt": 44,
    "depth": 2,
    "title": "1-8-1",
  },
  {
    "key": 10,
    "lft": 46,
    "rgt": 49,
    "depth": 1,
    "title": "1-9",
  },
  {
    "key": 29,
    "lft": 47,
    "rgt": 48,
    "depth": 2,
    "title": "1-9-1",
  },
  {
    "key": 11,
    "lft": 50,
    "rgt": 51,
    "depth": 1,
    "title": "1-10",
  },
  {
    "key": 12,
    "lft": 52,
    "rgt": 53,
    "depth": 1,
    "title": "1-11",
  },
  {
    "key": 13,
    "lft": 54,
    "rgt": 57,
    "depth": 1,
    "title": "1-12",
  },
  {
    "key": 30,
    "lft": 55,
    "rgt": 56,
    "depth": 2,
    "title": "1-12-1",
  },
  {
    "key": 14,
    "lft": 58,
    "rgt": 61,
    "depth": 1,
    "title": "1-13",
  },
  {
    "key": 31,
    "lft": 59,
    "rgt": 60,
    "depth": 2,
    "title": "1-13-1",
  },
];

want to generate data like this directly antd tree

<Tree>
  <TreeNode title="1" key="1">
    <TreeNode title="1-1" key="2" >
      <TreeNode title="1-1-1" key="15" />
      <TreeNode title="1-1-2" key="16" />
    </TreeNode>
    //...
  </TreeNode>
</Tree>

instead of converting to nested data

function  toNestedArray(flatArray=[], {title="title", key="key", depth="depth"}){
  let node = flatArray.shift();
  let lvl = node[depth];
  let root = {...node, title: node[title], key: node[key], children: []};
  let tree;
  let current_node = [];
  current_node[lvl] = root;
  while (flatArray.length > 0) {
    node = flatArray.shift();
    tree = {...node, title: node[title], key: node[key], children: []};
    lvl = node[depth];
    if (current_node[lvl - 1] === undefined) throw "invalid list!";
    current_node[lvl - 1].children.push(tree);
    current_node[lvl] = tree;
  }
  return [root];
}

then use

renderTreeNodes = (data) => {
    return data.map((item) => {
      if (item.children) {
        return (
          <TreeNode title={item.title} key={item.key} dataRef={item}>
            {this.renderTreeNodes(item.children)}
          </TreeNode>
        );
      }
      return <TreeNode {...item} />;
    });
  }