i18n-dashboard 0.15.0 → 0.15.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "i18n-dashboard",
-  "version": "0.15.0",
+  "version": "0.15.3",
   "description": "A web dashboard to manage vue-i18n translation keys with database persistence",
   "type": "module",
   "bin": {

package/src/app.vue

@@ -6,7 +6,7 @@
       :throttle="100"
     />
     <NuxtLayout>
-      <NuxtPage :transition="{ name: 'page', mode: 'out-in' }" />
+      <NuxtPage />
     </NuxtLayout>
   </UApp>
 </template>

package/src/assets/css/main.css

@@ -1,21 +1,3 @@
 @import "tailwindcss";
 @import "@nuxt/ui";
 
-/* ── Page transitions ─────────────────────────────────────────────────────── */
-.page-enter-active {
-  transition: opacity 0.18s ease, transform 0.18s ease;
-}
-
-.page-leave-active {
-  transition: opacity 0.12s ease, transform 0.12s ease;
-}
-
-.page-enter-from {
-  opacity: 0;
-  transform: translateY(8px);
-}
-
-.page-leave-to {
-  opacity: 0;
-  transform: translateY(-4px);
-}

package/src/layouts/auth.vue

@@ -1,5 +1,31 @@
 <template>
   <div class="min-h-screen bg-gradient-to-br from-primary-50 to-primary-100 dark:from-gray-950 dark:to-gray-900 flex items-center justify-center p-4">
+    <Transition name="auth-overlay">
+      <div
+        v-if="isLoading"
+        class="fixed inset-0 z-50 flex items-center justify-center bg-white/60 dark:bg-gray-950/60 backdrop-blur-sm"
+      >
+        <UIcon
+          name="i-heroicons-arrow-path"
+          class="text-4xl text-primary-500 animate-spin"
+        />
+      </div>
+    </Transition>
     <slot />
   </div>
 </template>
+
+<script setup lang="ts">
+const { isLoading } = useLoadingIndicator()
+</script>
+
+<style scoped>
+.auth-overlay-enter-active,
+.auth-overlay-leave-active {
+  transition: opacity 0.15s ease;
+}
+.auth-overlay-enter-from,
+.auth-overlay-leave-to {
+  opacity: 0;
+}
+</style>

package/src/middleware/auth.global.ts

@@ -1,9 +1,17 @@
-export default defineNuxtRouteMiddleware(async (to) => {
+export default defineNuxtRouteMiddleware(async (to, from) => {
   // Skip on SSR — auth checks run client-side only so Cypress intercepts apply.
   // useFetch does not properly block in client-side route middleware (it resolves
   // immediately with data = null). Use $fetch which is truly awaitable.
   if (import.meta.server) return
 
+  const publicPages = ['/login', '/forgot-password', '/reset-password']
+
+  // Skip the status fetch when navigating between public pages — no auth check needed
+  // and avoids a blank-screen flash caused by out-in page transitions waiting on the fetch.
+  if (publicPages.includes(to.path) && from && publicPages.includes(from.path)) {
+    return
+  }
+
   let status: {
     isLoggedIn: boolean
     hasUsers: boolean
@@ -36,7 +44,6 @@ export default defineNuxtRouteMiddleware(async (to) => {
   }
 
   // Non connecté → login (sauf si déjà sur /login ou pages publiques)
-  const publicPages = ['/login', '/forgot-password', '/reset-password']
   if (!status.isLoggedIn) {
     if (!publicPages.includes(to.path)) return navigateTo('/login')
     return

package/src/pages/admin/logs.vue

@@ -24,17 +24,26 @@
     <UCard class="mb-6 max-w-2xl">
       <template #header>
         <div class="flex items-center gap-2">
-          <UIcon class="text-primary-500" name="i-heroicons-cog-6-tooth" />
+          <UIcon
+            class="text-primary-500"
+            name="i-heroicons-cog-6-tooth"
+          />
           <h2 class="font-semibold text-gray-900 dark:text-white">
             {{ t('logs.settings_title', 'Auto-purge settings') }}
           </h2>
         </div>
       </template>
-      <div v-if="settingsPending" class="space-y-3">
+      <div
+        v-if="settingsPending"
+        class="space-y-3"
+      >
         <USkeleton class="h-8" />
         <USkeleton class="h-8" />
       </div>
-      <div v-else class="space-y-4">
+      <div
+        v-else
+        class="space-y-4"
+      >
         <UFormField :label="t('logs.retention_days_label', 'Retain logs for (days)')">
           <UInput
             v-model="retentionDays"
@@ -96,7 +105,10 @@
       v-if="!pending && !data?.data?.length"
       class="bg-white dark:bg-gray-900 rounded-xl border border-gray-200 dark:border-gray-800 py-16 text-center"
     >
-      <UIcon name="i-heroicons-check-circle" class="text-5xl text-green-400 mb-3" />
+      <UIcon
+        name="i-heroicons-check-circle"
+        class="text-5xl text-green-400 mb-3"
+      />
       <p class="text-gray-500 font-medium">
         {{ t('logs.empty', 'No logs found') }}
       </p>
@@ -108,8 +120,15 @@
       class="bg-white dark:bg-gray-900 rounded-xl border border-gray-200 dark:border-gray-800 overflow-hidden"
     >
       <!-- Loading -->
-      <div v-if="pending" class="space-y-0">
-        <div v-for="i in 8" :key="i" class="px-4 py-3 border-b border-gray-100 dark:border-gray-800 last:border-0">
+      <div
+        v-if="pending"
+        class="space-y-0"
+      >
+        <div
+          v-for="i in 8"
+          :key="i"
+          class="px-4 py-3 border-b border-gray-100 dark:border-gray-800 last:border-0"
+        >
           <USkeleton class="h-4 w-full" />
         </div>
       </div>
@@ -138,7 +157,10 @@
               <p class="text-sm text-gray-700 dark:text-gray-300">
                 {{ log.message }}
               </p>
-              <details v-if="log.details" class="mt-1">
+              <details
+                v-if="log.details"
+                class="mt-1"
+              >
                 <summary class="text-xs text-gray-400 cursor-pointer hover:text-gray-600">
                   {{ t('logs.show_details', 'Details') }}
                 </summary>
@@ -151,7 +173,10 @@
     </div>
 
     <!-- Pagination -->
-    <div v-if="(data?.total || 0) > limit" class="flex justify-center mt-5">
+    <div
+      v-if="(data?.total || 0) > limit"
+      class="flex justify-center mt-5"
+    >
       <UPagination
         v-model:page="page"
         :total="data?.total || 0"