From 879f7aad3f20c67deac111c8393941d899f620c6 Mon Sep 17 00:00:00 2001 From: Samuel Andert Date: Thu, 31 Aug 2023 19:08:35 +0200 Subject: [PATCH] Work in progress refactor --- src/app.d.ts | 17 +++++- src/hooks.server.ts | 5 ++ src/lib/GooglePKP.svelte | 110 +++++------------------------------- src/lib/GoogleSigner.svelte | 85 ++++++++++++++++++++++++++++ src/lib/Test.svelte | 103 +++++++++++++++++++++++++++++++++ src/lib/stores.js | 6 +- src/routes/+layout.svelte | 12 ++++ src/routes/+layout.ts | 1 - src/routes/+page.server.ts | 10 ++++ src/routes/+page.svelte | 23 +++----- 10 files changed, 255 insertions(+), 117 deletions(-) create mode 100644 src/hooks.server.ts create mode 100644 src/lib/GoogleSigner.svelte create mode 100644 src/lib/Test.svelte create mode 100644 src/routes/+page.server.ts diff --git a/src/app.d.ts b/src/app.d.ts index f59b884..78b0dda 100644 --- a/src/app.d.ts +++ b/src/app.d.ts @@ -1,12 +1,23 @@ +import type { Session } from 'svelte-kit-cookie-session'; + +type SessionData = { + views: number; +}; + // See https://kit.svelte.dev/docs/types#app // for information about these interfaces declare global { namespace App { // interface Error {} - // interface Locals {} - // interface PageData {} + interface Locals { + session: Session; + } + interface PageData { + // can add any properties here, return it from your root layout + session: SessionData; + } // interface Platform {} } } -export {}; +export { }; \ No newline at end of file diff --git a/src/hooks.server.ts b/src/hooks.server.ts new file mode 100644 index 0000000..6aa2d87 --- /dev/null +++ b/src/hooks.server.ts @@ -0,0 +1,5 @@ +import { handleSession } from 'svelte-kit-cookie-session'; + +export const handle = handleSession({ + secret: 'SOME_COMPLEX_SECRET_32_CHARSLONG' +}); diff --git a/src/lib/GooglePKP.svelte b/src/lib/GooglePKP.svelte index c1ffd85..68802b5 100644 --- a/src/lib/GooglePKP.svelte +++ b/src/lib/GooglePKP.svelte @@ -8,55 +8,18 @@ import Icon from "@iconify/svelte"; import { createLitSession } from "./createLitSession"; import { connectProvider } from "./setupLit"; + import { googleSession } from "./stores"; const redirectUri = "http://localhost:3000/"; let authMethod, provider; let status = "Initializing..."; let pkps: IRelayPKP[] = []; - let view = "SIGN_IN"; - let myPKP; onMount(async () => { initialize(); - myPKP = JSON.parse(localStorage.getItem("myPKP")); - if (myPKP.active) { - view = "READY"; - } }); - $: { - if (myPKP) { - if (myPKP.sessionSigs) { - myPKP.parsedSigs = parseSessionSigs(myPKP.sessionSigs); - console.log("test: " + JSON.stringify(myPKP.parsedSigs)); - myPKP.active = myPKP.parsedSigs.some((sig) => !sig.isExpired); - if (!myPKP.active) { - view = "SIGN_IN"; - } else if (myPKP.active) { - view = "READY"; - } - } else { - myPKP.active = false; - view = "SIGN_IN"; - } - localStorage.setItem("myPKP", JSON.stringify(myPKP)); - } - } - function parseSessionSigs(jsonData) { - let sessionList = Object.values(jsonData).map((session) => { - let sessionData = JSON.parse(session.signedMessage); - let expirationDate = new Date(sessionData.expiration); - let isExpired = expirationDate < new Date(); - return { - sig: session.sig, - expiration: expirationDate, - isExpired: isExpired, - }; - }); - return sessionList; - } - async function initialize() { status = "Connecting to Google provider..."; try { @@ -75,7 +38,6 @@ async function authWithGoogle() { try { - view = ""; if (!provider) { provider = await connectProvider(); status = "Reconnected to Google provider."; @@ -89,7 +51,6 @@ async function handleRedirect(providerName: string) { try { - view = ""; if (!provider) throw new Error("Invalid provider."); authMethod = await provider.authenticate(); status = "Authenticated successfully."; @@ -108,7 +69,6 @@ } async function mint() { - view = ""; const newPKP: IRelayPKP = await mintPkp(provider, authMethod); pkps = [...pkps, newPKP]; status = "New PKP minted."; @@ -117,7 +77,6 @@ async function createSession(pkp: IRelayPKP) { try { - view = ""; const currentPKP = pkp; // Assign the selected PKP to currentPKP const sessionSigs = await createLitSession( provider, @@ -131,70 +90,29 @@ provider: "google", pkp: currentPKP, sessionSigs: sessionSigs, - active: true, }) ); - myPKP = JSON.parse(localStorage.getItem("myPKP")); + status = "Session created successfully."; - view = "READY"; } catch (err) { console.log(err); } } - function clearSession() { - localStorage.removeItem("myPKP"); - myPKP = null; - view = "SIGN_IN"; - }
- {#if view === "SIGN_IN"} -
- -
- {/if} - {#if view != "READY"} -
-
-

{status}

-
-
- {/if} - {#if view === "READY"} -
+ -
+ + Sign in with Google + +
+
+
+

{status}

- {/if} +
diff --git a/src/lib/GoogleSigner.svelte b/src/lib/GoogleSigner.svelte new file mode 100644 index 0000000..02d319a --- /dev/null +++ b/src/lib/GoogleSigner.svelte @@ -0,0 +1,85 @@ + + +{#if myPKP} +
+
+
+ +
+

+ Address: + {myPKP.pkp.ethAddress} +

+

+ Provider: + {myPKP.provider} +

+
+
+ +
+
+{/if} diff --git a/src/lib/Test.svelte b/src/lib/Test.svelte new file mode 100644 index 0000000..8412b0f --- /dev/null +++ b/src/lib/Test.svelte @@ -0,0 +1,103 @@ + + +
+ +
diff --git a/src/lib/stores.js b/src/lib/stores.js index bcd880a..fcecd40 100644 --- a/src/lib/stores.js +++ b/src/lib/stores.js @@ -2,4 +2,8 @@ import { writable } from 'svelte/store'; export const signRequest = writable({json: {}}); -export const signedMessages = writable([]) \ No newline at end of file +export const signedMessages = writable([]) + +export const googleSession = writable({ + activeSession: false + }); \ No newline at end of file diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 3bbde7f..d1c5403 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -6,11 +6,20 @@ import Cookies from "js-cookie"; import { onMount } from "svelte"; import { initChainProvider } from "$lib/setupChainProvider"; + import { googleSession } from "$lib/stores.js"; + import GoogleSigner from "$lib/GoogleSigner.svelte"; + import GooglePKP from "$lib/GooglePKP.svelte"; + + let activeSession = true; export let data: LayoutData; const token = Cookies.get("token"); + googleSession.subscribe((value) => { + activeSession = value.activeSession; + }); + onMount(() => { initChainProvider(); }); @@ -25,6 +34,9 @@ style="background-image: url('lake.jpeg');" > +
{activeSession}
+ {#if activeSession}active {:else} {/if} + diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts index 11fd681..7dff367 100644 --- a/src/routes/+layout.ts +++ b/src/routes/+layout.ts @@ -10,6 +10,5 @@ export const load: LayoutLoad = async () => { }, }, }); - return { queryClient }; }; diff --git a/src/routes/+page.server.ts b/src/routes/+page.server.ts new file mode 100644 index 0000000..84c800c --- /dev/null +++ b/src/routes/+page.server.ts @@ -0,0 +1,10 @@ +import type { ServerLoad } from '@sveltejs/kit'; + +export const load: ServerLoad = async ({ locals }) => { + await locals.session.set({ myPKP: "hello1" }); + + return { + myPKP: locals.session.data.myPKP + }; +}; + diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index f375547..dab442b 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,23 +1,14 @@ - - - + - +