With a loading

src/views/main/Creator.vue

@@ -1,14 +1,8 @@
 <template>
   <div v-if="user && user.id">
-    <CreatorBanner
-        :user="user"
-    ></CreatorBanner>
-    <div>
+    <CreatorBanner :user="user"></CreatorBanner>
       
     <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>-->
@@ -37,12 +31,17 @@
   </div>
 
   <!-- Fallback when user try to access a non-existing creator -->
-  <div v-else> 
-    <v-card>
-      <v-card-text style="text-align: center;">
-        Aucun créateur au nom de {{ route.params.creator }}
-      </v-card-text>
-    </v-card>
+  <div v-else>
+    <div v-if="loading">
+      <v-progress-linear indeterminate></v-progress-linear>
+    </div>
+    <div v-else>
+      <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>