fix: index creation

pages/indexes/create.vue

@@ -1,6 +1,9 @@
 <template>
   <Layout :title="t('title')" :subtitle="t('subtitle')">
-    <form class="space-y-4" @submit.prevent="submit()">
+    <form
+      class="space-y-4"
+      @reset.prevent="reset(factory())"
+      @submit.prevent="submit()">
       <Alert v-if="error" dismissable theme="danger" @close="error = null">
         {{ error }}
       </Alert>
@@ -42,8 +45,10 @@ import { useFormSubmit, useMeiliClient } from '~/composables'
 import { resettableRef } from '~/utils'
 import Button from '~/components/layout/forms/Button.vue'
 import Buttons from '~/components/layout/forms/Buttons.vue'
+import Label from '~/components/layout/forms/Label.vue'
 import { TOAST_PLEASEWAIT, TOAST_SUCCESS, useToasts } from '~/stores/toasts'
 import Alert from '~/components/layout/Alert.vue'
+import { promiseTimeout } from '@vueuse/core'
 
 const { t } = useI18n()
 const client = useMeiliClient()
@@ -58,19 +63,21 @@ const { value: index, reset, modified } = resettableRef(factory())
 const { loading, error, handle } = useFormSubmit()
 const self = reactive({ index, loading })
 const submit = async () => {
+  const toast = createToast({
+    ...TOAST_PLEASEWAIT(t),
+    title: t('toasts.success.title'),
+    text: t('toasts.success.pendingText'),
+    immediate: false,
+  })
   let indexUid = self.index.uid
   await handle(async () => {
+    toast.spawn()
     const task = await client.createIndex(indexUid, {
       primaryKey: self.index.primaryKey,
     })
-    const toast = createToast({
-      ...TOAST_PLEASEWAIT,
-      title: t('toasts.success.title'),
-      text: t('toasts.success.pendingText'),
-    })
     await client.waitForTask(task.taskUid)
     toast.update({
-      ...TOAST_SUCCESS,
+      ...TOAST_SUCCESS(t),
     })
     reset(factory())
     navigateTo(`/indexes/${indexUid}/documents`)