diff --git a/apps/wallet-mobile/.storybook/storybook.requires.js b/apps/wallet-mobile/.storybook/storybook.requires.js index 43e2a175ed..f9e8d4ed9f 100644 --- a/apps/wallet-mobile/.storybook/storybook.requires.js +++ b/apps/wallet-mobile/.storybook/storybook.requires.js @@ -133,6 +133,7 @@ const getStories = () => { "./src/features/Exchange/common/ProviderItem/ProviderItem.stories.tsx": require("../src/features/Exchange/common/ProviderItem/ProviderItem.stories.tsx"), "./src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.stories.tsx": require("../src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.stories.tsx"), "./src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.stories.tsx": require("../src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.stories.tsx"), + "./src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.stories.tsx": require("../src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.stories.tsx"), "./src/features/Exchange/common/ShowBuyBanner/ShowBuyBanner.stories.tsx": require("../src/features/Exchange/common/ShowBuyBanner/ShowBuyBanner.stories.tsx"), "./src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeOrderScreen.stories.tsx": require("../src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeOrderScreen.stories.tsx"), "./src/features/Exchange/useCases/CreateExchangeOrderScreen/EditAmount/EditAmount.stories.tsx": require("../src/features/Exchange/useCases/CreateExchangeOrderScreen/EditAmount/EditAmount.stories.tsx"), diff --git a/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx b/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx index e6e9aa0789..e2bb13f90a 100644 --- a/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx +++ b/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx @@ -186,7 +186,7 @@ const getTxDetails = async (cbor: string): Promise => { } const useTxDetails = (cbor: string) => { - return useQuery({queryFn: () => getTxDetails(cbor)}) + return useQuery({queryFn: () => getTxDetails(cbor), queryKey: ['txDetails', cbor]}) } const useFormattedTransaction = (cbor: string) => { diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.stories.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.stories.tsx new file mode 100644 index 0000000000..a99b7fd7eb --- /dev/null +++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.stories.tsx @@ -0,0 +1,7 @@ +import {storiesOf} from '@storybook/react-native' +import React from 'react' + +import {PreprodFaucetBanner} from './PreprodFaucetBanner' + +storiesOf('Exchange PreprodFaucetBanner', module) // + .add('initial', () => ) diff --git a/apps/wallet-mobile/src/features/Exchange/illustrations/PreprodFaucetBannerLogo.tsx b/apps/wallet-mobile/src/features/Exchange/illustrations/PreprodFaucetBannerLogo.tsx new file mode 100644 index 0000000000..f33aefb589 --- /dev/null +++ b/apps/wallet-mobile/src/features/Exchange/illustrations/PreprodFaucetBannerLogo.tsx @@ -0,0 +1,742 @@ +import * as React from 'react' +import Svg, {Defs, Ellipse, LinearGradient, Path, Stop} from 'react-native-svg' + +export const PreprodFaucetBannerLogo = () => { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ) +} diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/DashboardTokensList.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/DashboardTokensList.tsx index f79095ecb9..b0cd14dbb2 100644 --- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/DashboardTokensList.tsx +++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/DashboardTokensList.tsx @@ -1,11 +1,14 @@ import {isPrimaryToken} from '@yoroi/portfolio' import {useTheme} from '@yoroi/theme' +import {Chain} from '@yoroi/types' import * as React from 'react' import {FlatList, StyleSheet, Text, TouchableOpacity, useWindowDimensions, View} from 'react-native' import {Icon, Spacer} from '../../../../../components' import {makeList} from '../../../../../kernel/utils' +import {PreprodFaucetBanner} from '../../../../Exchange/common/ShowBuyBanner/PreprodFaucetBanner' import {useSelectedWallet} from '../../../../WalletManager/common/hooks/useSelectedWallet' +import {useWalletManager} from '../../../../WalletManager/context/WalletManagerProvider' import {usePortfolioBalances} from '../../../common/hooks/usePortfolioBalances' import {useGetTokensWithBalance} from '../../../common/useGetTokensWithBalance' import {useNavigateTo} from '../../../common/useNavigateTo' @@ -23,6 +26,9 @@ export const DashboardTokensList = () => { const {isLoading} = useGetTokensWithBalance() const {wallet} = useSelectedWallet() const balances = usePortfolioBalances({wallet}) + const { + selected: {network}, + } = useWalletManager() const tokensList = React.useMemo(() => balances.fts ?? [], [balances.fts]) const isJustADA = React.useMemo(() => { @@ -61,7 +67,7 @@ export const DashboardTokensList = () => { if (isZeroADABalance) { return ( - + {network === Chain.Network.Preprod ? : } ) } diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxList/TxList.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxList/TxList.tsx index 4367224cec..a06d5d3200 100644 --- a/apps/wallet-mobile/src/features/Transactions/useCases/TxList/TxList.tsx +++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxList/TxList.tsx @@ -18,12 +18,20 @@ export const TxList = (props: Props) => { const {wallet} = useSelectedWallet() const filter = useTxFilter() - const transactions = useTransactionInfos({wallet}) - const filteredTransactions = React.useMemo(() => filterTransactions(transactions, filter), [transactions, filter]) + const transactionInfos = useTransactionInfos({wallet}) + const filteredTransactions = React.useMemo( + () => filterTransactions(transactionInfos, filter), + [transactionInfos, filter], + ) const [loadedTxs, setLoadedTxs] = React.useState(filteredTransactions.slice(0, batchSize)) const [currentIndex, setCurrentIndex] = React.useState(batchSize) + React.useEffect(() => { + setLoadedTxs(filteredTransactions.slice(0, currentIndex + batchSize)) + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [transactionInfos]) // must be transactionInfos + const handleOnEndReached = React.useCallback(() => { if (currentIndex >= filteredTransactions.length) return const nextBatch = filteredTransactions.slice(currentIndex, currentIndex + batchSize) diff --git a/apps/wallet-mobile/src/yoroi-wallets/hooks/index.ts b/apps/wallet-mobile/src/yoroi-wallets/hooks/index.ts index dd2c9a69b1..d86a2d0555 100644 --- a/apps/wallet-mobile/src/yoroi-wallets/hooks/index.ts +++ b/apps/wallet-mobile/src/yoroi-wallets/hooks/index.ts @@ -471,7 +471,7 @@ export const useTransactionInfos = ({wallet}: {wallet: YoroiWallet}) => { const unsubscribe = wallet.subscribe((event) => { if (event.type !== 'transactions') return - setTransactionInfos(wallet.transactions) + setTransactionInfos(() => wallet.transactions) }) return () => unsubscribe?.() }, [wallet])