Fixing 'amount' error, separating getWalletTransactions in different functions for future use

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;
 }
 

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

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
     ) {