Refactor trezor action

src/components/trezorActions/Confirm/idnex.js

@@ -1,70 +0,0 @@
-import React from 'react';
-import RcTooltip from 'rc-tooltip';
-import colors from 'config/colors';
-import Link from 'components/Link';
-import styled from 'styled-components';
-import PropTypes from 'prop-types';
-
-const Wrapper = styled.div``;
-
-const Content = styled.div`
-    max-width: ${props => `${props.maxWidth}px` || 'auto'};
-`;
-
-const ContentWrapper = styled.div`
-    display: block;
-`;
-
-const ReadMore = styled.div`
-    margin-top: 15px;
-    padding: 10px 0 5px 0;
-    text-align: center;
-    width: 100%;
-    color: ${colors.WHITE};
-    border-top: 1px solid ${colors.TEXT_SECONDARY};
-`;
-
-const Tooltip = ({
-    maxWidth,
-    className,
-    placement,
-    content,
-    readMoreLink,
-    children,
-}) => (
-    <Wrapper className={className}>
-        <RcTooltip
-            arrowContent={<div className="rc-tooltip-arrow-inner" />}
-            placement={placement}
-            overlay={() => (
-                <ContentWrapper>
-                    <Content maxWidth={maxWidth}>{content}</Content>
-                    {readMoreLink && (
-                        <Link href={readMoreLink}>
-                            <ReadMore>Read more</ReadMore>
-                        </Link>
-                    )
-                    }
-                </ContentWrapper>)}
-        >
-            {children}
-        </RcTooltip>
-    </Wrapper>
-);
-
-Tooltip.propTypes = {
-    className: PropTypes.string,
-    placement: PropTypes.string,
-    children: PropTypes.oneOfType([
-        PropTypes.element,
-        PropTypes.string,
-    ]),
-    maxWidth: PropTypes.number,
-    content: PropTypes.oneOfType([
-        PropTypes.element,
-        PropTypes.string,
-    ]),
-    readMoreLink: PropTypes.string,
-};
-
-export default Tooltip;

src/components/trezorActions/Confirm/index.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import colors from 'config/colors';
+import ICONS from 'config/icons';
+import Icon from 'components/Icon';
+import styled from 'styled-components';
+
+const Wrapper = styled.div`
+    display: flex;
+`;
+
+const Tooltip = () => (
+    <Wrapper>
+        <Icon
+            icon={ICONS.T1}
+            color={colors.WHITE}
+        />
+        Check address on your Trezor
+    </Wrapper>
+);
+
+export default Tooltip;

src/config/variables.js

@@ -3,7 +3,6 @@ export const FONT_SIZE = {
     SMALLER: '12px',
     SMALL: '14px',
     BASE: '16px',
-    WALLET_TITLE: '18px',
     TOP_MENU: '17px',
     WALLET_TITLE: '18px',
     BIG: '21px',

src/views/Wallet/views/Account/Receive/index.js

@@ -1,25 +1,21 @@
 /* @flow */
 import React from 'react';
 import { QRCode } from 'react-qr-svg';
-<<<<<<< HEAD
-import styled, { css } from 'styled-components';
-=======
 import styled from 'styled-components';
 import media from 'styled-media-query';
 
 import { H2 } from 'components/Heading';
->>>>>>> master
 import Button from 'components/Button';
 import Icon from 'components/Icon';
 import Tooltip from 'components/Tooltip';
 import Input from 'components/inputs/Input';
 
 import ICONS from 'config/icons';
+import TrezorConfirm from 'components/trezorActions/Confirm';
 import colors from 'config/colors';
 import { CONTEXT_DEVICE } from 'actions/constants/modal';
 
 import Content from 'views/Wallet/components/Content';
-import Title from 'views/Wallet/components/Title';
 import VerifyAddressTooltip from './components/VerifyAddressTooltip';
 
 import type { Props } from './Container';
@@ -126,15 +122,7 @@ const AccountReceive = (props: Props) => {
                             type="text"
                             value={address}
                             isPartiallyHidden={isAddressHidden}
-                            trezorAction={isAddressVerifying ? (
+                            trezorAction={isAddressVerifying ? <TrezorConfirm /> : null}
-                                <React.Fragment>
-                                    <Icon
-                                        icon={ICONS.T1}
-                                        color={colors.WHITE}
-                                    />
-                                    Check address on your Trezor
-                                </React.Fragment>
-                            ) : null}
                             icon={((addressVerified || addressUnverified) && !isAddressVerifying) && (
                                 <Tooltip
                                     placement="left"