From 9fa2b34a5d5bccbf8599e54e8281fbc4ee4c79c7 Mon Sep 17 00:00:00 2001
From: Filipe Soccol <filipe.soccol@gmail.com>
Date: Tue, 1 Apr 2025 12:04:24 -0300
Subject: [PATCH] Update all to useUSer composabe. Still some bugs to resolve.

---
 package.json                                  |   4 +-
 src/App.vue                                   |   4 +
 src/blockchain/__tests__/addresses.spec.ts    |  30 ++--
 src/blockchain/addresses.ts                   |  18 +-
 src/blockchain/buyerMethods.ts                | 160 +++++-------------
 src/blockchain/events.ts                      |  26 ++-
 src/blockchain/provider.ts                    |  19 ++-
 src/blockchain/sellerMethods.ts               |  44 ++---
 src/blockchain/wallet.ts                      |  65 +++----
 .../BuyConfirmedComponent.vue                 |  20 +--
 .../ListingComponent/ListingComponent.vue     |  17 +-
 .../__tests__/ListingComponent.spec.ts        |   4 +-
 src/components/SearchComponent.vue            |   9 +-
 .../SellerSteps/SellerComponent.vue           |   9 +-
 .../SellerSteps/SellerSearchComponent.vue     |  11 +-
 src/components/ToasterComponent.vue           | 106 ++++++++++++
 src/components/TopBar/TopBar.vue              |  28 +--
 .../TopBar/__tests__/TopBar.spec.ts           |   6 +-
 src/composables/useUser.ts                    | 103 +++++++++++
 src/main.ts                                   |   2 -
 src/store/viem.ts                             |  65 -------
 src/utils/imagesPath.ts                       |  17 +-
 src/views/HomeView.vue                        |  20 +--
 src/views/ManageBidsView.vue                  |  11 +-
 src/views/SellerView.vue                      |  16 +-
 yarn.lock                                     | 135 ++++++++-------
 26 files changed, 495 insertions(+), 454 deletions(-)
 create mode 100644 src/components/ToasterComponent.vue
 create mode 100644 src/composables/useUser.ts
 delete mode 100644 src/store/viem.ts

diff --git a/package.json b/package.json
index 29fbb6d..54388ec 100644
--- a/package.json
+++ b/package.json
@@ -25,9 +25,8 @@
     "crc": "^3.8.0",
     "ethers": "^6.13.4",
     "marked": "^4.2.12",
-    "pinia": "^2.0.23",
     "qrcode": "^1.5.1",
-    "viem": "2.x",
+    "viem": "^2.24.3",
     "vite-svg-loader": "^5.1.0",
     "vue": "^3.2.41",
     "vue-markdown": "^2.2.4",
