yarn: update react-complex-tree to v2.0.0

Includes fixes for breaking changes.

package.json

@@ -90,7 +90,7 @@
         "react": "^16.14.0",
         "react-app-polyfill": "^3.0.0",
         "react-aria": "^3.21.0",
-        "react-complex-tree": "^1.1.11",
+        "react-complex-tree": "^2.0.0",
         "react-dev-utils": "^12.0.1",
         "react-dom": "^16.14.0",
         "react-dropzone": "^14.2.3",

src/explorer/Explorer.tsx

@@ -370,7 +370,7 @@ const FileTree: React.VoidFunctionComponent = () => {
                     [rootItemIndex]: {
                         index: rootItemIndex,
                         data: { fileName: '/' },
-                        hasChildren: true,
+                        isFolder: true,
                         children: [...files].map((f) => f.uuid),
                     },
                 } as Record<TreeItemIndex, FileTreeItem>,

src/utils/tree-renderer.tsx

@@ -18,6 +18,7 @@ import {
 import React, { createContext } from 'react';
 import { TreeItem, TreeRenderProps, useTree } from 'react-complex-tree';
 import { useBoolean } from 'usehooks-ts';
+import { assert } from '.';
 
 /** Combines class names into a string. */
 const cx = (...classNames: Array<string | undefined | false>): string =>
@@ -99,7 +100,7 @@ export const renderers: Omit<
                         )}
                         {...props.context.itemContainerWithoutChildrenProps}
                     >
-                        {props.item.hasChildren ? (
+                        {props.item.isFolder ? (
                             props.arrow
                         ) : (
                             <span className={Classes.TREE_NODE_CARET_NONE} />
@@ -201,17 +202,23 @@ export const renderers: Omit<
         </form>
     ),
 
-    renderSearchInput: (props) => (
-        <div className={cx('rct-tree-search-input-container')}>
-            <InputGroup
-                {...(props.inputProps as Omit<
-                    React.HTMLAttributes<HTMLInputElement>,
-                    'defaultValue'
-                >)}
-                placeholder="Search..."
-            />
-        </div>
-    ),
+    renderSearchInput: (props) => {
+        const { ref, defaultValue, value, ...inputProps } = props.inputProps;
+
+        assert(typeof ref !== 'string', 'cannot be a legacy ref');
+
+        // unused - have to be excluded from inputProps for InputGroup typing compatibility
+        defaultValue;
+        value;
+
+        // TODO: translate placeholder and inputProps.aria-label
+
+        return (
+            <div className={cx('rct-tree-search-input-container')}>
+                <InputGroup inputRef={ref} {...inputProps} placeholder="Search..." />
+            </div>
+        );
+    },
 
     renderDepthOffset: 1,
 };

yarn.lock

@@ -2502,7 +2502,7 @@ __metadata:
     react: ^16.14.0
     react-app-polyfill: ^3.0.0
     react-aria: ^3.21.0
-    react-complex-tree: ^1.1.11
+    react-complex-tree: ^2.0.0
     react-dev-utils: ^12.0.1
     react-dom: ^16.14.0
     react-dropzone: ^14.2.3
@@ -12850,10 +12850,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-complex-tree@npm:^1.1.11":
-  version: 1.1.11
-  resolution: "react-complex-tree@npm:1.1.11"
-  checksum: 80c332fb7c652d51705b740189318fb142f225e3836968d051140e9c7a77dce24953c4fab300bca8c571b4a570537ca112bc25a3255c917dd5e14ec1143eddb7
+"react-complex-tree@npm:^2.0.0":
+  version: 2.0.0
+  resolution: "react-complex-tree@npm:2.0.0"
+  peerDependencies:
+    react: ">=18.0.0"
+  checksum: e835f2b44ea2a35b17eb6bc08076dc083265b36e1391253b8ce93904e363089f053addda51f68acee98ff075b4128644c7c274df13b1b4cfcfa454bbb8814769
   languageName: node
   linkType: hard