react-native-tree-multi-select 1.2.1 → 1.2.3

package/src/__tests__/search.helper.test.ts

@@ -0,0 +1,47 @@
+import { getFilteredTreeData } from "../helpers";
+import { generateTree } from "../__mocks__/generateTree.mock";
+import { TreeNode } from "../types/treeView.types";
+
+describe('getFilteredTreeData', () => {
+    let nodes: TreeNode[];
+    let trimmedSearchTerm: string;
+    let searchKeys: string[];
+
+    beforeEach(() => {
+        nodes = generateTree(4, 10);  // Create a tree with depth 3 and breadth 2
+
+        trimmedSearchTerm = '';
+        searchKeys = ['name'];
+    });
+
+    test('should return all nodes when search term is empty', () => {
+        const result = getFilteredTreeData(nodes, trimmedSearchTerm, searchKeys);
+        expect(result).toEqual(nodes);
+    });
+
+    test('should return nodes that match the search term', () => {
+        trimmedSearchTerm = 'node1';
+        const result = getFilteredTreeData(nodes, trimmedSearchTerm, searchKeys);
+        expect(result.length).toBeGreaterThan(0);
+        result.forEach(node => {
+            expect(node.name).toContain(trimmedSearchTerm);
+        });
+    });
+
+    test('should return parent nodes whose children match the search term', () => {
+        trimmedSearchTerm = 'node1.1';
+        const result = getFilteredTreeData(nodes, trimmedSearchTerm, searchKeys);
+        expect(result.length).toBeGreaterThan(0);
+        result.forEach(node => {
+            expect(node.children?.some(
+                child => child.name === trimmedSearchTerm
+            )).toBeTruthy();
+        });
+    });
+
+    test('should return an empty array when no nodes match the search term', () => {
+        trimmedSearchTerm = 'nonexistent';
+        const result = getFilteredTreeData(nodes, trimmedSearchTerm, searchKeys);
+        expect(result).toEqual([]);
+    });
+});

package/src/__tests__/selectAll.helper.test.ts

