Merge branch 'develop' into setup-tests

2023-01-24 17:13:00 -03:00
parent 98a5959369 7dc8d587e2
commit 65fc11a64f
34 changed files with 5160 additions and 25839 deletions
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -1,13 +1,17 @@
 <script setup lang="ts">
 import SearchComponent from "../components/SearchComponent.vue";
 import ValidationComponent from "../components/LoadingComponent.vue";
-import BuyConfirmedComponent from "@/components/BuyConfirmedComponent/BuyConfirmedComponent.vue";
-import blockchain from "../utils/blockchain";
-import { ref } from "vue";
-
+import BuyConfirmedComponent from "@/components/BuyConfirmedComponent.vue";
+import { ref, onMounted } from "vue";
 import { useEtherStore } from "@/store/ether";
 import QrCodeComponent from "../components/QrCodeComponent.vue";
 import { storeToRefs } from "pinia";
+import { addLock, releaseLock } from "@/blockchain/buyerMethods";
+import { updateWalletStatus } from "@/blockchain/wallet";
+import { getNetworksLiquidity } from "@/blockchain/events";
+import { listReleaseTransactionByWalletAddress } from "@/blockchain/wallet";
+import type { Event } from "ethers";
+import type { ValidDeposit } from "@/model/ValidDeposit";

 enum Step {
  Search,
@@ -19,33 +23,33 @@ const etherStore = useEtherStore();
 etherStore.setSellerView(false);

 // States
-const { loadingLock, walletAddress, locksAddedList } = storeToRefs(etherStore);
+const { loadingLock, walletAddress } = storeToRefs(etherStore);
 const flowStep = ref<Step>(Step.Search);
 const pixTarget = ref<string>("");
 const tokenAmount = ref<number>();
-const lockTransactionHash = ref<string>("");
-const lockId = ref<string>("");
-const loadingRelease = ref<Boolean>(false);
-const lastWalletReleaseTransactions = ref<any[]>([]);
+const _lockID = ref<string>("");
+const loadingRelease = ref<boolean>(false);
+const lastWalletReleaseTransactions = ref<Event[]>([]);

-const confirmBuyClick = async ({ selectedDeposit, tokenValue }: any) => {
+const confirmBuyClick = async (
+  selectedDeposit: ValidDeposit,
+  tokenValue: number
+) => {
  // finish buy screen
-  const depositDetail = selectedDeposit;
-  const depositId = selectedDeposit.depositID;
  pixTarget.value = selectedDeposit.pixKey;
  tokenAmount.value = tokenValue;

  // Makes lock with deposit ID and the Amount
-  if (depositDetail) {
+  if (selectedDeposit) {
    flowStep.value = Step.Buy;
    etherStore.setLoadingLock(true);

-    await blockchain
-      .addLock(depositId, tokenValue)
-      .then((lock) => {
-        lockTransactionHash.value = lock.hash;
+    await addLock(selectedDeposit.depositID, tokenValue)
+      .then((lockID) => {
+        _lockID.value = lockID;
      })
-      .catch(() => {
+      .catch((err) => {
+        console.log(err);
        flowStep.value = Step.Search;
      });

@@ -53,38 +57,34 @@ const confirmBuyClick = async ({ selectedDeposit, tokenValue }: any) => {
  }
 };

-const releaseTransaction = async ({ e2eId }: any) => {
+const releaseTransaction = async (e2eId: string) => {
  flowStep.value = Step.List;
  loadingRelease.value = true;

-  const findLock = locksAddedList.value.find((element) => {
-    if (element.transactionHash === lockTransactionHash.value) {
-      lockId.value = element.args.lockID;
-      return true;
-    }
-    return false;
-  });
-
-  if (findLock && tokenAmount.value) {
-    const release = await blockchain.releaseLock(
+  if (_lockID.value && tokenAmount.value) {
+    const release = await releaseLock(
      pixTarget.value,
      tokenAmount.value,
      e2eId,
-      lockId.value
+      _lockID.value
    );
    release.wait();

-    await blockchain
-      .listReleaseTransactionByWalletAddress(walletAddress.value.toLowerCase())
-      .then((releaseTransactions) => {
-        if (releaseTransactions)
-          lastWalletReleaseTransactions.value = releaseTransactions;
-      });
+    await listReleaseTransactionByWalletAddress(
+      walletAddress.value.toLowerCase()
+    ).then((releaseTransactions) => {
+      if (releaseTransactions)
+        lastWalletReleaseTransactions.value = releaseTransactions;
+    });

-    await blockchain.updateWalletStatus();
+    await updateWalletStatus();
    loadingRelease.value = false;
  }
 };
+
+onMounted(async () => {
+  await getNetworksLiquidity();
+});
 </script>

 <template>
--- a/src/views/ManageBidsView.vue
+++ b/src/views/ManageBidsView.vue
@@ -1,28 +1,31 @@
 <script setup lang="ts">
 import { useEtherStore } from "@/store/ether";
 import { storeToRefs } from "pinia";
-import blockchain from "../utils/blockchain";
-import ListingComponent from "@/components/ListingComponent/ListingComponent.vue";
+import ListingComponent from "@/components/ListingComponent.vue";
 import type { BigNumber } from "ethers";
-import { ref, watch } from "vue";
+import { ref, watch, onMounted } from "vue";
+import { cancelDeposit, withdrawDeposit } from "@/blockchain/buyerMethods";
+import { listValidDepositTransactionsByWalletAddress } from "@/blockchain/wallet";
+import type { ValidDeposit } from "@/model/ValidDeposit";

 const etherStore = useEtherStore();

-const { walletAddress } = storeToRefs(etherStore);
-const depositList = ref<any[]>([]);
+const { walletAddress, networkName } = storeToRefs(etherStore);
+const depositList = ref<ValidDeposit[]>([]);

-if (walletAddress.value) {
-  const walletDeposits =
-    await blockchain.listValidDepositTransactionsByWalletAddress(
+onMounted(async () => {
+  if (walletAddress.value) {
+    const walletDeposits = await listValidDepositTransactionsByWalletAddress(
      walletAddress.value
    );
-  if (walletDeposits) {
-    depositList.value = walletDeposits;
+    if (walletDeposits) {
+      depositList.value = walletDeposits;
+    }
  }
-}
+});

 const handleCancelDeposit = async (depositID: BigNumber, index: number) => {
-  const response = await blockchain.cancelDeposit(depositID);
+  const response = await cancelDeposit(depositID);
  if (response == true) {
    console.log("Depósito cancelado com sucesso.");
    depositList.value.splice(index, 1);
@@ -30,7 +33,7 @@ const handleCancelDeposit = async (depositID: BigNumber, index: number) => {
 };

 const handleWithDrawDeposit = async (depositID: BigNumber, index: number) => {
-  const response = await blockchain.withdrawDeposit(depositID);
+  const response = await withdrawDeposit(depositID);
  if (response == true) {
    console.log("Token retirado com sucesso.");
    depositList.value.splice(index, 1);
@@ -38,13 +41,23 @@ const handleWithDrawDeposit = async (depositID: BigNumber, index: number) => {
 };

 watch(walletAddress, async () => {
-  const walletDeposits =
-    await blockchain.listValidDepositTransactionsByWalletAddress(
-      walletAddress.value
-    );
-  if (walletDeposits) {
-    depositList.value = walletDeposits;
-  }
+  await listValidDepositTransactionsByWalletAddress(walletAddress.value)
+    .then((res) => {
+      if (res) depositList.value = res;
+    })
+    .catch(() => {
+      depositList.value = [];
+    });
+});
+
+watch(networkName, async () => {
+  await listValidDepositTransactionsByWalletAddress(walletAddress.value)
+    .then((res) => {
+      if (res) depositList.value = res;
+    })
+    .catch(() => {
+      depositList.value = [];
+    });
 });
 </script>

--- a/src/views/MockView.vue
+++ b/src/views/MockView.vue
@@ -1,142 +0,0 @@
-<script setup lang="ts">
-import type { BigNumber } from "ethers";
-import { storeToRefs } from "pinia";
-import { ref } from "vue";
-import { useEtherStore } from "../store/ether";
-import blockchain from "../utils/blockchain";
-
-// Blockchain Data
-const etherStore = useEtherStore();
-const { depositsValidList } = storeToRefs(etherStore);
-const { depositsAddedList } = storeToRefs(etherStore);
-const { locksAddedList } = storeToRefs(etherStore);
-
-// Buyer's flow Data
-const depositValue = ref<Number>();
-const depositPixKey = ref<string>("");
-
-//  Split tokens between wallets in wallets.json
-const splitTokens = async () => {
-  blockchain.splitTokens();
-};
-
-// Formatting methods
-// Formats wallet address in 0x000...0000 format
-const formatWalletAddress = (wallet: string): string => {
-  const walletAddressLength = wallet.length;
-  const initialText = wallet.substring(0, 5);
-  const finalText = wallet.substring(
-    walletAddressLength - 4,
-    walletAddressLength
-  );
-  return `${initialText}...${finalText}`;
-};
-
-// Deposit methods
-// Gets value and pix key from user's form to create a deposit in the blockchain
-const mockDeposit = () => {
-  if (!depositValue.value || !depositPixKey.value) return;
-  blockchain.mockDeposit(depositValue.value, depositPixKey.value);
-};
-
-// Get specific deposit data by its ID
-const mapDeposit = (depositId: BigNumber) => {
-  const deposit = blockchain.mapDeposits(depositId);
-  return deposit;
-};
-
-// Lock methods
-// Get specific lock data by its ID
-const mapLock = (lockId: string) => {
-  const lock = blockchain.mapLocks(lockId);
-  return lock;
-};
-</script>
-
-<template>
-  <div class="page">
-    <div class="flex flex-col gap-4 justify-start items-start w-2/3">
-      <div class="flex gap-4 w-full justify-between">
-        <input
-          type="number"
-          class="default-input"
-          placeholder="Quantidade de tokens"
-          v-model="depositValue"
-        />
-
-        <input
-          type="text"
-          class="default-input"
-          placeholder="Chave pix"
-          v-model="depositPixKey"
-        />
-
-        <button type="button" class="default-button" @click="mockDeposit()">
-          Mockar depósitos
-        </button>
-      </div>
-
-      <button type="button" class="default-button" @click="splitTokens()">
-        Dividir tokens
-      </button>
-    </div>
-
-    <ul class="flex flex-col justify-center items-center gap-4">
-      <li
-        class="text-gray-900 font-semibold text-lg cursor-pointer border-2 border-amber-400 p-2 rounded-md bg-amber-200"
-        v-for="deposit in depositsAddedList"
-        :key="deposit.blockNumber"
-        @click="mapDeposit(deposit.args.depositID)"
-      >
-        Seller:<br />{{ formatWalletAddress(deposit.args.seller) }}<br />
-        MRBZ: {{ blockchain.formatBigNumber(deposit.args.amount) }}
-      </li>
-    </ul>
-    <ul class="flex flex-col justify-center items-center gap-4">
-      <li
-        class="text-gray-900 font-semibold text-lg cursor-pointer border-2 border-amber-400 p-2 rounded-md bg-amber-200"
-        v-for="lock in locksAddedList"
-        :key="lock.blockNumber"
-        @click="mapLock(lock.args.lockID)"
-      >
-        Buyer:<br />{{ formatWalletAddress(lock.args.buyer) }}<br />
-        MRBZ: {{ blockchain.formatBigNumber(lock.args.amount) }}
-      </li>
-    </ul>
-    <ul class="flex flex-col justify-center items-center gap-4">
-      <li
-        class="text-gray-900 font-semibold text-lg cursor-pointer border-2 border-amber-400 p-2 rounded-md bg-amber-200"
-        v-for="valid in depositsValidList"
-        :key="valid.depositID"
-        @click="mapDeposit(valid.depositID)"
-      >
-        Buyer:<br />{{ formatWalletAddress(valid.seller) }}<br />
-        MRBZ: {{ valid.remaining }}
-      </li>
-    </ul>
-  </div>
-</template>
-
-<style scoped>
-header {
-  @apply flex flex-row justify-between w-full items-center;
-}
-
-.default-button {
-  @apply p-2 rounded border-2 border-amber-400 text-gray-50 font-extrabold text-base w-full;
-}
-
-.default-input {
-  @apply border-none outline-none text-lg text-gray-900 w-64 p-2 rounded-lg;
-}
-
-.page {
-  @apply flex gap-8 mt-24;
-}
-
-@media (max-width: 1024px) {
-  .page {
-    @apply flex-wrap;
-  }
-}
-</style>
--- a/src/views/SellerView.vue
+++ b/src/views/SellerView.vue
@@ -2,7 +2,7 @@
 import WantSellComponent from "../components/SellerSteps/WantSellComponent.vue";
 import SendNetwork from "../components/SellerSteps/SendNetwork.vue";
 import ValidationComponent from "../components/LoadingComponent.vue";
-import blockchain from "../utils/blockchain";
+import { approveTokens, addDeposit } from "../blockchain/sellerMethods";

 import { ref } from "vue";
 import { useEtherStore } from "@/store/ether";
@@ -19,19 +19,20 @@ etherStore.setSellerView(true);
 const flowStep = ref<Step>(Step.Sell);
 const loading = ref<boolean>(false);

-const offerValue = ref<number>();
+const offerValue = ref<string>("");
 const pixKeyBuyer = ref<string>("");

 // Verificar tipagem
-const approveOffer = async ({ offer, pixKey }: any) => {
+const approveOffer = async (args: { offer: string; pixKey: string }) => {
  loading.value = true;
  try {
-    offerValue.value = offer;
-    pixKeyBuyer.value = pixKey;
-    await blockchain.approveTokens(Number(offerValue.value));
+    offerValue.value = args.offer;
+    pixKeyBuyer.value = args.pixKey;
+    await approveTokens(args.offer);
    flowStep.value = Step.Network;
    loading.value = false;
-  } catch {
+  } catch (err) {
+    console.log(err);
    flowStep.value = Step.Sell;
    loading.value = false;
  }
@@ -41,7 +42,7 @@ const sendNetwork = async () => {
  loading.value = true;
  try {
    if (offerValue.value && pixKeyBuyer.value) {
-      await blockchain.addDeposit(offerValue.value, pixKeyBuyer.value);
+      await addDeposit(String(offerValue.value), pixKeyBuyer.value);
      flowStep.value = Step.Sell;
      loading.value = false;
    }
--- a/src/views/TransactionHistoryView.vue
+++ b/src/views/TransactionHistoryView.vue
@@ -1,34 +1,42 @@
 <script setup lang="ts">
 import { useEtherStore } from "@/store/ether";
 import { storeToRefs } from "pinia";
-import { ref, watch } from "vue";
-import ListingComponent from "@/components/ListingComponent/ListingComponent.vue";
-import blockchain from "../utils/blockchain";
+import { ref, watch, onMounted } from "vue";
+import ListingComponent from "@/components/ListingComponent.vue";
+import { listAllTransactionByWalletAddress } from "@/blockchain/wallet";
+import type { Event } from "ethers";
+import type { ValidDeposit } from "@/model/ValidDeposit";

 const etherStore = useEtherStore();
-const { walletAddress } = storeToRefs(etherStore);
-const allUserTransactions = ref<any[]>([]);
+const { walletAddress, networkName } = storeToRefs(etherStore);
+const allUserTransactions = ref<(Event | ValidDeposit)[]>([]);

-if (walletAddress.value) {
-  await blockchain
-    .listAllTransactionByWalletAddress(walletAddress.value)
-    .then((res) => {
+onMounted(async () => {
+  if (walletAddress.value) {
+    await listAllTransactionByWalletAddress(walletAddress.value).then((res) => {
      if (res) allUserTransactions.value = res;
    });
-}
-
-watch(walletAddress, async (newValue) => {
-  await blockchain.listAllTransactionByWalletAddress(newValue).then((res) => {
-    if (res) allUserTransactions.value = res;
-  });
+  }
 });

 watch(walletAddress, async (newValue) => {
-  console.log(newValue);
+  await listAllTransactionByWalletAddress(newValue)
+    .then((res) => {
+      if (res) allUserTransactions.value = res;
+    })
+    .catch(() => {
+      allUserTransactions.value = [];
+    });
 });

-watch(allUserTransactions, (newValue) => {
-  console.log(newValue);
+watch(networkName, async () => {
+  await listAllTransactionByWalletAddress(walletAddress.value)
+    .then((res) => {
+      if (res) allUserTransactions.value = res;
+    })
+    .catch(() => {
+      allUserTransactions.value = [];
+    });
 });
 </script>