rename tree component

.eslintrc.js

@@ -18,7 +18,7 @@ module.exports = {
     },
     ecmaVersion: 2018,
     sourceType: 'module',
-    project: ['tsconfig.json', 'react-one-tree/tsconfig.json'],
+    project: ['tsconfig.json', 'ash-tree/tsconfig.json'],
   },
   parser: '@typescript-eslint/parser',
   extends: [

.gitignore

@@ -5,14 +5,14 @@
 # SPDX-License-Identifier: Apache-2.0
 
 # dependencies
-/react-one-tree/node_modules
-/react-one-tree/build
+/ash-tree/node_modules
+/ash-tree/build
 /node_modules
 
 
 # testing
 /coverage
-/react-one-tree/coverage
+/ash-tree/coverage
 
 # production
 /build
@@ -34,5 +34,5 @@ yarn-error.log*
 /.vscode
 /react-tree.iml
 /test-app.iml
-/react-one-tree.iml
-/react-one-tree/notices
+/ash-tree.iml
+/ash-tree/notices

CONTRIBUTING.md

@@ -50,7 +50,7 @@ This package is a React component written in TypeScript. The only further depend
 react-window. The repo ist structured on two levels:
 1. the root directory contains the developing package.json, including all scripts, dev dependencies and testing app 
    dependencies,
-2. the react-one-tree directory contains the source code of the virtualized tree component and its package.json, 
+2. the ash-tree directory contains the source code of the virtualized tree component and its package.json, 
    including no dev dependencies and meant to be distributed with the package.
 
 Prettier is used as a code formatter, eslint as a linter.

README.md

@@ -14,7 +14,7 @@ fit the needs of the user. It is not meant to be a full-fledged file explorer, b
 
 ## API
 
-The package exposes the React component **ReactOneTree** with the following API:
+The package exposes the React component **AshTree** with the following API:
 
 * nodes: The nodes of the tree
     * It is a recursive data structure that allows to define the nodes of the tree and their relations.
@@ -39,7 +39,7 @@ It is produced by the following code (we omitted some unimportant details; for d
 
 
 ```
-import { ReactOneTreeExport as ReactOneTree } from 'react-one-tree';
+import { AshTreeExport as AshTree } from 'ash-tree';
 
 
 function BasicTree(): ReactElement {
@@ -60,7 +60,7 @@ function BasicTree(): ReactElement {
   }
 
   return (
-    <ReactOneTree
+    <AshTree
     expandedPaths={expandedPaths}
     isFileWithChildren={(path: string): boolean => Boolean(path)}
     onSelect={handleSelect}

react-one-tree/package.json → ash-tree/package.json

@@ -1,6 +1,6 @@
 {
-  "name": "react-one-tree",
-  "description": "React One Tree.",
+  "name": "ash-tree",
+  "description": "React Ash Tree.",
   "license": "Apache-2.0",
   "version": "0.1.0",
   "private": true,

react-one-tree/src/ReactOneTree/ReactOneTree.tsx → ash-tree/src/AshTree/AshTree.tsx

@@ -14,12 +14,12 @@ import {
   NumberOfDisplayedNodesForTree,
   TreeNodeStyle,
 } from './types';
-import { ReactOneTreeNode, ReactOneTreeNodeData } from './ReactOneTreeNode';
+import { AshTreeNode, AshTreeNodeData } from './AshTreeNode';
 import { getTreeNodeProps } from './utils/get-tree-node-props';
 
 const DEFAULT_MAX_TREE_DISPLAYED_NODES = 5;
 
-interface ReactOneTreeProps {
+interface AshTreeProps {
   nodes: NodesForTree;
   getTreeNodeLabel: (
     nodeName: string,
@@ -41,9 +41,9 @@ interface ReactOneTreeProps {
   breakpoints?: Set<string>;
 }
 
-export function ReactOneTree(props: ReactOneTreeProps): ReactElement | null {
+export function AshTree(props: AshTreeProps): ReactElement | null {
   // eslint-disable-next-line testing-library/render-result-naming-convention
-  const treeNodeProps: Array<ReactOneTreeNodeData> = getTreeNodeProps(
+  const treeNodeProps: Array<AshTreeNodeData> = getTreeNodeProps(
     props.nodes,
     '',
     props.expandedPaths,
@@ -77,7 +77,7 @@ export function ReactOneTree(props: ReactOneTreeProps): ReactElement | null {
           max={maxListLength}
           cardVerticalDistance={props.cardHeight}
           getListItem={(index: number): ReactElement => (
-            <ReactOneTreeNode
+            <AshTreeNode
               {...{
                 ...treeNodeProps[index],
                 expandedNodeIcon: props.expandedNodeIcon,

react-one-tree/src/ReactOneTree/ReactOneTreeNode.tsx → ash-tree/src/AshTree/AshTreeNode.tsx

@@ -13,7 +13,7 @@ import { isChildOfSelected, isSelected } from './utils/get-tree-node-props';
 const INDENT_PER_DEPTH_LEVEL = 12;
 const SIMPLE_NODE_EXTRA_INDENT = 28;
 
-export interface ReactOneTreeNodeData {
+export interface AshTreeNodeData {
   path: string;
   nodeName: string;
   node: NodesForTree | 1;
@@ -34,9 +34,7 @@ export interface ReactOneTreeNodeData {
   nodeHeight: number;
 }
 
-export function ReactOneTreeNode(
-  props: ReactOneTreeNodeData,
-): ReactElement | null {
+export function AshTreeNode(props: AshTreeNodeData): ReactElement | null {
   const marginRight =
     ((props.path.match(/\//g) || []).length - 1) * INDENT_PER_DEPTH_LEVEL +
     (!props.isExpandable ? SIMPLE_NODE_EXTRA_INDENT : 0);

react-one-tree/src/ReactOneTree/__tests__/test-helpers.tsx → ash-tree/src/AshTree/__tests__/test-helpers.tsx

@@ -5,7 +5,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import React, { ReactElement } from 'react';
-import { ReactOneTree } from '../ReactOneTree';
+import { AshTree } from '../AshTree';
 import { render, screen } from '@testing-library/react';
 import { NodesForTree, PathPredicateForTree } from '../types';
 
@@ -37,7 +37,7 @@ export function renderVirtualizedTree(
   const mockOnSelect = jest.fn();
   const mockOnToggle = jest.fn();
   render(
-    <ReactOneTree
+    <AshTree
       expandedPaths={expandedPaths}
       isFileWithChildren={isFileWithChildren}
       onSelect={mockOnSelect}

react-one-tree/src/ReactOneTree/utils/get-tree-node-props.tsx → ash-tree/src/AshTree/utils/get-tree-node-props.tsx

@@ -7,7 +7,7 @@
 
 import React, { ReactElement } from 'react';
 import { PathPredicateForTree, NodesForTree } from '../types';
-import { ReactOneTreeNodeData } from '../ReactOneTreeNode';
+import { AshTreeNodeData } from '../AshTreeNode';
 
 export function getTreeNodeProps(
   nodes: NodesForTree,
@@ -23,12 +23,12 @@ export function getTreeNodeProps(
     path: string,
   ) => ReactElement,
   cardHeight: number,
-): Array<ReactOneTreeNodeData> {
+): Array<AshTreeNodeData> {
   const sortedNodeNames: Array<string> = Object.keys(nodes).sort(
     getSortFunction(nodes, isFileWithChildren, parentPath),
   );
 
-  let treeNodes: Array<ReactOneTreeNodeData> = [];
+  let treeNodes: Array<AshTreeNodeData> = [];
 
   for (const nodeName of sortedNodeNames) {
     const node = nodes[nodeName];

ash-tree/src/index.ts

@@ -0,0 +1,13 @@
+// SPDX-FileCopyrightText: TNG Technology Consulting GmbH <https://www.tngtech.com>
+// SPDX-FileCopyrightText: Leslie Lazzarino <[email protected]>
+// SPDX-FileCopyrightText: Benedikt Richter <[email protected]>
+//
+// SPDX-License-Identifier: Apache-2.0
+
+import { AshTree as AshTreeComponent } from './AshTree/AshTree';
+import { NodesForTree as NodesForTreeType } from './AshTree/types';
+import './AshTree/styles.css';
+
+export const AshTree = AshTreeComponent;
+
+export type NodesForAshTree = NodesForTreeType;

package.json

@@ -11,7 +11,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-scripts": "5.0.1",
-    "react-one-tree": "link:./react-one-tree/build/",
+    "ash-tree": "link:./ash-tree/build/",
     "web-vitals": "^3.3.2"
   },
   "devDependencies": {
@@ -48,23 +48,23 @@
     "setup": "yarn install && yarn build-package && yarn install",
     "update-package": "yarn build-package && yarn install",
     "start": "yarn update-package && react-scripts start",
-    "build-package": "cd react-one-tree && yarn install && tsc && cp ./src/ReactOneTree/styles.css  ./build/src/ReactOneTree/styles.css && cd .. && yarn generate-notice",
+    "build-package": "cd ash-tree && yarn install && tsc && cp ./src/AshTree/styles.css  ./build/src/AshTree/styles.css && cd .. && yarn generate-notice",
     "test-no-update": "yarn test-package-no-build && yarn test-app-no-update && yarn test-performance-no-update",
     "test": "yarn update-package && yarn test-package-no-build && yarn test-app-no-update && yarn test-performance-no-update",
-    "test-package-no-build": "cd react-one-tree && jest --coverage && cd ..",
-    "test-package": "cd react-one-tree && tsc && jest --coverage && cd ..",
+    "test-package-no-build": "cd ash-tree && jest --coverage && cd ..",
+    "test-package": "cd ash-tree && tsc && jest --coverage && cd ..",
     "test-app-no-update": "react-scripts test --testPathIgnorePatterns=performance.test.tsx --watchAll=false",
     "test-app": "yarn update-package && yarn test-app-no-update",
-    "lint": "eslint -c .eslintrc.js \"react-one-tree/src/**/*.{ts,tsx}\" --fix && eslint -c .eslintrc.js \"src/**/*.{ts,tsx}\" --fix",
-    "minify-and-size": "esbuild react-one-tree/build/src/index.js --bundle --outfile=minified-bundle.js && gzip-size minified-bundle.js && rm minified-bundle.js && rm minified-bundle.css",
+    "lint": "eslint -c .eslintrc.js \"ash-tree/src/**/*.{ts,tsx}\" --fix && eslint -c .eslintrc.js \"src/**/*.{ts,tsx}\" --fix",
+    "minify-and-size": "esbuild ash-tree/build/src/index.js --bundle --outfile=minified-bundle.js && gzip-size minified-bundle.js && rm minified-bundle.js && rm minified-bundle.css",
     "test-performance-no-update": "react-scripts test --testMatch='**/performance.test.tsx' --watchAll=false",
     "test-performance": "yarn update-package && yarn test-performance-no-update",
     "ci": "yarn setup && yarn lint && yarn test-no-update && yarn minify-and-size",
     "test-compile": "tsc -p ./",
     "prepare": "husky install",
     "generate-notice": "run-script-os",
-    "generate-notice:linux:darwin": "cd react-one-tree && mkdir -p notices && yarn licenses generate-disclaimer --ignore-platform --production > notices/notices.txt && cd ..",
-    "generate-notice:win32": "cd react-one-tree && IF NOT EXIST notices mkdir notices && yarn licenses generate-disclaimer --ignore-platform --production > notices/notices.txt && cd .."
+    "generate-notice:linux:darwin": "cd ash-tree && mkdir -p notices && yarn licenses generate-disclaimer --ignore-platform --production > notices/notices.txt && cd ..",
+    "generate-notice:win32": "cd ash-tree && IF NOT EXIST notices mkdir notices && yarn licenses generate-disclaimer --ignore-platform --production > notices/notices.txt && cd .."
   },
   "eslintConfig": {
     "extends": [

src/Components/BasicTree/BasicTree.tsx

@@ -7,7 +7,7 @@
 import React, { ReactElement, useState } from 'react';
 import '../../styles.css';
 import { testNodes } from '../shared';
-import { ReactOneTree } from 'react-one-tree';
+import { AshTree } from 'ash-tree';
 
 export function BasicTree(): ReactElement {
   const [selectedPath, setSelectedPath] = useState<string>('/');
@@ -42,7 +42,7 @@ export function BasicTree(): ReactElement {
   return (
     <div className="tree-box">
       <h1>Basic Tree</h1>
-      <ReactOneTree
+      <AshTree
         expandedPaths={expandedPaths}
         isFileWithChildren={(path: string): boolean => Boolean(path)}
         onSelect={handleSelect}

src/Components/FancyTree/FancyTree.tsx

@@ -8,7 +8,7 @@ import React, { ReactElement, useState } from 'react';
 import '../../styles.css';
 import { getFancyTreeItemLabel } from './FancyTreeItemLabel';
 import { testNodes } from '../shared';
-import { ReactOneTree } from 'react-one-tree';
+import { AshTree } from 'ash-tree';
 
 export function FancyTree(): ReactElement {
   const [selectedPath, setSelectedPath] = useState<string>('/');
@@ -43,7 +43,7 @@ export function FancyTree(): ReactElement {
   return (
     <div className="tree-box">
       <h1>Fancy Tree</h1>
-      <ReactOneTree
+      <AshTree
         expandedPaths={expandedPaths}
         isFileWithChildren={(path: string): boolean => Boolean(path)}
         onSelect={handleSelect}

src/Components/FancyTree/FancyTreeItemLabel.tsx

@@ -9,11 +9,11 @@ import React, { ReactElement } from 'react';
 import MuiBox from '@mui/material/Box';
 import MuiTypography from '@mui/material/Typography';
 import { DirectoryIcon, FileIcon } from './FancyTreeIcons';
-import { NodesForReactOneTree } from 'react-one-tree';
+import { NodesForAshTree } from 'ash-tree';
 
 export function getFancyTreeItemLabel(
   nodeName: string,
-  node: NodesForReactOneTree | 1,
+  node: NodesForAshTree | 1,
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   nodePath: string,
 ): ReactElement {

src/Components/shared.ts

@@ -4,9 +4,9 @@
 //
 // SPDX-License-Identifier: Apache-2.0
 
-import { NodesForReactOneTree } from 'react-one-tree';
+import { NodesForAshTree } from 'ash-tree';
 
-export const testNodes: NodesForReactOneTree = {
+export const testNodes: NodesForAshTree = {
   '': {
     thirdParty: {
       'package_01.tr.gz': 1,

yarn.lock

@@ -1041,6 +1041,13 @@
     "@babel/helper-validator-option" "^7.18.6"
     "@babel/plugin-transform-typescript" "^7.18.6"
 
+"@babel/runtime@^7.0.0":
+  version "7.23.5"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.5.tgz#11edb98f8aeec529b82b211028177679144242db"
+  integrity sha512-NdUTHcPe4C99WxPub+K9l9tK5/lV4UXIoaHSYgzco9BCyjKAAwzdBI+wWtYqHt7LJdbo74ZjRPJgzVweq1sz0w==
+  dependencies:
+    regenerator-runtime "^0.14.0"
+
 "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.16.3", "@babel/runtime@^7.20.7", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
   version "7.20.13"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.20.13.tgz#7055ab8a7cff2b8f6058bf6ae45ff84ad2aded4b"
@@ -3405,6 +3412,10 @@ asap@~2.0.6:
   resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
   integrity sha512-BSHWgDSAiKs50o2Re8ppvp3seVHXSRM44cdSsT9FfNEUUZLOGWVCsiWaRPWM1Znn+mqZ1OfVZ3z3DWEzSp7hRA==
 
+"ash-tree@link:./ash-tree/build":
+  version "0.0.0"
+  uid ""
+
 ast-types-flow@^0.0.7:
   version "0.0.7"
   resolved "https://registry.yarnpkg.com/ast-types-flow/-/ast-types-flow-0.0.7.tgz#f70b735c6bca1a5c9c22d982c3e39e7feba3bdad"
@@ -7833,6 +7844,11 @@ memfs@^3.1.2, memfs@^3.4.3:
   dependencies:
     fs-monkey "^1.0.3"
 
+"memoize-one@>=3.1.1 <6":
+  version "5.2.1"
+  resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-5.2.1.tgz#8337aa3c4335581839ec01c3d594090cebe8f00e"
+  integrity sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q==
+
 meow@^10.1.2:
   version "10.1.5"
   resolved "https://registry.yarnpkg.com/meow/-/meow-10.1.5.tgz#be52a1d87b5f5698602b0f32875ee5940904aa7f"
@@ -9230,10 +9246,6 @@ react-is@^18.0.0, react-is@^18.2.0:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b"
   integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==
 
-"react-one-tree@link:./react-one-tree/build":
-  version "0.0.0"
-  uid ""
-
 react-refresh@^0.11.0:
   version "0.11.0"
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.11.0.tgz#77198b944733f0f1f1a90e791de4541f9f074046"
@@ -9304,6 +9316,14 @@ react-transition-group@^4.4.5:
     loose-envify "^1.4.0"
     prop-types "^15.6.2"
 
+react-window@^1.8.8:
+  version "1.8.10"
+  resolved "https://registry.yarnpkg.com/react-window/-/react-window-1.8.10.tgz#9e6b08548316814b443f7002b1cf8fd3a1bdde03"
+  integrity sha512-Y0Cx+dnU6NLa5/EvoHukUD0BklJ8qITCtVEPY1C/nL8wwoZ0b5aEw8Ff1dOVHw7fCzMt55XfJDd8S8W8LCaUCg==
+  dependencies:
+    "@babel/runtime" "^7.0.0"
+    memoize-one ">=3.1.1 <6"
+
 react@^18.2.0:
   version "18.2.0"
   resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5"