external triggering of SignRequest

src/lib/GoogleAuth.svelte

@@ -13,50 +13,27 @@
   const redirectUri = "http://localhost:3000/";
 
   let sessionSigs = null;
-  let error, currentPKP, authMethod, provider;
+  let currentPKP, authMethod, provider;
   let status = "Initializing...";
   let pkps: IRelayPKP[] = [];
   let view = "SIGN_IN";
-  let sessionStatuses;
-  let activeSession = null;
-
   let messageToSign = { user: "Sam", loggedIn: true };
 
   onMount(async () => {
-    // Load activeSession from local storage
+    initialize();
+
     const storedSession = localStorage.getItem("google-session");
     const storedPKP = localStorage.getItem("current-pkp");
-    if (storedSession && storedPKP) {
-      activeSession = JSON.parse(storedSession);
+    console.log("stored session: " + storedSession);
+    if (storedSession != null) {
+      sessionSigs = JSON.parse(storedSession);
       currentPKP = JSON.parse(storedPKP);
       view = "READY";
+    } else {
+      view = "SIGN_IN";
     }
-    initialize();
   });
 
-  $: if (sessionSigs) {
-    // Store sessionSigs in local storage in its original format
-    localStorage.setItem("google-session", JSON.stringify(sessionSigs));
-
-    // Update sessionStatuses
-    sessionStatuses = Object.entries(sessionSigs).map(([node, data]) => {
-      const sessionKey = JSON.parse(data.signedMessage).sessionKey;
-      const expiration = new Date(JSON.parse(data.signedMessage).expiration);
-      const isExpired = expiration < new Date();
-      return {
-        node,
-        sessionKey,
-        expiration: expiration.toISOString(),
-        isExpired,
-      };
-    });
-
-    // Find an active session
-    activeSession = sessionStatuses.find(({ isExpired }) => !isExpired);
-
-    view = "READY";
-  }
-
   async function initialize() {
     status = "Connecting to Google provider...";
     try {
@@ -69,7 +46,7 @@
         }
       }
     } catch (err) {
-      setError(err);
+      console.log(err);
     }
   }
 
@@ -82,7 +59,7 @@
       await provider.signIn();
       status = "Signing in with Google...";
     } catch (err) {
-      setError(err);
+      console.log(err);
     }
   }
 
@@ -101,7 +78,7 @@
         await createSession(pkps[0]);
       }
     } catch (err) {
-      setError(err);
+      console.log(err);
     }
   }
 
@@ -118,30 +95,19 @@
       createLitSession(provider, pkp.publicKey, authMethod).then((sigs) => {
         sessionSigs = sigs;
         // Store sessionSigs and currentPKP in localStorage
-        localStorage.setItem("google-signature", JSON.stringify(sessionSigs));
+        localStorage.setItem("google-session", JSON.stringify(sessionSigs));
         localStorage.setItem("current-pkp", JSON.stringify(currentPKP));
       });
       status = "Session created successfully.";
     } catch (err) {
-      setError(err);
+      console.log(err);
     }
   }
-
-  function setError(err) {
-    error = err;
-    view = "ERROR";
-    status = `Error: ${err.message}`;
-  }
 </script>
 
 <div class="flex items-center justify-center h-screen">
   <div>
-    {#if error}
-      <div class="mt-4 text-center">
-        <h1>Error</h1>
-        <p>{error.message}</p>
-      </div>
-    {:else if view === "SIGN_IN"}
+    {#if view === "SIGN_IN"}
       <button on:click={authWithGoogle} class="btn variant-filled">
         <span><Icon icon="flat-color-icons:google" /></span>
         <span>Sign in with Google</span>
@@ -154,26 +120,9 @@
       </div>
       Signer
       <Signer {messageToSign} />
-      Sessions
     {/if}
     <div class="mt-4 text-center">
       <p>{status}</p>
     </div>
-    <!-- {#if activeSession}
-      <div>
-        <h3>Active Session:</h3>
-        <p>Node: {activeSession.node}</p>
-        <p>Session Key: {activeSession.sessionKey}</p>
-        <p>Expiration: {activeSession.expiration}</p>
-      </div>
-      {#if sessionStatuses}
-        {#each sessionStatuses as { node, sessionKey, expiration, isExpired }}
-          <p>
-            {isExpired ? "🔴" : "🟢"} Node: {node}, Session Key: {sessionKey},
-            Expiration: {expiration}
-          </p>
-        {/each}
-      {/if}
-    {/if} -->
   </div>
 </div>

src/lib/Signer.svelte

@@ -2,6 +2,7 @@
 <script lang="ts">
   import { ethers } from "ethers";
   import { onMount } from "svelte";
+  import { signRequest } from "./stores.js";
   // import { fetchBalance, serialize } from "@wagmi/core";
 
   export let messageToSign = {};
@@ -93,6 +94,13 @@
     }
   }
 
+  signRequest.subscribe((value) => {
+    if (value) {
+      signRequest.set(false);
+      signMessageWithPKP();
+    }
+  });
+
   // async function getJWT() {
   //   var unifiedAccessControlConditions = [
   //     {

src/lib/stores.js

@@ -0,0 +1,3 @@
+import { writable } from 'svelte/store';
+
+export const signRequest = writable(false);

src/routes/+page.svelte

@@ -1,5 +1,11 @@
 <script>
   import GoogleAuth from "$lib/GoogleAuth.svelte";
+  import { signRequest } from "$lib/stores.js";
+
+  function trigger() {
+    signRequest.set(true);
+  }
 </script>
 
 <GoogleAuth />
+<button on:click={trigger}>Sign Request</button>