From 766ec716f9a7d9d102add4eb1452349815fec207 Mon Sep 17 00:00:00 2001
From: Blossomi Shymae <87099578+BlossomiShymae@users.noreply.github.com>
Date: Sat, 12 Oct 2024 22:05:49 -0500
Subject: [PATCH] Attempt to fix LDRS on live

---
 components/LLazyImg.vue | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/components/LLazyImg.vue b/components/LLazyImg.vue
index 9683da6..6a15290 100644
--- a/components/LLazyImg.vue
+++ b/components/LLazyImg.vue
@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import 'ldrs/dotStream';
-
 const props = defineProps<{
   src: string | undefined,
   imgClass?: string
@@ -8,10 +6,15 @@ const props = defineProps<{
 
 const source = ref(props.src);
 const loading = ref(true);
+
+onMounted(async () => {
+  const { dotStream } = await import('ldrs');
+  dotStream.register();
+});
 </script>
 
 <template>
-  <div class="d-flex justify-content-center align-items-center"> 
+  <ClientOnly class="d-flex justify-content-center align-items-center"> 
     <l-dot-stream v-if="loading"
       class="w-100 h-100"
       size="60"
@@ -23,5 +26,5 @@ const loading = ref(true);
       loading="lazy" 
       v-on:load="loading = false;" 
       v-on:error="loading = false; source = '/clean-cuts/img/error.png';" />
-  </div>
+  </ClientOnly>
 </template>
\ No newline at end of file