Add dappkit-web functionality

packages/sdk/dappkit/package.json

@@ -10,14 +10,14 @@
     "@celo/connect": "1.0.3-dev",
     "@celo/contractkit": "1.0.3-dev",
     "@celo/utils": "1.0.3-dev",
-    "expo": "^36.0.2",
-    "expo-contacts": "8.0.0",
-    "libphonenumber-js": "^1.7.22"
+    "react-native": "^0.63.4"
   },
   "devDependencies": {
     "@types/react-native": "0.63.50"
   },
   "main": "./lib/index.js",
   "types": "./lib/index.d.ts",
-  "files": ["src/**/*", "lib/**/*"]
+  "files": [
+    "lib/**/*"
+  ]
 }

packages/sdk/dappkit/src/index.ts

@@ -12,7 +12,7 @@ import {
   SignTxResponseSuccess,
   TxToSignParam,
 } from '@celo/utils'
-import { Linking } from 'expo'
+import { Linking } from 'react-native'
 export {
   AccountAuthRequest,
   DappKitRequestMeta,
@@ -34,37 +34,29 @@ export function listenToAccount(callback: (account: string) => void) {
   })
 }
 
-export function waitForAccountAuth(requestId: string): Promise<AccountAuthResponseSuccess> {
-  return new Promise((resolve, reject) => {
-    const handler = ({ url }: { url: string }) => {
-      try {
-        const dappKitResponse = parseDappkitResponseDeeplink(url)
-        if (
-          requestId === dappKitResponse.requestId &&
-          dappKitResponse.type === DappKitRequestTypes.ACCOUNT_ADDRESS &&
-          dappKitResponse.status === DappKitResponseStatus.SUCCESS
-        ) {
-          Linking.removeEventListener('url', handler)
-          resolve(dappKitResponse)
-        }
-      } catch (error) {
-        reject(error)
+export function listenToSignedTxs(callback: (signedTxs: string[]) => void) {
+  return Linking.addEventListener('url', ({ url }: { url: string }) => {
+    try {
+      const dappKitResponse = parseDappkitResponseDeeplink(url)
+      if (
+        dappKitResponse.type === DappKitRequestTypes.SIGN_TX &&
+        dappKitResponse.status === DappKitResponseStatus.SUCCESS
+      ) {
+        callback(dappKitResponse.rawTxs)
       }
-    }
-    Linking.addEventListener('url', handler)
+    } catch (error) {}
   })
 }
 
-export function waitForSignedTxs(requestId: string): Promise<SignTxResponseSuccess> {
+function waitDecorator(
+  requestId: string,
+  checkCallback: (requestId: string, dappKitResponse: any) => boolean
+): Promise<any> {
   return new Promise((resolve, reject) => {
     const handler = ({ url }: { url: string }) => {
       try {
         const dappKitResponse = parseDappkitResponseDeeplink(url)
-        if (
-          requestId === dappKitResponse.requestId &&
-          dappKitResponse.type === DappKitRequestTypes.SIGN_TX &&
-          dappKitResponse.status === DappKitResponseStatus.SUCCESS
-        ) {
+        if (checkCallback(requestId, dappKitResponse)) {
           Linking.removeEventListener('url', handler)
           resolve(dappKitResponse)
         }
@@ -76,18 +68,28 @@ export function waitForSignedTxs(requestId: string): Promise<SignTxResponseSucce
   })
 }
 
-export function listenToSignedTxs(callback: (signedTxs: string[]) => void) {
-  return Linking.addEventListener('url', ({ url }: { url: string }) => {
-    try {
-      const dappKitResponse = parseDappkitResponseDeeplink(url)
-      if (
-        dappKitResponse.type === DappKitRequestTypes.SIGN_TX &&
-        dappKitResponse.status === DappKitResponseStatus.SUCCESS
-      ) {
-        callback(dappKitResponse.rawTxs)
-      }
-    } catch (error) {}
-  })
+export function checkAccountAuth(requestId: string, dappKitResponse: any): boolean {
+  return (
+    requestId === dappKitResponse.requestId &&
+    dappKitResponse.type === DappKitRequestTypes.ACCOUNT_ADDRESS &&
+    dappKitResponse.status === DappKitResponseStatus.SUCCESS
+  )
+}
+
+export function checkSignedTxs(requestId: string, dappKitResponse: any): boolean {
+  return (
+    requestId === dappKitResponse.requestId &&
+    dappKitResponse.type === DappKitRequestTypes.SIGN_TX &&
+    dappKitResponse.status === DappKitResponseStatus.SUCCESS
+  )
+}
+
+export function waitForAccountAuth(requestId: string): Promise<AccountAuthResponseSuccess> {
+  return waitDecorator(requestId, checkAccountAuth)
+}
+
+export function waitForSignedTxs(requestId: string): Promise<SignTxResponseSuccess> {
+  return waitDecorator(requestId, checkSignedTxs)
 }
 
 export function requestAccountAddress(meta: DappKitRequestMeta) {

packages/sdk/dappkit/src/web.ts

@@ -0,0 +1,77 @@
+// Special logic for Web DApps run on mobile
+import {
+  AccountAuthResponseSuccess,
+  parseDappkitResponseDeeplink,
+  SignTxResponseSuccess,
+} from '@celo/utils'
+import { checkAccountAuth, checkSignedTxs } from './index'
+export {
+  AccountAuthRequest,
+  DappKitRequestMeta,
+  serializeDappKitRequestDeeplink,
+  SignTxRequest,
+} from '@celo/utils'
+export { FeeCurrency, requestAccountAddress, requestTxSig, TxParams } from './index'
+
+// DappKit Web constants and helpers
+const localStorageKey = 'dappkit-web'
+
+// Ensure this is called on dappkit import
+parseURLOnRender()
+
+// hack to get around dappkit issue where new tabs are opened
+// and the url hash state is not respected (Note this implementation
+// of dappkit doesn't use URL hashes to always force the newtab experience).
+
+// Function that should be called within dapp wherever a window is rendered
+export function parseURLOnRender() {
+  if (typeof window !== 'undefined') {
+    const params = new URL(window.location.href).searchParams
+    if (params.get('type') && params.get('requestId')) {
+      // Prevents error when reloading a chrome page with params in the URL
+      if (localStorage) {
+        localStorage.setItem(localStorageKey, window.location.href)
+        // TODO: seems like the below line is not getting executed in Chrome on iOS
+        // on iOS though, the newly opened window gets closed and the following window (instead of the previously opened tab) gets opened
+        window.close()
+      }
+    }
+  }
+}
+
+async function waitForResponse(timeout: number) {
+  // In milliseconds
+  const pollInterval = 100
+  const endTime = Date.now() + timeout
+
+  while (Date.now() < endTime) {
+    const value = localStorage.getItem(localStorageKey)
+    if (value) {
+      localStorage.removeItem(localStorageKey)
+      return value
+    }
+    await new Promise((resolve) => setTimeout(resolve, pollInterval))
+  }
+  throw new Error('Timeout waiting for Valora response')
+}
+
+async function waitDecorator(
+  requestId: string,
+  checkCallback: (requestId: string, dappKitResponse: any) => boolean,
+  timeout: number = 15000
+): Promise<any> {
+  const url = await waitForResponse(timeout)
+  const dappKitResponse = parseDappkitResponseDeeplink(url)
+  if (checkCallback(requestId, dappKitResponse)) {
+    return dappKitResponse
+  }
+  throw new Error('Unable to parse Valora response')
+}
+
+export async function waitForAccountAuth(requestId: string): Promise<AccountAuthResponseSuccess> {
+  return waitDecorator(requestId, checkAccountAuth)
+}
+
+export async function waitForSignedTxs(requestId: string): Promise<SignTxResponseSuccess> {
+  return waitDecorator(requestId, checkSignedTxs)
+}