fix: use radix toast duration

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>

src/app/pages/login.vue

@@ -82,6 +82,7 @@
       v-if="setupError"
       :title="setupError.title"
       :message="setupError.message"
+      :duration="12000"
     />
   </section>
 </template>

src/app/pages/setup.vue

@@ -70,6 +70,7 @@
       v-if="setupError"
       :title="setupError.title"
       :message="setupError.message"
+      :duration="12000"
     />
   </main>
 </template>