Merge pull request #696 from airgap-it/fix/app_switching

fix: add app switching

packages/beacon-core/src/transports/clients/CommunicationClient.ts

@@ -1,4 +1,4 @@
-import { PeerInfoType, StorageKey } from '@airgap/beacon-types'
+import { PeerInfoType } from '@airgap/beacon-types'
 import { toHex, getHexHash, sealCryptobox } from '@airgap/beacon-utils'
 import { convertPublicKeyToX25519, convertSecretKeyToX25519, KeyPair } from '@stablelib/ed25519'
 import { clientSessionKeys, serverSessionKeys, SessionKeys } from '@stablelib/x25519-session'
@@ -84,19 +84,6 @@ export abstract class CommunicationClient {
     return sealCryptobox(message, Buffer.from(recipientPublicKey, 'hex'))
   }
 
-  protected tryToDeepLink() {
-    const wallet = JSON.parse(localStorage.getItem(StorageKey.LAST_SELECTED_WALLET) ?? '{}')
-
-    if (!this.isMobileOS() || !wallet.key || !wallet.url?.length || wallet.type !== 'mobile') {
-      return
-    }
-
-    const a = document.createElement('a')
-    a.setAttribute('href', wallet.url)
-    a.setAttribute('rel', 'noopener')
-    a.dispatchEvent(new MouseEvent('click', { view: window, bubbles: true, cancelable: true }))
-  }
-
   abstract unsubscribeFromEncryptedMessages(): Promise<void>
   abstract unsubscribeFromEncryptedMessage(senderPublicKey: string): Promise<void>
   // abstract send(message: string, recipient?: string): Promise<void>

packages/beacon-dapp/src/dapp-client/DAppClient.ts

@@ -119,7 +119,9 @@ import {
   getExtensionList,
   getWebList,
   isBrowser,
-  isDesktop
+  isDesktop,
+  isMobileOS,
+  isIOS
 } from '@airgap/beacon-ui'
 import { WalletConnectTransport } from '@airgap/beacon-transport-walletconnect'
 
@@ -144,6 +146,11 @@ export class DAppClient extends Client {
    */
   public readonly blockExplorer: BlockExplorer
 
+  /**
+   * Automatically switch between apps on Mobile Devices (Enabled by Default)
+   */
+  enableAppSwitching: boolean = true
+
   public network: Network
 
   protected readonly events: BeaconEventHandler = new BeaconEventHandler()
@@ -770,6 +777,28 @@ export class DAppClient extends Client {
     }
   }
 
