add a confirm modal before resetting all tasks

src/views/HomeView.vue

@@ -3,16 +3,33 @@ import TaskList from '@/modules/task/components/TaskList.vue'
 import { useTaskStore } from '@/modules/task/stores/useTask.store'
 
 const taskStore = useTaskStore()
+
+const resetTasks = () => {
+  if (window.confirm('are you sure to reset all your tasks?')) {
+    taskStore.reset()
+  }
+}
 </script>
 
 <template>
   <main>
-    <router-link :to="{ name: 'new-task' }" class="button is-primary"
+    <div>
-      >New task</router-link
+      <router-link :to="{ name: 'new-task' }" class="button is-primary"
-    >
+        >New task</router-link
+      >
+    </div>
     <task-list />
-    <button class="button is-danger" @click="() => taskStore.reset()">
+    <div>
-      reset list
+      <button class="button is-danger" @click="resetTasks">reset list</button>
-    </button>
+    </div>
   </main>
 </template>
+
+<style scoped>
+main {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  height: 60vh;
+}
+</style>

tsconfig.app.json

@@ -4,7 +4,7 @@
   "exclude": ["src/**/__tests__/*"],
   "compilerOptions": {
     "composite": true,
-    "lib": ["es2019"],
+    "lib": ["es2019", "dom"],
     "baseUrl": ".",
     "paths": {
       "@/*": ["./src/*"]