diff --git a/bun.lock b/bun.lock
index a488ecd..0a13cf2 100644
--- a/bun.lock
+++ b/bun.lock
@@ -1,5 +1,6 @@
 {
   "lockfileVersion": 1,
+  "configVersion": 0,
   "workspaces": {
     "": {
       "name": "tout-doux",
diff --git a/resources/ts/components/TaskList.vue b/resources/ts/components/TaskList.vue
index 4b23d07..c3f5fa6 100644
--- a/resources/ts/components/TaskList.vue
+++ b/resources/ts/components/TaskList.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onBeforeMount } from "vue";
+import { ref, onBeforeMount, computed } from "vue";
 import type { Task } from "@/types";
 import { getTasks, createTask, deleteTask } from "@/api/tasks";
 import { CirclePlus } from "@lucide/vue";
@@ -13,6 +13,8 @@ const showLastChecked = ref<boolean>(false);
 const showNextReset = ref<boolean>(false);
 const separateCompleted = ref<boolean>(false);
 
+const hasCompleted = computed<boolean>(() => tasks.value.some(taskCompleted));
+
 function fetchTasks() {
     void getTasks(list.value)
         .then((data: Task[]) => {
@@ -88,7 +90,7 @@ onBeforeMount(fetchTasks);
             </div>
         </li>
     </ul>
-    <div v-if="separateCompleted" class="collapse collapse-arrow">
+    <div v-if="separateCompleted && hasCompleted" class="collapse collapse-arrow">
       <input id="completed-dropdown" type="checkbox" />
       <div class="collapse-title mb-0">Completed</div>
       <div class="collapse-content p-0">