@@ -0,0 +1,233 @@
+import { tree3d2b } from "../__mocks__/generateTree.mock";
+import {
+    getFilteredTreeData,
+    getInnerMostChildrenIdsInTree,
+    initializeNodeMaps,
+    selectAll,
+    selectAllFiltered,
+    unselectAll,
+    unselectAllFiltered
+} from "../helpers";
+import { useTreeViewStore } from "../store/treeView.store";
+import { act } from 'react-test-renderer';
+
+jest.mock('zustand');
+
+describe('selectAll helpers functions', () => {
+    beforeEach(() => {
+        useTreeViewStore.setState(useTreeViewStore.getState(), true);
+
+        // Setup mock tree
+        useTreeViewStore.getState().updateInitialTreeViewData(tree3d2b);
+        initializeNodeMaps(tree3d2b);
+    });
+
+    it('selectAll works correctly', () => {
+        // Act
+        act(() => {
+            selectAll();
+        });
+
+        // Assert
+        const { checked, indeterminate } = useTreeViewStore.getState();
+        expect(checked).toEqual(new Set([
+            '1',
+            '1.1',
+            '1.1.1',
+            "1.1.2",
+            '1.2',
+            "1.2.1",
+            "1.2.2",
+            '2',
+            '2.1',
+            "2.1.1",
+            "2.1.2",
+            "2.2",
+            "2.2.1",
+            "2.2.2",
+        ]));
+        expect(indeterminate).toEqual(new Set([]));
+    });
+
+    it('unselectAll works correctly', () => {
+        // Arrange
+        act(() => {
+            selectAll();
+        });
+
+        // Act
+        act(() => {
+            unselectAll();
+        });
+
+        // Assert
+        const { checked, indeterminate } = useTreeViewStore.getState();
+        expect(checked).toEqual(new Set([]));
+        expect(indeterminate).toEqual(new Set([]));
+    });
+
+    it('getInnerMostChildrenIdsInTree works correctly', () => {
+        const initialData = useTreeViewStore.getState().initialTreeViewData;;
+
+        // Act
+        const innerMostChildrenIds = getInnerMostChildrenIdsInTree(initialData);
+
+        // Assert
+        expect(innerMostChildrenIds.sort()).toEqual([
+            '1.1.1',
+            "1.1.2",
+            "1.2.1",
+            "1.2.2",
+            "2.1.1",
+            "2.1.2",
+            "2.2.1",
+            "2.2.2",
+        ].sort());
+    });
+
+    ////////////////////////////////////////////////////////////////////////////////
+    it('selectAllFiltered works correctly for empty search term', () => {
+        // Act
+        act(() => {
+            selectAllFiltered();
+        });
+
+        // Assert
+        const { checked, indeterminate } = useTreeViewStore.getState();
+        expect(checked).toEqual(new Set([
+            '1',
+            '1.1',
+            '1.1.1',
+            "1.1.2",
+            '1.2',
+            "1.2.1",
+            "1.2.2",
+            '2',
+            '2.1',
+            "2.1.1",
+            "2.1.2",
+            "2.2",
+            "2.2.1",
+            "2.2.2",
+        ]));
+        expect(Array.from(indeterminate)).toEqual([]);
+    });
+
+    it('selectAllFiltered works correctly for non-empty search term with found nodes', () => {
+        const searchTerm = "1.1";
+
+        // Act
+        act(() => {
+            // Update search related states in the store
+            useTreeViewStore.getState().updateSearchText(searchTerm);
+            useTreeViewStore.getState().updateSearchKeys(["id"]);
+
+            const { searchText, searchKeys } = useTreeViewStore.getState();
+
+            // Get filtered tree data (getFilteredTreeData is already tested in `search.helper.test.ts`)
+            const filteredTreeData = getFilteredTreeData(
+                tree3d2b,
+                searchText,
+                searchKeys
+            );
+
+            // Get the ids of the inner most children in the filtered tree
+            const innerMostChildrenIds = getInnerMostChildrenIdsInTree(
+                filteredTreeData
+            );
+
+            // Update the state of innerMostChildrenIds in the store
+            useTreeViewStore.getState().updateInnerMostChildrenIds(
+                innerMostChildrenIds
+            );
+
+            // Call the select all filtered function
+            selectAllFiltered();
+        });
+
+        // Assert
+        const { checked, indeterminate } = useTreeViewStore.getState();
+        expect(checked).toEqual(new Set([
+            '1.1', // As both of it's children are checked
+            '1.1.1',
+            '1.1.2',
+            '2.1.1'
+        ]));
+        expect(indeterminate).toEqual(new Set([
+            '1', // As 1.2 is unchecked
+            '2', // only one if it's children is checked
+            '2.1'
+        ]));
+    });
+    ////////////////////////////////////////////////////////////////////////////////
+
+    it('unselectAllFiltered works correctly for empty search term', () => {
+        // Arrange
+        act(() => {
+            selectAllFiltered();
+        });
+
+        // Act
+        act(() => {
+            unselectAllFiltered();
+        });
+
+        // Assert
+        const { checked, indeterminate } = useTreeViewStore.getState();
+        expect(checked).toEqual(new Set([]));
+        expect(indeterminate).toEqual(new Set([]));
+    });
+
+    it('unselectAllFiltered works correctly for non-empty search term with found nodes', () => {
+        const searchTerm = "1.1";
+
+        // Act
+        act(() => {
+            // First select all the nodes(unfiltered)
+            selectAll();
+
+            // Update search related states in the store
+            useTreeViewStore.getState().updateSearchText(searchTerm);
+            useTreeViewStore.getState().updateSearchKeys(["id"]);
+
+            const { searchText, searchKeys } = useTreeViewStore.getState();
+
+            // Get filtered tree data (getFilteredTreeData is already tested in `search.helper.test.ts`)
+            const filteredTreeData = getFilteredTreeData(
+                tree3d2b,
+                searchText,
+                searchKeys
+            );
+
+            // Get the ids of the inner most children in the filtered tree
+            const innerMostChildrenIds = getInnerMostChildrenIdsInTree(
+                filteredTreeData
+            );
+
+            // Update the state of innerMostChildrenIds in the store
+            useTreeViewStore.getState().updateInnerMostChildrenIds(
+                innerMostChildrenIds
+            );
+
+            // Call the select all filtered function
+            unselectAllFiltered();
+        });
+
+        // Assert
+        const { checked, indeterminate } = useTreeViewStore.getState();
+        expect(checked).toEqual(new Set([
+            '1.2',
+            '1.2.1',
+            '1.2.2',
+            '2.1.2',
+            '2.2',
+            '2.2.1',
+            '2.2.2',
+        ]));
+        expect(indeterminate).toEqual(new Set([
+            '1',
+            '2',
+            '2.1'
+        ]));
+    });
+});

