change from deposits history to bid history and add it to bid_history router

src/components/ListingComponent.vue

@@ -154,7 +154,7 @@ showInitialItems();
       </button>
       <span class="text-gray-300">
         ({{ itemsToShow.length }} de
-        {{ props.walletTransactions.length }} transações)
+        {{ props.walletTransactions.length }} {{isManageMode ? 'ofertas' : 'transações'}})
       </span>
     </div>
 

src/components/SearchComponent.vue

@@ -62,7 +62,6 @@ const verifyLiquidity = () => {
   depositsValidList.value.find((element) => {
     const remaining = element.remaining;
     if (
-      element.valid == true &&
       tokenValue.value!! <= remaining &&
       tokenValue.value!! != 0 &&
       element.seller !== walletAddress.value

src/router/index.ts

@@ -3,7 +3,6 @@ import HomeView from "../views/HomeView.vue";
 import MockView from "../views/MockView.vue";
 import BidHistoryView from "../views/BidHistoryView.vue";
 import ManageBidsView from "../views/ManageBidsView.vue";
-import DepositsHistoryView from "../views/DepositsHistoryView.vue";
 import SellerView from "@/views/SellerView.vue";
 
 const router = createRouter({
@@ -34,11 +33,6 @@ const router = createRouter({
       name: "manage bids",
       component: ManageBidsView,
     },
-    {
-      path: "/deposits_history",
-      name: "deposits history",
-      component: DepositsHistoryView,
-    },
   ],
 });
 

src/views/BidHistoryView.vue

@@ -1,11 +1,53 @@
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import { useEtherStore } from "@/store/ether";
+import { storeToRefs } from "pinia";
+import { ref, watch } from "vue";
+import ListingComponent from "@/components/ListingComponent.vue";
+import blockchain from "../utils/blockchain";
+
+const etherStore = useEtherStore();
+const { walletAddress } = storeToRefs(etherStore);
+const allUserTransactions = ref<any[]>([]);
+
+  if (walletAddress.value) {
+  await blockchain.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);
+});
+
+watch(allUserTransactions, (newValue) => {
+  console.log(newValue);
+});
+</script>
 
 <template>
-  <div class="page">Histórico de ofertas</div>
+  <div class="page">
+    <div class="header">Histórico de transações</div>
+    <div class="w-full max-w-4xl">
+      <ListingComponent
+        :wallet-transactions="allUserTransactions"
+        :is-manage-mode="false"
+      ></ListingComponent>
+    </div>
+  </div>
 </template>
 
 <style scoped>
 .page {
-  @apply flex gap-8 mt-24;
+  @apply flex flex-col gap-10 mt-20 w-full items-center;
+}
+
+.header {
+  @apply text-3xl text-gray-900 leading-9 font-bold justify-center flex;
 }
 </style>

src/views/DepositsHistoryView.vue

@@ -1,45 +0,0 @@
-<script setup lang="ts">
-import { useEtherStore } from "@/store/ether";
-import { storeToRefs } from "pinia";
-import { ref, watch } from "vue";
-import ListingComponent from "@/components/ListingComponent.vue";
-import blockchain from "../utils/blockchain";
-
-const etherStore = useEtherStore();
-const { walletAddress } = storeToRefs(etherStore);
-const allUserTransactions = ref<any[]>([]);
-
-watch(walletAddress, async (newValue) => {
-  await blockchain.listAllTransactionByWalletAddress(newValue).then((res) => {
-    if (res) allUserTransactions.value = res;
-  });
-});
-
-watch(walletAddress, async (newValue) => {
-  console.log(newValue);
-});
-
-watch(allUserTransactions, (newValue) => {
-  console.log(newValue);
-});
-</script>
-
-<template>
-  <div class="page">
-    <div class="header">Histórico de Depósitos</div>
-    <ListingComponent
-      :wallet-transactions="allUserTransactions"
-      :is-manage-mode="false"
-    ></ListingComponent>
-  </div>
-</template>
-
-<style scoped>
-.page {
-  @apply flex flex-col gap-10 mt-20 w-full;
-}
-
-.header {
-  @apply text-3xl text-gray-900 leading-9 font-bold justify-center flex;
-}
-</style>

src/views/ManageBidsView.vue

@@ -7,9 +7,21 @@ import type { BigNumber } from "ethers";
 import { ref, watch } from "vue";
 
 const etherStore = useEtherStore();
+
+
 const { walletAddress } = storeToRefs(etherStore);
 const depositList = ref<any[]>([]);
 
+if (walletAddress.value) {
+  const walletDeposits =
+    await blockchain.listValidDepositTransactionsByWalletAddress(
+      walletAddress.value
+    );
+  if (walletDeposits) {
+    depositList.value = walletDeposits;
+  }
+}
+
 const handleCancelDeposit = async (depositID: BigNumber, index: number) => {
   const response = await blockchain.cancelDeposit(depositID);
   if (response == true) {
@@ -26,16 +38,6 @@ const handleWithDrawDeposit = async (depositID: BigNumber, index: number) => {
   }
 };
 
-if (walletAddress.value) {
-  const walletDeposits =
-    await blockchain.listValidDepositTransactionsByWalletAddress(
-      walletAddress.value
-    );
-  if (walletDeposits) {
-    depositList.value = walletDeposits;
-  }
-}
-
 watch(walletAddress, async () => {
   const walletDeposits =
     await blockchain.listValidDepositTransactionsByWalletAddress(