Merge pull request #283 from blocknative/develop

Release 1.6.0

Author: lnbc1QWFyb24

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bnc-onboard",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "description": "Onboard users to web3 by allowing them to select a wallet, get that wallet ready to transact and have access to synced wallet state.",
   "keywords": [
     "ethereum",
@@ -43,9 +43,9 @@
     "@ledgerhq/hw-transport-u2f": "^5.7.0",
     "@portis/web3": "^2.0.0-beta.42",
     "@toruslabs/torus-embed": "^1.2.4",
-    "@unilogin/provider": "^0.5.20",
+    "@unilogin/provider": "^0.5.21",
     "@walletconnect/web3-provider": "^1.0.0-beta.45",
-    "authereum": "^0.0.4-beta.88",
+    "authereum": "^0.0.4-beta.131",
     "bignumber.js": "^9.0.0",
     "bnc-sdk": "2.0.0",
     "bowser": "^2.5.2",

src/interfaces.ts

@@ -84,7 +84,6 @@ export interface WalletModule {
   }>
   type: 'hardware' | 'injected' | 'sdk'
   link?: string
-  url?: string
   installMessage?: (wallets: {
     currentWallet: string | undefined
     selectedWallet: string
@@ -117,6 +116,7 @@ export interface WalletInterface {
   address: StateSyncer
   network: StateSyncer
   balance: StateSyncer
+  dashboard?: () => void
 }
 
 export interface StateSyncer {
@@ -130,6 +130,7 @@ export interface Wallet {
   type: 'hardware' | 'injected' | 'sdk'
   instance?: any
   connect?: () => Promise<{ message: string } | undefined>
+  dashboard?: () => void
 }
 
 export interface CommonWalletOptions {
@@ -243,18 +244,20 @@ export interface WalletInterfaceStore {
   update: (
     updater: (walletInterface: WalletInterface | null) => WalletInterface | null
   ) => void
-  set: (walletInterface: WalletInterface) => void | never
+  set: (walletInterface: WalletInterface | null) => void | never
 }
 
 export interface WalletStateSliceStore {
   subscribe: (subscriber: (store: any) => void) => () => void
   reset: () => void
-  setStateSyncer: (stateSyncer: StateSyncer) => number | undefined
+  setStateSyncer: (
+    stateSyncer: StateSyncer
+  ) => { clear: () => void } | undefined
 }
 
 export interface BalanceStore {
   subscribe: (subscriber: (store: any) => void) => () => void
-  setStateSyncer: (stateSyncer: StateSyncer) => number | undefined
+  setStateSyncer: (stateSyncer: StateSyncer) => undefined
   reset: () => void
 }
 

src/modules/select/wallets/authereum.ts

@@ -1,5 +1,5 @@
 import authereumIcon from '../wallet-icons/icon-authereum.png'
-import { networkName } from '../../../utilities'
+import { networkName, openLink } from '../../../utilities'
 import {
   WalletModule,
   AuthereumOptions,
@@ -37,7 +37,9 @@ function authereum(
         interface: {
           name: 'Authereum',
           connect: () => provider.enable(),
-          disconnect: () => instance.logout(),
+          disconnect: () => {
+            instance.destroy()
+          },
           address: {
             get: () => instance.getAccountAddress()
           },
@@ -49,16 +51,19 @@ function authereum(
               const loggedIn = await instance.isAuthenticated()
               return loggedIn && instance.getBalance()
             }
-          }
+          },
+          dashboard: () =>
+            openLink(
+              `https://${
+                networkId !== 1 ? `${networkName(networkId)}.` : ''
+              }authereum.com/`
+            )
         }
       }
     },
     type: 'sdk',
     desktop: true,
     mobile: true,
-    url: `https://${
-      networkId !== 1 ? `${networkName(networkId)}.` : ''
-    }authereum.com/`,
     preferred
   }
 }

src/modules/select/wallets/portis.ts

@@ -1,4 +1,4 @@
-import { networkName } from '../../../utilities'
+import { networkName, openLink } from '../../../utilities'
 import {
   SdkWalletOptions,
   WalletModule,
@@ -65,14 +65,14 @@ function portis(options: SdkWalletOptions & CommonWalletOptions): WalletModule {
                   )
                 }, 1)
               })
-          }
+          },
+          dashboard: () => openLink('https://wallet.portis.io/')
         }
       }
     },
     type: 'sdk',
     desktop: true,
     mobile: true,
-    url: 'https://wallet.portis.io/',
     preferred
   }
 }

src/modules/select/wallets/squarelink.ts

@@ -1,4 +1,4 @@
-import { networkName, networkToId } from '../../../utilities'
+import { networkName, networkToId, openLink } from '../../../utilities'
 import {
   SdkWalletOptions,
   CommonWalletOptions,
@@ -60,14 +60,14 @@ function squarelink(
                   }
                 )
               })
