From c9c19adac64187abfb25fabf59fc22145b0655e1 Mon Sep 17 00:00:00 2001
From: Bruno <brest.dallacosta@outlook.com>
Date: Wed, 14 Dec 2022 18:26:25 -0300
Subject: [PATCH] Fixing 'amount' error, separating getWalletTransactions in
 different functions for future use

---
 src/components/ListComponent.vue   |  42 ++++--------
 src/components/QrCodeComponent.vue |   1 -
 src/components/SearchComponent.vue |   6 +-
 src/utils/blockchain.ts            | 100 +++++++++++++++++++++++------
 src/views/HomeView.vue             |  33 ++++------
 src/views/MockView.vue             |   8 ++-
 6 files changed, 118 insertions(+), 72 deletions(-)

diff --git a/src/components/ListComponent.vue b/src/components/ListComponent.vue
index a417ed5..52dcc83 100644
--- a/src/components/ListComponent.vue
+++ b/src/components/ListComponent.vue
@@ -1,19 +1,13 @@
 <script setup lang="ts">
 import CustomButton from "@/components/CustomButton.vue";
-import { BigNumber } from "ethers";
 import blockchain from "../utils/blockchain";
 
 // props and store references
 const props = defineProps({
-  lastWalletTransactions: Array,
-  tokenAmmount: BigNumber,
+  lastWalletReleaseTransactions: Array,
+  tokenAmount: Number,
 });
 
