From df5fdb476b634d0be9ac8d93bf5da21e9dd8c6f3 Mon Sep 17 00:00:00 2001
From: MiniDigger | Martin <admin@benndorf.dev>
Date: Sun, 18 Aug 2024 17:15:48 +0200
Subject: [PATCH] chore: make skeleton delay optional

---
 frontend/src/components/Skeleton.vue                   | 6 ++++--
 frontend/src/pages/[user]/[project]/versions/index.vue | 4 ++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/Skeleton.vue b/frontend/src/components/Skeleton.vue
index 2b0de454c..c6703dc4e 100644
--- a/frontend/src/components/Skeleton.vue
+++ b/frontend/src/components/Skeleton.vue
@@ -1,15 +1,17 @@
 <script lang="ts" setup>
-withDefaults(
+const props = withDefaults(
   defineProps<{
     animated?: boolean;
+    delay?: boolean;
   }>(),
   {
     animated: true,
+    delay: false,
   }
 );
 
 const show = ref(false);
-if (import.meta.client) {
+if (import.meta.client && props.delay) {
   onMounted(() => {
     setTimeout(() => {
       show.value = true;
diff --git a/frontend/src/pages/[user]/[project]/versions/index.vue b/frontend/src/pages/[user]/[project]/versions/index.vue
index 94d66ffab..33cd79726 100644
--- a/frontend/src/pages/[user]/[project]/versions/index.vue
+++ b/frontend/src/pages/[user]/[project]/versions/index.vue
@@ -93,8 +93,8 @@ function getVisibilityTitle(visibility: Visibility) {
     <section class="basis-full md:basis-11/15 flex-grow">
       <ul>
         <template v-if="versionsStatus === 'loading'">
-          <Skeleton class="mb-2 h-[90px]" />
-          <Skeleton class="mb-2 h-[90px]" />
+          <Skeleton class="mb-2 h-[90px]" delay />
+          <Skeleton class="mb-2 h-[90px]" delay />
         </template>
         <Alert v-else-if="!versions?.result?.length" type="info"> {{ i18n.t("version.page.noVersions") }} </Alert>
         <Pagination