diff --git a/src/app/components/error/Toast.vue b/src/app/components/error/Toast.vue
index efde0da4..1a414e08 100644
--- a/src/app/components/error/Toast.vue
+++ b/src/app/components/error/Toast.vue
@@ -1,24 +1,14 @@
 <script setup lang="ts">
-const props = defineProps<{
+const { title, message, duration } = defineProps<{
   title: string;
   message: string;
   duration?: number;
 }>();
-
-const open = ref(true);
-
-const autoCloseToast = props.duration ? Number(props.duration) : 12000; // 12 seconds
-
-onMounted(() => {
-  setTimeout(() => {
-    open.value = false;
-  }, autoCloseToast);
-});
 </script>
 
 <template>
   <ToastRoot
-    v-model:open="open"
+    :duration="duration"
     class="bg-red-800 rounded-md p-2 text-neutral-200"
   >
     <ToastTitle class="mb-4 font-medium text-lg">{{ title }} </ToastTitle>
diff --git a/src/app/pages/login.vue b/src/app/pages/login.vue
index 098a1c69..c2d63070 100644
--- a/src/app/pages/login.vue
+++ b/src/app/pages/login.vue
@@ -82,6 +82,7 @@
       v-if="setupError"
       :title="setupError.title"
       :message="setupError.message"
+      :duration="12000"
     />
   </section>
 </template>
diff --git a/src/app/pages/setup.vue b/src/app/pages/setup.vue
index c1ec8a01..772887b1 100644
--- a/src/app/pages/setup.vue
+++ b/src/app/pages/setup.vue
@@ -70,6 +70,7 @@
       v-if="setupError"
       :title="setupError.title"
       :message="setupError.message"
+      :duration="12000"
     />
   </main>
 </template>