package/src/__tests__/store.test.ts

@@ -0,0 +1,208 @@
+jest.mock('zustand');
+
+import { act } from 'react-test-renderer';
+import { useTreeViewStore } from '../store/treeView.store';
+import { createRandomNumberSet, generateTree } from '../__mocks__/generateTree.mock';
+import { TreeNode } from '../types/treeView.types';
+
+describe('TreeViewStore', () => {
+
+    beforeEach(() => {
+        useTreeViewStore.setState(useTreeViewStore.getState(), true);
+    });
+
+    test('updateChecked correctly updates the checked state', () => {
+        const val1 = new Set(['1', '2']);
+        act(() => {
+            useTreeViewStore.getState().updateChecked(val1);
+        });
+
+        expect(useTreeViewStore.getState().checked).toEqual(val1);
+
+        const val2 = createRandomNumberSet();
+        act(() => {
+            useTreeViewStore.getState().updateChecked(val2);
+        });
+
+        expect(useTreeViewStore.getState().checked).toEqual(val2);
+    });
+
+    test('updateIndeterminate correctly updates the indeterminate state', () => {
+        const val1 = new Set(['1', '2']);
+        act(() => {
+            useTreeViewStore.getState().updateIndeterminate(val1);
+        });
+
+        expect(useTreeViewStore.getState().indeterminate).toEqual(val1);
+
+        const val2 = createRandomNumberSet();
+        act(() => {
+            useTreeViewStore.getState().updateIndeterminate(val2);
+        });
+
+        expect(useTreeViewStore.getState().indeterminate).toEqual(val2);
+    });
+
+    test('updateExpanded correctly updates the expanded state', () => {
+        const val1 = new Set(['1', '2']);
+        act(() => {
+            useTreeViewStore.getState().updateExpanded(val1);
+        });
+
+        expect(useTreeViewStore.getState().expanded).toEqual(val1);
+
+        const val2 = createRandomNumberSet();
+        act(() => {
+            useTreeViewStore.getState().updateExpanded(val2);
+        });
+
+        expect(useTreeViewStore.getState().expanded).toEqual(val2);
+    });
+
+    test('updateInitialTreeViewData correctly updates the initialTreeViewData state', () => {
+        const val1: TreeNode[] = [{
+            id: '1',
+            name: 'node1',
+            children: [
+                {
+                    id: '1.1', name: 'node1.1', children: [
+                        { id: '1.1.1', name: 'node1.1.1' },
+                        { id: '1.1.2', name: 'node1.1.2' },
+                        { id: '1.1.3', name: 'node1.1.3' },
+                    ]
+                },
+                {
+                    id: '1.2', name: 'node1.2', children: [
+                        { id: '1.2.1', name: 'node1.2.1' },
+                        { id: '1.2.2', name: 'node1.2.2' },
+                        { id: '1.2.3', name: 'node1.2.3' },
+                    ]
+                },
+                {
+                    id: '1.3', name: 'node1.3', children: [
+                        { id: '1.3.1', name: 'node1.3.1' },
+                        { id: '1.3.2', name: 'node1.3.2' },
+                        { id: '1.3.3', name: 'node1.3.3' },
+                    ]
+                },
+            ],
+        }];
+        act(() => {
+            useTreeViewStore.getState().updateInitialTreeViewData(val1);
+        });
+
+        expect(useTreeViewStore.getState().initialTreeViewData).toEqual(val1);
+
+        const val2 = generateTree(3, 3);
+        act(() => {
+            useTreeViewStore.getState().updateInitialTreeViewData(val2);
+        });
+
+        expect(useTreeViewStore.getState().initialTreeViewData).toEqual(val2);
+    });
+
+    test('updateNodeMap correctly updates the node map', () => {
+        const val1 = new Map<string, TreeNode>();
+        val1.set('1', generateTree(5, 10)[0] as TreeNode);
+        act(() => {
+            useTreeViewStore.getState().updateNodeMap(val1);
+        });
+
+        expect(useTreeViewStore.getState().nodeMap).toEqual(val1);
+
+        const val2 = new Map<string, TreeNode>();
+        val2.set('2', {} as TreeNode);
+        act(() => {
+            useTreeViewStore.getState().updateNodeMap(val2);
+        });
+
+        expect(useTreeViewStore.getState().nodeMap).toEqual(val2);
+    });
+
+    // Testing updateChildToParentMap
+    test('updateChildToParentMap correctly updates the child to parent map', () => {
+        const val1 = new Map<string, string>();
+        val1.set('1', '2');
+        act(() => {
+            useTreeViewStore.getState().updateChildToParentMap(val1);
+        });
+
+        expect(useTreeViewStore.getState().childToParentMap).toEqual(val1);
+
+        const val2 = new Map<string, string>();
+        val2.set('3', '4');
+        act(() => {
+            useTreeViewStore.getState().updateChildToParentMap(val2);
+        });
+
+        expect(useTreeViewStore.getState().childToParentMap).toEqual(val2);
+    });
+
+    // Testing updateSearchText
+    test('updateSearchText correctly updates the search text', () => {
+        const val1 = 'hello';
+        act(() => {
+            useTreeViewStore.getState().updateSearchText(val1);
+        });
+
+        expect(useTreeViewStore.getState().searchText).toEqual(val1);
+
+        const val2 = 'world';
+        act(() => {
+            useTreeViewStore.getState().updateSearchText(val2);
+        });
+
+        expect(useTreeViewStore.getState().searchText).toEqual(val2);
+    });
+
+    // Testing updateSearchKeys
+    test('updateSearchKeys correctly updates the search keys', () => {
+        const val1 = ['hello'];
+        act(() => {
+            useTreeViewStore.getState().updateSearchKeys(val1);
+        });
+
+        expect(useTreeViewStore.getState().searchKeys).toEqual(val1);
+
+        const val2 = ['world'];
+        act(() => {
+            useTreeViewStore.getState().updateSearchKeys(val2);
+        });
+
+        expect(useTreeViewStore.getState().searchKeys).toEqual(val2);
+    });
+
+    // Testing updateInnerMostChildrenIds
+    test('updateInnerMostChildrenIds correctly updates the inner most children ids', () => {
+        const val1 = ['1', '2'];
+        act(() => {
+            useTreeViewStore.getState().updateInnerMostChildrenIds(val1);
+        });
+
+        expect(useTreeViewStore.getState().innerMostChildrenIds).toEqual(val1);
+
+        const val2 = ['3', '4'];
+        act(() => {
+            useTreeViewStore.getState().updateInnerMostChildrenIds(val2);
+        });
+
+        expect(useTreeViewStore.getState().innerMostChildrenIds).toEqual(val2);
+    });
+
+    // Testing cleanUpTreeViewStore
+    test('cleanUpTreeViewStore correctly cleans up the store', () => {
+        act(() => {
+            useTreeViewStore.getState().cleanUpTreeViewStore();
+        });
+
+        expect(useTreeViewStore.getState().checked).toEqual(new Set());
+        expect(useTreeViewStore.getState().indeterminate).toEqual(new Set());
+        expect(useTreeViewStore.getState().expanded).toEqual(new Set());
+        expect(useTreeViewStore.getState().initialTreeViewData).toEqual([]);
+        expect(useTreeViewStore.getState().nodeMap).toEqual(new Map());
+        expect(useTreeViewStore.getState().childToParentMap).toEqual(new Map());
+        expect(useTreeViewStore.getState().searchText).toEqual("");
+        expect(useTreeViewStore.getState().searchKeys).toEqual([""]);
+        expect(useTreeViewStore.getState().innerMostChildrenIds).toEqual([]);
+    });
+});

