From 154d7abe3037c6e9ea820e0203dd1357e2636495 Mon Sep 17 00:00:00 2001 From: jorbuedo Date: Tue, 3 Dec 2024 12:42:19 +0100 Subject: [PATCH] wip --- ....tsx_ => SelectBuyTokenFromListScreen.tsx} | 63 +++--- ...tsx_ => SelectSellTokenFromListScreen.tsx} | 48 ++--- .../Transactions/TxHistoryNavigator.tsx | 5 +- .../Transactions/TxHistoryNavigator.json | 184 +++++++++--------- 4 files changed, 144 insertions(+), 156 deletions(-) rename apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/{SelectBuyTokenFromListScreen.tsx_ => SelectBuyTokenFromListScreen.tsx} (77%) rename apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/{SelectSellTokenFromListScreen.tsx_ => SelectSellTokenFromListScreen.tsx} (76%) diff --git a/apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectBuyTokenFromListScreen.tsx_ b/apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectBuyTokenFromListScreen.tsx similarity index 77% rename from apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectBuyTokenFromListScreen.tsx_ rename to apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectBuyTokenFromListScreen.tsx index 221a692aa1..55c16b0cd3 100644 --- a/apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectBuyTokenFromListScreen.tsx_ +++ b/apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectBuyTokenFromListScreen.tsx @@ -1,6 +1,5 @@ import {FlashList} from '@shopify/flash-list' import {sortTokenInfos} from '@yoroi/portfolio' -import {useSwap, useSwapTokensOnlyVerified} from '@yoroi/swap' import {useTheme} from '@yoroi/theme' import {Portfolio} from '@yoroi/types' import React from 'react' @@ -8,26 +7,23 @@ import {ErrorBoundary} from 'react-error-boundary' import {StyleSheet, TouchableOpacity, View} from 'react-native' import {SafeAreaView} from 'react-native-safe-area-context' -import {Boundary} from '../../../../../../../components/Boundary/Boundary' -import {Icon} from '../../../../../../../components/Icon' -import {Spacer} from '../../../../../../../components/Spacer/Spacer' -import {Text} from '../../../../../../../components/Text' -import {useMetrics} from '../../../../../../../kernel/metrics/metricsManager' -import {YoroiWallet} from '../../../../../../../yoroi-wallets/cardano/types' -import {usePortfolioBalances} from '../../../../../../Portfolio/common/hooks/usePortfolioBalances' -import { - AmountItemPlaceholder, - TokenAmountItem, -} from '../../../../../../Portfolio/common/TokenAmountItem/TokenAmountItem' -import {useSearch, useSearchOnNavBar} from '../../../../../../Search/SearchContext' -import {NoAssetFoundImage} from '../../../../../../Send/common/NoAssetFoundImage' -import {useSelectedWallet} from '../../../../../../WalletManager/common/hooks/useSelectedWallet' -import {Counter} from '../../../../../common/Counter/Counter' -import {filterBySearch} from '../../../../../common/filterBySearch' -import {useNavigateTo} from '../../../../../common/navigation' -import {ServiceUnavailable} from '../../../../../common/ServiceUnavailable/ServiceUnavailable' -import {useStrings} from '../../../../../common/strings' -import {useSwapForm} from '../../../../../common/SwapFormProvider' +import {Boundary} from '../../../../components/Boundary/Boundary' +import {Icon} from '../../../../components/Icon' +import {Spacer} from '../../../../components/Spacer/Spacer' +import {Text} from '../../../../components/Text' +import {useMetrics} from '../../../../kernel/metrics/metricsManager' +import {YoroiWallet} from '../../../../yoroi-wallets/cardano/types' +import {usePortfolioBalances} from '../../../Portfolio/common/hooks/usePortfolioBalances' +import {AmountItemPlaceholder, TokenAmountItem} from '../../../Portfolio/common/TokenAmountItem/TokenAmountItem' +import {useSearch, useSearchOnNavBar} from '../../../Search/SearchContext' +import {NoAssetFoundImage} from '../../../Send/common/NoAssetFoundImage' +import {useSelectedWallet} from '../../../WalletManager/common/hooks/useSelectedWallet' +import {Counter} from '../../common/Counter/Counter' +import {filterBySearch} from '../../common/filterBySearch' +import {useNavigateTo} from '../../common/navigation' +import {ServiceUnavailable} from '../../common/ServiceUnavailable/ServiceUnavailable' +import {useStrings} from '../../common/strings' +import {useSwap} from '../../common/SwapProvider' export const SelectBuyTokenFromListScreen = () => { const strings = useStrings() @@ -73,7 +69,7 @@ const TokenList = () => { const strings = useStrings() const {styles, colors} = useStyles() const {wallet} = useSelectedWallet() - const tokenInfos = useSwapTokensOnlyVerified() + const {tokenInfos} = useSwap() const {search: assetSearchTerm} = useSearch() const balances = usePortfolioBalances({wallet}) @@ -81,7 +77,7 @@ const TokenList = () => { const [filteredTokenList, someInWallet] = React.useMemo(() => { const list = sortTokenInfos({ - secondaryTokenInfos: tokenInfos.filter(filterBySearch(assetSearchTerm)), + secondaryTokenInfos: Array.from(tokenInfos.values()).filter(filterBySearch(assetSearchTerm)), primaryTokenInfo: wallet.portfolioPrimaryTokenInfo, }) const set = new Set(list.map(({id}) => id)) @@ -153,19 +149,14 @@ const SelectableToken = ({wallet, tokenInfo, walletTokenIds}: SelectableTokenPro // NOTE: no need to subscribe to the balance const balanceAvailable = wallet.balances.records.get(id)?.quantity ?? 0n const {closeSearch} = useSearch() - const {buyTokenInfoChanged, orderData, resetQuantities} = useSwap() - const { - sellQuantity: {isTouched: isSellTouched}, - buyQuantity: {isTouched: isBuyTouched}, - buyTouched, - switchTokens, - } = useSwapForm() + const swapForm = useSwap() + const navigateTo = useNavigateTo() const {track} = useMetrics() const inUserWallet = walletTokenIds.includes(tokenInfo.id) - const shouldUpdateToken = id !== orderData.amounts.buy?.info.id || !isBuyTouched - const shouldSwitchTokens = id === orderData.amounts.sell?.info.id && isSellTouched + const shouldUpdateToken = id !== swapForm.tokenOutInput.tokenId || !swapForm.tokenOutInput.isTouched + const shouldSwitchTokens = id === swapForm.tokenInInput.tokenId && swapForm.tokenInInput.isTouched const handleOnTokenSelection = () => { const [policyId] = id.split('.') @@ -175,13 +166,13 @@ const SelectableToken = ({wallet, tokenInfo, walletTokenIds}: SelectableTokenPro // useCase - switch tokens when selecting the same already selected token on the other side if (shouldSwitchTokens) { - resetQuantities() - switchTokens() + swapForm.dispatch({type: 'ResetAmounts'}) + swapForm.dispatch({type: 'SwitchTouched'}) } if (shouldUpdateToken) { - buyTokenInfoChanged(tokenInfo) - buyTouched() + swapForm.dispatch({type: 'TokenInIdChanged', value: id}) + swapForm.dispatch({type: 'TokenInInputTouched'}) } navigateTo.startSwap() closeSearch() diff --git a/apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectSellTokenFromListScreen.tsx_ b/apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectSellTokenFromListScreen.tsx similarity index 76% rename from apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectSellTokenFromListScreen.tsx_ rename to apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectSellTokenFromListScreen.tsx index d94c63c687..fb9e573421 100644 --- a/apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectSellTokenFromListScreen.tsx_ +++ b/apps/wallet-mobile/src/features/Swap/useCases/CreateOrder/SelectSellTokenFromListScreen.tsx @@ -1,25 +1,24 @@ import {FlashList} from '@shopify/flash-list' import {infoFilterByName} from '@yoroi/portfolio' -import {useSwap} from '@yoroi/swap' import {useTheme} from '@yoroi/theme' import {Portfolio} from '@yoroi/types' import * as React from 'react' import {StyleSheet, TouchableOpacity, View} from 'react-native' import {SafeAreaView} from 'react-native-safe-area-context' -import {Spacer} from '../../../../../../../components/Spacer/Spacer' -import {Text} from '../../../../../../../components/Text' -import {useMetrics} from '../../../../../../../kernel/metrics/metricsManager' -import {getTokenIdParts} from '../../../../../../Portfolio/common/helpers/get-token-id-parts' -import {usePortfolioBalances} from '../../../../../../Portfolio/common/hooks/usePortfolioBalances' -import {TokenAmountItem} from '../../../../../../Portfolio/common/TokenAmountItem/TokenAmountItem' -import {useSearch, useSearchOnNavBar} from '../../../../../../Search/SearchContext' -import {NoAssetFoundImage} from '../../../../../../Send/common/NoAssetFoundImage' -import {useSelectedWallet} from '../../../../../../WalletManager/common/hooks/useSelectedWallet' -import {Counter} from '../../../../../common/Counter/Counter' -import {useNavigateTo} from '../../../../../common/navigation' -import {useStrings} from '../../../../../common/strings' -import {useSwapForm} from '../../../../../common/SwapFormProvider' +import {Spacer} from '../../../../components/Spacer/Spacer' +import {Text} from '../../../../components/Text' +import {useMetrics} from '../../../../kernel/metrics/metricsManager' +import {getTokenIdParts} from '../../../Portfolio/common/helpers/get-token-id-parts' +import {usePortfolioBalances} from '../../../Portfolio/common/hooks/usePortfolioBalances' +import {TokenAmountItem} from '../../../Portfolio/common/TokenAmountItem/TokenAmountItem' +import {useSearch, useSearchOnNavBar} from '../../../Search/SearchContext' +import {NoAssetFoundImage} from '../../../Send/common/NoAssetFoundImage' +import {useSelectedWallet} from '../../../WalletManager/common/hooks/useSelectedWallet' +import {Counter} from '../../common/Counter/Counter' +import {useNavigateTo} from '../../common/navigation' +import {useStrings} from '../../common/strings' +import {useSwap} from '../../common/SwapProvider' export const SelectSellTokenFromListScreen = () => { const strings = useStrings() @@ -100,19 +99,14 @@ const TokenList = () => { const SelectableToken = ({amount}: {amount: Portfolio.Token.Amount}) => { const styles = useStyles() const {closeSearch} = useSearch() - const {sellTokenInfoChanged, orderData, resetQuantities} = useSwap() - const { - buyQuantity: {isTouched: isBuyTouched}, - sellQuantity: {isTouched: isSellTouched}, - sellTouched, - switchTokens, - } = useSwapForm() + const swapForm = useSwap() + const navigateTo = useNavigateTo() const {track} = useMetrics() const {policyId} = getTokenIdParts(amount.info.id) - const shouldUpdateToken = amount.info.id !== orderData.amounts.sell?.info.id || !isSellTouched - const shouldSwitchTokens = amount.info.id === orderData.amounts.buy?.info.id && isBuyTouched + const shouldUpdateToken = amount.info.id !== swapForm.tokenInInput.tokenId || !swapForm.tokenInInput.isTouched + const shouldSwitchTokens = amount.info.id === swapForm.tokenOutInput.tokenId && swapForm.tokenOutInput.isTouched const handleOnTokenSelection = () => { track.swapAssetFromChanged({ @@ -121,13 +115,13 @@ const SelectableToken = ({amount}: {amount: Portfolio.Token.Amount}) => { // useCase - switch tokens when selecting the same already selected token on the other side if (shouldSwitchTokens) { - resetQuantities() - switchTokens() + swapForm.dispatch({type: 'ResetAmounts'}) + swapForm.dispatch({type: 'SwitchTouched'}) } if (shouldUpdateToken) { - sellTouched() - sellTokenInfoChanged(amount.info) + swapForm.dispatch({type: 'TokenInInputTouched'}) + swapForm.dispatch({type: 'TokenInIdChanged', value: amount.info.id}) } navigateTo.startSwap() diff --git a/apps/wallet-mobile/src/features/Transactions/TxHistoryNavigator.tsx b/apps/wallet-mobile/src/features/Transactions/TxHistoryNavigator.tsx index bf68d10b03..018985d18d 100644 --- a/apps/wallet-mobile/src/features/Transactions/TxHistoryNavigator.tsx +++ b/apps/wallet-mobile/src/features/Transactions/TxHistoryNavigator.tsx @@ -37,6 +37,8 @@ import {StartMultiTokenTxScreen} from '../Send/useCases/StartMultiTokenTx/StartM import {NetworkTag} from '../Settings/useCases/changeAppSettings/ChangeNetwork/NetworkTag' import {SwapTabNavigator} from '../Swap/SwapNavigator' import {EditSlippageScreen} from '../Swap/useCases/CreateOrder/EditSlippageScreen' +import {SelectBuyTokenFromListScreen} from '../Swap/useCases/CreateOrder/SelectBuyTokenFromListScreen' +import {SelectSellTokenFromListScreen} from '../Swap/useCases/CreateOrder/SelectSellTokenFromListScreen' // import {EditSlippageScreen, SelectPoolFromListScreen} from '../Swap/useCases' import {ReviewSwap} from '../Swap/useCases/ReviewSwap/ReviewSwap' import {ShowPreprodNoticeScreen} from '../Swap/useCases/ShowPreprodNoticeScreen/ShowPreprodNoticeScreen' @@ -233,7 +235,7 @@ export const TxHistoryNavigator = () => { }} /> - {/* { }} /> + {/*