✨ Add support for wallet disconnection in dApp

ccamel · Aug 7, 2024 · 2e8375e · 2e8375e
1 parent 5a22fb3
commit 2e8375e
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 3 deletions.
diff --git a/src/Page/Dapp.elm b/src/Page/Dapp.elm
@@ -126,6 +126,7 @@ type
     | ConnectWalletWithProvider Uuid
     | WalletConnected WalletConnection
     | WalletNotConnected Uuid
+    | WalletDisconnected Uuid
       -- notification
     | ToastMsg Toast.Msg
     | AddToast Notification
@@ -189,6 +190,23 @@ update msg (Model model) =
                 , Cmd.none
                 )
 
+            WalletDisconnected uuid ->
+                ( { model
+                    | wallets =
+                        Dict.update uuid
+                            (Maybe.map
+                                (\w ->
+                                    { w
+                                        | state =
+                                            NotConnected
+                                    }
+                                )
+                            )
+                            model.wallets
+                  }
+                , Cmd.none
+                )
+
             AddToast notification ->
                 let
                     ( tray, tmsg ) =
@@ -235,6 +253,7 @@ subscriptions _ =
         [ receiveProviderAnnouncement mapProviderAnnounced
         , receiveWalletConnected mapWalletConnected
         , receiveWalletNotConnected mapWalletNotConnected
+        , receiveWalletDisconnected mapWalletDisconnected
         , receiveNotification mapNotification
         ]
 
@@ -261,6 +280,9 @@ port receiveWalletConnected : (Json.Decode.Value -> msg) -> Sub msg
 port receiveWalletNotConnected : (Uuid -> msg) -> Sub msg
 
 
+port receiveWalletDisconnected : (Uuid -> msg) -> Sub msg
+
+
 port receiveNotification : (Json.Decode.Value -> msg) -> Sub msg
 
 
@@ -342,6 +364,11 @@ mapWalletNotConnected uuid =
     WalletNotConnected uuid
 
 
+mapWalletDisconnected : Uuid -> Msg
+mapWalletDisconnected uuid =
+    WalletDisconnected uuid
+
+
 mapNotification : Json.Decode.Value -> Msg
 mapNotification json =
     let

diff --git a/src/Page/dapp.port.js b/src/Page/dapp.port.js
@@ -44,9 +44,10 @@ const registerPorts = app => {
   app.ports.connectWalletWithProvider.subscribe(async uuid => {
     if (uuid in providers) {
       try {
-        const provider = providers[uuid].provider;
-        const address = await provider.request({ method: 'eth_requestAccounts' });
-        const chainID = await provider.request({
+        const provider = providers[uuid];
+        const proxy = providers[uuid].provider;
+        const address = await proxy.request({ method: 'eth_requestAccounts' });
+        const chainID = await proxy.request({
           method: 'eth_chainId'
         });
         const chainName = await chainIDtoName(chainID);
@@ -56,6 +57,13 @@ const registerPorts = app => {
           chainID,
           chainName
         };
+        proxy.on('disconnect', error => {
+          app.ports.receiveWalletDisconnected.send(uuid);
+          app.ports.receiveNotification.send({
+            message: `Wallet ${provider.info.name} disconnected` + (error ? `: ${error.message}` : ''),
+            type: 'error'
+          });
+        });
 
         app.ports.receiveWalletConnected.send(wallet);
       } catch (error) {