+  private async tryToAppSwitch() {
+    if (!isMobileOS(window) || !this.enableAppSwitching) {
+      return
+    }
+
+    const wallet = await this.getWalletInfo()
+
+    if (wallet.type !== 'mobile') {
+      return
+    }
+
+    const link = isIOS(window)
+      ? wallet.deeplink
+      : JSON.parse(localStorage.getItem(StorageKey.LAST_SELECTED_WALLET) ?? '{}').url
+
+    if (!link?.length) {
+      return
+    }
+
+    window.location = link
+  }
+
   /**
    * Will remove the account from the local storage and set a new active account if necessary.
    *
@@ -1797,18 +1826,6 @@ export class DAppClient extends Client {
     logger.timeLog(messageId, 'init done')
     logger.log('makeRequest', 'after init')
 
-    const transport = await this.transport
-
-    if (
-      transport instanceof WalletConnectTransport &&
-      (await this.getActiveAccount()) &&
-      !(await transport.hasPairings()) &&
-      !(await transport.hasSessions())
-    ) {
-      await this.channelClosedHandler()
-      throw new Error('No active pairing nor session found')
-    }
-
     if (await this.addRequestAndCheckIfRateLimited()) {
       this.events
         .emit(BeaconEvent.LOCAL_RATE_LIMIT_REACHED)
@@ -1860,7 +1877,13 @@ export class DAppClient extends Client {
     logger.log('makeRequest', 'sending message', request)
     logger.timeLog('makeRequest', messageId, 'sending')
     try {
-      await transport.send(payload, peer)
+      ;(await this.transport).send(payload, peer)
+      if (
+        request.type !== BeaconMessageType.PermissionRequest ||
+        (this._activeAccount.isResolved() && (await this._activeAccount.promise))
+      ) {
+        this.tryToAppSwitch()
+      }
     } catch (sendError) {
       this.events.emit(BeaconEvent.INTERNAL_ERROR, {
         text: 'Unable to send message. If this problem persists, please reset the connection and pair your wallet again.',
@@ -1940,24 +1963,6 @@ export class DAppClient extends Client {
       throw new Error('rate limit reached')
     }
 
-    const transport = await this.transport
-
-    if (
-      transport instanceof WalletConnectTransport &&
-      (await this.getActiveAccount()) &&
-      !(await transport.hasPairings()) &&
-      !(await transport.hasSessions())
-    ) {
-      await this.channelClosedHandler()
-      throw new Error('No active pairing nor session found')
-    }
-
-    // if (!(await this.checkPermissions(requestInput.type as BeaconMessageType))) {
-    //   this.events.emit(BeaconEvent.NO_PERMISSIONS).catch((emitError) => console.warn(emitError))
-
-    //   throw new Error('No permissions to send this request to wallet!')
-    // }
-
     if (!this.beaconId) {
       throw await this.sendInternalError('BeaconID not defined')
     }
@@ -1990,7 +1995,13 @@ export class DAppClient extends Client {
     logger.log('makeRequest', 'sending message', request)
     logger.timeLog('makeRequest', messageId, 'sending')
     try {
-      await transport.send(payload, peer)
+      ;(await this.transport).send(payload, peer)
+      if (
+        request.message.type !== BeaconMessageType.PermissionRequest ||
+        (this._activeAccount.isResolved() && (await this._activeAccount.promise))
+      ) {
+        this.tryToAppSwitch()
+      }
     } catch (sendError) {
       this.events.emit(BeaconEvent.INTERNAL_ERROR, {
         text: 'Unable to send message. If this problem persists, please reset the connection and pair your wallet again.',

packages/beacon-transport-walletconnect/src/communication-client/WalletConnectCommunicationClient.ts

@@ -192,10 +192,6 @@ export class WalletConnectCommunicationClient extends CommunicationClient {
     switch (message.type) {
       case BeaconMessageType.PermissionRequest:
         this.requestPermissions(message)
-
-        if (this.messageIds.length) {
-          this.tryToDeepLink()
-        }
         break
       case BeaconMessageType.OperationRequest:
         this.sendOperations(message)

packages/beacon-ui/src/index.ts

@@ -18,4 +18,4 @@ export type { ToastAction } from './ui/toast'
 
 export { getColorMode, setColorMode } from './utils/colorMode'
 
-export { isMobile, isMobileOS, isBrowser, isDesktop } from './utils/platform'
+export { isMobile, isMobileOS, isBrowser, isDesktop, isAndroid, isIOS } from './utils/platform'

packages/beacon-ui/src/ui/alert/index.tsx

@@ -480,6 +480,15 @@ const openAlert = async (config: AlertConfig): Promise<string> => {
         analytics()?.track('click', 'ui', 'opened wallet', { key: wallet.key })
       }
 
+      localStorage.setItem(
+        StorageKey.LAST_SELECTED_WALLET,
+        JSON.stringify({
+          key: wallet?.key,
+          type: 'mobile',
+          icon: currentWallet()?.image
+        })
+      )
+
       if (
         wallet?.types.includes('web') &&
         !(
@@ -550,11 +559,13 @@ const openAlert = async (config: AlertConfig): Promise<string> => {
             isIOS(window) && wallet.deepLink
               ? wallet.deepLink
               : isAndroid(window)
-              ? 'tezos://'
-              : wallet.links[OSLink.IOS],
+              ? wallet.links[OSLink.IOS]
+              : 'tezos://',
             code
           )
 
+          updateSelectedWalletWithURL(link)
+
           if (isAndroid(window)) window.open(link, '_blank', 'noopener')
           else if (isIOS(window)) {
             const a = document.createElement('a')