From 13b32b51044be959ce2902ab7e098dfcd4fba95b Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Fri, 18 Apr 2025 13:13:13 +0330
Subject: [PATCH] Fix loading overlay bug

---
 frontend/components/global/LoadingOverlay.vue | 45 +++++++++++--------
 1 file changed, 27 insertions(+), 18 deletions(-)

diff --git a/frontend/components/global/LoadingOverlay.vue b/frontend/components/global/LoadingOverlay.vue
index 0421860..6000a58 100644
--- a/frontend/components/global/LoadingOverlay.vue
+++ b/frontend/components/global/LoadingOverlay.vue
@@ -7,6 +7,16 @@ const isSiteLoadingDisabled = useCookie("is-site-loading-disabled", {
     default: () => false,
 });
 
+watch(
+    isSiteLoadingDisabled,
+    (nv) => {
+        console.log(nv);
+    },
+    {
+        immediate: true,
+    }
+);
+
 const shouldRenderLoadingOverlay = ref(true);
 const isAssetLoaded = ref(false);
 const criticalLoad = ref(true);
@@ -27,8 +37,8 @@ const progressStyle = computed(() => {
 // methods
 
 const onAssetLoaded = () => {
-    criticalLoad.value = false;
     clearInterval(progressInterval.value!);
+    criticalLoad.value = false;
     assetLoadingProgress.value = 100;
     isAssetLoaded.value = true;
 };
@@ -55,30 +65,29 @@ watch([assetLoadingProgress, criticalLoad], ([assetLoadingProgress, criticalLoad
 // lifecycle
 
 onMounted(() => {
-    isWindowScrollLocked.value = true;
-
     if (!isSiteLoadingDisabled.value) {
+        isWindowScrollLocked.value = true;
+
+        const heymlzLoadingAnimation = document.querySelector("#heymlz-loading-animation") as HTMLVideoElement;
+
+        if (heymlzLoadingAnimation?.readyState >= HTMLMediaElement.HAVE_ENOUGH_DATA) {
+            onAssetLoaded();
+        }
+
+        progressInterval.value = setInterval(() => {
+            assetLoadingProgress.value += Math.random() * 10;
+        }, 250);
+
+        gsap.to("#loading-overlay", {
+            opacity: 1,
+        });
     }
-
-    const heymlzLoadingAnimation = document.querySelector("#heymlz-loading-animation") as HTMLVideoElement;
-
-    if (heymlzLoadingAnimation?.readyState >= HTMLMediaElement.HAVE_ENOUGH_DATA) {
-        onAssetLoaded();
-    }
-
-    progressInterval.value = setInterval(() => {
-        assetLoadingProgress.value += Math.random() * 10;
-    }, 250);
-
-    gsap.to("#loading-overlay", {
-        opacity: 1,
-    });
 });
 </script>
 
 <template>
     <div
-        v-if="shouldRenderLoadingOverlay"
+        v-if="shouldRenderLoadingOverlay && !isSiteLoadingDisabled"
         id="loading-overlay"
         class="fixed inset-0 size-full z-9999 flex-center bg-black"
     >