Session ID handling & Reconnection

src/iframeWrapper.ts

@@ -60,6 +60,23 @@ export default class IframeWrapper {
     )
   }
 
+  public getSessionID = () => {
+    const val = window.localStorage.getItem(
+      `arcana-auth-${this.params.iframeUrl}-sessionID`
+    )
+    if (val) {
+      return JSON.parse(val)
+    }
+    return null
+  }
+
+  public setSessionID = (id: string, expiry: number) => {
+    window.localStorage.setItem(
+      `arcana-auth-${this.params.iframeUrl}-sessionID`,
+      JSON.stringify({ id, expiry })
+    )
+  }
+
   public setWalletType(appMode: AppMode | undefined) {
     this.appMode = appMode ?? AppMode.Full
     this.initWalletUI()

src/index.ts

@@ -14,6 +14,7 @@
   AppConfig,
   AppMode,
   BearerAuthentication,
+  ChainConfigInput,
   ConstructorParams,
   EthereumProvider,
   FirebaseBearer,
@@ -24,7 +25,6 @@
   Theme,
   ThemeConfig,
   UserInfo,
-  ChainConfigInput,
 } from './typings'
 import { getAppInfo, getImageUrls } from './appInfo'
 import { ArcanaAuthError, ErrorNotInitialized } from './errors'
@@ -45,7 +45,7 @@
   private connectCtrl: ModalController
   private _standaloneMode: {
     mode: 1 | 2
     handler: (...args: any) => void | undefined
   }
   constructor(clientId: string, p?: Partial<ConstructorParams>) {
     let network = p?.network
@@ -290,6 +290,42 @@
     throw ErrorNotInitialized
   }
 
+  /**
+   * A function to to be called before trying to .reconnect()
+   */
+  public canReconnect() {
+    const session = this.iframeWrapper.getSessionID()
+    if (!session) {
+      return false
+    }
+
+    if (session.exp < Date.now()) {
+      return false
+    }
+
+    return true
+  }
+
+  /**
+   * A function to try to reconnect to last login session.
+   * Should be called on event of click function as it opens a popup.
+   */
+  public async reconnect() {
+    const session = this.iframeWrapper.getSessionID()
+    if (session) {
+      if (session.exp < Date.now()) {
+        throw new Error('cannot reconnect, session expired')
+      }
+      const u = new URL(await this._provider.getReconnectionUrl())
+      u.searchParams.set('sessionID', session.id)
+
+      const popup = new Popup(u.toString())
+      await popup.open()
+      return
+    }
+    throw new Error('cannot reconnect, no session found')
+  }
+
   /* Private functions */
   /**
    * @internal
@@ -401,7 +437,7 @@
 
   private standaloneMode(
     mode: 1 | 2,
     handler: (eventName: string, data: any) => void
   ) {
     this._standaloneMode = {
       mode,

src/provider.ts

@@ -87,6 +87,8 @@ export class ArcanaProvider
       triggerPasswordlessLogin: loginFuncs.loginWithLink,
       getPopupState: () => this.iframe.getState(),
       setIframeStyle: this.iframe.setIframeStyle,
+      getSessionID: this.iframe.getSessionID,
+      setSessionID: this.iframe.setSessionID,
       getSDKVersion: () => 'v3',
     })
     this.communication = communication
@@ -127,6 +129,12 @@ export class ArcanaProvider
     return info
   }
 
+  public async getReconnectionUrl() {
+    const c = await this.getCommunication('getReconnectionUrl')
+    const url = await c.getReconnectionUrl()
+    return url
+  }
+
   public async getPublicKey(email: string, verifier: string) {
     const c = await this.getCommunication('getPublicKey')
     const pk = await c.getPublicKey(email, verifier)

src/typings.ts

@@ -121,6 +121,7 @@
     setToken: string
   }
   expandWallet: () => Promise<void>
+  getReconnectionUrl: () => Promise<string>
 }
 
 export interface ParentMethods {
@@ -138,6 +139,8 @@
   setIframeStyle: (styles: CSSStyleDeclaration) => void
   getWalletPosition: () => Position
   getSDKVersion: () => SDKVersion
+  getSessionID: () => string | null
+  setSessionID: (id: string, exp: number) => void
 }
 
 export interface TypedDataMessage {
@@ -204,9 +207,9 @@
 
 export interface EthereumProvider {
   request(args: RequestArguments): Promise<unknown>
   on(eventName: string | symbol, listener: (...args: any[]) => void): this
   removeListener(
     eventName: string | symbol,
     listener: (...args: any[]) => void
   ): this
 }