feat: added UI notification

airgap-it · Sep 28, 2023 · ab98594 · ab98594
1 parent 4b34f71
commit ab98594
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 4 deletions.
diff --git a/packages/beacon-core/src/transports/clients/ClientEvents.ts b/packages/beacon-core/src/transports/clients/ClientEvents.ts
@@ -1,4 +1,5 @@
 export const enum ClientEvents {
   CLOSE_ALERT = 'CLOSE_ALERT',
-  RESET_STATE = 'RESET_STATE'
+  RESET_STATE = 'RESET_STATE',
+  WC_ACK_NOTIFICATION = "WC_ACK_NOTIFICATION"
 }
diff --git a/packages/beacon-dapp/src/dapp-client/DAppClient.ts b/packages/beacon-dapp/src/dapp-client/DAppClient.ts
@@ -416,6 +416,24 @@ export class DAppClient extends Client {
       ClientEvents.RESET_STATE,
       this.channelClosedHandler.bind(this)
     )
+    this.walletConnectTransport.setEventHandler(
+      ClientEvents.WC_ACK_NOTIFICATION,
+      this.wcToastHandler.bind(this)
+    )
+  }
+
+  private async wcToastHandler(isWaiting: boolean) {
+    const walletInfo = await (async (): Promise<WalletInfo> => {
+      try {
+        return await this.getWalletInfo()
+      } catch {
+        return { name: 'wallet' }
+      }
+    })()
+
+    await (isWaiting
+      ? this.events.emit(BeaconEvent.WC_ACKNOWLEDGE_PENDING, { walletInfo })
+      : this.events.emit(BeaconEvent.WC_ACKNOWLEDGE_RECEIVED, { walletInfo }))
   }
 
   private async channelClosedHandler() {

diff --git a/packages/beacon-dapp/src/events.ts b/packages/beacon-dapp/src/events.ts
@@ -74,7 +74,8 @@ export enum BeaconEvent {
   BROADCAST_REQUEST_SENT = 'BROADCAST_REQUEST_SENT',
   BROADCAST_REQUEST_SUCCESS = 'BROADCAST_REQUEST_SUCCESS',
   BROADCAST_REQUEST_ERROR = 'BROADCAST_REQUEST_ERROR',
-
+  WC_ACKNOWLEDGE_PENDING = 'WC_ACKNOWLEDGE_PENDING',
+  WC_ACKNOWLEDGE_RECEIVED = 'WC_ACKNOWLEDGE_RECEIVED',
   ACKNOWLEDGE_RECEIVED = 'ACKNOWLEDGE_RECEIVED',
 
   LOCAL_RATE_LIMIT_REACHED = 'LOCAL_RATE_LIMIT_REACHED',
@@ -155,6 +156,12 @@ export interface BeaconEventType {
     walletInfo: WalletInfo
   }
   [BeaconEvent.BROADCAST_REQUEST_ERROR]: { errorResponse: ErrorResponse; walletInfo: WalletInfo }
+  [BeaconEvent.WC_ACKNOWLEDGE_PENDING]: {
+    walletInfo: WalletInfo
+  }
+  [BeaconEvent.WC_ACKNOWLEDGE_RECEIVED]: {
+    walletInfo: WalletInfo
+  }
   [BeaconEvent.ACKNOWLEDGE_RECEIVED]: {
     message: AcknowledgeResponse
     extraInfo: ExtraInfo
@@ -289,7 +296,7 @@ const showNoPermissionAlert = async (): Promise<void> => {
 }
 
 /**
- * Show a 
+ * Show a
  */
 const showInvalidActiveAccountState = async (): Promise<void> => {
   await openAlert({
@@ -621,6 +628,22 @@ const showBroadcastSuccessAlert = async (
   })
 }
 
+const showWCPendingAck = async (data: { walletInfo: WalletInfo }): Promise<void> => {
+  openToast({
+    body: 'Awaiting acknowledgment from\u00A0 {{wallet}}',
+    state: 'loading',
+    walletInfo: data.walletInfo
+  }).catch((toastError) => console.error(toastError))
+}
+
+const showWCReceivedAck = async (data: { walletInfo: WalletInfo }): Promise<void> => {
+  openToast({
+    body: 'Acknowledgment received from\u00A0 {{wallet}}',
+    state: 'acknowledge',
+    walletInfo: data.walletInfo
+  }).catch((toastError) => console.error(toastError))
+}
+
 const emptyHandler = (): BeaconEventHandlerFunction => async (): Promise<void> => {
   //
 }
@@ -652,6 +675,8 @@ export const defaultEventCallbacks: {
   [BeaconEvent.BROADCAST_REQUEST_SENT]: showSentToast,
   [BeaconEvent.BROADCAST_REQUEST_SUCCESS]: showBroadcastSuccessAlert,
   [BeaconEvent.BROADCAST_REQUEST_ERROR]: showErrorToast,
+  [BeaconEvent.WC_ACKNOWLEDGE_PENDING]: showWCPendingAck,
+  [BeaconEvent.WC_ACKNOWLEDGE_RECEIVED]: showWCReceivedAck,
   [BeaconEvent.ACKNOWLEDGE_RECEIVED]: showAcknowledgedToast,
   [BeaconEvent.LOCAL_RATE_LIMIT_REACHED]: showRateLimitReached,
   [BeaconEvent.NO_PERMISSIONS]: showNoPermissionAlert,
@@ -685,6 +710,8 @@ export class BeaconEventHandler {
     [BeaconEvent.SIGN_REQUEST_SENT]: [defaultEventCallbacks.SIGN_REQUEST_SENT],
     [BeaconEvent.SIGN_REQUEST_SUCCESS]: [defaultEventCallbacks.SIGN_REQUEST_SUCCESS],
     [BeaconEvent.SIGN_REQUEST_ERROR]: [defaultEventCallbacks.SIGN_REQUEST_ERROR],
+    [BeaconEvent.WC_ACKNOWLEDGE_PENDING]: [defaultEventCallbacks.WC_ACKNOWLEDGE_PENDING],
+    [BeaconEvent.WC_ACKNOWLEDGE_RECEIVED]: [defaultEventCallbacks.WC_ACKNOWLEDGE_RECEIVED],
     // TODO: ENCRYPTION
     // [BeaconEvent.ENCRYPT_REQUEST_SENT]: [defaultEventCallbacks.ENCRYPT_REQUEST_SENT],
     // [BeaconEvent.ENCRYPT_REQUEST_SUCCESS]: [defaultEventCallbacks.ENCRYPT_REQUEST_SUCCESS],
@@ -697,7 +724,9 @@ export class BeaconEventHandler {
     [BeaconEvent.NO_PERMISSIONS]: [defaultEventCallbacks.NO_PERMISSIONS],
     [BeaconEvent.ACTIVE_ACCOUNT_SET]: [defaultEventCallbacks.ACTIVE_ACCOUNT_SET],
     [BeaconEvent.ACTIVE_TRANSPORT_SET]: [defaultEventCallbacks.ACTIVE_TRANSPORT_SET],
-    [BeaconEvent.INVALID_ACTIVE_ACCOUNT_STATE]: [defaultEventCallbacks.INVALID_ACTIVE_ACCOUNT_STATE],
+    [BeaconEvent.INVALID_ACTIVE_ACCOUNT_STATE]: [
+      defaultEventCallbacks.INVALID_ACTIVE_ACCOUNT_STATE
+    ],
     [BeaconEvent.SHOW_PREPARE]: [defaultEventCallbacks.SHOW_PREPARE],
     [BeaconEvent.HIDE_UI]: [defaultEventCallbacks.HIDE_UI],
     [BeaconEvent.PAIR_INIT]: [defaultEventCallbacks.PAIR_INIT],

diff --git a/...acon-transport-walletconnect/src/communication-client/WalletConnectCommunicationClient.ts b/...acon-transport-walletconnect/src/communication-client/WalletConnectCommunicationClient.ts
@@ -201,6 +201,8 @@ export class WalletConnectCommunicationClient extends CommunicationClient {
   }
 
   private async setSessionProperties(session: SessionTypes.Struct) {
+    const fun = this.eventHandlers.get(ClientEvents.WC_ACK_NOTIFICATION)
+    fun && fun(true)
     try {
       const sessionProperties = await this.fetchSessionProperties(
         session.topic,
@@ -210,6 +212,7 @@ export class WalletConnectCommunicationClient extends CommunicationClient {
     } catch (error) {
       console.warn('No session properties received.')
     }
+    fun && fun(false)
   }
 
   async requestPermissions(message: PermissionRequest) {