[TaskList] Checked init

Author: Dmitry Yadrikhinsky

src/models/TaskModel.ts

@@ -3,13 +3,15 @@ import { ITreeItem } from '../types/ITreeItem';
 
 interface ITaskModel extends ITreeItem<ITaskModel> {
   projectId: string;
+  checked: boolean;
 }
 
 export default class TaskModel extends AbstractModel implements ITaskModel {
   key: string = '';
   title: string = '';
   children: TaskModel[] = [];
   projectId: string = '';
+  checked: boolean = false;
 
   constructor(props: ITaskModel) {
     super();

src/screens/projects/Projects.tsx

@@ -19,6 +19,18 @@ const TaskList = TreeList(
   () => tasksStore.getTasks(projectStore.activeProject),
   (list: TaskModel[]) => {
     tasksStore.set(projectStore.activeProject, list);
+  },
+  {
+    checkable: true,
+    onCheck(keys) {
+      tasksStore.checkTasks(keys as string[]);
+      console.log('Check', keys);
+    },
+    getDefaultChecked() {
+      const taskKeys = tasksStore.getCheckedKeys(projectStore.activeProject);
+      console.log('Checked List', taskKeys);
+      return taskKeys;
+    },
   }
 );
 

src/screens/projects/components/TreeList.tsx

@@ -12,7 +12,12 @@ interface TreeListProps {
 
 export default function TreeList<T extends ITreeItem>(
   getData: () => T[],
-  updateData: (items: T[]) => void
+  updateData: (items: T[]) => void,
+  options?: {
+    checkable?: boolean;
+    onCheck?: (checkedKeys: React.Key[]) => void;
+    getDefaultChecked?: () => React.Key[];
+  }
 ) {
   return observer(function TreeList({ onSelect }: TreeListProps) {
     const data = getData();
@@ -87,11 +92,14 @@ export default function TreeList<T extends ITreeItem>(
     return (
       <Tree
         className="draggable-tree"
+        defaultCheckedKeys={options?.getDefaultChecked?.()}
+        checkable={options?.checkable}
         draggable
         blockNode
         onDrop={onDrop}
         treeData={data}
         onSelect={onSelect}
+        onCheck={options?.checkable ? options?.onCheck : undefined}
       />
     );
   });

src/services/tasks/TaskStore.ts

@@ -35,4 +35,39 @@ export default class TaskStore {
   restore() {
     this.tasks = this.tasksService.getAll();
   }
+
+  getCheckedKeys(projectId: string): string[] {
+    if (Array.isArray(this.tasks[projectId])) {
+      const checkedIds: string[] = [];
+      this.getCheckedKeysRecursive(this.tasks[projectId], checkedIds);
+      return checkedIds;
+    }
+    return [];
+  }
+
+  checkTasks(taskIds: string[]) {
+    Object.keys(this.tasks).forEach((projectId) => {
+      this.checkTasksRecursive(this.tasks[projectId], taskIds);
+    });
+  }
+
+  private getCheckedKeysRecursive(tasks: TaskModel[], checkedIds: string[]) {
+    tasks.forEach((task) => {
+      if (task.checked) {
+        checkedIds.push(task.key);
+      }
+      if (Array.isArray(task.children)) {
+        this.getCheckedKeysRecursive(task.children, checkedIds);
+      }
+    });
+  }
+
+  private checkTasksRecursive(tasks: TaskModel[], taskIds: string[]) {
+    tasks.forEach((task) => {
+      task.checked = taskIds.includes(task.key);
+      if (Array.isArray(task.children)) {
+        this.checkTasksRecursive(task.children, taskIds);
+      }
+    });
+  }
 }

yarn.lock

@@ -1696,15 +1696,20 @@
   resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
   integrity sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA==
 
-"@types/node@*", "@types/node@14.14.10":
+"@types/node@*":
+  version "14.14.37"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-14.14.37.tgz#a3dd8da4eb84a996c36e331df98d82abd76b516e"
+  integrity sha512-XYmBiy+ohOR4Lh5jE379fV2IU+6Jn4g5qASinhitfyO71b/sCo6MKsMLF5tc7Zf2CE8hViVQyYSobJNke8OvUw==
+
+"@types/node@14.14.10":
   version "14.14.10"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-14.14.10.tgz#5958a82e41863cfc71f2307b3748e3491ba03785"
   integrity sha512-J32dgx2hw8vXrSbu4ZlVhn1Nm3GbeCFNw2FWL8S5QKucHGY0cyNwjdQdO+KMBZ4wpmC7KhLCiNsdk1RFRIYUQQ==
 
 "@types/node@^12.0.12":
-  version "12.19.5"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-12.19.5.tgz#9be3946136e818597c71c62d04240d0602c645d4"
-  integrity sha512-Wgdl27uw/jUYUFyajUGKSjDNGxmJrZi9sjeG6UJImgUtKbJoO9aldx+1XODN1EpNDX9DirvbvHHmTsNlb8GwMA==
+  version "12.20.7"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-12.20.7.tgz#1cb61fd0c85cb87e728c43107b5fd82b69bc9ef8"
+  integrity sha512-gWL8VUkg8VRaCAUgG9WmhefMqHmMblxe2rVpMF86nZY/+ZysU+BkAp+3cz03AixWDSSz0ks5WX59yAhv/cDwFA==
 
 "@types/normalize-package-data@^2.4.0":
   version "2.4.0"
@@ -4585,9 +4590,9 @@ electron-updater@^4.3.4:
     semver "^7.3.2"
 
 electron@^11.0.1:
-  version "11.0.1"
-  resolved "https://registry.yarnpkg.com/electron/-/electron-11.0.1.tgz#e71195ff9abfbcfa0f4bf49ec9064e5e0f3f928c"
-  integrity sha512-UefDvxeyTREL1FpC0BcXwzLjcYiQICFSZONbwarpoqTXQU5rzEguIegHPqg5AqwYH4FVYfEuigj/Vm94rtZOzg==
+  version "11.4.2"
+  resolved "https://registry.yarnpkg.com/electron/-/electron-11.4.2.tgz#02005d9f5d77ea6485efeffdb5c5433c769ddda4"
+  integrity sha512-P0PRLH7cXp8ZdpA9yVPe7jRVM+QeiAtsadqmqS6XY3AYrsH+7bJnVrNuw6p/fcmp+b/UxWaCexobqQpyFJ5Qkw==
   dependencies:
     "@electron/get" "^1.0.1"
     "@types/node" "^12.0.12"