adata-ui 2.0.28 → 2.0.29

package/.nuxtrc

@@ -1 +1 @@
-typescript.includeWorkspace = true
+typescript.includeWorkspace = true

package/.playground/app.config.ts

@@ -1,5 +1,5 @@
-export default defineAppConfig({
-  myLayer: {
-    name: 'My amazing Nuxt layer (overwritten)'
-  }
-})
+export default defineAppConfig({
+  myLayer: {
+    name: 'My amazing Nuxt layer (overwritten)'
+  }
+})

package/README.md

@@ -1,75 +1,75 @@
-# Adata UI with Nuxt 3 using Layers
-
-Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
-
-## Setup
-
-Make sure to install the dependencies:
-
-```bash
-# npm
-npm install
-
-# pnpm
-pnpm install
-
-# yarn
-yarn install
-
-# bun
-bun install
-```
-
-## Development Server
-
-Start the development server on `https://localhost:3000`:
-
-```bash
-# npm
-npm run dev
-
-# pnpm
-pnpm run dev
-
-# yarn
-yarn dev
-
-# bun
-bun run dev
-```
-
-## Production
-
-Build the application for production:
-
-```bash
-# npm
-npm run build
-
-# pnpm
-pnpm run build
-
-# yarn
-yarn build
-
-# bun
-bun run build
-```
-
-Locally preview production build:
-
-```bash
-# npm
-npm run preview
-
-# pnpm
-pnpm run preview
-
-# yarn
-yarn preview
-
-# bun
-bun run preview
-```
-
-Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
+# Adata UI with Nuxt 3 using Layers
+
+Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+
+## Setup
+
+Make sure to install the dependencies:
+
+```bash
+# npm
+npm install
+
+# pnpm
+pnpm install
+
+# yarn
+yarn install
+
+# bun
+bun install
+```
+
+## Development Server
+
+Start the development server on `https://localhost:3000`:
+
+```bash
+# npm
+npm run dev
+
+# pnpm
+pnpm run dev
+
+# yarn
+yarn dev
+
+# bun
+bun run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+# npm
+npm run build
+
+# pnpm
+pnpm run build
+
+# yarn
+yarn build
+
+# bun
+bun run build
+```
+
+Locally preview production build:
+
+```bash
+# npm
+npm run preview
+
+# pnpm
+pnpm run preview
+
+# yarn
+yarn preview
+
+# bun
+bun run preview
+```
+
+Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.

package/components/elements/README.md

@@ -1 +1 @@
-# button, alerts, dropdown
+# button, alerts, dropdown

package/components/forms/README.md

@@ -1 +1 @@
-# inputs
+# inputs

package/components/modals/AConfirmationEmail.vue

@@ -1,40 +1,40 @@
-<script setup lang="ts">
-const emit = defineEmits<{
-  (e: 'resend'): void
-  (e: 'close'): void
-}>()
-</script>
-
-<template>
-  <div class="flex flex-col justify-center items-center gap-5">
-    <p class="heading-02">
-      {{ $t('login.modal.title') }}
-    </p>
-    <a-ill-mail />
-    <p class="body-400 text-center">
-      {{ $t('login.modal.subtitle1') }}
-    </p>
-    <p class="body-400 text-center">
-      {{ $t('login.modal.confirmationEmail') }}
-    </p>
-    <div class="flex flex-col gap-2 w-full">
-      <a-button
-        class="w-full"
-        view="outline"
-        @click="emit('close')"
-      >
-        {{ $t('login.modal.back') }}
-      </a-button>
-      <a-button
-        class="w-full"
-        @click="emit('resend')"
-      >
-        {{ $t('login.modal.resend') }}
-      </a-button>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-
-</style>
+<script setup lang="ts">
+const emit = defineEmits<{
+  (e: 'resend'): void
+  (e: 'close'): void
+}>()
+</script>
+
+<template>
+  <div class="flex flex-col justify-center items-center gap-5">
+    <p class="heading-02">
+      {{ $t('login.modal.title') }}
+    </p>
+    <a-ill-mail />
+    <p class="body-400 text-center">
+      {{ $t('login.modal.subtitle1') }}
+    </p>
+    <p class="body-400 text-center">
+      {{ $t('login.modal.confirmationEmail') }}
+    </p>
+    <div class="flex flex-col gap-2 w-full">
+      <a-button
+        class="w-full"
+        view="outline"
+        @click="emit('close')"
+      >
+        {{ $t('login.modal.back') }}
+      </a-button>
+      <a-button
+        class="w-full"
+        @click="emit('resend')"
+      >
+        {{ $t('login.modal.resend') }}
+      </a-button>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+
+</style>

package/components/modals/Resend.vue

