diff --git a/apps/main/src/components/AssetSelect/AssetSelect.tsx b/apps/main/src/components/AssetSelect/AssetSelect.tsx index ba8cab4138..d193782736 100644 --- a/apps/main/src/components/AssetSelect/AssetSelect.tsx +++ b/apps/main/src/components/AssetSelect/AssetSelect.tsx @@ -48,6 +48,7 @@ export const AssetSelect = ({ const displayValueLoading = props.displayValueLoading ?? displayValueLoading_ const { getTransferableBalance } = useAccountBalances() + const maxBalance = ((): string | undefined => { if (providedMaxBalance) { return providedMaxBalance diff --git a/apps/main/src/components/AssetSelectModal/AssetSelectModal.utils.ts b/apps/main/src/components/AssetSelectModal/AssetSelectModal.utils.ts index fd4a5d4d7f..336d086648 100644 --- a/apps/main/src/components/AssetSelectModal/AssetSelectModal.utils.ts +++ b/apps/main/src/components/AssetSelectModal/AssetSelectModal.utils.ts @@ -19,7 +19,9 @@ export const useAssetSelectModalAssets = ({ search, selectedAssetId, ignoreAssetIds, - ...sortOptions + tickerOrder, + lowPriorityAssetIds, + highPriorityAssetIds, }: { assets: TAssetData[] ignoreAssetIds?: string[] @@ -45,33 +47,54 @@ export const useAssetSelectModalAssets = ({ const { getAssetPrice, isLoading: isPriceLoading } = useAssetsPrice(assetsBalanceIds) - if (!account || !assets.length) { - return { - sortedAssets: filteredAssets, - isLoading: false, - } - } - - const assetsWithBalances = filteredAssets.map((asset) => { - const balance = scaleHuman(getTransferableBalance(asset.id), asset.decimals) + const invalidState = !account || !assets.length - const { price, isValid } = getAssetPrice(asset.id) - const balanceDisplay = isValid ? Big(price).times(balance).toString() : "0" + const isLoading = isPriceLoading || isBalanceLoading - return { - ...asset, - balance, - balanceDisplay, + const sortedAssets = useMemo(() => { + if (invalidState || isLoading) { + return filteredAssets } - }) - const sortedAssets = sortAssets(assetsWithBalances, "balanceDisplay", { - firstAssetId: selectedAssetId, + const assetsWithBalances = filteredAssets.map((asset) => { + const balance = scaleHuman( + getTransferableBalance(asset.id), + asset.decimals, + ) + + const { price, isValid } = getAssetPrice(asset.id) + const balanceDisplay = isValid + ? Big(price).times(balance).toString() + : "0" + + return { + ...asset, + balance, + balanceDisplay, + } + }) + + return sortAssets(assetsWithBalances, "balanceDisplay", { + firstAssetId: selectedAssetId, + search, + tickerOrder, + lowPriorityAssetIds, + highPriorityAssetIds, + }) + }, [ + invalidState, + filteredAssets, + getAssetPrice, + getTransferableBalance, + highPriorityAssetIds, + isLoading, + lowPriorityAssetIds, + selectedAssetId, search, - ...sortOptions, - }) + tickerOrder, + ]) - return { sortedAssets, isLoading: isPriceLoading || isBalanceLoading } + return { sortedAssets, isLoading: invalidState ? false : isLoading } } export const useFilteredSearchAssets = ( @@ -85,6 +108,7 @@ export const useFilteredSearchAssets = ( } const ignoredAssetIdSet = new Set(ignoreAssetIds ?? []) + const searchLower = search.length ? search.toLowerCase() : "" return assets.filter((asset) => { if (ignoredAssetIdSet.has(asset.id)) { @@ -93,8 +117,8 @@ export const useFilteredSearchAssets = ( if (search.length) { return ( - asset.name.toLowerCase().includes(search.toLowerCase()) || - asset.symbol.toLowerCase().includes(search.toLowerCase()) + asset.name.toLowerCase().includes(searchLower) || + asset.symbol.toLowerCase().includes(searchLower) ) } diff --git a/apps/main/src/modules/layout/components/LayoutSkeleton/AppSkeleton.tsx b/apps/main/src/modules/layout/components/LayoutSkeleton/AppSkeleton.tsx index 0b50380507..e160b1f041 100644 --- a/apps/main/src/modules/layout/components/LayoutSkeleton/AppSkeleton.tsx +++ b/apps/main/src/modules/layout/components/LayoutSkeleton/AppSkeleton.tsx @@ -1,4 +1,5 @@ import { + AssetButton, Box, Flex, LoadingButton, @@ -8,10 +9,11 @@ import { Stack, Text, } from "@galacticcouncil/ui/components" +import { pxToRem } from "@galacticcouncil/ui/utils" const AssetSectionSkeleton = () => { return ( - + @@ -21,13 +23,14 @@ const AssetSectionSkeleton = () => { - - - - - - - + + +
+ +
+
+ +
@@ -36,11 +39,11 @@ const AssetSectionSkeleton = () => { const SwitcherSkeleton = () => { return ( - - + + diff --git a/apps/main/src/modules/trade/orders/DcaOrderDetailsModal.tsx b/apps/main/src/modules/trade/orders/DcaOrderDetailsModal.tsx index 30f35fcc37..c81049488d 100644 --- a/apps/main/src/modules/trade/orders/DcaOrderDetailsModal.tsx +++ b/apps/main/src/modules/trade/orders/DcaOrderDetailsModal.tsx @@ -66,9 +66,9 @@ export const DcaOrderDetailsModal = ({ details, onTerminate }: Props) => { {t("number", { value: details.isOpenBudget ? details.fromAmountExecuted - : details.status === DcaScheduleStatus.Created - ? details.fromAmountRemaining - : "0", + : details.status === DcaScheduleStatus.Completed + ? "0" + : (details.fromAmountRemaining ?? details.fromAmountBudget), })} {!details.isOpenBudget && ( <> diff --git a/apps/main/src/modules/trade/orders/columns/SwapPrice.tsx b/apps/main/src/modules/trade/orders/columns/SwapPrice.tsx index 54f134959c..a35c162964 100644 --- a/apps/main/src/modules/trade/orders/columns/SwapPrice.tsx +++ b/apps/main/src/modules/trade/orders/columns/SwapPrice.tsx @@ -13,7 +13,14 @@ type Props = { } export const SwapPrice: FC = ({ from, to, price }) => { - const { t } = useTranslation() + const { t } = useTranslation("common") + + if (!price) + return ( + + - + + ) return ( diff --git a/apps/main/src/modules/trade/otc/place-order/PlaceOrderModalContent.tsx b/apps/main/src/modules/trade/otc/place-order/PlaceOrderModalContent.tsx index aa756f45bf..d52601c1f4 100644 --- a/apps/main/src/modules/trade/otc/place-order/PlaceOrderModalContent.tsx +++ b/apps/main/src/modules/trade/otc/place-order/PlaceOrderModalContent.tsx @@ -449,7 +449,6 @@ export const PlaceOrderModalContent: FC = ({ onClose }) => { )} )} -