Merge branch 'staging'

CHANGELOG.md

@@ -1,8 +1,44 @@
 # edge-react-gui
 
+## 2.0.16 (2021-07-26)
+
+- Code cleanups: connectors, actions, and constants
+- Add styles/utils for Add Custom Token scene
+- Ethereum checksum support
+- FIO: Fix custom domain registration when there isn't a name registered to address
+- Fade component fixes
+- UI component consistency fixes
+- Update translations
+- Update partner descriptions
+- Upgrade edge-currency-accountbased to v0.7.67
+  - XRP: Add x-address support
+  - Throw error if there is a checksum present and it fails verification
+- Upgrade edge-login-ui-rn to v0.9.12
+  - rn: Synchronize outlined text field logic fixes
+  - rn: Tighten the outlined text field props
+  - rn: Fix the crash in the QR-login modal
+  - rn: Run yarn precommit to update strings
+  - rn: Always close modals on the way out the door
+  - rn: Fix coding errors caught by TypeScript
+  - rn: Add missing react-native-gesture-handler dependency
+  - rn: Put withTheme after connect
+  - rn: Simplify the Fade component
+  - rn: Move the isASCII function to the right file
+  - rn: Use better export syntax
+  - rn: Use modern syntax for localization
+  - rn: Remove unused components & libraries
+  - rn: Implemented recovery translations
+  - rn: Add back button to the "TermsAndConditions" screen
+  - rn: Switch New Account flow screens positions: move "TermsAndConditions" screen after "Pin" screen and before "Wait" screen
+  - rn: Upgrade to react-native-airship v0.2.6
+- Upgrade edge-exchange-plugins to v0.11.30
+  - Totle: Fix error response handling
+- Upgrade edge-currency-bitcoin to v4.9.16
+  - BCH: Fix typo in BSV wallet type in forks array
+
 ## 2.0.15 (2021-07-19)
 
-- Return '0' if exchange rate isn't available
+- Fix crash when attempting to send without an exchange rate present
 
 ## 2.0.14 (2021-07-06)
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "edge-react-gui",
-  "version": "2.0.16-rc1",
+  "version": "2.0.16",
   "private": true,
   "description": "Edge Wallet React GUI",
   "homepage": "https://edge.app",

src/actions/SettingsActions.js

@@ -68,7 +68,8 @@ export const setDefaultFiatRequest = (defaultFiat: string) => (dispatch: Dispatc
       })
       const nextDefaultIsoFiat = getState().ui.settings.defaultIsoFiat
       // convert from previous fiat to next fiat
-      return convertCurrency(state, previousDefaultIsoFiat, nextDefaultIsoFiat, transaction.amount)
+      const fiatString = convertCurrency(state, previousDefaultIsoFiat, nextDefaultIsoFiat, transaction.amount.toFixed(18))
+      return parseFloat(fiatString)
     })
     .then(transactionAmount => {
       const nextSpendingLimits = {

src/components/modals/ContactsPermissionModal.js

@@ -62,7 +62,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
   },
   header: {
     marginVertical: theme.rem(1),
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     fontSize: theme.rem(1.25),
     includeFontPadding: false
   },

src/components/navigation/CurrencySettingsTitle.js

@@ -39,6 +39,6 @@ const getStyles = cacheStyles((theme: Theme) => ({
     resizeMode: 'contain'
   },
   text: {
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   }
 }))

src/components/navigation/TransactionDetailsTitle.js

@@ -37,7 +37,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
     paddingHorizontal: theme.rem(1.5)
   },
   date: {
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   },
   time: {
     fontSize: theme.rem(0.75),

src/components/scenes/CryptoExchangeSuccessScene.js

@@ -83,7 +83,7 @@ class CryptoExchangeSuccessComponent extends React.PureComponent<Props, LocalSta
           <EdgeText style={[styles.text, styles.textInfo]} numberOfLines={3}>
             {s.strings.exchange_congratulations_msg_info}
           </EdgeText>
-          <Fade visible={showButton} hidden>
+          <Fade visible={showButton}>
             <SecondaryButton label={s.strings.string_done_cap} onPress={this.done} />
           </Fade>
           {this.renderConfetti()}

src/components/scenes/GuiPluginListScene.js

@@ -304,7 +304,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
     marginVertical: theme.rem(1),
     marginHorizontal: theme.rem(1.5),
     fontSize: theme.rem(1.25),
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   },
   selectedCountryRow: {
     marginTop: theme.rem(1),
@@ -321,7 +321,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
   },
   selectedCountryText: {
     flex: 1,
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   },
   emptyPluginContainer: {
     flex: 1,
@@ -361,7 +361,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
   },
   titleText: {
     marginBottom: theme.rem(0.25),
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   },
   subtitleText: {
     fontSize: theme.rem(0.75),

src/components/scenes/RequestScene.js

@@ -517,7 +517,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
   },
 
   title: {
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     fontSize: theme.rem(2),
     marginBottom: theme.rem(0.5)
   },

