diff --git a/src/lib/components/GoogleAuth.svelte b/src/lib/components/GoogleAuth.svelte index 53a8c8c..726e0a6 100644 --- a/src/lib/components/GoogleAuth.svelte +++ b/src/lib/components/GoogleAuth.svelte @@ -7,171 +7,99 @@ import { createLitSession } from '$lib/services/createLitSession/createLitSession'; const redirectUri = 'http://localhost:5173/'; - let view = 'sign_in'; - let error; - let currentProviderType; - let authMethod; - let pkps = []; - let currentPKP; - let sessionSigs; - let isLoading = false; export let setupLitProvider; + let view = 'sign_in'; + let sessionSigs; + let error; + let isLoading = false; + let currentPKP; + let pkps: IRelayPKP[] = []; + let authMethod; let provider; - onMount(async () => { - provider = await setupLitProvider.setupLitProvider(); - isLoading = true; - console.log('Component mounted.'); + function logMessage(text, type = 'SYSTEM') { + console.log(text); createMessage({ - text: 'Component mounted.', + text, sender: '$lib/components/GoogleAuth.svelte', - type: 'SYSTEM' + type }); + } + onMount(async () => { try { - console.log('Checking if isSignInRedirect...'); - if (!authMethod && isSignInRedirect(redirectUri)) { - console.log('Redirect detected, handling...'); - createMessage({ - text: 'Redirect detected, handling...', - sender: '$lib/components/GoogleAuth.svelte', - type: 'SYSTEM' - }); + provider = await setupLitProvider.setupLitProvider(); + logMessage('Component mounted.'); + + if (!authMethod && isSignInRedirect(redirectUri)) { + logMessage('Redirect detected, handling...'); const providerName = getProviderFromUrl(); if (providerName) { await handleRedirect(providerName); } else { - console.error('No provider detected in the URL.'); + logMessage('No provider detected in the URL.', 'ERROR'); } } else { - console.log('No redirect detected.'); - createMessage({ - text: 'No redirect detected.', - sender: '$lib/components/GoogleAuth.svelte', - type: 'SYSTEM' - }); + logMessage('No redirect detected.'); } } catch (err) { - console.error(err); - error = err; - view = 'ERROR'; - } finally { - isLoading = false; + setError(err); } }); async function authWithGoogle() { - isLoading = true; - error = null; try { await provider.signIn(); await handleRedirect(ProviderType.Google); } catch (err) { - error = err; - view = 'ERROR'; - } finally { - isLoading = false; + setError(err); } } async function handleRedirect(providerName: string) { - isLoading = true; - createMessage({ - text: `Handling redirect for ${providerName}`, - sender: '$lib/components/GoogleAuth.svelte', - type: 'SYSTEM' - }); + logMessage(`Handling redirect for ${providerName}`); - // As we're now using the global provider, we no longer need to fetch it again based on the providerName - currentProviderType = providerName as ProviderType; + if (!provider) throw new Error('Invalid provider.'); + authMethod = await provider.authenticate(); + await tick(); - try { - console.log('Handling redirect...'); + view = 'fetching'; + pkps = await provider.fetchPKPsThroughRelayer(authMethod); + view = pkps.length > 0 ? 'fetched' : 'NO_PKPS'; - if (!provider) { - throw new Error('Invalid provider.'); - } - - // Get auth method object that has the OAuth token from redirect callback - authMethod = await provider.authenticate(); - await tick(); // Allow Svelte to update the view - - // Fetch PKPs associated with social account - view = 'fetching'; - const fetchedPkps: IRelayPKP[] = await provider.fetchPKPsThroughRelayer(authMethod); - await tick(); // Allow Svelte to update the view - - if (fetchedPkps.length > 0) { - pkps = fetchedPkps; - view = 'fetched'; - } else { - view = 'NO_PKPS'; - } - } catch (err) { - console.error(err); - error = err; - view = 'ERROR'; - } finally { - isLoading = false; - } - console.log(`Handling redirect for ${providerName}`); - console.log(`Fetched PKPs: ${pkps.length}`); - createMessage({ - text: `Fetched PKPs: ${pkps.length}`, - sender: '$lib/components/GoogleAuth.svelte', - type: 'SYSTEM' - }); + logMessage(`Fetched PKPs: ${pkps.length}`); } async function mint() { - isLoading = true; - error = null; try { view = 'MINTING'; - const newPKP: IRelayPKP = await mintPkp(provider, authMethod); // Ensure provider implements IProvider + const newPKP: IRelayPKP = await mintPkp(provider, authMethod); pkps = [...pkps, newPKP]; await createSession(newPKP); view = 'MINTED'; } catch (err) { - console.error(err); - error = err; - view = 'ERROR'; - } finally { - isLoading = false; + setError(err); } } async function createSession(pkp: IRelayPKP) { - isLoading = true; - error = null; - try { - console.log('Creating session...'); - createMessage({ - text: 'Creating session...', - sender: '$lib/components/GoogleAuth.svelte', - type: 'SYSTEM' - }); - view = 'CREATING_SESSION'; + logMessage('Creating session...'); + view = 'CREATING_SESSION'; - sessionSigs = await createLitSession(provider, pkp.publicKey, authMethod); - currentPKP = pkp; + sessionSigs = await createLitSession(provider, pkp.publicKey, authMethod); + currentPKP = pkp; - createMessage({ - text: 'Session created.', - sender: '$lib/components/GoogleAuth.svelte', - type: 'SYSTEM' - }); - view = 'SESSION_CREATED'; - } catch (err) { - console.error(err); - error = err; - view = 'ERROR'; - } finally { - isLoading = false; - } + logMessage('Session created.'); + view = 'SESSION_CREATED'; + } + + function setError(err) { + console.error(err); + error = err; + view = 'ERROR'; } function resetView() { @@ -184,14 +112,12 @@ {#if error}
{error.message}
- + {:else if isLoading}