From fefebcf91ee0adeaa6529afec66d5a11260f4b8b Mon Sep 17 00:00:00 2001
From: RcleydsonR <rafael.cleydson@gmail.com>
Date: Wed, 16 Nov 2022 01:29:06 -0300
Subject: [PATCH] add change account event listener

---
 src/components/TopBar.vue |  2 +-
 src/utils/ethers.ts       | 15 ++++++++++-----
 src/views/EthersView.vue  |  2 +-
 3 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/components/TopBar.vue b/src/components/TopBar.vue
index ed11d04..83df9e5 100644
--- a/src/components/TopBar.vue
+++ b/src/components/TopBar.vue
@@ -8,7 +8,7 @@ const etherStore = useEtherStore();
 const { walletAddress } = storeToRefs(etherStore);
 
 const connectMetaMask = () => {
-  ethers.getProvider();
+  ethers.connectProvider();
 };
 
 const formatWalletAddress = (): string => {
diff --git a/src/utils/ethers.ts b/src/utils/ethers.ts
index eec9fb6..fcfe099 100644
--- a/src/utils/ethers.ts
+++ b/src/utils/ethers.ts
@@ -1,23 +1,28 @@
 import { useEtherStore } from "@/store/ether";
 import { ethers } from "ethers";
 
-const getProvider = async (): Promise<ethers.providers.Web3Provider | null> => {
+const connectProvider = async (): Promise<ethers.providers.Web3Provider | null> => {
   const etherStore = useEtherStore();
   const window_ = window as any;
+  const connection = window_.ethereum;
   let provider: ethers.providers.Web3Provider | null = null;
 
-  if (window_.ethereum) {
-    provider = new ethers.providers.Web3Provider(window_.ethereum);
+  if (connection) {
+    provider = new ethers.providers.Web3Provider(connection);
 
     const walletAddress = await provider.send("eth_requestAccounts", []);
     const balance = await provider.getBalance(walletAddress[0]);
 
     etherStore.setProvider(provider);
-    etherStore.setWalletAddress(walletAddress);
+    etherStore.setWalletAddress(walletAddress[0]);
     etherStore.setBalance(Number(balance));
+
+    connection.on('accountsChanged', (accounts: string[]) => {
+      etherStore.setWalletAddress(accounts[0])
+    });
   } else console.log("Browser não suporta conexão com metamask");
 
   return provider;
 };
 
-export default { getProvider };
+export default { connectProvider };
diff --git a/src/views/EthersView.vue b/src/views/EthersView.vue
index 75c9912..1b2298e 100644
--- a/src/views/EthersView.vue
+++ b/src/views/EthersView.vue
@@ -2,7 +2,7 @@
 import ethers from "../utils/ethers";
 
 const connectMetaMask = () => {
-  ethers.getProvider().then((web3Provider) => {
+  ethers.connectProvider().then((web3Provider) => {
     console.log(web3Provider);
   });
 };