@@ -36,7 +35,6 @@
   "devDependencies": {
     "@babel/preset-env": "^7.20.2",
     "@babel/preset-typescript": "^7.18.6",
-    "@pinia/testing": "^0.0.14",
     "@rushstack/eslint-patch": "^1.1.4",
     "@types/crc": "^3.8.0",
     "@types/jest": "^27.0.0",
diff --git a/src/App.vue b/src/App.vue
index 02ab545..b9816b9 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -2,13 +2,16 @@
 import { useRoute } from "vue-router";
 import TopBar from "@/components/TopBar/TopBar.vue";
 import SpinnerComponent from "@/components/SpinnerComponent.vue";
+import ToasterComponent from "@/components/ToasterComponent.vue";
 import { init, useOnboard } from "@web3-onboard/vue";
 import injectedModule from "@web3-onboard/injected-wallets";
 import { Networks } from "./model/Networks";
 import { NetworkEnum } from "./model/NetworkEnum";
+import { ref } from "vue";
 
 const route = useRoute();
 const injected = injectedModule();
+const targetNetwork = ref(NetworkEnum.sepolia);
 
 const web3Onboard = init({
   wallets: [injected],
@@ -58,5 +61,6 @@ if (!connectedWallet) {
         </Transition>
       </template>
     </RouterView>
+    <ToasterComponent :targetNetwork="targetNetwork" />
   </div>
 </template>
diff --git a/src/blockchain/__tests__/addresses.spec.ts b/src/blockchain/__tests__/addresses.spec.ts
index a8bd566..8ea10ec 100644
--- a/src/blockchain/__tests__/addresses.spec.ts
+++ b/src/blockchain/__tests__/addresses.spec.ts
@@ -8,7 +8,7 @@ import {
 
 import { setActivePinia, createPinia } from "pinia";
 import { NetworkEnum, TokenEnum } from "@/model/NetworkEnum";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 
 describe("addresses.ts types", () => {
   it("My addresses.ts types work properly", () => {
@@ -25,16 +25,16 @@ describe("addresses.ts functions", () => {
   });
 
   it("getTokenAddress Ethereum", () => {
-    const etherStore = useViemStore();
-    etherStore.setNetworkId(NetworkEnum.sepolia);
+    const user = useUser();
+    user.setNetworkId(NetworkEnum.sepolia);
     expect(getTokenAddress(TokenEnum.BRZ)).toBe(
       "0x4A2886EAEc931e04297ed336Cc55c4eb7C75BA00"
     );
   });
 
   it("getTokenAddress Rootstock", () => {
-    const etherStore = useViemStore();
-    etherStore.setNetworkId(NetworkEnum.rootstock);
+    const user = useUser();
+    user.setNetworkId(NetworkEnum.rootstock);
     expect(getTokenAddress(TokenEnum.BRZ)).toBe(
       "0xfE841c74250e57640390f46d914C88d22C51e82e"
     );
@@ -47,16 +47,16 @@ describe("addresses.ts functions", () => {
   });
 
   it("getP2PixAddress Ethereum", () => {
-    const etherStore = useViemStore();
-    etherStore.setNetworkId(NetworkEnum.sepolia);
+    const user = useUser();
+    user.setNetworkId(NetworkEnum.sepolia);
     expect(getP2PixAddress()).toBe(
       "0x2414817FF64A114d91eCFA16a834d3fCf69103d4"
     );
   });
 
   it("getP2PixAddress Rootstock", () => {
-    const etherStore = useViemStore();
-    etherStore.setNetworkId(NetworkEnum.rootstock);
+    const user = useUser();
+    user.setNetworkId(NetworkEnum.rootstock);
     expect(getP2PixAddress()).toBe(
       "0x98ba35eb14b38D6Aa709338283af3e922476dE34"
     );
@@ -69,14 +69,14 @@ describe("addresses.ts functions", () => {
   });
 
   it("getProviderUrl Ethereum", () => {
-    const etherStore = useViemStore();
-    etherStore.setNetworkId(NetworkEnum.sepolia);
+    const user = useUser();
+    user.setNetworkId(NetworkEnum.sepolia);
     expect(getProviderUrl()).toBe(import.meta.env.VITE_GOERLI_API_URL);
   });
 
   it("getProviderUrl Rootstock", () => {
-    const etherStore = useViemStore();
-    etherStore.setNetworkId(NetworkEnum.rootstock);
+    const user = useUser();
+    user.setNetworkId(NetworkEnum.rootstock);
     expect(getProviderUrl()).toBe(import.meta.env.VITE_ROOTSTOCK_API_URL);
   });
 
@@ -85,8 +85,8 @@ describe("addresses.ts functions", () => {
   });
 
   it("isPossibleNetwork Returns", () => {
-    const etherStore = useViemStore();
-    etherStore.setNetworkId(NetworkEnum.sepolia);
+    const user = useUser();
+    user.setNetworkId(NetworkEnum.sepolia);
     expect(isPossibleNetwork(0x5 as NetworkEnum)).toBe(true);
     expect(isPossibleNetwork(5 as NetworkEnum)).toBe(true);
     expect(isPossibleNetwork(0x13881 as NetworkEnum)).toBe(true);
diff --git a/src/blockchain/addresses.ts b/src/blockchain/addresses.ts
index 8059b8f..c812e9f 100644
--- a/src/blockchain/addresses.ts
+++ b/src/blockchain/addresses.ts
@@ -1,4 +1,4 @@
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import { NetworkEnum, TokenEnum } from "@/model/NetworkEnum";
 import { createPublicClient, http } from "viem";
 import { sepolia, rootstock } from "viem/chains";
@@ -15,8 +15,8 @@ const Tokens: { [key in NetworkEnum]: { [key in TokenEnum]: string } } = {
 };
 
 export const getTokenByAddress = (address: string) => {
-  const viemStore = useViemStore();
-  const networksTokens = Tokens[viemStore.networkName];
+  const user = useUser();
+  const networksTokens = Tokens[user.networkName.value];
   for (const [token, tokenAddress] of Object.entries(networksTokens)) {
     if (tokenAddress.toLowerCase() === address.toLowerCase()) {
       return token;
@@ -29,28 +29,28 @@ export const getTokenAddress = (
   token: TokenEnum,
   network?: NetworkEnum
 ): string => {
-  const viemStore = useViemStore();
-  return Tokens[network ? network : viemStore.networkName][token];
+  const user = useUser();
+  return Tokens[network ? network : user.networkName.value][token];
 };
 
 export const getP2PixAddress = (network?: NetworkEnum): string => {
-  const viemStore = useViemStore();
+  const user = useUser();
   const possibleP2PixAddresses: { [key in NetworkEnum]: string } = {
     [NetworkEnum.sepolia]: "0x2414817FF64A114d91eCFA16a834d3fCf69103d4",
     [NetworkEnum.rootstock]: "0x98ba35eb14b38D6Aa709338283af3e922476dE34",
   };
 
-  return possibleP2PixAddresses[network ? network : viemStore.networkName];
+  return possibleP2PixAddresses[network ? network : user.networkName.value];
 };
 
 export const getProviderUrl = (network?: NetworkEnum): string => {
-  const viemStore = useViemStore();
+  const user = useUser();
   const possibleProvidersUrls: { [key in NetworkEnum]: string } = {
     [NetworkEnum.sepolia]: import.meta.env.VITE_SEPOLIA_API_URL,
     [NetworkEnum.rootstock]: import.meta.env.VITE_RSK_API_URL,
   };
 
-  return possibleProvidersUrls[network || viemStore.networkName];
+  return possibleProvidersUrls[network || user.networkName.value];
 };
 
 export const getProviderByNetwork = (network: NetworkEnum) => {
diff --git a/src/blockchain/buyerMethods.ts b/src/blockchain/buyerMethods.ts
index e0f2f8b..991fcaa 100644
--- a/src/blockchain/buyerMethods.ts
+++ b/src/blockchain/buyerMethods.ts
@@ -1,141 +1,61 @@
-import { getContract, getWalletClient } from "./provider";
+import { getContract } from "./provider";
 import { getTokenAddress } from "./addresses";
-import { parseEther, stringToHex, toHex } from "viem";
-
+import { parseEther } from "viem";
 import type { TokenEnum } from "@/model/NetworkEnum";
-import { createSolicitation } from "../utils/bbPay";
-import type { Offer } from "../utils/bbPay";
 
-const addLock = async (
-  sellerId: string,
-  token: string,
+export const addLock = async (
+  sellerAddress: string,
+  tokenAddress: string,
   amount: number
 ): Promise<string> => {
   const { address, abi, client } = await getContract();
-  const walletClient = getWalletClient();
-  
-  if (!walletClient) {
-    throw new Error("Wallet client not initialized");
-  }
-  
-  const [account] = await walletClient.getAddresses();
-  
-  const hash = await walletClient.writeContract({
+
+  const parsedAmount = parseEther(amount.toString());
+
+  const { request } = await client.simulateContract({
     address,
     abi,
-    functionName: 'lock',
-    args: [
-      sellerId,
-      token,
-      parseEther(String(amount)),
-      [],
-      []
-    ],
-    account
+    functionName: "addLock",
+    args: [sellerAddress, tokenAddress, parsedAmount],
   });
-  
+
+  const hash = await client.writeContract(request);
   const receipt = await client.waitForTransactionReceipt({ hash });
-  const logs = receipt.logs;
-  
-  // Extract the lockID from transaction logs
-  // This is a simplified approach - in production you'll want more robust log parsing
-  const lockId = logs[0].topics[2]; // Simplified - adjust based on actual event structure
-  
-  const offer: Offer = {
-    amount,
-    lockId: String(lockId),
-    sellerId: sellerId,
-  };
-  
-  await createSolicitation(offer);
-  
-  return String(lockId);
+
+  return receipt.status ? receipt.logs[0].topics[2] : "";
 };
 
-const releaseLock = async (
-  pixKey: string,
-  amount: number,
-  e2eId: string,
-  lockId: string
-): Promise<any> => {
-  const { address, abi, client } = await getContract();
-  const walletClient = getWalletClient();
-  
-  if (!walletClient) {
-    throw new Error("Wallet client not initialized");
-  }
-  
-  const [account] = await walletClient.getAddresses();
-  
-  // In a real implementation, you would get this signature from your backend
-  // This is just a placeholder for the mock implementation
-  const signature = "0x1234567890";
-  
-  const hash = await walletClient.writeContract({
-    address,
-    abi,
-    functionName: 'release',
-    args: [
-      BigInt(lockId),
-      toHex(e2eId, { size: 32 }),
-      signature
-    ],
-    account
-  });
-  
-  const receipt = await client.waitForTransactionReceipt({ hash });
-  return receipt;
-};
-
-const cancelDeposit = async (depositId: bigint): Promise<any> => {
-  const { address, abi, client } = await getContract();
-  const walletClient = getWalletClient();
-  
-  if (!walletClient) {
-    throw new Error("Wallet client not initialized");
-  }
-  
-  const [account] = await walletClient.getAddresses();
-  
-  const hash = await walletClient.writeContract({
-    address,
-    abi,
-    functionName: 'cancelDeposit',
-    args: [depositId],
-    account
-  });
-  
-  const receipt = await client.waitForTransactionReceipt({ hash });
-  return receipt;
-};
-
-const withdrawDeposit = async (
+export const withdrawDeposit = async (
   amount: string,
   token: TokenEnum
-): Promise<any> => {
+): Promise<boolean> => {
   const { address, abi, client } = await getContract();
-  const walletClient = getWalletClient();
-  
-  if (!walletClient) {
-    throw new Error("Wallet client not initialized");
-  }
-  
-  const [account] = await walletClient.getAddresses();
-  
-  const hash = await walletClient.writeContract({
+
+  const tokenAddress = getTokenAddress(token);
+
+  const { request } = await client.simulateContract({
     address,
     abi,
-    functionName: 'withdraw',
-    args: [
-      getTokenAddress(token),
-      parseEther(String(amount)),
-      []
-    ],
-    account
+    functionName: "withdrawDeposit",
+    args: [tokenAddress, parseEther(amount)],
   });
-  
+
+  const hash = await client.writeContract(request);
   const receipt = await client.waitForTransactionReceipt({ hash });
-  return receipt;
+
+  return receipt.status;
 };
 
-export { cancelDeposit, withdrawDeposit, addLock, releaseLock };
+export const releaseLock = async (solicitation: any): Promise<any> => {
+  const { address, abi, client } = await getContract();
+
+  const { request } = await client.simulateContract({
+    address,
+    abi,
+    functionName: "releaseLock",
+    args: [solicitation.lockId, solicitation.e2eId],
+  });
+
+  const hash = await client.writeContract(request);
+  return client.waitForTransactionReceipt({ hash });
+};
diff --git a/src/blockchain/events.ts b/src/blockchain/events.ts
index 481d3ee..51d5270 100644
--- a/src/blockchain/events.ts
+++ b/src/blockchain/events.ts
@@ -1,4 +1,4 @@
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import { formatEther, decodeEventLog, parseAbi, toHex, type PublicClient, type Address } from "viem";
 
 import p2pix from "@/utils/smart_contract_files/P2PIX.json";
@@ -14,8 +14,8 @@ import type { UnreleasedLock } from "@/model/UnreleasedLock";
 import type { Pix } from "@/model/Pix";
 
 const getNetworksLiquidity = async (): Promise<void> => {
-  const viemStore = useViemStore();
-  viemStore.setLoadingNetworkLiquidity(true);
+  const user = useUser();
+  user.setLoadingNetworkLiquidity(true);
 
   const depositLists: ValidDeposit[][] = [];
 
@@ -23,22 +23,16 @@ const getNetworksLiquidity = async (): Promise<void> => {
     (v) => !isNaN(Number(v))
   )) {
     console.log("getNetworksLiquidity", network);
-    
-    // Get public client for this network
-    const client = getProviderByNetwork(network as NetworkEnum);
-    const address = getP2PixAddress(network as NetworkEnum);
-    
-    depositLists.push(
-      await getValidDeposits(
-        getTokenAddress(viemStore.selectedToken, network as NetworkEnum),
-        network as NetworkEnum,
-        { client, address }
-      )
+    const deposits = await getValidDeposits(
+      getTokenAddress(user.selectedToken.value),
+      Number(network)
     );
+    if (deposits) depositLists.push(deposits);
   }
 
-  viemStore.setDepositsValidList(depositLists.flat());
-  viemStore.setLoadingNetworkLiquidity(false);
+  const allDeposits = depositLists.flat();
+  user.setDepositsValidList(allDeposits);
+  user.setLoadingNetworkLiquidity(false);
 };
 
 const getPixKey = async (seller: string, token: string): Promise<string> => {
diff --git a/src/blockchain/provider.ts b/src/blockchain/provider.ts
index 85a62d9..3ae1380 100644
--- a/src/blockchain/provider.ts
+++ b/src/blockchain/provider.ts
@@ -3,17 +3,17 @@ import { updateWalletStatus } from "./wallet";
 import { getProviderUrl, getP2PixAddress } from "./addresses";
 import { createPublicClient, createWalletClient, custom, http } from "viem";
 import { sepolia, rootstock } from "viem/chains";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 
 let publicClient = null;
 let walletClient = null;
 
 const getPublicClient = (onlyRpcProvider = false) => {
   if (onlyRpcProvider) {
-    const viemStore = useViemStore();
+    const user = useUser();
     const rpcUrl = getProviderUrl();
     return createPublicClient({
-      chain: viemStore.networkName === sepolia.id ? sepolia : rootstock,
+      chain: Number(user.networkName.value) === sepolia.id ? sepolia : rootstock,
       transport: http(rpcUrl)
     });
   }
@@ -28,24 +28,25 @@ const getContract = async (onlyRpcProvider = false) => {
   const client = getPublicClient(onlyRpcProvider);
   const address = getP2PixAddress();
   const abi = p2pix.abi;
-  
+
   return { address, abi, client };
 };
 
 const connectProvider = async (p: any): Promise<void> => {
-  const viemStore = useViemStore();
-  const chain = viemStore.networkName === sepolia.id ? sepolia : rootstock;
-  
+  console.log("Connecting to provider...");
+  const user = useUser();
+  const chain = Number(user.networkName.value) === sepolia.id ? sepolia : rootstock;
+
   publicClient = createPublicClient({
     chain,
     transport: custom(p)
   });
-  
+
   walletClient = createWalletClient({
     chain,
     transport: custom(p)
   });
-  
+
   await updateWalletStatus();
 };
 
diff --git a/src/blockchain/sellerMethods.ts b/src/blockchain/sellerMethods.ts
index 7027773..3b6d714 100644
--- a/src/blockchain/sellerMethods.ts
+++ b/src/blockchain/sellerMethods.ts
@@ -3,25 +3,25 @@ import { getTokenAddress, getP2PixAddress } from "./addresses";
 import { parseEther, toHex } from "viem";
 
 import mockToken from "../utils/smart_contract_files/MockToken.json";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import { createParticipant } from "@/utils/bbPay";
 import type { Participant } from "@/utils/bbPay";
 
 const approveTokens = async (participant: Participant): Promise<any> => {
-  const viemStore = useViemStore();
+  const user = useUser();
   const publicClient = getPublicClient();
   const walletClient = getWalletClient();
-  
+
   if (!publicClient || !walletClient) {
     throw new Error("Clients not initialized");
   }
-  
-  viemStore.setSeller(participant);
+
+  user.setSeller(participant);
   const [account] = await walletClient.getAddresses();
-  
+
   // Get token address
-  const tokenAddress = getTokenAddress(viemStore.selectedToken);
-  
+  const tokenAddress = getTokenAddress(user.selectedToken.value);
+
   // Check if the token is already approved
   const allowance = await publicClient.readContract({
     address: tokenAddress,
@@ -29,17 +29,17 @@ const approveTokens = async (participant: Participant): Promise<any> => {
     functionName: 'allowance',
     args: [account, getP2PixAddress()]
   });
-  
-  if (allowance < parseEther(participant.offer)) {
+
+  if (allowance < parseEther(participant.offer.toString())) {
     // Approve tokens
     const hash = await walletClient.writeContract({
       address: tokenAddress,
       abi: mockToken.abi,
       functionName: 'approve',
-      args: [getP2PixAddress(), parseEther(participant.offer)],
+      args: [getP2PixAddress(), parseEther(participant.offer.toString())],
       account
     });
-    
+
     await publicClient.waitForTransactionReceipt({ hash });
     return true;
   }
@@ -49,17 +49,17 @@ const approveTokens = async (participant: Participant): Promise<any> => {
 const addDeposit = async (): Promise<any> => {
   const { address, abi, client } = await getContract();
   const walletClient = getWalletClient();
-  const viemStore = useViemStore();
-  
+  const user = useUser();
+
   if (!walletClient) {
     throw new Error("Wallet client not initialized");
   }
-  
+
   const [account] = await walletClient.getAddresses();
-  
-  const sellerId = await createParticipant(viemStore.seller);
-  viemStore.setSellerId(sellerId.id);
-  
+
+  const sellerId = await createParticipant(user.seller.value);
+  user.setSellerId(sellerId.id);
+
   const hash = await walletClient.writeContract({
     address,
     abi,
@@ -67,13 +67,13 @@ const addDeposit = async (): Promise<any> => {
     args: [
       sellerId.id,
       toHex("", { size: 32 }),
-      getTokenAddress(viemStore.selectedToken),
-      parseEther(viemStore.seller.offer),
+      getTokenAddress(user.selectedToken.value),
+      parseEther(user.seller.value.offer),
       true
     ],
     account
   });
-  
+
   const receipt = await client.waitForTransactionReceipt({ hash });
   return receipt;
 };
diff --git a/src/blockchain/wallet.ts b/src/blockchain/wallet.ts
index 988096b..f30ceb5 100644
--- a/src/blockchain/wallet.ts
+++ b/src/blockchain/wallet.ts
@@ -5,7 +5,7 @@ import {
   type Log,
   parseAbi,
 } from "viem";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 
 import { getPublicClient, getWalletClient, getContract } from "./provider";
 import { getTokenAddress, isPossibleNetwork } from "./addresses";
@@ -21,46 +21,31 @@ import type { UnreleasedLock } from "@/model/UnreleasedLock";
 import type { Pix } from "@/model/Pix";
 
 export const updateWalletStatus = async (): Promise<void> => {
-  const viemStore = useViemStore();
+  const user = useUser();
 
   const publicClient = getPublicClient();
   const walletClient = getWalletClient();
-  
+
   if (!publicClient || !walletClient) {
     console.error("Client not initialized");
     return;
   }
-  
-  const chainId = await publicClient.getChainId();
-  if (!isPossibleNetwork(Number(chainId))) {
-    window.alert("Invalid chain!:" + chainId);
-    return;
-  }
-  viemStore.setNetworkId(Number(chainId));
 
-  // Get account address
-  const [address] = await walletClient.getAddresses();
-  
-  // Get token balance
-  const tokenAddress = getTokenAddress(viemStore.selectedToken);
-  const balanceResult = await publicClient.readContract({
-    address: tokenAddress,
-    abi: mockToken.abi,
-    functionName: 'balanceOf',
-    args: [address]
-  });
+  // Get balance
+  const [account] = await walletClient.getAddresses();
+  const balance = await publicClient.getBalance({ address: account });
 
-  viemStore.setBalance(formatEther(balanceResult));
-  viemStore.setWalletAddress(getAddress(address));
+  user.setWalletAddress(account);
+  user.setBalance(formatEther(balance));
 };
 
 export const listValidDepositTransactionsByWalletAddress = async (
   walletAddress: string
 ): Promise<ValidDeposit[]> => {
-  const viemStore = useViemStore();
+  const user = useUser();
   const walletDeposits = await getValidDeposits(
-    getTokenAddress(viemStore.selectedToken),
-    viemStore.networkName
+    getTokenAddress(user.selectedToken.value),
+    user.networkName.value
   );
   if (walletDeposits) {
     return walletDeposits
@@ -96,12 +81,12 @@ const filterLockStatus = async (
         data: transaction.data,
         topics: transaction.topics,
       });
-      
+
       if (!decoded || !decoded.args) continue;
-      
+
       // Type assertion to handle the args safely
       const args = decoded.args as Record<string, any>;
-      
+
       const tx: WalletTransaction = {
         token: args.token ? String(args.token) : "",
         blockNumber: Number(transaction.blockNumber),
@@ -244,7 +229,7 @@ const listLockTransactionByWalletAddress = async (
   });
 
   return lockLogs
-    .sort((a:Log, b:Log) => {
+    .sort((a: Log, b: Log) => {
       return Number(b.blockNumber) - Number(a.blockNumber);
     })
     .map((log: Log) => {
@@ -259,7 +244,7 @@ const listLockTransactionByWalletAddress = async (
         return null;
       }
     })
-    .filter((decoded:any) => decoded !== null);
+    .filter((decoded: any) => decoded !== null);
 };
 
 const listLockTransactionBySellerAddress = async (
@@ -267,7 +252,7 @@ const listLockTransactionBySellerAddress = async (
 ) => {
   const { address, abi, client } = await getContract(true);
   console.log("Will get locks as seller", sellerAddress);
-  
+
   const lockLogs = await client.getLogs({
     address,
     event: parseAbi(['event LockAdded(address indexed buyer, uint256 indexed lockID, address seller, address token, uint256 amount)'])[0],
@@ -290,8 +275,8 @@ const listLockTransactionBySellerAddress = async (
     })
     .filter((decoded: any) => decoded !== null)
     .filter(
-      (decoded:any) => decoded.args && decoded.args.seller && 
-      decoded.args.seller.toLowerCase() === sellerAddress.toLowerCase()
+      (decoded: any) => decoded.args && decoded.args.seller &&
+        decoded.args.seller.toLowerCase() === sellerAddress.toLowerCase()
     );
 };
 
@@ -304,25 +289,25 @@ export const checkUnreleasedLock = async (
   };
 
   const addedLocks = await listLockTransactionByWalletAddress(walletAddress);
-  
+
   if (!addedLocks.length) return undefined;
-  
+
   const lockIds = addedLocks.map((lock: any) => lock.args.lockID);
-  
+
   const lockStatus = await client.readContract({
     address,
     abi,
     functionName: 'getLocksStatus',
     args: [lockIds]
   });
-  
+
   const unreleasedLockId = lockStatus[1].findIndex(
     (status: number) => status == 1
   );
 
   if (unreleasedLockId !== -1) {
     const lockID = lockStatus[0][unreleasedLockId];
-    
+
     const lock = await client.readContract({
       address,
       abi,
@@ -351,7 +336,7 @@ export const getActiveLockAmount = async (
   if (!lockSeller.length) return 0;
 
   const lockIds = lockSeller.map((lock: any) => lock.args.lockID);
-  
+
   const lockStatus = await client.readContract({
     address,
     abi,
diff --git a/src/components/BuyConfirmedComponent/BuyConfirmedComponent.vue b/src/components/BuyConfirmedComponent/BuyConfirmedComponent.vue
index 4f22afc..c9cbc3b 100644
--- a/src/components/BuyConfirmedComponent/BuyConfirmedComponent.vue
+++ b/src/components/BuyConfirmedComponent/BuyConfirmedComponent.vue
@@ -8,7 +8,7 @@ import {
 import CustomButton from "@/components/CustomButton/CustomButton.vue";
 import type { ValidDeposit } from "@/model/ValidDeposit";
 import type { WalletTransaction } from "@/model/WalletTransaction";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import { NetworkEnum } from "@/model/NetworkEnum";
 import { onMounted, ref, watch } from "vue";
 import ListingComponent from "../ListingComponent/ListingComponent.vue";
@@ -19,8 +19,8 @@ const props = defineProps<{
   isCurrentStep: boolean;
 }>();
 
-const viemStore = useViemStore();
-const { walletAddress } = storeToRefs(viemStore);
+const user = useUser();
+const { walletAddress } = useUser();
 
 const lastWalletTransactions = ref<WalletTransaction[]>([]);
 const depositList = ref<ValidDeposit[]>([]);
@@ -29,7 +29,7 @@ const activeLockAmount = ref<number>(0);
 // methods
 
 const getWalletTransactions = async () => {
-  viemStore.setLoadingWalletTransactions(true);
+  user.setLoadingWalletTransactions(true);
   if (walletAddress.value) {
     const walletDeposits = await listValidDepositTransactionsByWalletAddress(
       walletAddress.value
@@ -48,20 +48,20 @@ const getWalletTransactions = async () => {
       lastWalletTransactions.value = allUserTransactions;
     }
   }
-  viemStore.setLoadingWalletTransactions(false);
+  user.setLoadingWalletTransactions(false);
 };
 
 const callWithdraw = async (amount: string) => {
   if (amount) {
-    viemStore.setLoadingWalletTransactions(true);
-    const withdraw = await withdrawDeposit(amount, viemStore.selectedToken);
+    user.setLoadingWalletTransactions(true);
+    const withdraw = await withdrawDeposit(amount, user.selectedToken.value);
     if (withdraw) {
       console.log("Saque realizado!");
       await getWalletTransactions();
     } else {
       console.log("Não foi possível realizar o saque!");
     }
-    viemStore.setLoadingWalletTransactions(false);
+    user.setLoadingWalletTransactions(false);
   }
 };
 
@@ -93,14 +93,14 @@ onMounted(async () => {
         <div>
           <p>Tokens recebidos</p>
           <p class="text-2xl text-gray-900">
-            {{ props.tokenAmount }} {{ viemStore.selectedToken }}
+            {{ props.tokenAmount }} {{ user.selectedToken }}
           </p>
         </div>
         <div class="my-5">
           <p class="text-sm">
             <b>Não encontrou os tokens? </b><br />Clique no botão abaixo para
             <br />
-            cadastrar o {{ viemStore.selectedToken }} em sua carteira.
+            cadastrar o {{ user.selectedToken }} em sua carteira.
           </p>
         </div>
         <CustomButton :text="'Cadastrar token'" @buttonClicked="() => {}" />
diff --git a/src/components/ListingComponent/ListingComponent.vue b/src/components/ListingComponent/ListingComponent.vue
index 876cb63..b07cdee 100644
--- a/src/components/ListingComponent/ListingComponent.vue
+++ b/src/components/ListingComponent/ListingComponent.vue
@@ -3,8 +3,7 @@ import { withdrawDeposit } from "@/blockchain/buyerMethods";
 import { NetworkEnum } from "@/model/NetworkEnum";
 import type { ValidDeposit } from "@/model/ValidDeposit";
 import type { WalletTransaction } from "@/model/WalletTransaction";
-import { useViemStore } from "@/store/viem";
-import { storeToRefs } from "pinia";
+import { useUser } from "@/composables/useUser";
 import { ref, watch, onMounted } from "vue";
 import SpinnerComponent from "../SpinnerComponent.vue";
 import { decimalCount } from "@/utils/decimalCount";
@@ -12,7 +11,7 @@ import { debounce } from "@/utils/debounce";
 import { getTokenByAddress } from "@/blockchain/addresses";
 import { useFloating, arrow, offset, flip, shift } from "@floating-ui/vue";
 
-const etherStore = useViemStore();
+const user = useUser();
 
 // props
 const props = defineProps<{
@@ -23,8 +22,9 @@ const props = defineProps<{
 
 const emit = defineEmits(["depositWithdrawn"]);
 
-const { loadingWalletTransactions } = storeToRefs(etherStore);
-const remaining = ref<number>(0.0);
+const { loadingWalletTransactions } = user;
+
+const remaining = ref<number>(0);
 const itemsToShow = ref<WalletTransaction[]>([]);
 const withdrawAmount = ref<string>("");
 const withdrawButtonOpacity = ref<number>(0.6);
@@ -85,8 +85,7 @@ watch(withdrawAmount, (): void => {
 });
 
 const getRemaining = (): number => {
-  if (props.validDeposits instanceof Array) {
-    // Here we are getting only the first element of the list because
+  if (props.validDeposits.length > 0) {
     // in this release only the BRL token is being used.
     const deposit = props.validDeposits[0];
     remaining.value = deposit ? deposit.remaining : 0;
@@ -96,7 +95,7 @@ const getRemaining = (): number => {
 };
 
 const getExplorer = (): string => {
-  return etherStore.networkName == NetworkEnum.sepolia
+  return user.networkName.value == NetworkEnum.sepolia
     ? "Etherscan"
     : "Polygonscan";
 };
@@ -107,7 +106,7 @@ const showInitialItems = (): void => {
 
 const openEtherscanUrl = (transactionHash: string): void => {
   const networkUrl =
-    etherStore.networkName == NetworkEnum.sepolia
+    user.networkName.value == NetworkEnum.sepolia
       ? "sepolia.etherscan.io"
       : "mumbai.polygonscan.com";
   const url = `https://${networkUrl}/tx/${transactionHash}`;
diff --git a/src/components/ListingComponent/__tests__/ListingComponent.spec.ts b/src/components/ListingComponent/__tests__/ListingComponent.spec.ts
index 7de5266..fba7a33 100644
--- a/src/components/ListingComponent/__tests__/ListingComponent.spec.ts
+++ b/src/components/ListingComponent/__tests__/ListingComponent.spec.ts
@@ -2,13 +2,13 @@ import { describe, it, expect, vi, beforeEach } from "vitest";
 import { mount } from "@vue/test-utils";
 import ListingComponent from "../ListingComponent.vue";
 import SpinnerComponent from "../../SpinnerComponent.vue";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import { MockValidDeposits } from "@/model/mock/ValidDepositMock";
 import { MockWalletTransactions } from "@/model/mock/WalletTransactionMock";
 
 describe("ListingComponent.vue", () => {
   beforeEach(() => {
-    useViemStore().setLoadingWalletTransactions(false);
+    useUser().setLoadingWalletTransactions(false);
   });
 
   test("Test Message when an empty array is received", () => {
diff --git a/src/components/SearchComponent.vue b/src/components/SearchComponent.vue
index 270902f..b7ad3d2 100644
--- a/src/components/SearchComponent.vue
+++ b/src/components/SearchComponent.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import { ref, computed, watch } from "vue";
-import { storeToRefs } from "pinia";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import SpinnerComponent from "@/components/SpinnerComponent.vue";
 import CustomButton from "@/components/CustomButton/CustomButton.vue";
 import { debounce } from "@/utils/debounce";
@@ -15,7 +14,7 @@ import { onClickOutside } from "@vueuse/core";
 import { TokenEnum } from "@/model/NetworkEnum";
 
 // Store reference
-const viemStore = useViemStore();
+const user = useUser();
 const selectTokenToggle = ref<boolean>(false);
 
 const {
@@ -24,7 +23,7 @@ const {
   selectedToken,
   depositsValidList,
   loadingNetworkLiquidity,
-} = storeToRefs(viemStore);
+} = user;
 
 // html references
 const tokenDropdownRef = ref<any>(null);
@@ -84,7 +83,7 @@ onClickOutside(tokenDropdownRef, () => {
 });
 
 const handleSelectedToken = (token: TokenEnum): void => {
-  viemStore.setSelectedToken(token);
+  user.setSelectedToken(token);
   selectTokenToggle.value = false;
 };
 
diff --git a/src/components/SellerSteps/SellerComponent.vue b/src/components/SellerSteps/SellerComponent.vue
index 92b5cd4..0483199 100644
--- a/src/components/SellerSteps/SellerComponent.vue
+++ b/src/components/SellerSteps/SellerComponent.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import { ref, computed } from "vue";
-import { storeToRefs } from "pinia";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import CustomButton from "@/components/CustomButton/CustomButton.vue";
 import { pixFormatValidation, postProcessKey } from "@/utils/pixKeyFormat";
 import { TokenEnum } from "@/model/NetworkEnum";
@@ -24,8 +23,8 @@ const tokenDropdownRef = ref<any>(null);
 const formRef = ref<HTMLFormElement | null>(null);
 
 // Reactive state
-const viemStore = useViemStore();
-const { walletAddress, selectedToken } = storeToRefs(viemStore);
+const user = useUser();
+const { walletAddress, selectedToken } = user;
 
 const fullName = ref<string>("");
 const offer = ref<string>("");
@@ -91,7 +90,7 @@ const openTokenSelection = (): void => {
 };
 
 const handleSelectedToken = (token: TokenEnum): void => {
-  viemStore.setSelectedToken(token);
+  user.setSelectedToken(token);
   selectTokenToggle.value = false;
 };
 </script>
diff --git a/src/components/SellerSteps/SellerSearchComponent.vue b/src/components/SellerSteps/SellerSearchComponent.vue
index 9fffac3..5be8f5d 100644
--- a/src/components/SellerSteps/SellerSearchComponent.vue
+++ b/src/components/SellerSteps/SellerSearchComponent.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import { ref, computed } from "vue";
-import { storeToRefs } from "pinia";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import SpinnerComponent from "@/components/SpinnerComponent.vue";
 import CustomButton from "@/components/CustomButton/CustomButton.vue";
 import { debounce } from "@/utils/debounce";
@@ -10,8 +9,8 @@ import { getTokenImage } from "@/utils/imagesPath";
 import { useOnboard } from "@web3-onboard/vue";
 
 // Store
-const viemStore = useViemStore();
-const { walletAddress } = storeToRefs(viemStore);
+const user = useUser();
+const { walletAddress } = user;
 
 // Reactive state
 const tokenValue = ref<number>(0);
@@ -76,10 +75,10 @@ const handleInputEvent = (event: any): void => {
             <img
               alt="Token image"
               class="w-fit"
-              :src="getTokenImage(viemStore.selectedToken)"
+              :src="getTokenImage(user.selectedToken.value)"
             />
             <span class="text-gray-900 text-lg w-fit" id="token">{{
-              viemStore.selectedToken
+              user.selectedToken
             }}</span>
           </div>
         </div>
diff --git a/src/components/ToasterComponent.vue b/src/components/ToasterComponent.vue
new file mode 100644
index 0000000..e8e2bfe
--- /dev/null
+++ b/src/components/ToasterComponent.vue
@@ -0,0 +1,106 @@
+<script setup lang="ts">
+import { ref, computed, watch, onMounted, watchEffect } from "vue";
+import { useOnboard } from "@web3-onboard/vue";
+import { Networks } from "../model/Networks";
+import { NetworkEnum } from "../model/NetworkEnum";
+import type { PropType } from "vue";
+import { useUser } from "@/composables/useUser";
+
+const props = defineProps({
+  targetNetwork: {
+    type: Object as PropType<NetworkEnum>,
+    default: NetworkEnum.sepolia,
+  },
+});
+
+const { connectedWallet } = useOnboard();
+const user = useUser();
+const { networkName } = user;
+
+const isWrongNetwork = ref(false);
+const currentNetworkName = ref("");
+const targetNetworkName = computed(
+  () => Networks[props.targetNetwork as keyof typeof Networks].chainName
+);
+
+const checkNetwork = () => {
+  if (connectedWallet.value) {
+    const chainId = connectedWallet.value.chains[0].id;
+    const targetChainId =
+      Networks[props.targetNetwork as keyof typeof Networks].chainId;
+
+    isWrongNetwork.value =
+      chainId.toLowerCase() !== targetChainId.toLowerCase();
+
+    // Find current network name
+    Object.entries(Networks).forEach(([key, network]) => {
+      if (network.chainId === chainId) {
+        currentNetworkName.value = network.chainName;
+      }
+    });
+  } else {
+    isWrongNetwork.value = false; // No wallet connected yet
+  }
+};
+
+const switchNetwork = async () => {
+  try {
+    if (connectedWallet.value && connectedWallet.value.provider) {
+      const targetChainId =
+        Networks[props.targetNetwork as keyof typeof Networks].chainId;
+      await connectedWallet.value.provider.request({
+        method: "wallet_switchEthereumChain",
+        params: [{ chainId: targetChainId }],
+      });
+    }
+  } catch (error) {
+    console.error("Failed to switch network:", error);
+  }
+};
+
+onMounted(checkNetwork);
+watch(connectedWallet, checkNetwork, { immediate: true });
+watch(networkName, checkNetwork, { immediate: true });
+</script>
+
+<template>
+  <transition name="slide-up" appear>
+    <div
+      v-if="isWrongNetwork"
+      class="fixed bottom-0 left-0 right-0 bg-red-500 text-white p-4 flex justify-between items-center z-50"
+    >
+      <div>
+        <span class="font-bold">Wrong network!</span>
+        <span v-if="currentNetworkName"
+          >You are connected to {{ currentNetworkName }}.</span
+        >
+        <span> Please switch to {{ targetNetworkName }}.</span>
+      </div>
+      <button
+        @click="switchNetwork"
+        class="bg-white text-red-500 px-4 py-2 rounded font-bold hover:bg-gray-100 transition-colors"
+      >
+        Switch Network
+      </button>
+    </div>
+  </transition>
+</template>
+
+<style scoped>
+.slide-up-enter-active,
+.slide-up-leave-active {
+  transition: transform 0.3s ease, opacity 0.3s ease;
+}
+
+.slide-up-enter-from,
+.slide-up-leave-to {
+  transform: translateY(100%);
+  opacity: 0;
+}
+
+.slide-up-enter-to,
+.slide-up-leave-from {
+  transform: translateY(0);
+  opacity: 1;
+}
+</style>
diff --git a/src/components/TopBar/TopBar.vue b/src/components/TopBar/TopBar.vue
index ce98d80..61c3937 100644
--- a/src/components/TopBar/TopBar.vue
+++ b/src/components/TopBar/TopBar.vue
@@ -1,8 +1,7 @@
 <script setup lang="ts">
-import { ref, computed, onMounted, watch } from "vue";
+import { ref, watch } from "vue";
 import { useRouter } from "vue-router";
-import { useViemStore } from "@/store/viem";
-import { storeToRefs } from "pinia";
+import { useUser } from "@/composables/useUser";
 import { onClickOutside } from "@vueuse/core";
 import { NetworkEnum } from "@/model/NetworkEnum";
 import { getNetworkImage } from "@/utils/imagesPath";
@@ -16,10 +15,9 @@ import LinkedinIcon from "@/assets/linkedinIcon.svg";
 import GithubIcon from "@/assets/githubIcon.svg";
 import { connectProvider } from "@/blockchain/provider";
 
-// Store reference
-const viemStore = useViemStore();
-
-const { walletAddress, sellerView } = storeToRefs(viemStore);
+// Use the new composable
+const user = useUser();
+const { walletAddress, sellerView } = user;
 
 const menuOpenToggle = ref<boolean>(false);
 const infoMenuOpenToggle = ref<boolean>(false);
@@ -39,11 +37,11 @@ const connnectWallet = async (): Promise<void> => {
 watch(connectedWallet, async (newVal: any) => {
   connectProvider(newVal.provider);
   const addresses = await newVal.provider.request({ method: "eth_accounts" });
-  viemStore.setWalletAddress(addresses.shift());
+  user.setWalletAddress(addresses.shift());
 });
 
 watch(connectedChain, (newVal: any) => {
-  viemStore.setNetworkId(newVal?.id);
+  user.setNetworkId(newVal?.id);
 });
 
 const formatWalletAddress = (): string => {
@@ -57,7 +55,7 @@ const formatWalletAddress = (): string => {
 };
 
 const disconnectUser = async (): Promise<void> => {
-  viemStore.setWalletAddress("");
+  user.setWalletAddress("");
   await disconnectWallet({ label: connectedWallet.value?.label || "" });
   closeMenu();
 };
@@ -73,7 +71,7 @@ const networkChange = async (network: NetworkEnum): Promise<void> => {
       chainId: Networks[network].chainId,
       wallet: connectedWallet.value?.label || "",
     });
-    viemStore.setNetworkId(network);
+    user.setNetworkId(network);
   } catch (error) {
     console.log("Error changing network", error);
   }
@@ -246,7 +244,7 @@ onClickOutside(infoMenuRef, () => {
         >
           <img
             alt="Choosed network image"
-            :src="getNetworkImage(NetworkEnum[viemStore.networkName])"
+            :src="getNetworkImage(NetworkEnum[user.networkName.value])"
             height="24"
             width="24"
           />
@@ -254,7 +252,11 @@ onClickOutside(infoMenuRef, () => {
             class="default-text hidden sm:inline-block text-gray-50 group-hover:text-gray-900 transition-all duration-500 ease-in-out whitespace-nowrap text-ellipsis overflow-hidden"
             :class="{ '!text-gray-900': currencyMenuOpenToggle }"
           >
-            {{ Networks[viemStore.networkName].chainName }}
+            {{
+              Networks[user.networkName.value]
+                ? Networks[user.networkName.value].chainName
+                : "Invalid Chain"
+            }}
           </span>
           <div
             class="transition-all duration-500 ease-in-out mt-1"
diff --git a/src/components/TopBar/__tests__/TopBar.spec.ts b/src/components/TopBar/__tests__/TopBar.spec.ts
index 31c0884..ecd81b4 100644
--- a/src/components/TopBar/__tests__/TopBar.spec.ts
+++ b/src/components/TopBar/__tests__/TopBar.spec.ts
@@ -1,7 +1,7 @@
 import { describe, it, expect, vi, beforeEach } from "vitest";
 import { mount } from "@vue/test-utils";
 import TopBar from "../TopBar.vue";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 
 import { createPinia, setActivePinia } from "pinia";
 
@@ -21,8 +21,8 @@ describe("TopBar.vue", () => {
   });
 
   it("should render button to change to seller view when in buyer screen", () => {
-    const viemStore = useViemStore();
-    viemStore.setSellerView(true);
+    const user = useUser();
+    user.setSellerView(true);
     const wrapper = mount(TopBar);
     expect(wrapper.html()).toContain("Quero comprar");
   });
diff --git a/src/composables/useUser.ts b/src/composables/useUser.ts
new file mode 100644
index 0000000..42c853a
--- /dev/null
+++ b/src/composables/useUser.ts
@@ -0,0 +1,103 @@
+import { ref } from 'vue'
+import { NetworkEnum, TokenEnum } from "../model/NetworkEnum"
+import type { ValidDeposit } from "@/model/ValidDeposit"
+import type { Participant } from "../utils/bbPay"
+
+const walletAddress = ref("")
+const balance = ref("")
+const networkName = ref(NetworkEnum.sepolia)
+const selectedToken = ref(TokenEnum.BRZ)
+const loadingLock = ref(false)
+const sellerView = ref(false)
+const depositsValidList = ref<ValidDeposit[]>([])
+const loadingWalletTransactions = ref(false)
+const loadingNetworkLiquidity = ref(false)
+const seller = ref<Participant>({} as Participant)
+const sellerId = ref("")
+
+export function useUser() {
+
+  // Actions become regular functions
+  const setWalletAddress = (address: string) => {
+    walletAddress.value = address
+  }
+
+  const setBalance = (newBalance: string) => {
+    balance.value = newBalance
+  }
+
+  const setSelectedToken = (token: TokenEnum) => {
+    selectedToken.value = token
+  }
+
+  const setNetworkId = (network: NetworkEnum) => {
+    console.log("setNetworkId", network)
+    networkName.value = Number(network)
+  }
+
+  const setLoadingLock = (isLoading: boolean) => {
+    loadingLock.value = isLoading
+  }
+
+  const setSellerView = (view: boolean) => {
+    sellerView.value = view
+  }
+
+  const setDepositsValidList = (deposits: ValidDeposit[]) => {
+    depositsValidList.value = deposits
+  }
+
+  const setLoadingWalletTransactions = (isLoading: boolean) => {
+    loadingWalletTransactions.value = isLoading
+  }
+
+  const setLoadingNetworkLiquidity = (isLoading: boolean) => {
+    loadingNetworkLiquidity.value = isLoading
+  }
+
+  const setSeller = (newSeller: Participant) => {
+    seller.value = newSeller
+  }
+
+  const setSellerId = (id: string) => {
+    sellerId.value = id
+  }
+
+  // Getters become computed or regular functions
+  const getValidDepositByWalletAddress = (address: string) => {
+    return depositsValidList.value
+      .filter((deposit) => deposit.seller == address)
+      .sort((a, b) => b.blockNumber - a.blockNumber)
+  }
+
+  return {
+    // State
+    walletAddress,
+    balance,
+    networkName,
+    selectedToken,
+    loadingLock,
+    sellerView,
+    depositsValidList,
+    loadingWalletTransactions,
+    loadingNetworkLiquidity,
+    seller,
+    sellerId,
+
+    // Actions
+    setWalletAddress,
+    setBalance,
+    setSelectedToken,
+    setNetworkId,
+    setLoadingLock,
+    setSellerView,
+    setDepositsValidList,
+    setLoadingWalletTransactions,
+    setLoadingNetworkLiquidity,
+    setSeller,
+    setSellerId,
+
+    // Getters
+    getValidDepositByWalletAddress
+  }
+}
\ No newline at end of file
diff --git a/src/main.ts b/src/main.ts
index 54e2868..f2c08d1 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,7 +1,6 @@
 import { createApp } from "vue";
 import App from "./App.vue";
 import router from "./router";
-import { createPinia } from "pinia";
 
 import "./assets/main.css";
 import "./assets/transitions.css";
@@ -9,6 +8,5 @@ import "./assets/transitions.css";
 const app = createApp(App);
 
 app.use(router);
-app.use(createPinia());
 
 app.mount("#app");
diff --git a/src/store/viem.ts b/src/store/viem.ts
deleted file mode 100644
index b21b27d..0000000
--- a/src/store/viem.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-import { NetworkEnum, TokenEnum } from "../model/NetworkEnum";
-import type { ValidDeposit } from "@/model/ValidDeposit";
-import type { Participant } from "../utils/bbPay";
-import { defineStore } from "pinia";
-
-export const useViemStore = defineStore("viem", {
-  state: () => ({
-    walletAddress: "",
-    balance: "",
-    networkName: NetworkEnum.sepolia,
-    selectedToken: TokenEnum.BRZ,
-    loadingLock: false,
-    sellerView: false,
-    depositsValidList: [] as ValidDeposit[],
-    loadingWalletTransactions: false,
-    loadingNetworkLiquidity: false,
-    seller: {} as Participant,
-    sellerId: "",
-  }),
-  actions: {
-    setWalletAddress(walletAddress: string) {
-      this.walletAddress = walletAddress;
-    },
-    setBalance(balance: string) {
-      this.balance = balance;
-    },
-    setSelectedToken(token: TokenEnum) {
-      this.selectedToken = token;
-    },
-    setNetworkId(networkName: NetworkEnum) {
-      this.networkName = Number(networkName);
-    },
-    setLoadingLock(isLoadingLock: boolean) {
-      this.loadingLock = isLoadingLock;
-    },
-    setSellerView(sellerView: boolean) {
-      this.sellerView = sellerView;
-    },
-    setDepositsValidList(depositsValidList: ValidDeposit[]) {
-      this.depositsValidList = depositsValidList;
-    },
-    setLoadingWalletTransactions(isLoadingWalletTransactions: boolean) {
-      this.loadingWalletTransactions = isLoadingWalletTransactions;
-    },
-    setLoadingNetworkLiquidity(isLoadingNetworkLiquidity: boolean) {
-      this.loadingNetworkLiquidity = isLoadingNetworkLiquidity;
-    },
-    setSeller(seller: Participant) {
-      this.seller = seller;
-    },
-    setSellerId(sellerId: string) {
-      this.sellerId = sellerId;
-    },
-  },
-  getters: {
-    getValidDepositByWalletAddress: (state) => {
-      return (walletAddress: string) =>
-        state.depositsValidList
-          .filter((deposit) => deposit.seller == walletAddress)
-          .sort((a, b) => {
-            return b.blockNumber - a.blockNumber;
-          });
-    },
-  },
-});
diff --git a/src/utils/imagesPath.ts b/src/utils/imagesPath.ts
index 7b0b670..5100d43 100644
--- a/src/utils/imagesPath.ts
+++ b/src/utils/imagesPath.ts
@@ -7,10 +7,19 @@ export const imagesPath = import.meta.glob<string>("@/assets/*.{png,svg}", {
 });
 
 export const getNetworkImage = (networkName: string): string => {
-  const path = Object.keys(imagesPath).find((key) =>
-    key.endsWith(`${networkName.toLowerCase()}.svg`)
-  );
-  return path ? imagesPath[path] : "";
+  try {
+    const path = Object.keys(imagesPath).find((key) =>
+      key.endsWith(`${networkName.toLowerCase()}.svg`)
+    );
+    return path ? imagesPath[path] : "";
+  } catch (error) {
+    console.error("Error fetching network image");
+    const path = Object.keys(imagesPath).find((key) =>
+      key.endsWith(`invalidIcon.svg`)
+    );
+    return path ? imagesPath[path] : "";
+    return "";
+  }
 };
 
 export const getTokenImage = (tokenName: TokenEnum): string => {
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 3ae4a59..3fab7a9 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -3,9 +3,8 @@ import SearchComponent from "@/components/SearchComponent.vue";
 import LoadingComponent from "@/components/LoadingComponent/LoadingComponent.vue";
 import BuyConfirmedComponent from "@/components/BuyConfirmedComponent/BuyConfirmedComponent.vue";
 import { ref, onMounted, watch } from "vue";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import QrCodeComponent from "@/components/QrCodeComponent.vue";
-import { storeToRefs } from "pinia";
 import { addLock, releaseLock } from "@/blockchain/buyerMethods";
 import { updateWalletStatus, checkUnreleasedLock } from "@/blockchain/wallet";
 import { getNetworksLiquidity } from "@/blockchain/events";
@@ -20,11 +19,11 @@ enum Step {
   List,
 }
 
-const viemStore = useViemStore();
-viemStore.setSellerView(false);
+const user = useUser();
+user.setSellerView(false);
 
 // States
-const { loadingLock, walletAddress, networkName } = storeToRefs(viemStore);
+const { loadingLock, walletAddress, networkName } = user;
 const flowStep = ref<Step>(Step.Search);
 const pixTarget = ref<string>();
 const tokenAmount = ref<number>();
@@ -34,18 +33,13 @@ const showModal = ref<boolean>(false);
 const showBuyAlert = ref<boolean>(false);
 const paramLockID = window.history.state?.lockID;
 
-const confirmBuyClick = async (
-  selectedDeposit: ValidDeposit,
-  tokenValue: number
-) => {
-  // finish buy screen
+const confirmBuyClick = async (selectedDeposit: ValidDeposit, tokenValue: number) => {
   pixTarget.value = selectedDeposit.pixKey;
   tokenAmount.value = tokenValue;
 
-  // Makes lock with deposit ID and the Amount
   if (selectedDeposit) {
     flowStep.value = Step.Buy;
-    viemStore.setLoadingLock(true);
+    user.setLoadingLock(true);
 
     await addLock(selectedDeposit.seller, selectedDeposit.token, tokenValue)
       .then((_lockID) => {
@@ -56,7 +50,7 @@ const confirmBuyClick = async (
         flowStep.value = Step.Search;
       });
 
-    viemStore.setLoadingLock(false);
+    user.setLoadingLock(false);
   }
 };
 
diff --git a/src/views/ManageBidsView.vue b/src/views/ManageBidsView.vue
index 49b5d86..1f4e10b 100644
--- a/src/views/ManageBidsView.vue
+++ b/src/views/ManageBidsView.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref, onMounted, watch } from "vue";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import ListingComponent from "@/components/ListingComponent/ListingComponent.vue";
 import LoadingComponent from "@/components/LoadingComponent/LoadingComponent.vue";
 import CustomAlert from "@/components/CustomAlert/CustomAlert.vue";
@@ -14,10 +14,9 @@ import type { ValidDeposit } from "@/model/ValidDeposit";
 import type { WalletTransaction } from "@/model/WalletTransaction";
 
 import router from "@/router/index";
-import { storeToRefs } from "pinia";
 
-const viemStore = useViemStore();
-const { walletAddress, networkName, selectedToken } = storeToRefs(viemStore);
+const user = useUser();
+const { walletAddress, networkName, selectedToken } = user;
 const loadingWithdraw = ref<boolean>(false);
 const showAlert = ref<boolean>(false);
 
@@ -47,7 +46,7 @@ const callWithdraw = async (amount: string) => {
 };
 
 const getWalletTransactions = async () => {
-  viemStore.setLoadingWalletTransactions(true);
+  user.setLoadingWalletTransactions(true);
   if (walletAddress.value) {
     console.log("Will fetch all required data...");
     const walletDeposits = await listValidDepositTransactionsByWalletAddress(
@@ -70,7 +69,7 @@ const getWalletTransactions = async () => {
       transactionsList.value = allUserTransactions;
     }
   }
-  viemStore.setLoadingWalletTransactions(false);
+  user.setLoadingWalletTransactions(false);
 };
 
 onMounted(async () => {
diff --git a/src/views/SellerView.vue b/src/views/SellerView.vue
index 5e59c65..9875020 100644
--- a/src/views/SellerView.vue
+++ b/src/views/SellerView.vue
@@ -1,13 +1,12 @@
 <script setup lang="ts">
 import { ref, onMounted, watch } from "vue";
-import { storeToRefs } from "pinia";
 
 import SellerComponent from "@/components/SellerSteps/SellerComponent.vue";
 import SearchComponent from "@/components/SearchComponent.vue";
 import SendNetwork from "@/components/SellerSteps/SendNetwork.vue";
 import SellerSearchComponent from "@/components/SellerSteps/SellerSearchComponent.vue";
 import LoadingComponent from "@/components/LoadingComponent/LoadingComponent.vue";
-import { useViemStore } from "@/store/viem";
+import { useUser } from "@/composables/useUser";
 import { approveTokens, addDeposit } from "@/blockchain/sellerMethods";
 
 import CustomAlert from "@/components/CustomAlert/CustomAlert.vue";
@@ -19,12 +18,11 @@ enum Step {
   Network,
 }
 
-const viemStore = useViemStore();
-viemStore.setSellerView(true);
+const user = useUser();
+user.setSellerView(true);
 
 const flowStep = ref<Step>(Step.Sell);
 const loading = ref<boolean>(false);
-
 const showAlert = ref<boolean>(false);
 
 // Verificar tipagem
@@ -44,7 +42,7 @@ const approveOffer = async (args: Participant) => {
 const sendNetwork = async () => {
   loading.value = true;
   try {
-    if (viemStore.seller) {
+    if (user.seller.value) {
       await addDeposit();
       flowStep.value = Step.Sell;
       loading.value = false;
@@ -74,9 +72,9 @@ const sendNetwork = async () => {
     />
     <div v-if="flowStep == Step.Network">
       <SendNetwork
-        :sellerId="viemStore.sellerId"
-        :offer="Number(viemStore.seller.offer)"
-        :selected-token="viemStore.selectedToken"
+        :sellerId="user.sellerId"
+        :offer="Number(user.seller.offer)"
+        :selected-token="user.selectedToken"
         v-if="!loading"
         @send-network="sendNetwork"
       />
diff --git a/yarn.lock b/yarn.lock
index 9b0cba6..0f49e21 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -12,7 +12,7 @@
   resolved "https://registry.yarnpkg.com/@adraffy/ens-normalize/-/ens-normalize-1.10.1.tgz#63430d04bd8c5e74f8d7d049338f1cd9d4f02069"
   integrity sha512-96Z2IP3mYmF1Xg2cDm8f1gWGf/HUVedQ3FMifV4kG/PQ4yEP51xDtRAEfhVNt5f/uzpNkZHwWQuUcu6D6K+Ekw==
 
-"@adraffy/ens-normalize@1.11.0":
+"@adraffy/ens-normalize@^1.10.1":
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/@adraffy/ens-normalize/-/ens-normalize-1.11.0.tgz#42cc67c5baa407ac25059fcd7d405cc5ecdb0c33"
   integrity sha512-/3DDPKHqqIqxUULp8yP4zODUY1i+2xvVWsv8A79xGWdCAG+8sb0hRh0Rk2QyOJUnnbyPUAZYcpBuRe3nS2OIUg==
@@ -1615,22 +1615,22 @@
   dependencies:
     "@noble/hashes" "1.3.2"
 
-"@noble/curves@1.6.0", "@noble/curves@^1.4.0", "@noble/curves@~1.6.0":
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/@noble/curves/-/curves-1.6.0.tgz#be5296ebcd5a1730fccea4786d420f87abfeb40b"
-  integrity sha512-TlaHRXDehJuRNR9TfZDNQ45mMEd5dwUwmicsafcIX4SsNiqnCHKjE/1alYPd/lDRVhxdhUAlv8uEhMCI5zjIJQ==
+"@noble/curves@1.8.1", "@noble/curves@^1.6.0", "@noble/curves@~1.8.1":
+  version "1.8.1"
+  resolved "https://registry.yarnpkg.com/@noble/curves/-/curves-1.8.1.tgz#19bc3970e205c99e4bdb1c64a4785706bce497ff"
+  integrity sha512-warwspo+UYUPep0Q+vtdVB4Ugn8GGQj8iyB3gnRWsztmUHTI3S1nhdiWNsPUGL0vud7JlRRk1XEu7Lq1KGTnMQ==
   dependencies:
-    "@noble/hashes" "1.5.0"
+    "@noble/hashes" "1.7.1"
 
 "@noble/hashes@1.3.2":
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.3.2.tgz#6f26dbc8fbc7205873ce3cee2f690eba0d421b39"
   integrity sha512-MVC8EAQp7MvEcm30KWENFjgR+Mkmf+D189XJTkFIlwohU5hcBbn1ZkKq7KVTi2Hme3PMGF390DaL52beVrIihQ==
 
-"@noble/hashes@1.5.0", "@noble/hashes@^1.4.0", "@noble/hashes@~1.5.0":
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.5.0.tgz#abadc5ca20332db2b1b2aa3e496e9af1213570b0"
-  integrity sha512-1j6kQFb7QRru7eKN3ZDvRcP13rugwdxZqCjbiAVZfIJwgj2A65UmT4TgARXGlXgnRkORLTDTrO19ZErt7+QXgA==
+"@noble/hashes@1.7.1", "@noble/hashes@^1.5.0", "@noble/hashes@~1.7.1":
+  version "1.7.1"
+  resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.7.1.tgz#5738f6d765710921e7a751e00c20ae091ed8db0f"
+  integrity sha512-B8XBPsn4vT/KJAGqDzbwztd+6Yte3P4V7iafm24bxgDe/mlRuK6xmWPuCNrKt2vDafZ8MfJLlchDG/vYafQEjQ==
 
 "@noble/hashes@~1.3.0", "@noble/hashes@~1.3.2":
   version "1.3.3"
@@ -1658,23 +1658,21 @@
     "@nodelib/fs.scandir" "2.1.5"
     fastq "^1.6.0"
 
-"@pinia/testing@^0.0.14":
-  version "0.0.14"
-  resolved "https://registry.npmjs.org/@pinia/testing/-/testing-0.0.14.tgz"
-  integrity sha512-ZmZwVNd/NnKYLIfjfuKl0zlJ3UdiXFpsHzSlL6wCeezSlyrqGMxsIQKv0J6fleu38gyCNTPBEipfxrt8V4+VIg==
-  dependencies:
-    vue-demi "*"
-
 "@rushstack/eslint-patch@^1.1.4":
   version "1.2.0"
   resolved "https://registry.npmjs.org/@rushstack/eslint-patch/-/eslint-patch-1.2.0.tgz"
   integrity sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==
 
-"@scure/base@~1.1.0", "@scure/base@~1.1.2", "@scure/base@~1.1.7", "@scure/base@~1.1.8":
+"@scure/base@~1.1.0", "@scure/base@~1.1.2":
   version "1.1.9"
   resolved "https://registry.yarnpkg.com/@scure/base/-/base-1.1.9.tgz#e5e142fbbfe251091f9c5f1dd4c834ac04c3dbd1"
   integrity sha512-8YKhl8GHiNI/pU2VMaofa2Tor7PJRAjwQLBBuilkJ9L5+13yVbC7JO/wS7piioAvPSwR3JKM1IJ/u4xQzbcXKg==
 
+"@scure/base@~1.2.2", "@scure/base@~1.2.4":
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/@scure/base/-/base-1.2.4.tgz#002eb571a35d69bdb4c214d0995dff76a8dcd2a9"
+  integrity sha512-5Yy9czTO47mqz+/J8GM6GIId4umdCk1wc1q8rKERQulIoc8VP9pzDcghv10Tl2E7R96ZUx/PhND3ESYUQX8NuQ==
+
 "@scure/bip32@1.3.2":
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/@scure/bip32/-/bip32-1.3.2.tgz#90e78c027d5e30f0b22c1f8d50ff12f3fb7559f8"
@@ -1684,14 +1682,14 @@
     "@noble/hashes" "~1.3.2"
     "@scure/base" "~1.1.2"
 
-"@scure/bip32@1.5.0":
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/@scure/bip32/-/bip32-1.5.0.tgz#dd4a2e1b8a9da60e012e776d954c4186db6328e6"
-  integrity sha512-8EnFYkqEQdnkuGBVpCzKxyIwDCBLDVj3oiX0EKUFre/tOjL/Hqba1D6n/8RcmaQy4f95qQFrO2A8Sr6ybh4NRw==
+"@scure/bip32@1.6.2", "@scure/bip32@^1.5.0":
+  version "1.6.2"
+  resolved "https://registry.yarnpkg.com/@scure/bip32/-/bip32-1.6.2.tgz#093caa94961619927659ed0e711a6e4bf35bffd0"
+  integrity sha512-t96EPDMbtGgtb7onKKqxRLfE5g05k7uHnHRM2xdE6BP/ZmxaLtPek4J4KfVn/90IQNrU1IOAqMgiDtUdtbe3nw==
   dependencies:
-    "@noble/curves" "~1.6.0"
-    "@noble/hashes" "~1.5.0"
-    "@scure/base" "~1.1.7"
+    "@noble/curves" "~1.8.1"
+    "@noble/hashes" "~1.7.1"
+    "@scure/base" "~1.2.2"
 
 "@scure/bip39@1.2.1":
   version "1.2.1"
@@ -1701,13 +1699,13 @@
     "@noble/hashes" "~1.3.0"
     "@scure/base" "~1.1.0"
 
-"@scure/bip39@1.4.0":
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/@scure/bip39/-/bip39-1.4.0.tgz#664d4f851564e2e1d4bffa0339f9546ea55960a6"
-  integrity sha512-BEEm6p8IueV/ZTfQLp/0vhw4NPnT9oWf5+28nvmeUICjP99f4vr2d+qc7AVGDDtwRep6ifR43Yed9ERVmiITzw==
+"@scure/bip39@1.5.4", "@scure/bip39@^1.4.0":
+  version "1.5.4"
+  resolved "https://registry.yarnpkg.com/@scure/bip39/-/bip39-1.5.4.tgz#07fd920423aa671be4540d59bdd344cc1461db51"
+  integrity sha512-TFM4ni0vKvCfBpohoh+/lY05i9gRbSwXWngAsF4CABQxoaOHijxuaZ2R6cStDQ5CHtHO9aGJTr4ksVJASRRyMA==
   dependencies:
-    "@noble/hashes" "~1.5.0"
-    "@scure/base" "~1.1.8"
+    "@noble/hashes" "~1.7.1"
+    "@scure/base" "~1.2.4"
 
 "@sideway/address@^4.1.3":
   version "4.1.5"
@@ -2117,7 +2115,7 @@
     de-indent "^1.0.2"
     he "^1.2.0"
 
-"@vue/devtools-api@^6.4.4", "@vue/devtools-api@^6.4.5":
+"@vue/devtools-api@^6.4.5":
   version "6.4.5"
   resolved "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.4.5.tgz"
   integrity sha512-JD5fcdIuFxU4fQyXUu3w2KpAJHzTVdN+p4iOX2lMWSHMOoQdMAcpFLZzm9Z/2nmsoZ1a96QEhZ26e50xLBsgOQ==
@@ -2324,10 +2322,10 @@ abitype@1.0.0:
   resolved "https://registry.yarnpkg.com/abitype/-/abitype-1.0.0.tgz#237176dace81d90d018bebf3a45cb42f2a2d9e97"
   integrity sha512-NMeMah//6bJ56H5XRj8QCV4AwuW6hB6zqz2LnhhLdcWVQOsXki6/Pn3APeqxCma62nXIcmZWdu1DlHWS74umVQ==
 
-abitype@1.0.6:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/abitype/-/abitype-1.0.6.tgz#76410903e1d88e34f1362746e2d407513c38565b"
-  integrity sha512-MMSqYh4+C/aVqI2RQaWqbvI4Kxo5cQV40WQ4QFtDnNzCkqChm8MuENhElmynZlO0qUy/ObkEUaXtKqYnx1Kp3A==
+abitype@1.0.8, abitype@^1.0.6:
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/abitype/-/abitype-1.0.8.tgz#3554f28b2e9d6e9f35eb59878193eabd1b9f46ba"
+  integrity sha512-ZeiI6h3GnW06uYDLx0etQtX/p8E24UaHHBj57RSjK7YBFe7iuVn07EDpOeP451D06sF27VOz9JJPlIKJmXgkEg==
 
 acorn-globals@^7.0.0:
   version "7.0.1"
@@ -3650,6 +3648,11 @@ event-emitter@^0.3.5:
     d "1"
     es5-ext "~0.10.14"
 
+eventemitter3@5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-5.0.1.tgz#53f5ffd0a492ac800721bb42c66b841de96423c4"
+  integrity sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==
+
 eventemitter3@^4.0.7:
   version "4.0.7"
   resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-4.0.7.tgz#2de9b68f6528d5644ef5c59526a1b4a07306169f"
@@ -4852,6 +4855,19 @@ optionator@^0.9.1:
     type-check "^0.4.0"
     word-wrap "^1.2.3"
 
+ox@0.6.9:
+  version "0.6.9"
+  resolved "https://registry.yarnpkg.com/ox/-/ox-0.6.9.tgz#da1ee04fa10de30c8d04c15bfb80fe58b1f554bd"
+  integrity sha512-wi5ShvzE4eOcTwQVsIPdFr+8ycyX+5le/96iAJutaZAvCes1J0+RvpEPg5QDPDiaR0XQQAvZVl7AwqQcINuUug==
+  dependencies:
+    "@adraffy/ens-normalize" "^1.10.1"
+    "@noble/curves" "^1.6.0"
+    "@noble/hashes" "^1.5.0"
+    "@scure/bip32" "^1.5.0"
+    "@scure/bip39" "^1.4.0"
+    abitype "^1.0.6"
+    eventemitter3 "5.0.1"
+
 p-limit@^2.2.0:
   version "2.3.0"
   resolved "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz"
@@ -4996,14 +5012,6 @@ pify@^3.0.0:
   resolved "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz"
   integrity sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg==
 
-pinia@^2.0.23:
-  version "2.0.23"
-  resolved "https://registry.npmjs.org/pinia/-/pinia-2.0.23.tgz"
-  integrity sha512-N15hFf4o5STrxpNrib1IEb1GOArvPYf1zPvQVRGOO1G1d74Ak0J0lVyalX/SmrzdT4Q0nlEFjbURsmBmIGUR5Q==
-  dependencies:
-    "@vue/devtools-api" "^6.4.4"
-    vue-demi "*"
-
 pkg-types@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npmjs.org/pkg-types/-/pkg-types-1.0.1.tgz"
@@ -5950,20 +5958,19 @@ viem@2.12.0:
     isows "1.0.4"
     ws "8.13.0"
 
-viem@2.x:
-  version "2.21.41"
-  resolved "https://registry.yarnpkg.com/viem/-/viem-2.21.41.tgz#40c9af3f6e0fdbb45b532838b4e1be2418d1b0de"
-  integrity sha512-FxDALzW6I9lGSISbGKqGLfsc4GCtALrgm3mpQcOi7gpyTBkKkl39IWgRjAK1KGNOOvqneQmUKSxWsApkUYSn5w==
+viem@^2.24.3:
+  version "2.24.3"
+  resolved "https://registry.yarnpkg.com/viem/-/viem-2.24.3.tgz#e34f686eed9d19caa2e8a162a29a85bee4efc21e"
+  integrity sha512-FAoW0hqqpGOlZvfL6GbizDNUd6ZvUyNYYF8HouXbGATrO0RLLh28MOElFNF63hg++uZi2R/EcISs0bvY185z8g==
   dependencies:
-    "@adraffy/ens-normalize" "1.11.0"
-    "@noble/curves" "1.6.0"
-    "@noble/hashes" "1.5.0"
-    "@scure/bip32" "1.5.0"
-    "@scure/bip39" "1.4.0"
-    abitype "1.0.6"
+    "@noble/curves" "1.8.1"
+    "@noble/hashes" "1.7.1"
+    "@scure/bip32" "1.6.2"
+    "@scure/bip39" "1.5.4"
+    abitype "1.0.8"
     isows "1.0.6"
-    webauthn-p256 "0.0.10"
-    ws "8.18.0"
+    ox "0.6.9"
+    ws "8.18.1"
 
 vite-node@0.28.1:
   version "0.28.1"
@@ -6160,14 +6167,6 @@ w3c-xmlserializer@^4.0.0:
   dependencies:
     xml-name-validator "^4.0.0"
 
-webauthn-p256@0.0.10:
-  version "0.0.10"
-  resolved "https://registry.yarnpkg.com/webauthn-p256/-/webauthn-p256-0.0.10.tgz#877e75abe8348d3e14485932968edf3325fd2fdd"
-  integrity sha512-EeYD+gmIT80YkSIDb2iWq0lq2zbHo1CxHlQTeJ+KkCILWpVy3zASH3ByD4bopzfk0uCwXxLqKGLqp2W4O28VFA==
-  dependencies:
-    "@noble/curves" "^1.4.0"
-    "@noble/hashes" "^1.4.0"
-
 webidl-conversions@^7.0.0:
   version "7.0.0"
   resolved "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz"
@@ -6286,10 +6285,10 @@ ws@8.17.1:
   resolved "https://registry.yarnpkg.com/ws/-/ws-8.17.1.tgz#9293da530bb548febc95371d90f9c878727d919b"
   integrity sha512-6XQFvXTkbfUOZOKKILFG1PDK2NDQs4azKQl26T0YS5CxqWLgXajbPZ+h4gZekJyRqFU8pvnbAbbs/3TgRPy+GQ==
 
-ws@8.18.0:
-  version "8.18.0"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-8.18.0.tgz#0d7505a6eafe2b0e712d232b42279f53bc289bbc"
-  integrity sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==
+ws@8.18.1:
+  version "8.18.1"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-8.18.1.tgz#ea131d3784e1dfdff91adb0a4a116b127515e3cb"
+  integrity sha512-RKW2aJZMXeMxVpnZ6bck+RswznaxmzdULiBr6KY7XkTnW8uvt0iT9H5DkHUChXrc+uurzwa0rVI16n/Xzjdz1w==
 
 ws@^8.11.0:
   version "8.12.0"