package/src/__tests__/toggleCheckbox.helper.test.ts

@@ -0,0 +1,124 @@
+jest.mock('zustand');
+
+import { useTreeViewStore } from '../store/treeView.store';
+import {
+    initializeNodeMaps,
+    toggleCheckboxes
+} from '../helpers';
+import { act } from 'react-test-renderer';
+import { tree3d2b } from '../__mocks__/generateTree.mock';
+
+describe('toggleCheckboxes', () => {
+    beforeEach(() => {
+        useTreeViewStore.setState(useTreeViewStore.getState(), true);
+
+        // Setup mock tree
+        useTreeViewStore.getState().updateInitialTreeViewData(tree3d2b);
+        initializeNodeMaps(tree3d2b);
+    });
+
+    it('correctly updates checkbox states', () => {
+        // Act
+        act(() => {
+            // Pre-selection also got covered in this test
+            toggleCheckboxes(['1', '2'], true);
+        });
+
+        // Assert
+        const { checked, indeterminate } = useTreeViewStore.getState();
+
+        expect(checked).toEqual(new Set([
+            '1',
+            '1.1',
+            '1.1.1',
+            '1.1.2',
+            '1.2',
+            '1.2.1',
+            '1.2.2',
+            '2',
+            '2.1',
+            '2.1.1',
+            '2.1.2',
+            '2.2',
+            '2.2.1',
+            '2.2.2'
+        ]));
+
+        expect(indeterminate).toEqual(new Set([]));
+
+        // Act
+        act(() => {
+            toggleCheckboxes(['1.2']); // Was checked, now should be unchecked
+        });
+
+        // Assert
+        const {
+            checked: checkedAfterUncheck,
+            indeterminate: indeterminateAfterUncheck
+        } = useTreeViewStore.getState();
+
+
+        expect(checkedAfterUncheck).toEqual(new Set([
+            '1.1',
+            '1.1.1',
+            '1.1.2',
+            '2',
+            '2.1',
+            '2.1.1',
+            '2.1.2',
+            '2.2',
+            '2.2.1',
+            '2.2.2'
+        ]));
+
+        expect(indeterminateAfterUncheck).toEqual(new Set([
+            "1"
+        ]));
+
+        // Act
+        act(() => {
+            toggleCheckboxes(['2']); // Was checked, now should be unchecked
+        });
+
+        // Assert
+        const {
+            checked: checkedAfterUncheck2,
+            indeterminate: indeterminateAfterUncheck2
+        } = useTreeViewStore.getState();
+
+        expect(checkedAfterUncheck2).toEqual(new Set([
+            '1.1',
+            '1.1.1',
+            '1.1.2'
+        ]));
+
+        expect(indeterminateAfterUncheck2).toEqual(new Set([
+            "1"
+        ]));
+
+        // Act
+        act(() => {
+            toggleCheckboxes(['1.2']); // Was unchecked, now should be checked
+        });
+
+        // Assert
+        const {
+            checked: checkedAfter1ChildrenCheck,
+            indeterminate: indeterminateAfter1ChildrenCheck
+        } = useTreeViewStore.getState();
+
+        // As all children of node 1 are checked, it should also be checked
+        expect(checkedAfter1ChildrenCheck).toEqual(new Set([
+            '1', // All children are checked again
+            '1.1',
+            '1.1.1',
+            '1.1.2',
+            '1.2',
+            '1.2.1',
+            '1.2.2'
+        ]));
+
+        // 1 is all checked whereas all children of 2 are unchecked
+        expect(indeterminateAfter1ChildrenCheck).toEqual(new Set([]));
+    });
+});

