With a loading

src/views/main/Creator.vue

@@ -1,15 +1,9 @@
 <template>
   <div v-if="user && user.id">
-    <CreatorBanner
+    <CreatorBanner :user="user"></CreatorBanner>
-        :user="user"
-    ></CreatorBanner>
-    <div>
       
     <div class="flex flex-column w-max-[100] ">
   
-    </div>
-  
-  
   <!--    <div class="w-full border-b-2 p-6">-->
   <!--      <PostMessage content-id="00000001-0000-0000-0000-000000000001"></PostMessage>-->
   <!--    </div>-->
@@ -38,11 +32,16 @@
 
   <!-- Fallback when user try to access a non-existing creator -->
   <div v-else>
-    <v-card>
+    <div v-if="loading">
-      <v-card-text style="text-align: center;">
+      <v-progress-linear indeterminate></v-progress-linear>
-        Aucun créateur au nom de {{ route.params.creator }}
+    </div>
-      </v-card-text>
+    <div v-else>
-    </v-card>
+      <v-card>
+        <v-card-text style="text-align: center;">
+          Aucun créateur au nom de {{ route.params.creator }}
+        </v-card-text>
+      </v-card>
+    </div>
   </div>
 </template>
 
@@ -63,10 +62,14 @@ const client = useClient();
 const route = useRoute();
 
 const user = ref(null);
+const loading = ref(true);
 
 onBeforeMount(async() => {
   const response = await client.get(`/api/Users?UserName=${route.params.creator}`)
   user.value = response.data
+  setTimeout(() => {
+    loading.value = false;
+  }, 1500);
 })
 
 </script>