add balance validation

src/components/dex/InputPanelItem/index.tsx

@@ -30,6 +30,7 @@ function InputPanelItem(props: InputPanelItemProps) {
 		setRangeInputValue,
 		rangeInputValue = '50',
 		balance = 0,
+		zanoBalance = 0,
 		amountValid,
 		priceValid,
 		totalValid,
@@ -80,6 +81,24 @@ function InputPanelItem(props: InputPanelItemProps) {
 
 		if (!isFull) return;
 
+		if (isBuy) {
+			const zanoAmount = new Decimal(zanoBalance);
+			if (zanoAmount.lessThan(total)) {
+				setAlertState('error');
+				setAlertSubtitle('Insufficient ZANO balance');
+				setTimeout(() => setAlertState(null), 3000);
+				return;
+			}
+		} else {
+			const assetAmount = new Decimal(balance);
+			if (assetAmount.lessThan(amount)) {
+				setAlertState('error');
+				setAlertSubtitle(`Insufficient ${firstCurrencyName} balance`);
+				setTimeout(() => setAlertState(null), 3000);
+				return;
+			}
+		}
+
 		const orderData: CreateOrderData = {
 			type: isBuy ? 'buy' : 'sell',
 			side: 'limit',

src/hook/useTradeInit.ts

@@ -3,6 +3,7 @@ import { Store } from '@/store/store-reducer';
 import { useContext } from 'react';
 import Decimal from 'decimal.js';
 import { PairStats } from '@/interfaces/responses/orders/GetPairStatsRes';
+import { ZANO_ASSET_ID } from '@/utils/utils';
 import { useOrderForm } from './useOrdereForm';
 
 interface useTradeInitParams {
@@ -18,8 +19,11 @@ const useTradeInit = ({ pairData, pairStats }: useTradeInitParams) => {
 		secondCurrencyName: pairData?.second_currency?.name || '',
 	};
 
+	const firstCurrencyAssetID = pairData?.first_currency?.asset_id;
+
 	const assets = state.wallet?.connected ? state.wallet?.assets || [] : [];
-	const balance = assets.find((e) => e.ticker === currencyNames.firstCurrencyName)?.balance;
+	const balance = assets.find((e) => e.assetId === firstCurrencyAssetID)?.balance;
+	const zanoBalance = assets.find((e) => e.assetId === ZANO_ASSET_ID)?.balance || 0;
 
 	const firstAssetId = pairData ? pairData.first_currency?.asset_id : undefined;
 	const secondAssetId = pairData ? pairData.second_currency?.asset_id : undefined;
@@ -49,6 +53,7 @@ const useTradeInit = ({ pairData, pairStats }: useTradeInitParams) => {
 		secondAssetLink,
 		secondAssetUsdPrice,
 		balance,
+		zanoBalance,
 		orderForm,
 		pairRateUsd,
 	};

src/interfaces/props/pages/dex/trading/InputPanelItem/InputPanelItemProps.ts

@@ -16,6 +16,7 @@ interface InputPanelItemProps {
 	setRangeInputValue: Dispatch<SetStateAction<string>>;
 	rangeInputValue: string;
 	balance: number | undefined;
+	zanoBalance: number | undefined;
 	amountValid: boolean;
 	priceValid: boolean;
 	totalValid: boolean;

src/pages/dex/trading/[id].tsx

@@ -58,6 +58,7 @@ function Trading() {
 		secondAssetLink,
 		secondAssetUsdPrice,
 		balance,
+		zanoBalance,
 		pairRateUsd,
 	} = useTradeInit({ pairData, pairStats });
 
@@ -202,6 +203,7 @@ function Trading() {
 							setRangeInputValue={orderForm.setRangeInputValue}
 							rangeInputValue={orderForm.rangeInputValue}
 							balance={Number(balance)}
+							zanoBalance={Number(zanoBalance)}
 							priceValid={orderForm.priceValid}
 							amountValid={orderForm.amountValid}
 							totalValid={orderForm.totalValid}