-const teste = (amount: any) => {
-  console.log(amount);
-  console.log("Teste");
-};
-
 const formatEventsAmount = (amount: any) => {
   try {
     const formated = blockchain.formatBigNumber(amount);
@@ -42,9 +36,7 @@ const openEtherscanUrl = (url: string) => {
       >
         <div>
           <p>Tokens recebidos</p>
-          <p class="text-2xl text-gray-900">
-            {{ teste(props.tokenAmmount) }} BRZ
-          </p>
+          <p class="text-2xl text-gray-900">{{ props.tokenAmount }} BRZ</p>
         </div>
         <div class="my-5">
           <p>
@@ -82,30 +74,24 @@ const openEtherscanUrl = (url: string) => {
     <div class="blur-container">
       <div
         class="flex flex-row justify-between w-full bg-white p-5 rounded-lg"
-        v-for="deposit in lastWalletTransactions"
-        :key="deposit?.blockNumber"
+        v-for="release in lastWalletReleaseTransactions"
+        :key="release?.blockNumber"
       >
-        <p class="last-deposit-info">
-          {{ formatEventsAmount(deposit?.args.amount) }} BRZ
+        <p class="last-release-info">
+          {{ formatEventsAmount(release?.args.amount) }} BRZ
         </p>
-        <p class="last-deposit-info">
-          {{
-            deposit?.event == "DepositAdded"
-              ? "Depósito"
-              : deposit?.event == "LockAdded"
-              ? "Reserva"
-              : "Compra"
-          }}
+        <p class="last-release-info">
+          {{ "Compra" }}
         </p>
         <div
           class="flex gap-2 cursor-pointer items-center"
           @click="
             openEtherscanUrl(
-              `https://etherscan.io/tx/${deposit?.transactionHash}`
+              `https://etherscan.io/tx/${release?.transactionHash}`
             )
           "
         >
-          <p class="last-deposit-info">Etherscan</p>
+          <p class="last-release-info">Etherscan</p>
           <img alt="Redirect image" src="@/assets/redirect.svg" />
         </div>
       </div>
@@ -113,11 +99,11 @@ const openEtherscanUrl = (url: string) => {
         type="button"
         class="text-white mt-2"
         @click="() => {}"
-        v-if="lastWalletTransactions?.length != 0"
+        v-if="lastWalletReleaseTransactions?.length != 0"
       >
         Carregar mais
       </button>
-      <p class="font-bold" v-if="lastWalletTransactions?.length == 0">
+      <p class="font-bold" v-if="lastWalletReleaseTransactions?.length == 0">
         Não há nenhuma transação anterior
       </p>
     </div>
@@ -148,7 +134,7 @@ p {
   @apply flex flex-col justify-center items-center px-8 py-6 gap-2 rounded-lg shadow-md shadow-gray-600 backdrop-blur-md mt-8 w-1/3;
 }
 
-.last-deposit-info {
+.last-release-info {
   @apply font-medium text-base;
 }
 
diff --git a/src/components/QrCodeComponent.vue b/src/components/QrCodeComponent.vue
index 43ccd65..47a1386 100644
--- a/src/components/QrCodeComponent.vue
+++ b/src/components/QrCodeComponent.vue
@@ -69,7 +69,6 @@ const validatePix = async () => {
 
 <template>
   <div class="page">
-    <h2>{{ e2eId }}</h2>
     <div class="text-container">
       <span class="text font-extrabold text-2xl max-w-[30rem]">
         Utilize o QR Code ou copie o código para realizar o Pix
diff --git a/src/components/SearchComponent.vue b/src/components/SearchComponent.vue
index bf18eb5..d5e5c53 100644
--- a/src/components/SearchComponent.vue
+++ b/src/components/SearchComponent.vue
@@ -60,9 +60,11 @@ const verifyLiquidity = () => {
   if (!walletAddress.value || tokenValue.value <= 0) return;
 
   depositsAddedList.value.find((element) => {
-    const p2pixTokenValue = blockchain.formatBigNumber(element.args.amount);
+    const p2pixTokenValue = Number(
+      blockchain.formatBigNumber(element.args.amount)
+    );
     if (
-      tokenValue.value!! <= Number(p2pixTokenValue) &&
+      tokenValue.value!! <= p2pixTokenValue &&
       tokenValue.value!! != 0 &&
       element.args.seller !== walletAddress.value
     ) {
diff --git a/src/utils/blockchain.ts b/src/utils/blockchain.ts
index d9e2eea..9552c12 100644
--- a/src/utils/blockchain.ts
+++ b/src/utils/blockchain.ts
@@ -21,8 +21,7 @@ const updateWalletStatus = async () => {
   const walletAddress = await provider.send("eth_requestAccounts", []);
 
   const balance = await contract.balanceOf(walletAddress[0]);
-
-  etherStore.setBalance(formatBigNumber(balance));
+  +etherStore.setBalance(formatBigNumber(balance));
   etherStore.setWalletAddress(ethers.utils.getAddress(walletAddress[0]));
 };
 
@@ -48,8 +47,8 @@ const splitTokens = async () => {
   }
 };
 
-// get wallet transactions
-const listTransactionByWalletAddress = async (
+// get all wallet transactions
+const listAllTransactionByWalletAddress = async (
   walletAddress: string
 ): Promise<any[] | undefined> => {
   const provider = getProvider();
@@ -76,6 +75,62 @@ const listTransactionByWalletAddress = async (
   );
 };
 
+// get wallet's deposit transactions
+const listDepositTransactionByWalletAddress = async (
+  walletAddress: string
+): Promise<any[] | undefined> => {
+  const provider = getProvider();
+  if (!provider) return;
+
+  const signer = provider.getSigner();
+  const p2pContract = new ethers.Contract(addresses.p2pix, p2pix.abi, signer);
+
+  const filterDeposits = p2pContract.filters.DepositAdded([walletAddress]);
+  const eventsDeposits = await p2pContract.queryFilter(filterDeposits);
+
+  return eventsDeposits.sort((a, b) => {
+    return b.blockNumber - a.blockNumber;
+  });
+};
+
+// get wallet's lock transactions
+const listLockTransactionByWalletAddress = async (
+  walletAddress: string
+): Promise<any[] | undefined> => {
+  const provider = getProvider();
+  if (!provider) return;
+
+  const signer = provider.getSigner();
+  const p2pContract = new ethers.Contract(addresses.p2pix, p2pix.abi, signer);
+
+  const filterAddedLocks = p2pContract.filters.LockAdded([walletAddress]);
+  const eventsAddedLocks = await p2pContract.queryFilter(filterAddedLocks);
+
+  return eventsAddedLocks.sort((a, b) => {
+    return b.blockNumber - a.blockNumber;
+  });
+};
+
+// get wallet's release transactions
+const listReleaseTransactionByWalletAddress = async (
+  walletAddress: string
+): Promise<any[] | undefined> => {
+  const provider = getProvider();
+  if (!provider) return;
+
+  const signer = provider.getSigner();
+  const p2pContract = new ethers.Contract(addresses.p2pix, p2pix.abi, signer);
+
+  const filterReleasedLocks = p2pContract.filters.LockReleased([walletAddress]);
+  const eventsReleasedLocks = await p2pContract.queryFilter(
+    filterReleasedLocks
+  );
+
+  return eventsReleasedLocks.sort((a, b) => {
+    return b.blockNumber - a.blockNumber;
+  });
+};
+
 // Update events at store methods
 const updateDepositAddedEvents = async () => {
   const etherStore = useEtherStore();
@@ -194,14 +249,14 @@ const mapDeposits = async (depositId: BigNumber) => {
 
   const signer = provider.getSigner();
   const contract = new ethers.Contract(addresses.p2pix, p2pix.abi, signer);
-  const deposit = await contract.mapDeposits(depositId.toNumber());
+  const deposit = await contract.mapDeposits(depositId);
 
   return deposit;
 };
 
 // Lock methods
 // Gets value from user's form to create a lock in the blockchain
-const addLock = async (depositId: Number, amount: Number) => {
+const addLock = async (depositId: BigNumber, amount: Number) => {
   const etherStore = useEtherStore();
   const provider = getProvider();
 
@@ -212,17 +267,19 @@ const addLock = async (depositId: Number, amount: Number) => {
   // Make lock
   const oldEventsLen = etherStore.locksAddedList.length;
   const lock = await p2pContract.lock(
-    depositId,
-    etherStore.walletAddress,
-    ethers.constants.AddressZero,
+    depositId, // BigNumber
+    etherStore.walletAddress, // String "0x70997970C51812dc3A010C7d01b50e0d17dc79C8" (Example)
+    ethers.constants.AddressZero, // String "0x0000000000000000000000000000000000000000"
     0,
-    ethers.utils.parseEther(amount.toString()),
+    formatEther(String(amount)), // BigNumber
     []
   );
   lock.wait();
+
   while (etherStore.locksAddedList.length === oldEventsLen) {
     await updateLockAddedEvents();
   }
+
   return lock;
 };
 
@@ -236,17 +293,14 @@ const mapLocks = async (lockId: string) => {
   const contract = new ethers.Contract(addresses.p2pix, p2pix.abi, signer);
   const lock = await contract.mapLocks(lockId);
 
-  console.log(lock);
-
-  console.log("Expiration block = ", Number(lock.expirationBlock));
   return lock;
 };
 
 // Releases lock by specific ID and other additional data
 const releaseLock = async (
   pixKey: string,
-  amount: string,
-  e2eId: Number,
+  amount: Number,
+  e2eId: string,
   lockId: string
 ) => {
   const provider = getProvider();
@@ -258,7 +312,7 @@ const releaseLock = async (
 
   const messageToSign = ethers.utils.solidityKeccak256(
     ["string", "uint256", "uint256"],
-    [pixKey, formatEther(amount), e2eId]
+    [pixKey, formatEther(String(amount)), formatEther(e2eId)]
   );
 
   const messageHashBytes = ethers.utils.arrayify(messageToSign);
@@ -268,7 +322,13 @@ const releaseLock = async (
   const signer = provider.getSigner();
   const p2pContract = new ethers.Contract(addresses.p2pix, p2pix.abi, signer);
 
-  const release = await p2pContract.release(lockId, e2eId, sig.r, sig.s, sig.v);
+  const release = await p2pContract.release(
+    lockId,
+    formatEther(e2eId),
+    sig.r,
+    sig.s,
+    sig.v
+  );
   release.wait();
   await updateLockReleasedEvents();
 
@@ -289,8 +349,12 @@ const formatBigNumber = (num: BigNumber) => {
 export default {
   connectProvider,
   formatEther,
+  updateWalletStatus,
   splitTokens,
-  listTransactionByWalletAddress,
+  listAllTransactionByWalletAddress,
+  listReleaseTransactionByWalletAddress,
+  listDepositTransactionByWalletAddress,
+  listLockTransactionByWalletAddress,
   addDeposit,
   mapDeposits,
   formatBigNumber,
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 6355408..6e22600 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -24,18 +24,18 @@ const tokenAmount = ref<number>();
 const lockTransactionHash = ref<string>("");
 const lockId = ref<string>("");
 const loadingRelease = ref<Boolean>(false);
-const lastWalletTransactions = ref<any[] | undefined>([]);
+const lastWalletReleaseTransactions = ref<any[] | undefined>([]);
 
 const confirmBuyClick = async ({ selectedDeposit, tokenValue }: any) => {
   // finish buy screen
-  console.log(selectedDeposit);
   let depositDetail;
+  // depositId is BigNumber type object
   const depositId = selectedDeposit["args"]["depositID"];
   await blockchain
     .mapDeposits(depositId)
     .then((deposit) => (depositDetail = deposit));
   tokenAmount.value = tokenValue;
-  pixTarget.value = depositDetail?.pixTarget;
+  pixTarget.value = String(depositDetail?.pixTarget);
 
   // Makes lock with deposit ID and the Amount
   if (depositDetail) {
@@ -61,36 +61,29 @@ const releaseTransaction = async ({ e2eId }: any) => {
 
   const findLockId = locksAddedList.value.find((element) => {
     if (element.transactionHash === lockTransactionHash.value) {
-      lockId.value = element.args.lockID;
+      lockId.value = element.args.lockID; // BigNumber type
       return true;
     }
     return false;
   });
 
   if (findLockId) {
-    console.log(
-      pixTarget.value,
-      String(tokenAmount.value),
-      Number(e2eId),
-      lockId.value
-    );
-
     const release = await blockchain.releaseLock(
-      pixTarget.value,
-      String(tokenAmount.value),
-      Number(e2eId),
-      lockId.value
+      pixTarget.value, // String
+      tokenAmount.value ?? 0, // Number
+      e2eId, // String
+      lockId.value // String
     );
     release.wait();
 
-    lastWalletTransactions.value =
-      await blockchain.listTransactionByWalletAddress(
+    lastWalletReleaseTransactions.value =
+      await blockchain.listReleaseTransactionByWalletAddress(
         walletAddress.value.toLowerCase()
       );
 
-    console.log(tokenAmount);
-
     loadingRelease.value = false;
+
+    blockchain.updateWalletStatus();
   }
 };
 </script>
@@ -115,8 +108,8 @@ const releaseTransaction = async ({ e2eId }: any) => {
   <div v-if="flowStep == Step.List">
     <ListComponent
       v-if="!loadingRelease"
+      :last-wallet-release-transactions="lastWalletReleaseTransactions"
       :tokenAmount="tokenAmount"
-      :last-wallet-transactions="lastWalletTransactions"
     />
     <ValidationComponent
       v-if="loadingRelease"
diff --git a/src/views/MockView.vue b/src/views/MockView.vue
index 2d8f55d..1f4324d 100644
--- a/src/views/MockView.vue
+++ b/src/views/MockView.vue
@@ -15,7 +15,7 @@ const depositValue = ref<Number>();
 const depositPixKey = ref<string>("");
 
 //  Split tokens between wallets in wallets.json
-const splitTokens = () => {
+const splitTokens = async () => {
   blockchain.splitTokens();
 };
 
@@ -40,13 +40,15 @@ const mockDeposit = () => {
 
 // Get specific deposit data by its ID
 const mapDeposit = (depositId: BigNumber) => {
-  blockchain.mapDeposits(depositId);
+  const deposit = blockchain.mapDeposits(depositId);
+  return deposit;
 };
 
 // Lock methods
 // Get specific lock data by its ID
 const mapLock = (lockId: string) => {
-  blockchain.mapLocks(lockId);
+  const lock = blockchain.mapLocks(lockId);
+  return lock;
 };
 </script>