metamask first version

src/components/ConnectAccount.vue

@@ -0,0 +1,17 @@
+<template>
+  <div id="connected">
+    <section>
+      <p>Connected as <b>{{ address}}</b></p>
+    </section>
+  </div>
+</template>
+
+<script>
+export default {
+    props: ["address"]
+
+};
+</script>
+
+<style>
+</style>

src/components/KeyVote.vue

@@ -43,27 +43,34 @@ export default {
     clearVoteStatus() {
       for (let account of this.accounts) {
         for (let proposal of account.proposals) {
-          proposal.status_code = '';
-          proposal.status_message = '';
+          proposal.status_code = "";
+          proposal.status_message = "";
         }
       }
     },
     async startVoting(key, proposals) {
       let wallet = getWallet(key);
+      let previousSpace = "";
       for (let proposal of proposals) {
         let isVoted = await hasVoted(wallet.address, proposal.id);
         if (isVoted) {
           proposal.status_code = "voted";
           proposal.status_message = "This proposal has already Voted";
         } else {
-          let vp = await getVotingPowers(proposal.id, wallet.address);
-          if (vp == 0) {
+          if (previousSpace !== proposal.space) {
+            let vp = await getVotingPowers(proposal.id, wallet.address);
+            previousSpace = proposal.space;
+            if (vp == 0) {
+              proposal.status_code = "error";
+              proposal.status_message = "You don't have Voting Power to vote";
+            } else {
+              proposal.status_code = "ready";
+              proposal.status_message = "Ready to vote";
+              await vote(wallet, proposal, "false");
+            }
+          } else {
             proposal.status_code = "error";
             proposal.status_message = "You don't have Voting Power to vote";
-          } else {
-            proposal.status_code = "ready";
-            proposal.status_message = "Ready to vote";
-            await vote(wallet, proposal,'false');
           }
         }
       }

src/components/MetamaskVote.vue

@@ -45,6 +45,8 @@ export default {
     async startVoting(proposals) {
       let provider = new ethers.providers.Web3Provider(window.ethereum);
       const accounts = await provider.send("eth_requestAccounts");
+      let previousSpace = "";
+      let voted = false;
       let wallet = {};
       wallet.address = accounts[0];
       for (let proposal of proposals) {
@@ -53,14 +55,21 @@ export default {
           proposal.status_code = "voted";
           proposal.status_message = "This proposal has already Voted";
         } else {
-          let vp = await getVotingPowers(proposal.id, wallet.address);
-          if (vp == 0) {
+          if (previousSpace !== proposal.space || voted) {
+            let vp = await getVotingPowers(proposal.id, wallet.address);
+            previousSpace = proposal.space;
+            if (vp == 0) {
+              proposal.status_code = "error";
+              proposal.status_message = "You don't have Voting Power to vote";
+            } else {
+              proposal.status_code = "ready";
+              proposal.status_message = "Ready to vote";
+              await vote(wallet, proposal, "true");
+              voted = true;
+            }
+          } else {
             proposal.status_code = "error";
             proposal.status_message = "You don't have Voting Power to vote";
-          } else {
-            proposal.status_code = "ready";
-            proposal.status_message = "Ready to vote";
-            await vote(wallet, proposal, "true");
           }
         }
       }

src/utils/snapshot.js

@@ -98,17 +98,14 @@ async function vote(account, proposal, useMetamask) {
             }
         }
     }
-    if (useMetamask) {
+    if (useMetamask==='true' || useMetamask===true) {
         if(!window.ethereum){
             alert("Please install Metamask");
             return;
         }
         await window.ethereum.enable();
-        console.log("Metamask enabled");
         const signer = (new ethers.providers.Web3Provider(window.ethereum)).getSigner();
-        console.log(signer);
         const { domain, types, message } = data.data
-        console.log(domain, types, message)
         data.sig = await signer._signTypedData(domain, types, message);
     } else {
         data.sig = await get_signature(account, data, provider)

src/utils/wallet.js

@@ -1,5 +1,5 @@
 import { Wallet } from '@ethersproject/wallet';
-
+import { ethers } from "ethers";
 export function getWallet(privateKey) {
     let wallet = new Wallet(privateKey);
     return wallet;
@@ -13,4 +13,13 @@ export function validatePrivateKey(value) {
         return false;
     }
     return true;
+}
+
+export async function getAddress(useMetamask) {
+    if (useMetamask==='true' || useMetamask===true) {
+        let provider = new ethers.providers.Web3Provider(window.ethereum);
+        const accounts = await provider.send("eth_requestAccounts");
+        return accounts[0]
+    }
+    return '';
 }

src/views/HomeView.vue

@@ -118,9 +118,15 @@
           ></div>
           <span
             class="ml-3 text-sm font-medium text-gray-900 dark:text-gray-300"
-            >Use MetaMask</span
+            >Use MetaMask
+            </span
           >
+          <ConnectAccount
+          :address="address" class="ml-3 text-sm font-medium text-gray-900 dark:text-gray-300"
+          v-if="address.length > 0"
+        />
         </label>
+
       </div>
       <ProposalsList
         :proposals="proposals"
@@ -184,21 +190,23 @@
 <script>
 import { spacesList } from "../config/spaces";
 import { getActiveProposals } from "../utils/snapshot";
+import { getAddress } from "../utils/wallet";
 import ProposalsList from "@/components/ProposalsList.vue";
 import AppFooter from "@/components/AppFooter.vue";
 import KeysInput from "@/components/KeysInput.vue";
 import MetamaskVote from "@/components/MetamaskVote.vue";
 import AccountSingle from "@/components/Accounts/AccountSingle.vue";
-
+import ConnectAccount from "@/components/ConnectAccount.vue";
 export default {
   mounted() {
     if (window.ethereum) {
-      window.addEventListener("accountsChanged", () => {
+      window.ethereum.on("accountsChanged", () => {
         this.proposals = [];
         this.selected = "none";
         this.ready = false;
         this.response = {};
         this.populateOptions();
+        this.updateAddress(this.useMetamask);
       });
     }
   },
@@ -207,6 +215,7 @@ export default {
       this.$store.state.spaceMap.set(space.id, space);
     }
     this.populateOptions();
+    this.updateAddress(this.useMetamask);
   },
   data() {
     return {
@@ -216,18 +225,19 @@ export default {
       options: [],
       ready: false,
       useMetamask: false,
+      address: "",
     };
   },
   methods: {
     close() {
       this.response = {};
     },
     async toggle() {
-      this.response = {};
-      this.proposals = [];
-      this.selected = "none";
-      this.ready = false;
       this.populateOptions();
+      this.updateAddress(this.useMetamask);
+    },
+    async updateAddress() {
+      this.address = await getAddress(this.useMetamask);
     },
     populateOptions() {
       this.options = [];
@@ -272,6 +282,7 @@ export default {
     KeysInput,
     MetamaskVote,
     AccountSingle,
+    ConnectAccount,
   },
 };
 </script>