@fivenorth/loop-sdk 0.1.3 → 0.3.0

package/README.md

@@ -146,7 +146,7 @@ try {
 
 # API
 
-
+Coming soon
 
 # Development Guide
 
@@ -158,12 +158,14 @@ To install dependencies:
 bun install
 ```
 
-To run:
+To run the dev server, that is also auto re-compile the sdk:
 
 ```bash
-bun run index.ts
+bun start
 ```
 
+Upon doing so you can visit http://localhost:3030/ to see the local demo app, serve in `demo/test.html` and SDK is auto compile so you can actively working and trying out the SDK.
+
 # Publish the package to NPM
 
 

package/dist/index.js

@@ -2213,16 +2213,18 @@ class Provider {
   connection;
   party_id;
   public_key;
+  email;
   auth_token;
   requests = new Map;
   requestTimeout = 30000;
-  constructor({ connection, party_id, public_key, auth_token, requestTimeout }) {
+  constructor({ connection, party_id, public_key, auth_token, email, requestTimeout }) {
     if (!connection) {
       throw new Error("Provider requires a connection object.");
     }
     this.connection = connection;
     this.party_id = party_id;
     this.public_key = public_key;
+    this.email = email;
     this.auth_token = auth_token;
     this.requestTimeout = requestTimeout || 30000;
   }
@@ -2286,15 +2288,18 @@ class LoopSDK {
   appName = "Unknown";
   connection = null;
   provider = null;
+  openMode = "popup";
+  popupWindow = null;
   onAccept = null;
   onReject = null;
   overlay = null;
   ticketId = null;
   constructor() {}
-  init({ appName, network, walletUrl, apiUrl, onAccept, onReject }) {
+  init({ appName, network, walletUrl, apiUrl, onAccept, onReject, openMode }) {
     this.appName = appName;
     this.onAccept = onAccept || null;
     this.onReject = onReject || null;
+    this.openMode = openMode ?? "popup";
     this.connection = new Connection({ network, walletUrl, apiUrl });
   }
   async connect() {
@@ -2308,23 +2313,30 @@ class LoopSDK {
     const existingConnectionRaw = localStorage.getItem("loop_connect");
     if (existingConnectionRaw) {
       try {
-        const { ticketId, authToken, partyId, publicKey } = JSON.parse(existingConnectionRaw);
+        let canReuseTicket = true;
+        const { ticketId, authToken, partyId, publicKey, email } = JSON.parse(existingConnectionRaw);
         if (authToken && partyId && publicKey) {
           try {
             const verifiedAccount = await this.connection.verifySession(authToken);
             if (verifiedAccount.party_id === partyId) {
-              this.provider = new Provider({ connection: this.connection, party_id: partyId, auth_token: authToken, public_key: publicKey });
+              this.provider = new Provider({ connection: this.connection, party_id: partyId, auth_token: authToken, public_key: publicKey, email });
               this.onAccept?.(this.provider);
               if (ticketId) {
                 this.connection.connectWebSocket(ticketId, this.handleWebSocketMessage.bind(this));
               }
               return;
+            } else {
+              console.warn("[LoopSDK] Sttored partyId does not march verified account. Clearing cached session.");
+              canReuseTicket = false;
+              localStorage.removeItem("loop_connect");
             }
           } catch (err) {
             console.error("Auto-login failed, token is invalid. Starting new connection.", err);
+            canReuseTicket = false;
+            localStorage.removeItem("loop_connect");
           }
         }
-        if (ticketId) {
+        if (ticketId && canReuseTicket) {
           this.ticketId = ticketId;
           const connectUrl = `${this.connection.walletUrl}/.connect/?ticketId=${ticketId}`;
           this.showQrCode(connectUrl);
@@ -2351,10 +2363,12 @@ class LoopSDK {
   }
   handleWebSocketMessage(event) {
     const message = JSON.parse(event.data);
+    console.log("[LoopSDK] WS message received:", message);
     if (message.type === "handshake_accept" /* HANDSHAKE_ACCEPT */) {
-      const { authToken, partyId, publicKey } = message.payload || {};
+      console.log("[LoopSDK] Entering HANDSHAKE_ACCEPT flow");
+      const { authToken, partyId, publicKey, email } = message.payload || {};
       if (authToken && partyId && publicKey) {
-        this.provider = new Provider({ connection: this.connection, party_id: partyId, auth_token: authToken, public_key: publicKey });
+        this.provider = new Provider({ connection: this.connection, party_id: partyId, auth_token: authToken, public_key: publicKey, email });
         const connectionInfoRaw = localStorage.getItem("loop_connect");
         if (connectionInfoRaw) {
           try {
@@ -2362,24 +2376,59 @@ class LoopSDK {
             connectionInfo.authToken = authToken;
             connectionInfo.partyId = partyId;
             connectionInfo.publicKey = publicKey;
+            connectionInfo.email = email;
             localStorage.setItem("loop_connect", JSON.stringify(connectionInfo));
             this.onAccept?.(this.provider);
             this.hideQrCode();
             this.connection?.connectWebSocket(connectionInfo.ticketId, this.handleWebSocketMessage.bind(this));
+            console.log("[LoopSDK] HANDSHAKE_ACCEPT: closing popup (if exists)");
+            if (this.popupWindow && !this.popupWindow.closed) {
+              this.popupWindow.close();
+            }
+            this.popupWindow = null;
           } catch (error) {
             console.error("Failed to update local storage with auth token.", error);
           }
         }
       }
     } else if (message.type === "handshake_reject" /* HANDSHAKE_REJECT */) {
+      console.log("[LoopSDK] Entering HANDSHAKE_REJECT flow");
       localStorage.removeItem("loop_connect");
       this.connection?.ws?.close();
       this.onReject?.();
       this.hideQrCode();
+      console.log("[LoopSDK] HANDSHAKE_REJECT: closing popup (if exists)");
+      if (this.popupWindow && !this.popupWindow.closed) {
+        this.popupWindow.close();
+      }
+      this.popupWindow = null;
     } else if (this.provider) {
       this.provider.handleResponse(message);
     }
   }
+  openWallet(url) {
+    if (typeof window === "undefined") {
+      return;
+    }
+    if (this.openMode === "popup") {
+      const width = 480;
+      const height = 720;
+      const left = (window.innerWidth - width) / 2 + window.screenX;
+      const top = (window.innerWidth - height) / 2 + window.screenY;
+      const features = `width=${width},height=${height},` + `left=${left},top=${top},` + "menubar=no,toolbar=no,location=no," + "resizable=yes,scrollbars=yes,status=no";
+      const popup = window.open(url, "loop-wallet", features);
+      if (!popup) {
+        window.open(url, "_blank", "noopener,noreferrer");
+        return;
+      }
+      this.popupWindow = popup;
+      try {
+        popup.focus();
+      } catch {}
+      return;
+    }
+    window.open(url, "_blank", "noopener,noreferrer");
+  }
   showQrCode(url) {
     if (typeof window === "undefined" || typeof document === "undefined") {
       return;
@@ -2409,7 +2458,10 @@ class LoopSDK {
       link.textContent = "Or click here to connect";
       link.style.color = "white";
       link.style.marginTop = "20px";
-      link.target = "_blank";
+      link.onclick = (e) => {
+        e.preventDefault();
+        this.openWallet(url);
+      };
       overlay.appendChild(link);
       overlay.onclick = (e) => {
         if (e.target === overlay) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fivenorth/loop-sdk",
-  "version": "0.1.3",
+  "version": "0.3.0",
   "author": "hello@fivenorth.io",
   "main": "dist/index.js",
   "module": "dist/index.js",