From 6ae8333d25ba53242fa123f4c21820709f777884 Mon Sep 17 00:00:00 2001
From: Markus Thielen <markus.thielen@basebox.io>
Date: Wed, 1 Nov 2023 17:22:13 +0100
Subject: [PATCH] fix multiple items being created

---
 src/components/Todo.vue | 37 ++++++++++++++++++++++---------------
 1 file changed, 22 insertions(+), 15 deletions(-)

diff --git a/src/components/Todo.vue b/src/components/Todo.vue
index 2ae6138..234a757 100644
--- a/src/components/Todo.vue
+++ b/src/components/Todo.vue
@@ -37,7 +37,7 @@
     <div id="todo-container">
 
       <transition-group name="list" tag="div">
-        <div :class="todoItemClass(task)" v-for="(task, i) in filteredItems" :id="taskElId(task)" :key="i">
+        <div :class="todoItemClass(task)" v-for="(task, i) in filteredItems" :id="taskElId(task)" :key="task.id">
           <div :class="todoCheckedClass(task)" @click="toggleCompleted(task)">
             &nbsp;
           </div>
@@ -107,6 +107,10 @@ export default {
      * @param task the task to save; this is an object as received from the broker.
      */
     saveTask(task) {
+      if (!task.title) {
+        /* don't save empty tasks */
+        return;
+      }
       console.info(`Saving task '${task.title}' with id ${task.id}`);
       let request = "";
       if (task.id !== NEW_TASK_ID) {
@@ -114,8 +118,8 @@ export default {
         request = `mutation {
           updateTask(
             id: "${task.id}",
-            title: "${task.title}",
-            description: "${task.description}",
+            title: "${task.title.replaceAll('"', '\\"')}",
+            description: "${task.description.replaceAll('"', '\\"')}",
             completed: ${task.completed ? "true" : "false"},
             list: {
               id: "${task.list.id}"
@@ -128,8 +132,8 @@ export default {
         /* create new task */
         request = `mutation {
           createTask(
-            title: "${task.title}",
-            description: "${task.description}",
+            title: "${task.title.replaceAll('"', '\\"')}",
+            description: "${task.description.replaceAll('"', '\\"')}",
             completed: ${task.completed ? "true" : "false"},
             list: {
               id: "${task.list.id}"
@@ -148,7 +152,7 @@ export default {
         request
       ).then(data => {
         /* Save the task's id in case it was just created */
-        if (!task.id) {
+        if (task.id === NEW_TASK_ID) {
           task.id = data.createTask.id;
         } 
       }).catch(e => {
@@ -196,15 +200,18 @@ export default {
         return;
       }
 
-      store.tasks.push({
-        id: NEW_TASK_ID,
-        completed: false,
-        title: "Enter task here",
-        description: "",
-        list: {
-          id: this.currentList,
-        }
-      });
+      /* Do not add another empty/new task */
+      if (!store.tasks.find((item) => item.id === NEW_TASK_ID)) {
+        store.tasks.push({
+          id: NEW_TASK_ID,
+          completed: false,
+          title: "",
+          description: "",
+          list: {
+            id: this.currentList,
+          }
+        });
+      }
 
       /* wait a moment, then scroll list to the bottom */
       setTimeout(function() {