Merge branch 'beta'

src/components/notifications/Context/components/Static/index.js

@@ -33,6 +33,21 @@ export default (props: Props) => {
                     )}
                 />,
             );
+        } else if (location.state.send) {
+            notifications.push(
+                <Notification
+                    key="xrp-warning"
+                    type="warning"
+                    title="Do not send to accounts requiring a destination tag!"
+                    message={(
+                        <>
+                            Destination tag is an arbitrary number which serves as a unique identifier of your transaction. Some services may require this to process your transaction. The current firmware version <strong>does not support</strong> destination tags yet.
+                            <br /><br />
+                            If the receiver requires a destination tag, do not use Trezor to send XRP. We are working on adding this feature.
+                        </>
+                    )}
+                />,
+            );
         }
     }
 

src/views/Wallet/views/Account/Send/ripple/components/AdvancedForm/index.js

@@ -79,16 +79,16 @@ const getFeeInputState = (feeErrors: string, feeWarnings: string): string => {
     return state;
 };
 
-const getDestinationTagInputState = (errors: string, warnings: string): string => {
-    let state = '';
-    if (warnings && !errors) {
-        state = 'warning';
-    }
-    if (errors) {
-        state = 'error';
-    }
-    return state;
-};
+// const getDestinationTagInputState = (errors: string, warnings: string): string => {
+//     let state = '';
+//     if (warnings && !errors) {
+//         state = 'warning';
+//     }
+//     if (errors) {
+//         state = 'error';
+//     }
+//     return state;
+// };
 
 const Left = styled.div`
     display: flex;
@@ -106,11 +106,11 @@ const AdvancedForm = (props: Props) => {
         warnings,
         infos,
         fee,
-        destinationTag,
+        // destinationTag,
     } = props.sendForm;
     const {
         onFeeChange,
-        onDestinationTagChange,
+        // onDestinationTagChange,
     } = props.sendFormActions;
 
     return (
@@ -151,7 +151,7 @@ const AdvancedForm = (props: Props) => {
                 />
             </InputRow>
 
-            <InputRow>
+            {/* <InputRow>
                 <StyledInput
                     state={getDestinationTagInputState(errors.destinationTag, warnings.destinationTag)}
                     autoComplete="off"
@@ -185,7 +185,7 @@ const AdvancedForm = (props: Props) => {
                     value={destinationTag}
                     onChange={event => onDestinationTagChange(event.target.value)}
                 />
-            </InputRow>
+            </InputRow> */}
 
             <AdvancedSettingsSendButtonWrapper>
                 { props.children }

src/views/Wallet/views/Account/Summary/components/Balance/index.js

@@ -5,6 +5,7 @@ import styled from 'styled-components';
 import Icon from 'components/Icon';
 import colors from 'config/colors';
 import ICONS from 'config/icons';
+import Tooltip from 'components/Tooltip';
 import { FONT_SIZE, FONT_WEIGHT } from 'config/variables';
 
 import type { Network, State as ReducersState } from 'flowtype';
@@ -56,6 +57,7 @@ const FiatValue = styled.div`
     margin: 7px 0;
     min-height: 25px;
     color: ${colors.TEXT_PRIMARY};
+    align-items: center;
 `;
 
 const FiatValueRate = styled.div`
@@ -86,6 +88,15 @@ const Label = styled.div`
     color: ${colors.TEXT_SECONDARY};
 `;
 
