chore: wip

resources/layouts/dashboard/default.vue

@@ -7,9 +7,19 @@
     <div class="lg:pl-64">
       <Navbar />
 
-      <main class="bg-blue-gray-50 dark:bg-blue-gray-900">
-        <RouterView />
-      </main>
+      <router-view v-slot="{ Component }">
+        <main v-if="Component" class="bg-blue-gray-50 dark:bg-blue-gray-900">
+          <Transition mode="out-in">
+            <Suspense timeout="0">
+              <Component :is="Component" />
+              <template #fallback>
+                Loading...
+              </template>
+            </Suspense>
+          </Transition>
+        </main>
+      </router-view>
+      <!-- <RouterView /> -->
 
       <Toast />
     </div>
@@ -20,4 +30,14 @@
 body {
   @apply dark:bg-blue-gray-900 bg-blue-gray-50;
 }
+
+.v-enter-active,
+.v-leave-active {
+  transition: opacity 0.1s ease-in-out;
+}
+
+.v-enter-from,
+.v-leave-to {
+  opacity: 0;
+}
 </style>