diff --git a/apps/wallet-mobile/.storybook/storybook.requires.js b/apps/wallet-mobile/.storybook/storybook.requires.js index 8d43d52f4b..f3a090b1da 100644 --- a/apps/wallet-mobile/.storybook/storybook.requires.js +++ b/apps/wallet-mobile/.storybook/storybook.requires.js @@ -254,7 +254,9 @@ const getStories = () => { "./src/Nfts/Nfts.stories.tsx": require("../src/Nfts/Nfts.stories.tsx"), "./src/Nfts/NoNftsScreen.stories.tsx": require("../src/Nfts/NoNftsScreen.stories.tsx"), "./src/Staking/DelegationConfirmation/DelegationConfirmation.stories.tsx": require("../src/Staking/DelegationConfirmation/DelegationConfirmation.stories.tsx"), + "./src/Staking/FailedTx/FailedTxScreen.stories.tsx": require("../src/Staking/FailedTx/FailedTxScreen.stories.tsx"), "./src/Staking/PoolDetails/PoolDetailScreen.stories.tsx": require("../src/Staking/PoolDetails/PoolDetailScreen.stories.tsx"), + "./src/Staking/PoolTransition/PoolTransitionModal.stories.tsx": require("../src/Staking/PoolTransition/PoolTransitionModal.stories.tsx"), "./src/Staking/PoolWarningModal/PoolWarningModal.stories.tsx": require("../src/Staking/PoolWarningModal/PoolWarningModal.stories.tsx"), "./src/Staking/StakingCenter/StakingCenter.stories.tsx": require("../src/Staking/StakingCenter/StakingCenter.stories.tsx"), "./src/TxHistory/AssetList/ActionsBanner.stories.tsx": require("../src/TxHistory/AssetList/ActionsBanner.stories.tsx"), diff --git a/apps/wallet-mobile/ios/Podfile.lock b/apps/wallet-mobile/ios/Podfile.lock index dc43a58c8a..a4779cbf97 100644 --- a/apps/wallet-mobile/ios/Podfile.lock +++ b/apps/wallet-mobile/ios/Podfile.lock @@ -325,7 +325,7 @@ PODS: - react-native-config/App (= 1.5.1) - react-native-config/App (1.5.1): - React-Core - - react-native-haskell-shelley (6.0.0-alpha.4): + - react-native-haskell-shelley (6.0.0-alpha.9): - React - react-native-mmkv (2.11.0): - MMKV (>= 1.2.13) @@ -816,7 +816,7 @@ SPEC CHECKSUMS: react-native-background-timer: 17ea5e06803401a379ebf1f20505b793ac44d0fe react-native-ble-plx: f10240444452dfb2d2a13a0e4f58d7783e92d76e react-native-config: 86038147314e2e6d10ea9972022aa171e6b1d4d8 - react-native-haskell-shelley: 46f5fa9068996637c969e9526c22bd3867c27810 + react-native-haskell-shelley: 4015aef14eca3ecf5e8d8718e8d1b47cdcf60f84 react-native-mmkv: e97c0c79403fb94577e5d902ab1ebd42b0715b43 react-native-pager-view: 0ccb8bf60e2ebd38b1f3669fa3650ecce81db2df react-native-quick-base64: 62290829c619fbabca4c41cfec75ae759d08fc1c diff --git a/apps/wallet-mobile/package.json b/apps/wallet-mobile/package.json index c19605b760..2cfd62051c 100644 --- a/apps/wallet-mobile/package.json +++ b/apps/wallet-mobile/package.json @@ -1,6 +1,6 @@ { "name": "@yoroi/wallet-mobile", - "version": "4.27.0", + "version": "4.27.1", "private": true, "scripts": { "android-bundle": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res", @@ -90,16 +90,16 @@ ] }, "dependencies": { - "@amplitude/analytics-react-native": "^1.3.1", + "@amplitude/analytics-react-native": "1.3.1", "@cardano-foundation/ledgerjs-hw-app-cardano": "^6.0.0", "@emurgo/cip14-js": "^3.0.1", "@emurgo/cip4-js": "1.0.7", - "@emurgo/cross-csl-core": "^4.2.0", - "@emurgo/cross-csl-mobile": "^4.2.0", - "@emurgo/csl-mobile-bridge": "6.0.0-alpha.4", + "@emurgo/cross-csl-core": "4.4.0", + "@emurgo/cross-csl-mobile": "4.4.0", + "@emurgo/csl-mobile-bridge": "6.0.0-alpha.9", "@emurgo/react-native-blockies-svg": "^0.0.2", "@emurgo/react-native-hid": "^5.15.6", - "@emurgo/yoroi-lib": "0.15.1", + "@emurgo/yoroi-lib": "0.15.5-alpha.8", "@formatjs/intl-datetimeformat": "^6.7.0", "@formatjs/intl-getcanonicallocales": "^2.1.0", "@formatjs/intl-locale": "^3.2.1", @@ -127,11 +127,11 @@ "@yoroi/exchange": "2.0.1", "@yoroi/links": "1.5.4", "@yoroi/resolver": "2.0.5", + "@yoroi/setup-wallet": "1.0.0", "@yoroi/staking": "1.5.1", "@yoroi/swap": "1.5.2", "@yoroi/theme": "^1.0.0", "@yoroi/transfer": "1.0.0", - "@yoroi/setup-wallet": "1.0.0", "add": "2.0.6", "assert": "^2.0.0", "axios": "^1.5.0", @@ -213,8 +213,8 @@ "@babel/preset-env": "^7.20.0", "@babel/preset-react": "^7.16.7", "@babel/runtime": "^7.20.0", - "@emurgo/cardano-serialization-lib-nodejs": "^9.1.4", - "@emurgo/cross-csl-nodejs": "^4.2.0", + "@emurgo/cardano-serialization-lib-nodejs": "12.0.0-alpha.28", + "@emurgo/cross-csl-nodejs": "4.4.0", "@formatjs/cli": "^6.1.0", "@formatjs/ts-transformer": "^3.13.0", "@react-navigation/devtools": "^6.0.13", diff --git a/apps/wallet-mobile/src/Dashboard/Dashboard.tsx b/apps/wallet-mobile/src/Dashboard/Dashboard.tsx index 1c869f96ba..46ba5036a4 100644 --- a/apps/wallet-mobile/src/Dashboard/Dashboard.tsx +++ b/apps/wallet-mobile/src/Dashboard/Dashboard.tsx @@ -1,5 +1,6 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ import {useNavigation} from '@react-navigation/native' +import {useTheme} from '@yoroi/theme' import BigNumber from 'bignumber.js' import React from 'react' import {defineMessages, useIntl} from 'react-intl' @@ -16,6 +17,8 @@ import {useSelectedWallet} from '../features/WalletManager/Context/SelectedWalle import globalMessages from '../i18n/global-messages' import {Modal} from '../legacy/Modal' import {useWalletNavigation} from '../navigation' +import {PoolTransitionNotice} from '../Staking/PoolTransition/PoolTransitionNotice' +import {usePoolTransition} from '../Staking/PoolTransition/usePoolTransition' import {isEmptyString} from '../utils/utils' import {getCardanoNetworkConfigById} from '../yoroi-wallets/cardano/networks' import {getCardanoBaseConfig} from '../yoroi-wallets/cardano/utils' @@ -34,9 +37,11 @@ import {UserSummary} from './UserSummary' import {WithdrawStakingRewards} from './WithdrawStakingRewards' export const Dashboard = () => { + const {styles} = useStyles() const intl = useIntl() const navigateTo = useNavigateTo() const governanceStrings = useGovernanceStrings() + const {isPoolRetiring} = usePoolTransition() const wallet = useSelectedWallet() const {isLoading: isSyncing, sync} = useSync(wallet) @@ -90,6 +95,12 @@ export const Dashboard = () => { > {stakingInfo?.status !== 'staked' && } + {isPoolRetiring && ( + + + + )} + @@ -169,8 +180,6 @@ const useNavigateTo = () => { } } -const Row = ({style, ...props}: ViewProps) => - const SyncErrorBanner = ({showRefresh}: {showRefresh: boolean}) => { const intl = useIntl() @@ -239,8 +248,6 @@ const EpochInfo = () => { ) } -const Actions = (props: ViewProps) => - const messages = defineMessages({ stakingCenterButton: { id: 'components.delegation.delegationnavigationbuttons.stakingCenterButton', @@ -248,36 +255,53 @@ const messages = defineMessages({ }, }) -const styles = StyleSheet.create({ - root: { - flex: 1, - }, - container: { - flexDirection: 'column', - flex: 1, - }, - scrollView: { - flex: 1, - backgroundColor: '#fff', - }, - contentContainer: { - paddingTop: 16, - paddingHorizontal: 16, - }, - row: { - flex: 1, - paddingVertical: 12, - }, - actions: { - flexDirection: 'row', - backgroundColor: '#fff', - padding: 16, - borderTopLeftRadius: 8, - borderTopRightRadius: 8, - elevation: 1, - shadowOpacity: 0.06, - shadowColor: 'black', - shadowRadius: 6, - shadowOffset: {width: 0, height: -8}, - }, -}) +const useStyles = () => { + const {theme} = useTheme() + const {color} = theme + + const styles = StyleSheet.create({ + root: { + flex: 1, + }, + container: { + flexDirection: 'column', + flex: 1, + }, + scrollView: { + flex: 1, + backgroundColor: color.gray.min, + }, + contentContainer: { + paddingTop: 16, + paddingHorizontal: 16, + }, + row: { + flex: 1, + paddingVertical: 12, + }, + actions: { + flexDirection: 'row', + backgroundColor: color.gray.min, + padding: 16, + borderTopLeftRadius: 8, + borderTopRightRadius: 8, + elevation: 1, + shadowOpacity: 0.06, + shadowColor: color['black-static'], + shadowRadius: 6, + shadowOffset: {width: 0, height: -8}, + }, + }) + + return {styles} +} + +const Actions = (props: ViewProps) => { + const {styles} = useStyles() + return +} + +const Row = (props: ViewProps) => { + const {styles} = useStyles() + return +} diff --git a/apps/wallet-mobile/src/Dashboard/DashboardNavigator.tsx b/apps/wallet-mobile/src/Dashboard/DashboardNavigator.tsx index 06c599f736..d7ecc0ae43 100644 --- a/apps/wallet-mobile/src/Dashboard/DashboardNavigator.tsx +++ b/apps/wallet-mobile/src/Dashboard/DashboardNavigator.tsx @@ -9,7 +9,7 @@ import {SettingsButton} from '../components/Button' import {useGovernanceManagerMaker} from '../features/Staking/Governance' import {useSelectedWallet} from '../features/WalletManager/Context/SelectedWalletContext' import {DashboardRoutes, defaultStackNavigationOptions, useWalletNavigation} from '../navigation' -import {DelegationConfirmation} from '../Staking' +import {DelegationConfirmation, FailedTxScreen} from '../Staking' import {StakingCenter} from '../Staking/StakingCenter' import {useWalletName} from '../yoroi-wallets/hooks' import {Dashboard} from './Dashboard' @@ -46,6 +46,8 @@ export const DashboardNavigator = () => { component={DelegationConfirmation} options={{title: strings.title}} /> + + ) diff --git a/apps/wallet-mobile/src/Staking/FailedTx/FailedTxImage.tsx b/apps/wallet-mobile/src/Staking/FailedTx/FailedTxImage.tsx new file mode 100644 index 0000000000..b63d5b8dd2 --- /dev/null +++ b/apps/wallet-mobile/src/Staking/FailedTx/FailedTxImage.tsx @@ -0,0 +1,47 @@ +import * as React from 'react' +import Svg, {Defs, LinearGradient, Path, Stop, SvgProps} from 'react-native-svg' + +export const FailedTxImage = (props: SvgProps) => { + return ( + + + + + + + + + + + + + + + + + + + + + + + + ) +} diff --git a/apps/wallet-mobile/src/Staking/FailedTx/FailedTxScreen.stories.tsx b/apps/wallet-mobile/src/Staking/FailedTx/FailedTxScreen.stories.tsx new file mode 100644 index 0000000000..21536f6847 --- /dev/null +++ b/apps/wallet-mobile/src/Staking/FailedTx/FailedTxScreen.stories.tsx @@ -0,0 +1,8 @@ +import {storiesOf} from '@storybook/react-native' +import React from 'react' + +import {FailedTxScreen} from './FailedTxScreen' + +storiesOf('Staking/Failed Tx Screen', module).add('initial', () => { + return +}) diff --git a/apps/wallet-mobile/src/Staking/FailedTx/FailedTxScreen.tsx b/apps/wallet-mobile/src/Staking/FailedTx/FailedTxScreen.tsx new file mode 100644 index 0000000000..5271bf4187 --- /dev/null +++ b/apps/wallet-mobile/src/Staking/FailedTx/FailedTxScreen.tsx @@ -0,0 +1,121 @@ +import {useNavigation} from '@react-navigation/native' +import {useTheme} from '@yoroi/theme' +import React from 'react' +import {defineMessages, useIntl} from 'react-intl' +import {StyleSheet, View} from 'react-native' + +import {Button, Spacer, Text} from '../../components' +import {Space} from '../../components/Space/Space' +import {FailedTxImage} from './FailedTxImage' + +export const FailedTxScreen = () => { + const strings = useStrings() + const styles = useStyles() + const navigateTo = useNavigateTo() + + return ( + + + + + + {strings.notEnoughFunds} + + {strings.noFundsToProcess} + + + +