diff --git a/screens/MarginTrading/components/MarketTrading.tsx b/screens/MarginTrading/components/MarketTrading.tsx index 6d9dfa2e..225a1324 100644 --- a/screens/MarginTrading/components/MarketTrading.tsx +++ b/screens/MarginTrading/components/MarketTrading.tsx @@ -67,11 +67,10 @@ const MarketMarginTrading = ({ hidden }: { hidden: boolean }) => { const results = await Promise.all(promises); const mergedData: any[] = Object.values(marginConfigList).map((item, index) => { const volumeData: any | undefined = results[index]; - // console.log(volumeData, "volumeData"); return { ...item, - totalVolume: volumeData?.data.total_volume || 0, - volume24h: volumeData?.data["24h_volume"] || 0, + totalVolume: volumeData?.data?.total_volume || 0, + volume24h: volumeData?.data?.["24h_volume"] || 0, }; }); setMergedData(mergedData); diff --git a/screens/Trading/components/ChangeCollateralMobile.tsx b/screens/Trading/components/ChangeCollateralMobile.tsx index 9edcd15d..3c1614ec 100644 --- a/screens/Trading/components/ChangeCollateralMobile.tsx +++ b/screens/Trading/components/ChangeCollateralMobile.tsx @@ -497,7 +497,7 @@ const ChangeCollateralMobile: FC = ({ open, onClose
- +

{symbolC}

@@ -640,7 +640,7 @@ const ChangeCollateralMobile: FC = ({ open, onClose

- +

{symbolC}

diff --git a/screens/Trading/components/ConfirmMobile.tsx b/screens/Trading/components/ConfirmMobile.tsx index 71931eeb..2fb27856 100644 --- a/screens/Trading/components/ConfirmMobile.tsx +++ b/screens/Trading/components/ConfirmMobile.tsx @@ -21,6 +21,7 @@ import { showPositionFailure } from "../../../components/HashResultModal"; import { getSymbolById } from "../../../transformers/nearSymbolTrans"; import { IConfirmMobileProps } from "../comInterface"; import { useRegisterTokenType } from "../../../hooks/useRegisterTokenType"; +import { getAccountCategory } from "../../../redux/accountSelectors"; export const ModalContext = createContext(null) as any; const ConfirmMobile: React.FC = ({ @@ -48,7 +49,7 @@ const ConfirmMobile: React.FC = ({ const { max_slippage_rate, min_safety_buffer } = isMainStream ? marginConfigTokens : marginConfigTokensMEME; - + const account = useAppSelector(getAccountCategory(!isMainStream)); const { getAssetDetails, getAssetById, getAssetByIdMEME } = useMarginAccount(); const assetP = isMainStream ? getAssetById( @@ -109,6 +110,7 @@ const ConfirmMobile: React.FC = ({ swap_indication: confirmInfo.estimateData.swap_indication, assets: confirmInfo.assets.data, isMeme: isMemeStream, + account, }; const confirmOpenPosition = async () => { setIsDisabled(true); @@ -131,17 +133,6 @@ const ConfirmMobile: React.FC = ({ const tokenPPrice = confirmInfo.assets.data[openPositionParams.token_p_id].price.usd; const slippageRate = 1 - max_slippage_rate / 10000; const calculatedValue = ((+tokenDAmount * tokenDPrice) / tokenPPrice) * slippageRate; - console.log( - openPositionParams, - decimalsP, - tokenDAmount, - tokenDPrice, - tokenPPrice, - slippageRate, - calculatedValue, - minTokenPAmount, - "for nico confirmOpenPosition", - ); if (minTokenPAmount < calculatedValue) { setIsMinTokenPAmount(true); hasError = true; diff --git a/screens/Trading/components/TradingOperate.tsx b/screens/Trading/components/TradingOperate.tsx index d8ec813f..bb3ed4b1 100644 --- a/screens/Trading/components/TradingOperate.tsx +++ b/screens/Trading/components/TradingOperate.tsx @@ -336,7 +336,7 @@ const TradingOperate: React.FC = ({ onMobileClose, id }) => shortInput, ], ); - const setOwnBanlance = (key: string) => { + const setMaxInputBanlance = (key: string) => { if (activeTab === "long") { setLongInput(key); } else { @@ -649,7 +649,7 @@ const TradingOperate: React.FC = ({ onMobileClose, id }) => />

= ({ onMobileClose, id }) => />
; type: string; - setOwnBanlance?: (key: string) => void; + setMaxInputBanlance?: (key: string) => void; setForceUpdate?: () => void; isMemeCategory?: boolean; } const TradingToken: React.FC = ({ tokenList, type, - setOwnBanlance, + setMaxInputBanlance, setForceUpdate, isMemeCategory, }) => { @@ -33,30 +36,30 @@ const TradingToken: React.FC = ({ const dispatch = useAppDispatch(); const account = useAppSelector(getAccountCategory(isMemeCategory)); const { ReduxcategoryAssets1, ReduxcategoryAssets2 } = useAppSelector((state) => state.category); - const [ownBalance, setOwnBalance] = useState("-"); - const [ownBalanceDetail, setOwnBalanceDetail] = useState(""); + const [selectedTokenBalance, setSelectedTokenBalance] = useState(""); const [showModal, setShowModal] = useState(false); const accountId = useAppSelector(getAccountId); const [selectedItem, setSelectedItem] = useState( type === "cate1" ? ReduxcategoryAssets1 : ReduxcategoryAssets2, ); + const typeDispatchMap: Record any) | undefined> = { + cate1: setCategoryAssets1, + cate2: setCategoryAssets2, + }; useDebounce( () => { const { selectedAsset, setReduxcategoryCurrentBalance } = getSelectedAssetAndBalanceSetter(); const tokenId = selectedAsset?.metadata["token_id"]; - const balance = account?.balances[tokenId]; if (!tokenId) return; - const { decimals } = selectedAsset.metadata; - const waitUseKey = shrinkToken(balance, decimals); - const formattedBalance = toInternationalCurrencySystem_number(waitUseKey); - setOwnBalance(formattedBalance); - setOwnBalanceDetail(waitUseKey); - setReduxcategoryCurrentBalance && setReduxcategoryCurrentBalance(waitUseKey); + const selectedAssetBalance = getTokenBalance(selectedAsset); + setSelectedTokenBalance(selectedAssetBalance); + setReduxcategoryCurrentBalance && setReduxcategoryCurrentBalance(selectedAssetBalance); setSelectedItem(selectedAsset); }, 300, [type, accountId, account.balances, ReduxcategoryAssets1, ReduxcategoryAssets2], ); + // get selected asset from store and Setter api to store balance of asset const getSelectedAssetAndBalanceSetter = () => { if (type === "cate1" && ReduxcategoryAssets1) { return { @@ -73,21 +76,16 @@ const TradingToken: React.FC = ({ } return { selectedAsset: null, setReduxcategoryCurrentBalance: null }; }; + // click to select a token and dispatch to store const handleTokenClick = (item: any) => { if (!item) return; setSelectedItem(item); - const typeDispatchMap: Record any) | undefined> = { - cate1: setCategoryAssets1, - cate2: setCategoryAssets2, - }; - const dispatchAction = typeDispatchMap[type]; if (dispatchAction) { dispatch(dispatchAction(item)); } else { console.warn(`Unsupported type: ${type}`); } - setForceUpdate && setForceUpdate(); setShowModal(false); }; @@ -104,15 +102,28 @@ const TradingToken: React.FC = ({ }, 200); }; const sendBalance = () => { - if (setOwnBanlance) { - setOwnBanlance(ownBalanceDetail); + if (setMaxInputBanlance) { + setMaxInputBanlance(selectedTokenBalance); } }; + function getTokenBalance(asset: Asset) { + if (_.isEmpty(account?.balances)) return ""; + if (asset.token_id == nearTokenId) { + return shrinkToken( + new Decimal(account?.balances?.[asset.metadata.token_id] || 0) + .plus(account?.balances?.["near"] || 0) + .toFixed(0), + asset.metadata.decimals, + ); + } + return shrinkToken(account.balances[asset.metadata.token_id], asset.metadata.decimals); + } return (
+ {/* selected token symbol */}
= ({
{type === "cate2" && }
- + {/* selected token balance */} {type === "cate2" && (
Balance:  - {ownBalance} + + {selectedTokenBalance + ? toInternationalCurrencySystem_number(selectedTokenBalance) + : "-"} +
)} + {/* token list */} {showModal && type === "cate2" && (
= ({

{selectedItem?.metadata?.symbol === token.metadata.symbol && }

- {toInternationalCurrencySystem_number( - shrinkToken(account.balances[token.metadata.token_id], token.metadata.decimals), - )} + {toInternationalCurrencySystem_number(getTokenBalance(token))}

))} diff --git a/screens/Trading/index.tsx b/screens/Trading/index.tsx index cef2d09a..ad3dce65 100644 --- a/screens/Trading/index.tsx +++ b/screens/Trading/index.tsx @@ -92,7 +92,7 @@ const Trading = () => { setCurrentTokenCate1(ReduxcategoryAssets1); }, [ReduxcategoryAssets1]); - // get selected category 2 + // get or init selected category 2 useEffect(() => { if (id) { if ( @@ -115,6 +115,7 @@ const Trading = () => { const handlePopupToggle = () => { setShowPopup2(!showPopupCate2); }; + // click to select a token and dispatch to store (left top side) const handleTokenSelectCate2 = (item) => { dispatch(setCategoryAssets2(item)); setShowPopup2(false); @@ -240,12 +241,7 @@ const Trading = () => { onClick={handlePopupToggle} className="flex justify-center items-center" > -

- {currentTokenCate2?.metadata?.symbol || - (isMainStream - ? categoryAssets2[0]?.metadata.symbol - : categoryAssets2MEME[0]?.metadata.symbol)} -

+

{currentTokenCate2?.metadata?.symbol}

{showPopupCate2 && ( @@ -328,12 +324,7 @@ const Trading = () => { onClick={handlePopupToggle} className="flex justify-center items-center" > -

- {currentTokenCate2?.metadata?.symbol || - (isMainStream - ? categoryAssets2[0]?.metadata.symbol - : categoryAssets2MEME[0]?.metadata.symbol)} -

+

{currentTokenCate2?.metadata?.symbol}

{showPopupCate2 && ( @@ -393,6 +384,7 @@ const Trading = () => { {id && }
+ {/* for mobile */}