-          }
+          },
+          dashboard: () => openLink('https://app.squarelink.com/')
         }
       }
     },
     type: 'sdk',
     desktop: true,
     mobile: true,
-    url: 'https://app.squarelink.com/',
     preferred
   }
 }

src/modules/select/wallets/torus.ts

@@ -1,4 +1,4 @@
-import { networkName } from '../../../utilities'
+import { networkName, openLink } from '../../../utilities'
 import {
   TorusOptions,
   CommonWalletOptions,
@@ -76,14 +76,14 @@ function torus(options: TorusOptions & CommonWalletOptions): WalletModule {
                   }
                 )
               })
-          }
+          },
+          dashboard: () => openLink('https://app.tor.us/')
         }
       }
     },
     type: 'sdk',
     desktop: true,
     mobile: true,
-    url: 'https://app.tor.us/',
     preferred
   }
 }

src/modules/select/wallets/unilogin.ts

@@ -23,7 +23,8 @@ function unilogin(options: CommonWalletOptions): WalletModule {
           disconnect: () =>
             new Promise(resolve =>
               provider.send({ method: 'ul_disconnect' }, resolve)
-            )
+            ),
+          dashboard: () => provider.openDashboard()
         }
       }
     },

src/stores.ts

@@ -1,6 +1,6 @@
 import { getBlocknative } from './services'
 import { writable, derived, get } from 'svelte/store'
-import { wait, makeCancelable } from './utilities'
+import { wait, makeCancelable, createInterval } from './utilities'
 import { validateWalletInterface, validateType } from './validation'
 import {
   WritableStore,
@@ -51,7 +51,7 @@ export const wallet: WritableStore = writable({
   provider: null,
   connect: null,
   instance: null,
-  url: null,
+  dashboard: null,
   type: null
 })
 
@@ -70,7 +70,7 @@ export const state = derived(
 )
 
 // keep track of intervals that are syncing state so they can be cleared
-let currentSyncerIntervals: (number | undefined)[] = []
+let currentSyncerIntervals: ({ clear: () => void } | undefined)[] = []
 
 export const walletInterface: WalletInterfaceStore = createWalletInterfaceStore(
   null
@@ -79,7 +79,8 @@ export const walletInterface: WalletInterfaceStore = createWalletInterfaceStore(
 walletInterface.subscribe((walletInterface: WalletInterface | null) => {
   // clear all current intervals if they exist
   currentSyncerIntervals.forEach(
-    (interval: number | undefined) => interval && clearInterval(interval)
+    (interval: { clear: () => void } | undefined) =>
+      interval && interval.clear()
   )
 
   const currentState = get(state)
@@ -118,7 +119,7 @@ export function resetWalletState(options?: {
         provider: undefined,
         connect: undefined,
         instance: undefined,
-        url: undefined
+        dashboard: undefined
       }))
 
       currentInterface.disconnect && currentInterface.disconnect()
@@ -135,10 +136,10 @@ export function resetWalletState(options?: {
         provider: undefined,
         connect: undefined,
         instance: undefined,
-        url: undefined
+        dashboard: undefined
       }))
 
-      disconnected &&
+      !disconnected &&
         currentInterface.disconnect &&
         currentInterface.disconnect()
 
@@ -175,8 +176,10 @@ function createWalletInterfaceStore(
   return {
     subscribe,
     update,
-    set: (walletInterface: WalletInterface) => {
-      validateWalletInterface(walletInterface)
+    set: (walletInterface: WalletInterface | null) => {
+      if (walletInterface) {
+        validateWalletInterface(walletInterface)
+      }
       set(walletInterface)
     }
   }
@@ -228,11 +231,11 @@ function createWalletStateSliceStore(options: {
       }
 
       if (get) {
-        const interval: any = setInterval(() => {
+        const interval: any = createInterval(() => {
           get()
             .then(newVal => {
               if (newVal || currentState !== initialState) {
-                set(newVal)
+                interval.status.active && set(newVal)
               }
             })
             .catch((err: any) => {

src/utilities.ts

@@ -270,3 +270,20 @@ export function isPromise(val: any): val is Promise<any> {
   }
   return false
 }
+
+export function createInterval(func: any, interval: number) {
+  const id = setInterval(func, interval)
+  const status = { active: true }
+
+  return {
+    status,
+    clear: () => {
+      clearInterval(id)
+      status.active = false
+    }
+  }
+}
+
+export function openLink(url: string) {
+  window.open(url)
+}

src/views/WalletSelect.svelte

@@ -175,7 +175,7 @@
     wallet.set({
       provider,
       instance,
-      url: module.url,
+      dashboard: selectedWalletInterface.dashboard,
       name: module.name,
       connect: selectedWalletInterface.connect,
       type: module.type