refactor: created class

todo/package-lock.json

@@ -1,16 +1,17 @@
 {
-  "name": "webpack-template",
+  "name": "todo",
   "version": "1.0.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
-      "name": "webpack-template",
+      "name": "todo",
       "version": "1.0.0",
       "license": "ISC",
       "devDependencies": {
         "css-loader": "^6.8.1",
-        "html-webpack-plugin": "^5.6.0",
+        "html-webpack-plugin": "^5.5.4",
+        "inline-source-map": "^0.6.2",
         "style-loader": "^3.3.3",
         "webpack": "^5.89.0",
         "webpack-cli": "^5.1.4",
@@ -889,10 +890,13 @@
       "dev": true
     },
     "node_modules/commander": {
-      "version": "2.20.3",
+      "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz",
-      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
+      "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==",
-      "dev": true
+      "dev": true,
+      "engines": {
+        "node": ">= 12"
+      }
     },
     "node_modules/compressible": {
       "version": "2.0.18",
@@ -1834,15 +1838,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/html-minifier-terser/node_modules/commander": {
-      "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz",
-      "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==",
-      "dev": true,
-      "engines": {
-        "node": ">= 12"
-      }
-    },
     "node_modules/html-webpack-plugin": {
       "version": "5.6.0",
       "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-5.6.0.tgz",
@@ -2028,6 +2023,24 @@
       "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
       "dev": true
     },
+    "node_modules/inline-source-map": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/inline-source-map/-/inline-source-map-0.6.2.tgz",
+      "integrity": "sha512-0mVWSSbNDvedDWIN4wxLsdPM4a7cIPcpyMxj3QZ406QRwQ6ePGB1YIHxVPjqpcUGbWQ5C+nHTwGNWAGvt7ggVA==",
+      "dev": true,
+      "dependencies": {
+        "source-map": "~0.5.3"
+      }
+    },
+    "node_modules/inline-source-map/node_modules/source-map": {
+      "version": "0.5.7",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+      "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/interpret": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/interpret/-/interpret-3.1.1.tgz",
@@ -2814,9 +2827,9 @@
       }
     },
     "node_modules/postcss-selector-parser": {
-      "version": "6.0.13",
+      "version": "6.0.14",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.14.tgz",
-      "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
+      "integrity": "sha512-65xXYsT40i9GyWzlHQ5ShZoK7JZdySeOozi/tz2EezDo6c04q6+ckYMeoY7idaie1qp2dT5KoYQ2yky6JuoHnA==",
       "dev": true,
       "dependencies": {
         "cssesc": "^3.0.0",
@@ -3609,6 +3622,12 @@
         }
       }
     },
+    "node_modules/terser/node_modules/commander": {
+      "version": "2.20.3",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
+      "dev": true
+    },
     "node_modules/thunky": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/thunky/-/thunky-1.1.0.tgz",

todo/package.json

@@ -1,7 +1,7 @@
 {
   "name": "todo",
   "version": "1.0.0",
-  "description": "Todolist project",
+  "description": "Vanilla template for webpack",
   "private": true,
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
@@ -14,7 +14,8 @@
   "license": "ISC",
   "devDependencies": {
     "css-loader": "^6.8.1",
-    "html-webpack-plugin": "^5.6.0",
+    "html-webpack-plugin": "^5.5.4",
+    "inline-source-map": "^0.6.2",
     "style-loader": "^3.3.3",
     "webpack": "^5.89.0",
     "webpack-cli": "^5.1.4",

todo/src/components/todo.js

@@ -30,17 +30,19 @@ function createProject(name) {
     return project;
 }
 
-function todoHandler() {
+class todoHandler {
     // Create default project during construction
-    this.projects = [new createProject('default')];
+    constructor() {
+        this.projects = [new createProject('default')];
+    }
 
-    const getTodos = () => {
+    getTodos() {
         return this.projects.map(item => item.todos);
     }    
     
-    const addTodo = (project = 'default', title, description, dueDate, pomodoros) => {
+    addTodo(project = 'default', title, description, dueDate, pomodoros) {
         let index = this.projects.findIndex(x => x.name === project);
-        let _titleExists = titleExists(title, this.projects[index].todos);
+        let _titleExists = this.titleExists(title, this.projects[index].todos);
 
         if (!_titleExists) {
             this.projects[index].todos.push(new createTodo(title, description, dueDate, pomodoros));
@@ -51,7 +53,7 @@ function todoHandler() {
 
     }
 
-    const editTodo = (project, title, description, dueDate, pomodors) => {
+    editTodo(project, title, description, dueDate, pomodors) {
         let projectIndex = this.projects.findIndex(x => x.name === project);
         let todo = this.projects[projectIndex].todos.find(t => t.title === title)
 
@@ -62,7 +64,7 @@ function todoHandler() {
         }
     }
 
-    const deleteTodo = (project, title) => {
+    deleteTodo(project, title) {
         let projectIndex = this.projects.findIndex(x => x.name === project);
         let tempArr = this.projects[projectIndex].todos.filter(item => {
             if (item.title !== title){
@@ -72,17 +74,17 @@ function todoHandler() {
         this.projects[projectIndex].todos = tempArr;
     }
 
-    const titleExists = (title, todoArr) => {
+    titleExists(title, todoArr) {
         return todoArr.find(todo => todo.title === title);
     }
 
-    const addProject = name => this.projects.push(createProject(name));
+    addProject = name => this.projects.push(createProject(name));
 
-    const getProjects = () => {
+    getProjects () {
         return this.projects.map(item => item.name);
     }
 
-    const delProject = name => {
+    delProject = name => {
         let index = this.projects.findIndex(proj => proj.name === name);
         let tempArr = this.projects.filter(item => {
             if (item !== this.projects[index] || name === 'default' ){
@@ -92,11 +94,11 @@ function todoHandler() {
         this.projects = tempArr;
     }
 
-    return { getTodos, addTodo, editTodo, deleteTodo, addProject, getProjects, delProject }
+    // return { getTodos, addTodo, editTodo, deleteTodo, addProject, getProjects, delProject }
     
 }
 
-export { todoHandler };
+export {  todoHandler };
 
 
 

todo/src/index.js

@@ -1,10 +1,12 @@
+import { todoHandler } from "./components/todo";
 
+let todos = new todoHandler();
 
 // todoHandler().addTodo('default', 'test', 'some stuff', 'today', 5);
-// todos.addProject('chores');
+todos.addProject('chores');
-// todos.addTodo('default', 'test default 2', 'some stuff', 'today', 5);
+todos.addTodo('default', 'test default 2', 'some stuff', 'today', 5);
 // todos.addTodo('chores', 'choretest', 'some stuff', 'today', 5);
-// console.log(todos.getTodos());
+console.log(todos.getTodos());
 // todos.delProject('de');
 // todos.editTodo('default', 'test', 'stuffing', 'tomorrow', 4);
 // console.log(todos.getTodos());