Merge pull request #104 from kpustakhod/types-cleanup

Types cleanup

src/TreeView/index.tsx

@@ -14,7 +14,6 @@ import {
   INodeRendererProps,
   NodeAction,
   NodeId,
-  TreeViewData,
 } from "./types";
 import {
   difference,
@@ -48,7 +47,7 @@ import {
 } from "./constants";
 
 interface IUseTreeProps {
-  data: TreeViewData;
+  data: INode[];
   controlledIds?: NodeId[];
   controlledExpandedIds?: NodeId[];
   defaultExpandedIds?: NodeId[];
@@ -434,7 +433,7 @@ export interface ITreeViewOnLoadDataProps {
 
 export interface ITreeViewProps {
   /** Tree data*/
-  data: TreeViewData;
+  data: INode[];
   /** Function called when a node changes its selected state */
   onSelect?: (props: ITreeViewOnSelectProps) => void;
   /** Function called when a single node is manually selected/unselected. */
@@ -613,7 +612,7 @@ const handleKeyDown = ({
   togglableSelect,
   clickAction,
 }: {
-  data: TreeViewData;
+  data: INode[];
   tabbableId: NodeId;
   expandedIds: Set<NodeId>;
   selectedIds: Set<NodeId>;

src/TreeView/node.tsx

@@ -10,7 +10,6 @@ import {
   INodeRendererProps,
   NodeAction,
   NodeId,
-  TreeViewData,
 } from "./types";
 import {
   composeHandlers,
@@ -29,7 +28,7 @@ import { baseClassNames, clickActions } from "./constants";
 export interface INodeProps {
   element: INode;
   dispatch: React.Dispatch<TreeViewAction>;
-  data: TreeViewData;
+  data: INode[];
   nodeAction: NodeAction;
   selectedIds: Set<NodeId>;
   tabbableId: NodeId;

src/TreeView/types.ts

@@ -13,8 +13,6 @@ export type INodeRefs = null | React.RefObject<{
   [key: NodeId]: INodeRef;
 }>;
 
-export type TreeViewData = INode[];
-
 export type EventCallback = <T, E>(
   event: React.MouseEvent<T, E> | React.KeyboardEvent<T>
   ) => void;

src/TreeView/utils.ts

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from "react";
-import { EventCallback, INode, INodeRef, NodeId, TreeViewData } from "./types";
+import { EventCallback, INode, INodeRef, NodeId } from "./types";
 
 // eslint-disable-next-line @typescript-eslint/no-empty-function
 export const noop = () => {};
@@ -37,15 +37,15 @@ export const usePrevious = (x: Set<NodeId>) => {
   return ref.current;
 };
 
-export const usePreviousData = (value: TreeViewData) => {
-  const ref = useRef<TreeViewData>();
+export const usePreviousData = (value: INode[]) => {
+  const ref = useRef<INode[]>();
   useEffect(() => {
     ref.current = value;
   });
   return ref.current;
 };
 
-export const isBranchNode = (data: TreeViewData, i: NodeId) => {
+export const isBranchNode = (data: INode[], i: NodeId) => {
   const node = getTreeNode(data, i);
   return !!node.children?.length;
 };
@@ -62,12 +62,12 @@ export const focusRef = (ref: INodeRef) => {
   }
 };
 
-export const getParent = (data: TreeViewData, id: NodeId) => {
+export const getParent = (data: INode[], id: NodeId) => {
   return getTreeNode(data, id).parent;
 };
 
 export const getAncestors = (
-  data: TreeViewData,
+  data: INode[],
   childId: NodeId,
   disabledIds: Set<NodeId>
 ) => {
@@ -90,12 +90,12 @@ export const getAncestors = (
 };
 
 export const getDescendants = (
-  data: TreeViewData,
+  data: INode[],
   id: NodeId,
   disabledIds: Set<NodeId>
 ) => {
   const descendants: NodeId[] = [];
-  const getDescendantsHelper = (data: TreeViewData, id: NodeId) => {
+  const getDescendantsHelper = (data: INode[], id: NodeId) => {
     const node = getTreeNode(data, id);
     if (node.children == null) return;
     for (const childId of node.children.filter((x) => !disabledIds.has(x))) {
@@ -107,7 +107,7 @@ export const getDescendants = (
   return descendants;
 };
 
-export const getSibling = (data: TreeViewData, id: NodeId, diff: number) => {
+export const getSibling = (data: INode[], id: NodeId, diff: number) => {
   const parentId = getParent(data, id);
   if (parentId != null) {
     const parent = getTreeNode(data, parentId);
@@ -121,7 +121,7 @@ export const getSibling = (data: TreeViewData, id: NodeId, diff: number) => {
 };
 
 export const getLastAccessible = (
-  data: TreeViewData,
+  data: INode[],
   id: NodeId,
   expandedIds: Set<NodeId>
 ) => {
@@ -140,7 +140,7 @@ export const getLastAccessible = (
 };
 
 export const getPreviousAccessible = (
-  data: TreeViewData,
+  data: INode[],
   id: NodeId,
   expandedIds: Set<NodeId>
 ) => {
@@ -155,7 +155,7 @@ export const getPreviousAccessible = (
 };
 
 export const getNextAccessible = (
-  data: TreeViewData,
+  data: INode[],
   id: NodeId,
   expandedIds: Set<NodeId>
 ) => {
@@ -178,7 +178,7 @@ export const getNextAccessible = (
 };
 
 export const propagateSelectChange = (
-  data: TreeViewData,
+  data: INode[],
   ids: Set<NodeId>,
   selectedIds: Set<NodeId>,
   disabledIds: Set<NodeId>,
@@ -249,7 +249,7 @@ export const getAccessibleRange = ({
   from,
   to,
 }: {
-  data: TreeViewData;
+  data: INode[];
   expandedIds: Set<NodeId>;
   from: NodeId;
   to: NodeId;
@@ -284,9 +284,9 @@ interface ITreeNode {
   children?: ITreeNode[];
 }
 
-export const flattenTree = function(tree: ITreeNode): TreeViewData {
+export const flattenTree = function(tree: ITreeNode): INode[] {
   let internalCount = 0;
-  const flattenedTree: TreeViewData = [];
+  const flattenedTree: INode[] = [];
 
   const flattenTreeHelper = function(tree: ITreeNode, parent: NodeId | null) {
     const node: INode = {
@@ -351,7 +351,7 @@ export const getAriaChecked = ({
 };
 
 export const propagatedIds = (
-  data: TreeViewData,
+  data: INode[],
   ids: NodeId[],
   disabledIds: Set<NodeId>
 ) =>
@@ -383,7 +383,7 @@ export const onComponentBlur = (
 };
 
 export const isBranchSelectedAndHasSelectedDescendants = (
-  data: TreeViewData,
+  data: INode[],
   elementId: NodeId,
   selectedIds: Set<NodeId>
 ) => {
@@ -396,7 +396,7 @@ export const isBranchSelectedAndHasSelectedDescendants = (
   );
 };
 
-export const getTreeParent = (data: TreeViewData): INode => {
+export const getTreeParent = (data: INode[]): INode => {
   const parentNode: INode | undefined = data.find(
     (node) => node.parent === null
   );
@@ -408,7 +408,7 @@ export const getTreeParent = (data: TreeViewData): INode => {
   return parentNode;
 };
 
-export const getTreeNode = (data: TreeViewData, id: NodeId): INode => {
+export const getTreeNode = (data: INode[], id: NodeId): INode => {
   const treeNode = data.find((node) => node.id === id);
 
   if (treeNode == null) {
@@ -423,7 +423,7 @@ const hasDuplicates = (ids: NodeId[]): boolean => {
   return ids.length !== uniqueIds.length;
 };
 
-export const validateTreeViewData = (data: TreeViewData): void => {
+export const validateTreeViewData = (data: INode[]): void => {
   if (hasDuplicates(data.map((node) => node.id))) {
     throw Error(
       `Multiple TreeView nodes have the same ID. IDs must be unique.`

src/__tests__/ControlledExpandedNode.test.tsx

@@ -1,8 +1,8 @@
 import "@testing-library/jest-dom/extend-expect";
 import { fireEvent, render } from "@testing-library/react";
 import React from "react";
-import TreeView, { flattenTree, TreeViewData } from "..";
-import { NodeId } from "../TreeView/types";
+import TreeView, { flattenTree } from "..";
+import { INode, NodeId } from "../TreeView/types";
 
 const folder = {
   name: "",
@@ -99,7 +99,7 @@ const dataWithIds = flattenTree(folderWithIds);
 
 interface ControlledExpandedProps {
   expandedIds?: NodeId[];
-  data: TreeViewData;
+  data: INode[];
 }
 
 function ControlledExpanded(props: ControlledExpandedProps) {

src/__tests__/ControlledTree.test.tsx

@@ -2,7 +2,7 @@ import "@testing-library/jest-dom/extend-expect";
 import { render, fireEvent } from "@testing-library/react";
 import React from "react";
 import TreeView, { flattenTree } from "..";
-import { NodeId, TreeViewData } from "../TreeView/types";
+import { NodeId, INode } from "../TreeView/types";
 
 const folder = {
   name: "",
@@ -102,7 +102,7 @@ interface MultiSelectCheckboxControlledProps {
   selectedIds: NodeId[];
   defaultDisabledIds?: NodeId[];
   defaultExpandedIds?: NodeId[];
-  data: TreeViewData;
+  data: INode[];
 }
 
 function MultiSelectCheckboxControlled(

src/__tests__/MultiSelectCheckboxTreeAsync.test.tsx

@@ -1,11 +1,11 @@
 import "@testing-library/jest-dom/extend-expect";
 import { fireEvent, render, screen, waitFor } from "@testing-library/react";
 import React, { useState } from "react";
-import TreeView, { INode, ITreeViewProps } from "..";
-import { NodeId, TreeViewData } from "../TreeView/types";
+import TreeView, { ITreeViewProps } from "..";
+import { NodeId, INode } from "../TreeView/types";
 
 describe("Async MultiSelectCheckboxTree", () => {
-  let initialData: TreeViewData;
+  let initialData: INode[];
   beforeEach(() => {
     initialData = [
       {
@@ -50,10 +50,10 @@ describe("Async MultiSelectCheckboxTree", () => {
   });
 
   function AsyncMultiSelectCheckbox() {
-    const [data, setData] = useState<TreeViewData>(initialData);
+    const [data, setData] = useState<INode[]>(initialData);
 
     const updateTreeData = (
-      list: TreeViewData,
+      list: INode[],
       id: NodeId,
       children: INode[]
     ) => {

src/__tests__/TreeViewNodeId.test.tsx

@@ -3,7 +3,7 @@ import React from "react";
 import TreeView from "../TreeView";
 import { render } from "@testing-library/react";
 import { flattenTree } from "../TreeView/utils";
-import { TreeViewData } from "../TreeView/types";
+import { INode } from "../TreeView/types";
 
 const initialTreeNode = {
   name: "",
@@ -48,7 +48,7 @@ const initialTreeNode = {
 const mapDataType = flattenTree(initialTreeNode);
 
 interface TreeViewDataTypeProps {
-  data: TreeViewData;
+  data: INode[];
 }
 
 function TreeViewDataType(props: TreeViewDataTypeProps) {

src/index.ts

@@ -9,7 +9,7 @@ import { CLICK_ACTIONS } from "./TreeView/constants";
 import { ITreeViewState, TreeViewAction } from "./TreeView/reducer";
 import {
   INode,
-  TreeViewData,
+  NodeId,
   EventCallback,
   ClickActions,
   INodeRendererProps,
@@ -22,7 +22,7 @@ export {
   flattenTree,
   ITreeViewProps,
   INode,
-  TreeViewData,
+  NodeId,
   ITreeViewOnSelectProps,
   ITreeViewOnNodeSelectProps,
   CLICK_ACTIONS,