From 44d668d7afd15362cc1b7c5036308ea38f804388 Mon Sep 17 00:00:00 2001
From: Samuel Andert <samuel@ora.earth>
Date: Tue, 25 Jul 2023 09:34:31 +0200
Subject: [PATCH] Refactoring Provider setup of Google Auth

---
 src/lib/components/Composite.svelte     |  2 --
 src/lib/components/GoogleAuth.svelte    | 30 ++++---------------------
 src/lib/components/Wallet/Wallet.svelte |  3 +--
 src/lib/services/litProviderSetup.ts    | 30 +++++++++++++++++++++++++
 src/lib/services/provider/provider.ts   |  2 +-
 src/lib/services/providerUtils.ts       |  5 -----
 src/routes/+page.svelte                 | 14 ++++++++----
 7 files changed, 46 insertions(+), 40 deletions(-)
 create mode 100644 src/lib/services/litProviderSetup.ts
 delete mode 100644 src/lib/services/providerUtils.ts

diff --git a/src/lib/components/Composite.svelte b/src/lib/components/Composite.svelte
index b2a6f03..773bde4 100644
--- a/src/lib/components/Composite.svelte
+++ b/src/lib/components/Composite.svelte
@@ -67,8 +67,6 @@
 	}
 </script>
 
-<!-- Rest of the component markup remains unchanged -->
-
 <div class="grid w-full h-full" style="display: grid; {componentsData.layout || ''}">
 	{#each componentsData.children as component (component.id)}
 		{#await getComponent(component.componentName) then Component}
diff --git a/src/lib/components/GoogleAuth.svelte b/src/lib/components/GoogleAuth.svelte
index e695583..a34459e 100644
--- a/src/lib/components/GoogleAuth.svelte
+++ b/src/lib/components/GoogleAuth.svelte
@@ -1,23 +1,15 @@
 <script lang="ts">
 	import { onMount, tick } from 'svelte';
-	import {
-		LitAuthClient,
-		BaseProvider,
-		GoogleProvider,
-		isSignInRedirect,
-		getProviderFromUrl
-	} from '@lit-protocol/lit-auth-client';
-	import { LitNodeClient } from '@lit-protocol/lit-node-client';
+	import { isSignInRedirect, getProviderFromUrl } from '@lit-protocol/lit-auth-client';
 	import { IRelayPKP } from '@lit-protocol/types';
 	import { ProviderType } from '@lit-protocol/constants';
 	import { LitAccessControlConditionResource, LitAbility } from '@lit-protocol/auth-helpers';
 	import { createMessage } from '$lib/services/messages';
+	import { setupLitProvider } from '$lib/services/litProviderSetup.ts';
 
 	const redirectUri = 'http://localhost:5173/';
 	let view = 'sign_in';
 	let error;
-	let litAuthClient;
-	let litNodeClient;
 	let currentProviderType;
 	let authMethod;
 	let pkps = [];
@@ -25,7 +17,7 @@
 	let sessionSigs;
 	let isLoading = false;
 
-	let provider: BaseProvider | undefined;
+	let provider;
 
 	onMount(async () => {
 		isLoading = true;
@@ -37,21 +29,8 @@
 		});
 
 		try {
-			litNodeClient = new LitNodeClient({
-				litNetwork: 'serrano',
-				debug: false
-			});
-			await litNodeClient.connect();
-
-			litAuthClient = new LitAuthClient({
-				litRelayConfig: {
-					relayApiKey: 'test-api-key'
-				},
-				litNodeClient
-			});
-
 			// Globally set the provider during the component's mount
-			provider = litAuthClient.initProvider<GoogleProvider>(ProviderType.Google);
+			provider = await setupLitProvider();
 
 			console.log('Checking if isSignInRedirect...');
 			if (!authMethod && isSignInRedirect(redirectUri)) {
@@ -204,7 +183,6 @@
 			view = 'CREATING_SESSION';
 
 			const litResource = new LitAccessControlConditionResource('*');
-			const provider = litAuthClient.getProvider(currentProviderType);
 			sessionSigs = await provider.getSessionSigs({
 				pkpPublicKey: pkp.publicKey,
 				authMethod,
diff --git a/src/lib/components/Wallet/Wallet.svelte b/src/lib/components/Wallet/Wallet.svelte
index 60b03cb..e477e43 100644
--- a/src/lib/components/Wallet/Wallet.svelte
+++ b/src/lib/components/Wallet/Wallet.svelte
@@ -1,14 +1,13 @@
 <script>
 	import { onMount } from 'svelte';
 	import { connectWallet } from '$lib/services/wallet/wallet';
-
 	import { getComponentStore } from '$lib/stores/componentStores.ts';
 
 	// please abstract this.
 	export let id;
 	const store = getComponentStore(id);
 
-	let pkpWallet = null;
+	export let pkpWallet = null;
 
 	onMount(async () => {
 		pkpWallet = await connectWallet($store.pkpPubKey, $store.rpcURL);
diff --git a/src/lib/services/litProviderSetup.ts b/src/lib/services/litProviderSetup.ts
new file mode 100644
index 0000000..5b8e537
--- /dev/null
+++ b/src/lib/services/litProviderSetup.ts
@@ -0,0 +1,30 @@
+// litProviderSetup.ts
+
+import {
+    LitAuthClient,
+    GoogleProvider,
+    BaseProvider,
+} from '@lit-protocol/lit-auth-client';
+import { ProviderType } from '@lit-protocol/constants';
+import { LitNodeClient } from '@lit-protocol/lit-node-client';
+
+let provider: BaseProvider | undefined;
+
+export async function setupLitProvider() {
+    const litNodeClient = new LitNodeClient({
+        litNetwork: 'serrano',
+        debug: false
+    });
+    await litNodeClient.connect();
+
+    const litAuthClient = new LitAuthClient({
+        litRelayConfig: {
+            relayApiKey: 'test-api-key'
+        },
+        litNodeClient
+    });
+
+    provider = litAuthClient.initProvider<GoogleProvider>(ProviderType.Google);
+
+    return provider;
+}
diff --git a/src/lib/services/provider/provider.ts b/src/lib/services/provider/provider.ts
index 9cbf09a..a82526f 100644
--- a/src/lib/services/provider/provider.ts
+++ b/src/lib/services/provider/provider.ts
@@ -81,7 +81,7 @@ export function initProvider(data: ProviderData) {
 	});
 
 	createMessage({
-		text: 'Provider configuration created and autoConnect enabled...',
+		text: 'Chain Provider configuration created and autoConnect enabled...',
 		sender: '$lib/services/provider.ts',
 		type: 'SYSTEM'
 	});
diff --git a/src/lib/services/providerUtils.ts b/src/lib/services/providerUtils.ts
deleted file mode 100644
index e22e0f2..0000000
--- a/src/lib/services/providerUtils.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { LitAuthClient, BaseProvider, GoogleProvider, ProviderType } from '@lit-protocol/lit-auth-client';
-
-export function initializeProvider(litAuthClient: typeof LitAuthClient): BaseProvider {
-    return litAuthClient.initProvider<GoogleProvider>(ProviderType.Google);
-}
\ No newline at end of file
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 86e19f7..71a8073 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -4,15 +4,16 @@
 	let componentsData = {
 		layout: `
 			grid-template-areas: 
+			"auth",
 				"login",
 				"play"
-			grid-template-rows: 1fr 1fr;
+			grid-template-rows: auto 1fr 1fr;
 		`,
 		children: [
 			{
-				id: 'login1',
-				componentName: 'GoogleAuth',
-				slot: 'login'
+				id: 'authsig',
+				componentName: 'AuthSig',
+				slot: 'auth'
 			},
 			{
 				id: 'wallet1',
@@ -23,6 +24,11 @@
 					pkpPubKey:
 						'046da3ba67065fd1e2726242ca01cd4601524893f4aa4b0042578fa6cbec28fa8c9a28eb9f7893932fc09717edc9e1db57e157a21eed346247c1db5a722a01f571'
 				}
+			},
+			{
+				id: 'login1',
+				componentName: 'GoogleAuth',
+				slot: 'login'
 			}
 		]
 	};