Merge branch 'search-tokens' into list-tokens

src/components/SearchComponent.vue

@@ -6,21 +6,28 @@ import { useEtherStore } from "@/store/ether";
 import { storeToRefs } from "pinia";
 import blockchain from "../utils/blockchain";
 
+// Store reference
 const etherStore = useEtherStore();
 
-const { walletAddress, depositList } = storeToRefs(etherStore);
+const { walletAddress, depositsAddedList } = storeToRefs(etherStore);
 
+// Reactive state
 const tokenValue = ref(0);
 const enableSelectButton = ref(false);
 const hasLiquidity = ref(true);
 const validDecimals = ref(true);
 const selectedDeposit = ref();
 
+// Emits
+const emit = defineEmits(["tokenBuy"]);
+
+// Blockchain methods
 const connectAccount = async () => {
   await blockchain.connectProvider();
   verifyLiquidity();
 };
 
+// Debounce methods
 const handleInputEvent = (event: any) => {
   const { value } = event.target;
 
@@ -36,6 +43,8 @@ const handleInputEvent = (event: any) => {
   verifyLiquidity();
 };
 
+// Enable button methods
+// Check if has more than 2 decimal places
 const decimalCount = (num: Number) => {
   const numStr = String(num);
   if (numStr.includes(".")) {
@@ -43,35 +52,36 @@ const decimalCount = (num: Number) => {
   }
   return 0;
 };
-
+// Verify if there is a valid deposit to buy
 const verifyLiquidity = () => {
   enableSelectButton.value = false;
   selectedDeposit.value = null;
 
-  if (!walletAddress.value || tokenValue.value == 0) return;
-
-  depositList.value.forEach((deposit) => {
-    const p2pixTokenValue = blockchain.verifyDepositAmmount(
-      deposit.args.amount
-    );
+  if (!walletAddress.value || tokenValue.value <= 0) return;
 
+  depositsAddedList.value.find((element) => {
+    const p2pixTokenValue = blockchain.formatBigNumber(element.args.amount);
     if (
       tokenValue.value!! <= Number(p2pixTokenValue) &&
-      tokenValue.value!! != 0
+      tokenValue.value!! != 0 &&
+      element.args.seller !== walletAddress.value
     ) {
       enableSelectButton.value = true;
       hasLiquidity.value = true;
-      selectedDeposit.value = deposit;
-      return;
+      selectedDeposit.value = element;
+      console.log(
+        "Selected is :",
+        blockchain.formatBigNumber(element.args.amount)
+      );
+      return true;
     }
+    return false;
   });
 
   if (!enableSelectButton.value) {
     hasLiquidity.value = false;
   }
 };
-
-const emit = defineEmits(["tokenBuy"]);
 </script>
 
 <template>

src/components/TopBar.vue

@@ -3,10 +3,12 @@ import { storeToRefs } from "pinia";
 import { useEtherStore } from "../store/ether";
 import blockchain from "../utils/blockchain";
 
+// Store reference
 const etherStore = useEtherStore();
 
 const { walletAddress, balance } = storeToRefs(etherStore);
 
+//Methods
 const connectMetaMask = () => {
   blockchain.connectProvider();
 };
@@ -15,8 +17,8 @@ const formatWalletAddress = (): string => {
   const walletAddressLength = walletAddress.value.length;
   const initialText = walletAddress.value.substring(0, 5);
   const finalText = walletAddress.value.substring(
-    walletAddressLength - 5,
-    walletAddressLength - 1
+    walletAddressLength - 4,
+    walletAddressLength
   );
   return `${initialText}...${finalText}`;
 };