From 4999f3d145d376932b12142f0904f502cc879df0 Mon Sep 17 00:00:00 2001 From: RcleydsonR Date: Wed, 18 Jan 2023 23:35:08 -0300 Subject: [PATCH] Add typing on components layer Co-authored-by: geovanne97 --- src/blockchain/buyerMethods.ts | 2 +- src/blockchain/events.ts | 4 +- src/blockchain/sellerMethods.ts | 5 -- src/components/BuyConfirmedComponent.vue | 5 +- src/components/ListingComponent.vue | 49 ++++++++++--------- src/components/QrCodeComponent.vue | 7 +-- src/components/SearchComponent.vue | 31 ++++++------ .../SellerSteps/SellerSearchComponent.vue | 12 ++--- .../SellerSteps/WantSellComponent.vue | 10 ++-- src/components/TopBar.vue | 14 +++--- src/model/ValidDeposit.ts | 2 +- src/utils/networkLiquidity.ts | 6 ++- src/views/ManageBidsView.vue | 2 +- 13 files changed, 76 insertions(+), 73 deletions(-) diff --git a/src/blockchain/buyerMethods.ts b/src/blockchain/buyerMethods.ts index 8ffc520..d5b843e 100644 --- a/src/blockchain/buyerMethods.ts +++ b/src/blockchain/buyerMethods.ts @@ -35,7 +35,7 @@ const addLock = async (depositId: BigNumber, amount: number): Promise => { // Release lock const releaseLock = async ( pixKey: string, - amount: Number, + amount: number, e2eId: string, lockId: string ): Promise => { diff --git a/src/blockchain/events.ts b/src/blockchain/events.ts index b9d6327..1ebed94 100644 --- a/src/blockchain/events.ts +++ b/src/blockchain/events.ts @@ -65,13 +65,13 @@ const getValidDeposits = async ( const mappedDeposit = await p2pContract.mapDeposits( deposit.args?.depositID ); - let validDeposit = {}; + let validDeposit: ValidDeposit | undefined = undefined; if (mappedDeposit.valid) { validDeposit = { blockNumber: deposit.blockNumber, depositID: deposit.args?.depositID, - remaining: formatEther(mappedDeposit.remaining), + remaining: Number(formatEther(mappedDeposit.remaining)), seller: mappedDeposit.seller, pixKey: mappedDeposit.pixTarget, }; diff --git a/src/blockchain/sellerMethods.ts b/src/blockchain/sellerMethods.ts index 0e4bc4a..a316059 100644 --- a/src/blockchain/sellerMethods.ts +++ b/src/blockchain/sellerMethods.ts @@ -1,5 +1,4 @@ import { getProvider } from "./provider"; -import { updateWalletStatus } from "./wallet"; import { getTokenAddress, getP2PixAddress } from "./addresses"; import { parseEther } from "ethers/lib/utils"; @@ -8,9 +7,6 @@ import { ethers } from "ethers"; import p2pix from "../utils/smart_contract_files/P2PIX.json"; import mockToken from "../utils/smart_contract_files/MockToken.json"; -// Seller Flow methods // - -// Approve Tokens const approveTokens = async (tokenQty: string): Promise => { const provider = getProvider(); const signer = provider.getSigner(); @@ -31,7 +27,6 @@ const approveTokens = async (tokenQty: string): Promise => { return apprv; }; -// Add deposit const addDeposit = async (tokenQty: string, pixKey: string): Promise => { const provider = getProvider(); diff --git a/src/components/BuyConfirmedComponent.vue b/src/components/BuyConfirmedComponent.vue index fbfc637..ccc8914 100644 --- a/src/components/BuyConfirmedComponent.vue +++ b/src/components/BuyConfirmedComponent.vue @@ -1,11 +1,12 @@ diff --git a/src/components/SellerSteps/SellerSearchComponent.vue b/src/components/SellerSteps/SellerSearchComponent.vue index 4fe8059..6461f13 100644 --- a/src/components/SellerSteps/SellerSearchComponent.vue +++ b/src/components/SellerSteps/SellerSearchComponent.vue @@ -4,16 +4,16 @@ import CustomButton from "../../components/CustomButton.vue"; import { debounce } from "@/utils/debounce"; // Reactive state -const tokenValue = ref(0); -const enableSelectButton = ref(false); -const hasLiquidity = ref(true); -const validDecimals = ref(true); +const tokenValue = ref(0); +const enableSelectButton = ref(false); +const hasLiquidity = ref(true); +const validDecimals = ref(true); // Emits const emit = defineEmits(["tokenBuy"]); // Debounce methods -const handleInputEvent = (event: any) => { +const handleInputEvent = (event: any): void => { const { value } = event.target; tokenValue.value = Number(value); @@ -28,7 +28,7 @@ const handleInputEvent = (event: any) => { // Enable button methods // Check if has more than 2 decimal places -const decimalCount = (num: Number) => { +const decimalCount = (num: number): number => { const numStr = String(num); if (numStr.includes(".")) { return numStr.split(".")[1].length; diff --git a/src/components/SellerSteps/WantSellComponent.vue b/src/components/SellerSteps/WantSellComponent.vue index d70f86a..4b01c69 100644 --- a/src/components/SellerSteps/WantSellComponent.vue +++ b/src/components/SellerSteps/WantSellComponent.vue @@ -7,15 +7,15 @@ import { debounce } from "@/utils/debounce"; const offer = ref(""); const pixKey = ref(""); -const enableSelectButton = ref(false); -const hasLiquidity = ref(true); -const validDecimals = ref(true); +const enableSelectButton = ref(false); +const hasLiquidity = ref(true); +const validDecimals = ref(true); // Emits const emit = defineEmits(["approveTokens"]); // Debounce methods -const handleInputEvent = (event: any) => { +const handleInputEvent = (event: any): void => { const { value } = event.target; offer.value = Number(value); @@ -30,7 +30,7 @@ const handleInputEvent = (event: any) => { // Enable button methods // Check if has more than 2 decimal places -const decimalCount = (num: Number) => { +const decimalCount = (num: Number): number => { const numStr = String(num); if (numStr.includes(".")) { return numStr.split(".")[1].length; diff --git a/src/components/TopBar.vue b/src/components/TopBar.vue index 4b1d09f..d6f0a06 100644 --- a/src/components/TopBar.vue +++ b/src/components/TopBar.vue @@ -19,8 +19,8 @@ const currencyMenuOpenToggle = ref(false); const currencyMenuHoverToggle = ref(false); //Methods -const connectMetaMask = () => { - connectProvider(); +const connectMetaMask = async (): Promise => { + await connectProvider(); }; const formatWalletAddress = (): string => { @@ -33,28 +33,28 @@ const formatWalletAddress = (): string => { return `${initialText}...${finalText}`; }; -const formatWalletBalance = (): String => { +const formatWalletBalance = (): string => { const fixed = Number(balance.value); return fixed.toFixed(2); }; -const disconnectUser = () => { +const disconnectUser = (): void => { etherStore.setWalletAddress(""); closeMenu(); window.location.reload(); }; -const closeMenu = () => { +const closeMenu = (): void => { menuOpenToggle.value = false; }; -const networkChange = async (network: NetworkEnum) => { +const networkChange = async (network: NetworkEnum): Promise => { currencyMenuOpenToggle.value = false; const change = await requestNetworkChange(network); if (change) etherStore.setNetworkName(network); }; -const getNetworkImage = (networkName: NetworkEnum) => { +const getNetworkImage = (networkName: NetworkEnum): string => { let validImages = { Ethereum: ethereumImage, Polygon: polygonImage, diff --git a/src/model/ValidDeposit.ts b/src/model/ValidDeposit.ts index d68ad65..d22693b 100644 --- a/src/model/ValidDeposit.ts +++ b/src/model/ValidDeposit.ts @@ -3,7 +3,7 @@ import type { BigNumber } from "ethers"; export type ValidDeposit = { depositID: BigNumber; blockNumber: number; - remaining: string; + remaining: number; seller: string; pixKey: string; pixTarget?: string; diff --git a/src/utils/networkLiquidity.ts b/src/utils/networkLiquidity.ts index 439ec3d..15622b6 100644 --- a/src/utils/networkLiquidity.ts +++ b/src/utils/networkLiquidity.ts @@ -1,8 +1,10 @@ +import type { ValidDeposit } from "@/model/ValidDeposit"; + const verifyNetworkLiquidity = ( tokenValue: number, walletAddress: string, - validDepositList: any[] -) => { + validDepositList: ValidDeposit[] +): ValidDeposit | undefined => { const element = validDepositList.find((element) => { const remaining = element.remaining; if ( diff --git a/src/views/ManageBidsView.vue b/src/views/ManageBidsView.vue index 69d226b..f9d503e 100644 --- a/src/views/ManageBidsView.vue +++ b/src/views/ManageBidsView.vue @@ -2,7 +2,7 @@ import { useEtherStore } from "@/store/ether"; import { storeToRefs } from "pinia"; import ListingComponent from "@/components/ListingComponent.vue"; -import type { BigNumber, Event } from "ethers"; +import type { BigNumber } from "ethers"; import { ref, watch } from "vue"; import { cancelDeposit, withdrawDeposit } from "@/blockchain/buyerMethods"; import { listValidDepositTransactionsByWalletAddress } from "@/blockchain/wallet";