@@ -1,81 +1,81 @@
-<script setup lang="ts">
-
-const emit = defineEmits<{
-  (e: 'resend'): void
-  (e: 'close'): void
-}>()
-
-const timer = ref(60)
-const isResend = ref(false)
-const route = useRoute()
-const appConfig = useAppConfig()
-const landingUrl = appConfig.myLayer.landingUrl
-
-function runTimer() {
-  timer.value = 60
-  const intervalId = setInterval(() => {
-    if (timer.value <= 0) {
-      isResend.value = true
-      clearInterval(intervalId);
-      return;
-    }
-    timer.value--;
-  }, 1000);
-}
-
-onMounted(() => resend())
-
-const resend = () => {
-  isResend.value = false
-  runTimer()
-  emit('resend')
-}
-const goToMain = () => {
-  if (route.query.url) {
-    document.location.replace(route.query.url)
-  } else {
-    document.location.replace(landingUrl)
-  }
-  emit('close')
-
-}
-</script>
-
-<template>
-  <div class="flex flex-col justify-center items-center gap-5">
-    <p class="heading-02">
-      {{ $t('login.modal.title') }}
-    </p>
-    <a-ill-mail />
-    <p class="body-400 text-center">
-      {{ $t('login.modal.subtitle1') }}
-    </p>
-    <p class="body-400 text-center">
-      {{ $t('login.modal.subtitle2') }}
-    </p>
-    <p
-      v-if="!isResend"
-      class="heading-02"
-    >
-      {{ timer }} {{ $t('login.modal.seconds') }}
-    </p>
-    <a-button
-      v-else
-      class="w-full"
-      view="outline"
-      @click="resend"
-    >
-      {{ $t('login.modal.resend') }}
-    </a-button>
-    <a-button
-      class="w-full"
-      @click="goToMain"
-    >
-      {{ $t('login.modal.back') }}
-    </a-button>
-  </div>
-</template>
-
-<style scoped>
-
-</style>
+<script setup lang="ts">
+
+const emit = defineEmits<{
+  (e: 'resend'): void
+  (e: 'close'): void
+}>()
+
+const timer = ref(60)
+const isResend = ref(false)
+const route = useRoute()
+const appConfig = useAppConfig()
+const landingUrl = appConfig.myLayer.landingUrl
+
+function runTimer() {
+  timer.value = 60
+  const intervalId = setInterval(() => {
+    if (timer.value <= 0) {
+      isResend.value = true
+      clearInterval(intervalId);
+      return;
+    }
+    timer.value--;
+  }, 1000);
+}
+
+onMounted(() => resend())
+
+const resend = () => {
+  isResend.value = false
+  runTimer()
+  emit('resend')
+}
+const goToMain = () => {
+  if (route.query.url) {
+    document.location.replace(route.query.url)
+  } else {
+    document.location.replace(landingUrl)
+  }
+  emit('close')
+
+}
+</script>
+
+<template>
+  <div class="flex flex-col justify-center items-center gap-5">
+    <p class="heading-02">
+      {{ $t('login.modal.title') }}
+    </p>
+    <a-ill-mail />
+    <p class="body-400 text-center">
+      {{ $t('login.modal.subtitle1') }}
+    </p>
+    <p class="body-400 text-center">
+      {{ $t('login.modal.subtitle2') }}
+    </p>
+    <p
+      v-if="!isResend"
+      class="heading-02"
+    >
+      {{ timer }} {{ $t('login.modal.seconds') }}
+    </p>
+    <a-button
+      v-else
+      class="w-full"
+      view="outline"
+      @click="resend"
+    >
+      {{ $t('login.modal.resend') }}
+    </a-button>
+    <a-button
+      class="w-full"
+      @click="goToMain"
+    >
+      {{ $t('login.modal.back') }}
+    </a-button>
+  </div>
+</template>
+
+<style scoped>
+
+</style>

package/components/modals/id/IdConfirmAccountOtpModal.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import OtpInput from '#adata-ui/components/modals/two-factor/otp-input.vue'
+import OtpInput from '#adata-ui/components/modals/id/otp-input.vue'
 import { useAuthStore } from '#adata-ui/stores/auth.store'
 
 const { $toast } = useNuxtApp()
@@ -17,6 +17,7 @@ const otp = ref(['', '', '', '', '', ''])
 const otpFormatted = computed(() => {
   return otp.value.join('')
 })
+const attempts = ref(5)
 const showError = ref(false)
 const isLoading = ref(false)
 
@@ -28,7 +29,7 @@ async function onResend() {
       headers: {
         lang: locale.value,
       },
-      body: {
+      params: {
         email: intermediateState.value.email,
       },
     })
@@ -59,6 +60,12 @@ async function onConfirm() {
     confirmSuccessfulModal.value = true
   }
   catch (error) {
+    if (error.data?.retry_after) {
+      attempts.value = 0
+    }
+    else {
+      attempts.value--
+    }
     showError.value = true
     $toast.error(error.data.message)
   }
@@ -70,12 +77,14 @@ async function onConfirm() {
 function onClose() {
   otp.value = ['', '', '', '', '', '']
   showError.value = false
+  attempts.value = 5
   confirmAccountOtpModal.value = false
 }
 
 const timer = ref(60)
 
 function runTimer() {
+  timer.value = 60
   const intervalId = setInterval(() => {
     if (!timer.value) clearInterval(intervalId)
     return timer.value--
@@ -101,7 +110,7 @@ onBeforeUnmount(() => {
 <template>
   <div class="flex flex-col items-center gap-4 text-center">
     <h2 class="text-2xl font-bold">
-      {{ t('register.modal.title') }}
+      {{ t('modals.id.confirmAccount.title') }}
     </h2>
 
     <a-icon-hand-with-phone-light class="size-32 dark:hidden" />
@@ -113,7 +122,7 @@ onBeforeUnmount(() => {
       </p>
 
       <div v-if="timer > 0" class="text-2xl font-bold">
-        {{ timer }} {{ t('register.modal.seconds') }}
+        {{ timer }} {{ t('modals.id.resetPasswordOtp.seconds') }}
       </div>
       <button
         v-else
@@ -124,7 +133,11 @@ onBeforeUnmount(() => {
       </button>
     </div>
 
-    <otp-input v-model="otp" v-model:error="showError" />
+    <otp-input
+      v-model="otp"
+      v-model:error="showError"
+      :attempts="attempts"
+    />
 
     <div class="flex w-full gap-2">
       <a-button
@@ -137,7 +150,7 @@ onBeforeUnmount(() => {
       <a-button
         block
         :loading="isLoading"
-        :disabled="otpFormatted.length < 6"
+        :disabled="otpFormatted.length < 6 || attempts === 0"
         @click="onConfirm"
       >
         {{ t('actions.confirm') }}