diff --git a/native/navigation/header-right-add-button.react.js b/native/navigation/header-right-add-button.react.js new file mode 100644 --- /dev/null +++ b/native/navigation/header-right-add-button.react.js @@ -0,0 +1,32 @@ +// @flow + +import * as React from 'react'; +import { Text, TouchableOpacity } from 'react-native'; + +import { useStyles } from '../themes/colors.js'; + +type Props = { + +onPress: () => mixed, +}; + +function HeaderRightAddButton(props: Props): React.Node { + const { onPress } = props; + + const styles = useStyles(unboundStyles); + + return ( + + Add + + ); +} + +const unboundStyles = { + textStyle: { + color: 'purpleLink', + fontSize: 16, + marginRight: 10, + }, +}; + +export default HeaderRightAddButton; diff --git a/native/profile/linked-devices-header-right-button.react.js b/native/profile/linked-devices-header-right-button.react.js --- a/native/profile/linked-devices-header-right-button.react.js +++ b/native/profile/linked-devices-header-right-button.react.js @@ -2,15 +2,13 @@ import { useNavigation } from '@react-navigation/native'; import * as React from 'react'; -import { Text, TouchableOpacity } from 'react-native'; +import HeaderRightAddButton from '../navigation/header-right-add-button.react.js'; import { SecondaryDeviceQRCodeScannerRouteName } from '../navigation/route-names.js'; -import { useStyles } from '../themes/colors.js'; import Alert from '../utils/alert.js'; import { deviceIsEmulator } from '../utils/url-utils.js'; function LinkedDevicesHeaderRightButton(): React.Node { - const styles = useStyles(unboundStyles); const { navigate } = useNavigation(); const navigateToQRCodeScanner = React.useCallback(() => { @@ -26,19 +24,7 @@ navigate(SecondaryDeviceQRCodeScannerRouteName); }, [navigate]); - return ( - - Add - - ); + return ; } -const unboundStyles = { - textStyle: { - color: 'headerChevron', - fontSize: 16, - marginRight: 10, - }, -}; - export default LinkedDevicesHeaderRightButton;