src/components/themed/BuyCrypto.js

@@ -70,7 +70,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
     marginVertical: theme.rem(0.25)
   },
   buyCryptoText: {
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     marginVertical: theme.rem(0.25)
   },
   noTransactionContainer: {

src/components/themed/CardContent.js

@@ -80,7 +80,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
     flexDirection: 'column'
   },
   contentTitle: {
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     fontWeight: '600'
   },
   contentValue: {

src/components/themed/Fade.js

@@ -1,58 +1,29 @@
 // @flow
 
 import * as React from 'react'
-import Animated, { interpolate, runOnJS, useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated'
+import Animated from 'react-native-reanimated'
 
-import { useEffect, useRef, useState } from '../../types/reactHooks.js'
+import { useFadeAnimation } from '../../hooks/animations/useFadeAnimation'
 
 type Props = {
+  children: React.Node,
+
+  // True to make the contents visible:
   visible: boolean,
-  noFadeIn?: boolean,
-  hidden?: boolean,
-  children: React.Node
-}
 
-const FadeComponent = ({ visible: propsVisible, noFadeIn, hidden, children }: Props) => {
-  const firstRender = useRef(true)
-  const opacity = useSharedValue(noFadeIn ? 0.5 : 0)
-  const [visible, setVisible] = useState<boolean>(propsVisible)
-  const [prevVisible, setPrevVisible] = useState<boolean>(propsVisible)
-
-  const animate = (toValue: number) => {
-    if (toValue === 0.5) setVisible(true)
-
-    opacity.value = withTiming(
-      toValue,
-      {
-        duration: 500
-      },
-      (isComplete: boolean) => {
-        if (!isComplete) return
-
-        runOnJS(setVisible)(toValue === 0.5)
-      }
-    )
-  }
-
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  useEffect(() => animate(propsVisible ? 0.5 : 0), [])
-
-  useEffect(() => {
-    if (firstRender.current) {
-      firstRender.current = false
-      return
-    }
-
-    if (propsVisible !== prevVisible) {
-      animate(propsVisible ? 0.5 : 1)
-      setPrevVisible(propsVisible)
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [propsVisible])
-
-  const style = useAnimatedStyle(() => ({ opacity: interpolate(opacity.value, [0, 0.5, 1], [0, 1, 0]) }))
-
-  return <Animated.View style={style}>{hidden || visible ? children : null}</Animated.View>
+  // Animation duration, in ms:
+  duration?: number,
+
+  // No fade in animation on first render:
+  noFadeIn?: boolean
 }
 
-export const Fade = FadeComponent
+export const Fade = ({ children, duration, visible, noFadeIn }: Props) => {
+  const style = useFadeAnimation(visible, { noFadeIn, duration })
+
+  return (
+    <Animated.View style={style} pointerEvents={visible ? 'auto' : 'none'}>
+      {children}
+    </Animated.View>
+  )
+}

src/components/themed/FlipInput.js

@@ -577,12 +577,12 @@ const getStyles = cacheStyles((theme: Theme) => ({
     marginRight: theme.rem(1.5)
   },
   bottomAmount: {
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     fontSize: theme.rem(1.5),
     marginRight: theme.rem(0.5)
   },
   bottomAmountMuted: {
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     fontSize: theme.rem(1.5),
     marginLeft: theme.rem(-0.1), // Hack because of amount being bigger font size not aligning to the rest of the text on justified left
     marginRight: theme.rem(0.5),

src/components/themed/ModalParts.js

@@ -15,11 +15,11 @@ export function ModalTitle(props: { children: React.Node, center?: boolean, padd
   return <Text style={[styles.titleText, props.center ? styles.titleCenter : null, paddingStyles(props.paddingRem, theme)]}>{props.children}</Text>
 }
 
-export function ModalMessage(props: { children: React.Node }) {
+export function ModalMessage(props: { children: React.Node, paddingRem?: number[] | number, isWarning?: boolean }) {
   const theme = useTheme()
   const styles = getStyles(theme)
 
-  return <Text style={styles.messageText}>{props.children}</Text>
+  return <Text style={[styles.messageText, paddingStyles(props.paddingRem, theme), props.isWarning && styles.warningText]}>{props.children}</Text>
 }
 
 export function ModalCloseArrow(props: { onPress: () => void }) {
@@ -52,13 +52,15 @@ const getStyles = cacheStyles((theme: Theme) => ({
   titleText: {
     color: theme.primaryText,
     fontFamily: theme.fontFaceBold,
-    fontWeight: '600',
-    fontSize: theme.rem(1.25),
+    fontSize: theme.rem(1.2),
     margin: theme.rem(0.5)
   },
   titleCenter: {
     textAlign: 'center'
   },
+  warningText: {
+    color: theme.warningText
+  },
   messageText: {
     color: theme.primaryText,
     fontFamily: theme.fontFaceDefault,

src/components/themed/SceneHeader.js

@@ -42,8 +42,8 @@ const getStyles = cacheStyles((theme: Theme) => ({
     marginTop: theme.rem(1)
   },
   title: {
-    fontSize: theme.rem(1.25),
-    fontWeight: '600'
+    fontSize: theme.rem(1.2),
+    fontFamily: theme.fontFaceBold
   }
 }))
 

src/components/themed/SettingsHeaderRow.js

@@ -47,7 +47,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
   text: {
     flexShrink: 1,
     flexGrow: 1,
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     fontSize: theme.rem(1),
     textAlign: 'left',
     color: theme.primaryText

src/components/themed/ThemedButtons.js

@@ -186,7 +186,7 @@ const getStyles = cacheStyles((theme: Theme) => {
     justifyContent: 'center'
   }
   const commonText = {
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     fontSize: theme.rem(1),
     marginVertical: theme.rem(0.25),
     marginHorizontal: theme.rem(0.5),

src/components/themed/Title.js

@@ -45,7 +45,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
   text: {
     flexShrink: 1,
     flexGrow: 1,
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     fontSize: theme.rem(1),
     textAlign: 'left',
     color: theme.primaryText

src/components/themed/TransactionListComponents.js

@@ -77,7 +77,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
   },
   headerDate: {
     fontSize: theme.rem(0.75),
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   },
   headerLoaderContainer: {
     flex: 1,
@@ -87,7 +87,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
   },
   headerLoaderText: {
     fontSize: theme.rem(1.25),
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   }
 }))
 

src/components/themed/TransactionListTop.js

@@ -227,7 +227,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
   },
   balanceBoxCurrency: {
     fontSize: theme.rem(2),
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   },
   balanceFiatBalance: {
     fontSize: theme.rem(1.25)
@@ -254,13 +254,13 @@ const getStyles = cacheStyles((theme: Theme) => ({
   buttonsText: {
     fontSize: theme.rem(1),
     color: theme.textLink,
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     marginLeft: theme.rem(0.25)
   },
 
   // Transactions Divider
   transactionsDividerText: {
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   },
 
   searchContainer: {
@@ -289,8 +289,8 @@ export const TransactionListTop = connect<StateProps, DispatchProps, OwnProps>(
     // Fiat Balance Formatting
     const defaultDenomination = getDefaultDenomination(selectedCurrencyCode, state.ui.settings)
     const defaultCryptoAmount = convertNativeToDenomination(defaultDenomination.multiplier)(balance)
-    const fiatBalance = convertCurrency(state, selectedCurrencyCode, guiWallet.isoFiatCurrencyCode, parseFloat(defaultCryptoAmount))
-    const fiatBalanceFormat = intl.formatNumber(fiatBalance && fiatBalance > 0.000001 ? fiatBalance : 0, { toFixed: 2 })
+    const fiatBalance = convertCurrency(state, selectedCurrencyCode, guiWallet.isoFiatCurrencyCode, defaultCryptoAmount)
+    const fiatBalanceFormat = intl.formatNumber(fiatBalance && bns.gt(fiatBalance, '0.000001') ? fiatBalance : 0, { toFixed: 2 })
 
     return {
       currencyCode: selectedCurrencyCode,

src/components/themed/TransactionRow.js

@@ -201,17 +201,17 @@ const getStyles = cacheStyles((theme: Theme) => ({
   },
   transactionText: {
     flex: 1,
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   },
   positiveCryptoAmount: {
     marginLeft: theme.rem(0.5),
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     color: theme.positiveText,
     textAlign: 'right'
   },
   negativeCryptoAmount: {
     marginLeft: theme.rem(0.5),
-    fontFamily: theme.fontFaceBold,
+    fontFamily: theme.fontFaceMedium,
     color: theme.negativeText,
     textAlign: 'right'
   },

src/components/themed/WalletListCreateRow.js

@@ -166,7 +166,7 @@ const getStyles = cacheStyles((theme: Theme) => ({
     justifyContent: 'center'
   },
   labelText: {
-    fontFamily: theme.fontFaceBold
+    fontFamily: theme.fontFaceMedium
   }
 }))