+const StyledIcon = styled(Icon)`
+    cursor: pointer;
+    margin-top: -5px;
+`;
+
+const TooltipWrapper = styled.div`
+    display: flex;
+    align-items: center;
+`;
 
 class AccountBalance extends PureComponent<Props, State> {
     constructor(props: Props) {
@@ -115,6 +126,20 @@ class AccountBalance extends PureComponent<Props, State> {
             fiat = accountBalance.times(fiatRateValue).toFixed(2);
         }
 
+        const NoRatesTooltip = (
+            <Tooltip
+                maxWidth={285}
+                placement="top"
+                content="Fiat rates are not currently available."
+            >
+                <StyledIcon
+                    icon={ICONS.HELP}
+                    color={colors.TEXT_SECONDARY}
+                    size={26}
+                />
+            </Tooltip>
+        );
+
         return (
             <Wrapper isHidden={this.state.isHidden}>
                 <HideBalanceIconWrapper
@@ -132,18 +157,20 @@ class AccountBalance extends PureComponent<Props, State> {
                     <React.Fragment>
                         <BalanceWrapper>
                             <Label>Balance</Label>
-                            {fiatRate && (
-                                <FiatValue>${fiat}</FiatValue>
-                            )}
+                            <TooltipWrapper>
+                                <FiatValue>{fiatRate ? `$ ${fiat}` : 'N/A'}</FiatValue>
+                                {!fiatRate && NoRatesTooltip}
+                            </TooltipWrapper>
                             <CoinBalance>{this.props.balance} {network.symbol}</CoinBalance>
                         </BalanceWrapper>
-                        {fiatRate && (
-                            <BalanceRateWrapper>
-                                <Label>Rate</Label>
-                                <FiatValueRate>${fiatRateValue}</FiatValueRate>
-                                <CoinBalance>1.00 {network.symbol}</CoinBalance>
-                            </BalanceRateWrapper>
-                        )}
+                        <BalanceRateWrapper>
+                            <Label>Rate</Label>
+                            <TooltipWrapper>
+                                <FiatValueRate>{fiatRate ? `$ ${fiatRateValue}` : 'N/A'}</FiatValueRate>
+                                {!fiatRate && NoRatesTooltip}
+                            </TooltipWrapper>
+                            <CoinBalance>1 {network.symbol}</CoinBalance>
+                        </BalanceRateWrapper>
                     </React.Fragment>
                 )}
             </Wrapper>

src/views/Wallet/views/Account/Summary/ripple/components/Balance/index.js

@@ -6,7 +6,7 @@ import Icon from 'components/Icon';
 import colors from 'config/colors';
 import ICONS from 'config/icons';
 import { FONT_SIZE, FONT_WEIGHT } from 'config/variables';
-
+import Tooltip from 'components/Tooltip';
 import type { Network, State as ReducersState } from 'flowtype';
 
 type Props = {
@@ -57,6 +57,7 @@ const FiatValue = styled.div`
     margin: 7px 0;
     min-height: 25px;
     color: ${colors.TEXT_PRIMARY};
+    align-items: center;
 `;
 
 const FiatValueRate = styled.div`
@@ -65,8 +66,8 @@ const FiatValueRate = styled.div`
     min-height: 25px;
     margin: 7px 0;
     display: flex;
-    align-items: center;
     color: ${colors.TEXT_PRIMARY};
+    align-items: center;
 `;
 
 const BalanceWrapper = styled.div`
@@ -87,6 +88,15 @@ const Label = styled.div`
     color: ${colors.TEXT_SECONDARY};
 `;
 
+const StyledIcon = styled(Icon)`
+    cursor: pointer;
+    margin-top: -5px;
+`;
+
+const TooltipWrapper = styled.div`
+    display: flex;
+    align-items: center;
+`;
 
 class AccountBalance extends PureComponent<Props, State> {
     constructor(props: Props) {
@@ -116,6 +126,20 @@ class AccountBalance extends PureComponent<Props, State> {
             fiat = accountBalance.times(fiatRateValue).toFixed(2);
         }
 
+        const NoRatesTooltip = (
+            <Tooltip
+                maxWidth={285}
+                placement="top"
+                content="Fiat rates are not currently available."
+            >
+                <StyledIcon
+                    icon={ICONS.HELP}
+                    color={colors.TEXT_SECONDARY}
+                    size={26}
+                />
+            </Tooltip>
+        );
+
         return (
             <Wrapper isHidden={this.state.isHidden}>
                 <HideBalanceIconWrapper
@@ -133,24 +157,28 @@ class AccountBalance extends PureComponent<Props, State> {
                     <React.Fragment>
                         <BalanceWrapper>
                             <Label>Balance</Label>
-                            {fiatRate && (
-                                <FiatValue>${fiat}</FiatValue>
-                            )}
+                            <TooltipWrapper>
+                                <FiatValue>{fiatRate ? `$ ${fiat}` : 'N/A'}</FiatValue>
+                                {!fiatRate && NoRatesTooltip}
+                            </TooltipWrapper>
                             <CoinBalance>{this.props.balance} {network.symbol}</CoinBalance>
                         </BalanceWrapper>
                         {this.props.reserve !== '0' && (
                             <BalanceWrapper>
                                 <Label>Reserve</Label>
-                                <CoinBalance>{this.props.reserve} {network.symbol}</CoinBalance>
+                                <FiatValueRate>{this.props.reserve} {network.symbol}</FiatValueRate>
                             </BalanceWrapper>
                         )}
-                        {fiatRate && (
-                            <BalanceRateWrapper>
-                                <Label>Rate</Label>
-                                <FiatValueRate>${fiatRateValue}</FiatValueRate>
-                                <CoinBalance>1.00 {network.symbol}</CoinBalance>
-                            </BalanceRateWrapper>
-                        )}
+
+                        <BalanceRateWrapper>
+                            <Label>Rate</Label>
+                            <TooltipWrapper>
+                                <FiatValueRate>{fiatRate ? `$ ${fiatRateValue}` : 'N/A'}</FiatValueRate>
+                                {!fiatRate && NoRatesTooltip}
+                            </TooltipWrapper>
+                            <CoinBalance>1 {network.symbol}</CoinBalance>
+                        </BalanceRateWrapper>
+
                     </React.Fragment>
                 )}
             </Wrapper>