warn the user that records are reset when editing task

src/views/task/EditTask.vue

@@ -2,16 +2,30 @@
 import TaskForm from '@/modules/task/components/TaskForm.vue'
 import TaskNotFound from '@/modules/task/components/TaskNotFound.vue'
 import { useTaskStore } from '@/modules/task/stores/useTask.store'
+import { ref } from 'vue'
 
 const props = defineProps<{ id: string }>()
-const store = useTaskStore()
+const taskStore = useTaskStore()
 
-const task = store.getTask(props.id)
+const isMessageDisplayed = ref(true)
+
+const task = taskStore.getTask(props.id)
 </script>
 
 <template>
   <div class="edit-task">
     <TaskForm v-if="task" :id="task.id" :initial-task="task" />
     <task-not-found v-else />
+    <article v-if="isMessageDisplayed" class="message is-info">
+      <div class="message-header">
+        <p>Info</p>
+        <button
+          class="delete"
+          aria-label="delete"
+          @click="isMessageDisplayed = false"
+        ></button>
+      </div>
+      <div class="message-body">When editing a task, record will be reset.</div>
+    </article>
   </div>
 </template>