package/tsconfig.build.json

@@ -0,0 +1,5 @@
+
+{
+  "extends": "./tsconfig",
+  "exclude": ["example"]
+}

package/tsconfig.json

@@ -0,0 +1,31 @@
+{
+  "exclude": [
+    "node_modules"
+  ],
+  "compilerOptions": {
+    "baseUrl": "./",
+    "paths": {
+      "react-native-tree-multi-select": ["./src/index"]
+    },
+    "allowUnreachableCode": false,
+    "allowUnusedLabels": false,
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "jsx": "react",
+    "lib": ["esnext", "dom"],
+    "module": "esnext",
+    "moduleResolution": "node",
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitReturns": true,
+    "noImplicitUseStrict": false,
+    "noStrictGenericChecks": false,
+    "noUncheckedIndexedAccess": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "resolveJsonModule": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "target": "esnext",
+    "verbatimModuleSyntax": false
+  }
+}

package/turbo.json

@@ -0,0 +1,34 @@
+{
+  "$schema": "https://turbo.build/schema.json",
+  "pipeline": {
+    "build:android": {
+      "inputs": [
+        "package.json",
+        "android",
+        "!android/build",
+        "src/*.ts",
+        "src/*.tsx",
+        "example/package.json",
+        "example/android",
+        "!example/android/.gradle",
+        "!example/android/build",
+        "!example/android/app/build"
+      ],
+      "outputs": []
+    },
+    "build:ios": {
+      "inputs": [
+        "package.json",
+        "*.podspec",
+        "ios",
+        "src/*.ts",
+        "src/*.tsx",
+        "example/package.json",
+        "example/ios",
+        "!example/ios/build",
+        "!example/ios/Pods"
+      ],
+      "outputs": []
+    }
+  }
+}