testing out dynamic import of firebase inside LoginCard.svelte ...but for now the onMount logic effectively does the same as importing at the top of the component

Author: brightowltutoring

.svelte-kit/ambient.d.ts

@@ -123,7 +123,6 @@ declare module '$env/static/private' {
 	export const npm_node_execpath: string;
 	export const npm_config_prefix: string;
 	export const COLORTERM: string;
-	export const NODE_ENV: string;
 }
 
 /**
@@ -257,7 +256,6 @@ declare module '$env/dynamic/private' {
 		npm_node_execpath: string;
 		npm_config_prefix: string;
 		COLORTERM: string;
-		NODE_ENV: string;
 		[key: `PUBLIC_${string}`]: undefined;
 		[key: string]: string | undefined;
 	}

src/.DS_Store

@@ -7,6 +7,7 @@
 
   // TODO: commented out on dec12, 2022  due to dynamicimporting
   // import { app, auth } from "$lib/firebase";
+  // import { auth } from "$lib/firebase";
   // import { onAuthStateChanged, isSignInWithEmailLink } from "firebase/auth";
 
   import { onMount } from "svelte";
@@ -50,8 +51,10 @@
   async function onMountFirebase() {
     // TODO:dynamic importing added on dec12,2022
     const { auth } = await import("$lib/firebase");
-    const { onAuthStateChanged } = await import("firebase/auth");
-    const { isSignInWithEmailLink } = await import("firebase/auth");
+    const { onAuthStateChanged, isSignInWithEmailLink } = await import(
+      "firebase/auth"
+    );
+
     // Confirm the link is a sign-in with email link.
 
     if (isSignInWithEmailLink(auth, window.location.href)) {
@@ -96,14 +99,24 @@
     });
     // }
   }
+  // globalThis.loginFirstClickHappened = false;
+  // $: if ($showLoginModal == true && !globalThis.loginFirstClickHappened) {
+  //   onMountFirebase();
+  //   globalThis.loginFirstClickHappened = true;
+  // }
+
+  // TODO: placing 'onMountFirebase()' inside an onclick .. requires to click twice...???
 
   onMount(() => {
-    document.querySelector('a[href="/login"]').addEventListener("click", () => {
-      if (!globalThis.loginFirstClickHappened) {
-        onMountFirebase();
-        globalThis.loginFirstClickHappened = true;
-      }
-    });
+    onMountFirebase();
+    // document
+    //   .querySelector('a[href="/login"]')
+    //   .addEventListener("dblclick", () => {
+    //     if (!globalThis.loginFirstClickHappened) {
+    //       onMountFirebase();
+    //       globalThis.loginFirstClickHappened = true;
+    //     }
+    //   });
   });
 
   //  Hoisted Functions

src/lib/Login/LoginCard.svelte

@@ -11,7 +11,9 @@
     ? `${bgTint} `
     : 'hidden'} overflow-y-scroll overflow-x-clip"
 >
+  <!-- {#if showModal} -->
   <slot />
+  <!-- {/if} -->
 </button>
 
 <!-- switched from 'hidden' to opacity-0... otherwise tailwind animations aren't working on this