Fix Globe appearing when changing page?!

Apparently the globe was running too early and would not show up from a page to another
Waiting for the page transition is helping
Thanks Baptiste!

src/components/organisms/InteractiveGlobe.svelte

@@ -3,7 +3,7 @@
 </style>
 
 <script lang="ts">
-    import { onMount, onDestroy, getContext } from 'svelte'
+    import { onMount, getContext } from 'svelte'
     import { getPosition, getRandomItem } from '$utils/functions'
 
     export let type: string = undefined
@@ -11,6 +11,7 @@
     export let scrollSmooth: number = 0.5
     export let opacity: number = 1
 
+    let InteractiveGlobe: any
     let globeEl: HTMLElement
     let observer: IntersectionObserver
     let globe: any
@@ -54,15 +55,16 @@
 
     // On resize
     const handleResize = () => {
-        if (globeEl) {
+        if (globeEl && globe) {
             containerTop = getPosition(globeEl).top
             containerHeight = globeEl.clientHeight
+
+            requestAnimationFrame(() => {
+                globe.resize()
+                globe.update()
+                handleScroll()
+            })
         }
-        if (globe) {
-            globe.resize()
-            globe.update()
-        }
-        handleScroll()
     }
 
 
@@ -88,17 +90,23 @@
 
         // Run the globe
         update()
-        handleResize()
+        setTimeout(() => {
+            handleResize()
+            handleScroll()
+        }, 1000)
+
 
         // Enable/Disable the globe when shown/hidden
+        const globeCanvas = document.querySelector('.globe-canvas')
+
         observer = new IntersectionObserver(entries => {
             entries.forEach(({ isIntersecting }: IntersectionObserverEntry) => {
                 if (isIntersecting) {
                     globe.enable()
-                    console.log('globe: IO enable')
+                    globeCanvas.classList.remove('is-hidden')
                 } else {
                     globe.disable()
-                    console.log('globe: IO disable')
+                    globeCanvas.classList.add('is-hidden')
                 }
             })
         }, {
@@ -106,14 +114,12 @@
             rootMargin: '0px 0px 0px'
         })
         observer.observe(globeEl)
-    })
 
 
-    /*
-    ** Destroy when unmounted
-    */
-    onDestroy(() => {
-        globe && globe.destroy()
+        // Destroy
+        return () => {
+            globe && globe.destroy()
+        }
     })
 </script>