diff --git a/src/components/UiKit/OfflineBanner.js b/src/components/UiKit/OfflineBanner.js index 0567805a5f..4b405c2563 100644 --- a/src/components/UiKit/OfflineBanner.js +++ b/src/components/UiKit/OfflineBanner.js @@ -2,7 +2,7 @@ import React from 'react' import {useSelector} from 'react-redux' -import {injectIntl, defineMessages, type IntlShape} from 'react-intl' +import {useIntl, defineMessages} from 'react-intl' import {isOnlineSelector} from '../../selectors' import Banner from './Banner' @@ -14,10 +14,11 @@ const messages = defineMessages({ }, }) -const OfflineBanner = ({intl}: {intl: IntlShape}) => { +const OfflineBanner = () => { + const intl = useIntl() const isOnline = useSelector(isOnlineSelector) return isOnline ? null : } -export default injectIntl(OfflineBanner) +export default OfflineBanner diff --git a/src/components/WalletInit/ConnectNanoX/CheckNanoXScreen.js b/src/components/WalletInit/ConnectNanoX/CheckNanoXScreen.js index 5dba1ec9f3..d9d8713bf4 100644 --- a/src/components/WalletInit/ConnectNanoX/CheckNanoXScreen.js +++ b/src/components/WalletInit/ConnectNanoX/CheckNanoXScreen.js @@ -3,7 +3,7 @@ import React from 'react' import {View, ScrollView, Image, Platform, StyleSheet} from 'react-native' import {SafeAreaView} from 'react-native-safe-area-context' -import {injectIntl, defineMessages} from 'react-intl' +import {useIntl, defineMessages} from 'react-intl' import {Text, Button, BulletPointItem, ProgressStep, Spacer} from '../../UiKit' import {confirmationMessages, ledgerMessages} from '../../../../src/i18n/global-messages' @@ -11,7 +11,6 @@ import {WALLET_INIT_ROUTES} from '../../../RoutesList' import image from '../../../assets/img/ledger_1.png' -import type {IntlShape} from 'react-intl' import {useNavigation, useRoute} from '@react-navigation/native' import type {NetworkId, WalletImplementationId} from '../../../config/types' @@ -52,7 +51,8 @@ export type Params = { useUSB: boolean, } -const CheckNanoXScreen = ({intl}: {intl: IntlShape}) => { +const CheckNanoXScreen = () => { + const intl = useIntl() const route = useRoute() const {networkId, walletImplementationId, useUSB} = ((route.params: any): Params) @@ -104,6 +104,6 @@ const CheckNanoXScreen = ({intl}: {intl: IntlShape}) => { ) } -export default injectIntl(CheckNanoXScreen) +export default CheckNanoXScreen const Actions = (props) => diff --git a/src/components/WalletInit/ConnectNanoX/ConnectNanoXScreen.js b/src/components/WalletInit/ConnectNanoX/ConnectNanoXScreen.js index 0b874de1cd..25199fd1f4 100644 --- a/src/components/WalletInit/ConnectNanoX/ConnectNanoXScreen.js +++ b/src/components/WalletInit/ConnectNanoX/ConnectNanoXScreen.js @@ -3,7 +3,7 @@ import React from 'react' import {StyleSheet} from 'react-native' import {SafeAreaView} from 'react-native-safe-area-context' -import {injectIntl, defineMessages, type IntlShape} from 'react-intl' +import {useIntl, defineMessages} from 'react-intl' import LedgerConnect from '../../Ledger/LedgerConnect' import {getHWDeviceInfo} from '../../../crypto/shelley/ledgerUtils' @@ -34,11 +34,11 @@ const styles = StyleSheet.create({ }) type Props = { - intl: IntlShape, defaultDevices: ?Array, // for storybook } -const ConnectNanoXScreen = ({intl, defaultDevices}: Props) => { +const ConnectNanoXScreen = ({defaultDevices}: Props) => { + const intl = useIntl() const navigation = useNavigation() const route = useRoute() const walletImplementationId: WalletImplementationId = (route.params?.walletImplementationId: any) @@ -87,4 +87,4 @@ const ConnectNanoXScreen = ({intl, defaultDevices}: Props) => { ) } -export default injectIntl(ConnectNanoXScreen) +export default ConnectNanoXScreen diff --git a/src/components/WalletInit/CreateWallet/MnemonicBackupImportanceModal.js b/src/components/WalletInit/CreateWallet/MnemonicBackupImportanceModal.js index cbce846102..6827d10686 100644 --- a/src/components/WalletInit/CreateWallet/MnemonicBackupImportanceModal.js +++ b/src/components/WalletInit/CreateWallet/MnemonicBackupImportanceModal.js @@ -1,7 +1,7 @@ // @flow import React from 'react' -import {injectIntl, defineMessages, type IntlShape} from 'react-intl' +import {useIntl, defineMessages} from 'react-intl' import {Text, Button, Checkbox, Modal} from '../../UiKit' import styles from './styles/MnemonicBackupImportanceModal.style' @@ -31,12 +31,12 @@ const messages = defineMessages({ type Props = { onConfirm: () => any, - intl: IntlShape, visible: boolean, onRequestClose: () => any, } -const MnemonicBackupImportanceModal = ({onConfirm, intl, visible, onRequestClose}: Props) => { +const MnemonicBackupImportanceModal = ({onConfirm, visible, onRequestClose}: Props) => { + const intl = useIntl() const [acceptedKeyStorage, setAcceptedKeyStorage] = React.useState(false) const [acceptedNewDeviceRecovery, setAcceptedNewDeviceRecovery] = React.useState(false) @@ -67,4 +67,4 @@ const MnemonicBackupImportanceModal = ({onConfirm, intl, visible, onRequestClose ) } -export default injectIntl(MnemonicBackupImportanceModal) +export default MnemonicBackupImportanceModal diff --git a/src/components/WalletInit/CreateWallet/MnemonicCheckScreen.js b/src/components/WalletInit/CreateWallet/MnemonicCheckScreen.js index 2113f28f82..6cb9b2bc18 100644 --- a/src/components/WalletInit/CreateWallet/MnemonicCheckScreen.js +++ b/src/components/WalletInit/CreateWallet/MnemonicCheckScreen.js @@ -3,7 +3,7 @@ import React from 'react' import {useDispatch} from 'react-redux' import {SafeAreaView} from 'react-native-safe-area-context' -import {injectIntl, defineMessages, type IntlShape} from 'react-intl' +import {useIntl, defineMessages} from 'react-intl' import {View, ScrollView, TouchableOpacity} from 'react-native' import {useNavigation, useRoute} from '@react-navigation/native' @@ -38,7 +38,8 @@ const messages = defineMessages({ }, }) -const MnemonicCheckScreen = ({intl}: {intl: IntlShape}) => { +const MnemonicCheckScreen = () => { + const intl = useIntl() const navigation = useNavigation() const route = (useRoute(): any) const mnemonic: string = route.params.mnemonic @@ -112,7 +113,7 @@ const MnemonicCheckScreen = ({intl}: {intl: IntlShape}) => { ) } -export default injectIntl(MnemonicCheckScreen) +export default MnemonicCheckScreen const MnemonicInput = ({ partialPhrase, @@ -140,19 +141,25 @@ const MnemonicInput = ({ ) } -const Instructions = injectIntl(({intl}: {intl: IntlShape}) => ( - - {intl.formatMessage(messages.instructions)} - -)) +const Instructions = () => { + const intl = useIntl() + + return ( + + {intl.formatMessage(messages.instructions)} + + ) +} + +const ErrorMessage = ({visible}: {visible: boolean}) => { + const intl = useIntl() -const ErrorMessage = injectIntl(({intl, visible}: {intl: IntlShape, visible: boolean}) => { return ( {intl.formatMessage(messages.mnemonicWordsInputInvalidPhrase)} ) -}) +} const WordBadges = ({ words, diff --git a/src/components/WalletInit/CreateWallet/MnemonicExplanationModal.js b/src/components/WalletInit/CreateWallet/MnemonicExplanationModal.js index 8eb1f54db9..d09280c817 100644 --- a/src/components/WalletInit/CreateWallet/MnemonicExplanationModal.js +++ b/src/components/WalletInit/CreateWallet/MnemonicExplanationModal.js @@ -2,7 +2,7 @@ import React from 'react' import {View, Image} from 'react-native' -import {injectIntl, defineMessages, type IntlShape} from 'react-intl' +import {useIntl, defineMessages} from 'react-intl' import Markdown from 'react-native-easy-markdown' import {Button, Modal} from '../../UiKit' @@ -29,29 +29,32 @@ const messages = defineMessages({ }, }) -type ExternalProps = { +type Props = { onConfirm: () => any, visible: boolean, onRequestClose: () => any, - intl: IntlShape, } -const MnemonicExplanationModal = ({onConfirm, intl, onRequestClose, visible}: ExternalProps) => ( - - - - +const MnemonicExplanationModal = ({onConfirm, onRequestClose, visible}: Props) => { + const intl = useIntl() - - {intl.formatMessage(messages.paragraph1)} - + return ( + + + + - - {intl.formatMessage(messages.paragraph2)} - + + {intl.formatMessage(messages.paragraph1)} + -