Merge pull request #399 from trezor/feature/connect-7

Feature/connect 7

package.json

@@ -74,7 +74,7 @@
         "styled-components": "^4.1.3",
         "styled-normalize": "^8.0.6",
         "trezor-bridge-communicator": "1.0.2",
-        "trezor-connect": "7.0.0-beta.2",
+        "trezor-connect": "7.0.0-beta.3",
         "wallet-address-validator": "^0.2.4",
         "web3": "1.0.0-beta.38",
         "webpack": "^4.29.3",

src/actions/DiscoveryActions.js

@@ -205,7 +205,7 @@ const discoverAccount = (device: TrezorDevice, discoveryProcess: Discovery): Asy
         }
 
         // handle outdated firmware error
-        if (error.message === UI.FIRMWARE) {
+        if (error.message === UI.FIRMWARE_OLD) {
             dispatch({
                 type: DISCOVERY.FIRMWARE_OUTDATED,
                 device,

src/actions/TrezorConnectActions.js

@@ -3,6 +3,7 @@ import TrezorConnect, {
     DEVICE, DEVICE_EVENT, UI_EVENT, TRANSPORT_EVENT, BLOCKCHAIN_EVENT,
 } from 'trezor-connect';
 import { CONTEXT_NONE } from 'actions/constants/modal';
+import urlConstants from 'constants/urls';
 import * as CONNECT from 'actions/constants/TrezorConnect';
 import * as NOTIFICATION from 'actions/constants/notification';
 import { getDuplicateInstanceNumber } from 'reducers/utils';
@@ -120,7 +121,7 @@ export const init = (): AsyncAction => async (dispatch: Dispatch, getState: GetS
 
     if (buildUtils.isDev()) {
         window.__TREZOR_CONNECT_SRC = typeof LOCAL === 'string' ? LOCAL : 'https://sisyfos.trezor.io/connect/'; // eslint-disable-line no-underscore-dangle
-        // window.__TREZOR_CONNECT_SRC = typeof LOCAL === 'string' ? LOCAL : 'https://connect.trezor.io/5/'; // eslint-disable-line no-underscore-dangle
+        // window.__TREZOR_CONNECT_SRC = typeof LOCAL === 'string' ? LOCAL : 'https://localhost:8088/'; // eslint-disable-line no-underscore-dangle
         window.TrezorConnect = TrezorConnect;
     }
 
@@ -131,6 +132,10 @@ export const init = (): AsyncAction => async (dispatch: Dispatch, getState: GetS
             popup: false,
             webusb: true,
             pendingTransportEvent: (getState().devices.length < 1),
+            manifest: {
+                email: 'info@trezor.io',
+                appUrl: urlConstants.NEXT_WALLET,
+            },
         });
     } catch (error) {
         dispatch({

src/components/modals/confirm/NoBackup/index.js

@@ -5,6 +5,7 @@ import PropTypes from 'prop-types';
 import styled from 'styled-components';
 
 import icons from 'config/icons';
+import { getOldWalletUrl } from 'utils/url';
 import colors from 'config/colors';
 
 import { H2 } from 'components/Heading';
@@ -13,10 +14,12 @@ import Icon from 'components/Icon';
 import Button from 'components/Button';
 import Link from 'components/Link';
 
+import type { TrezorDevice } from 'flowtype';
 import type { Props as BaseProps } from '../../Container';
 
 type Props = {
     onReceiveConfirmation: $ElementType<$ElementType<BaseProps, 'modalActions'>, 'onReceiveConfirmation'>;
+    device: ?TrezorDevice;
 }
 
 const Wrapper = styled.div`
@@ -67,7 +70,7 @@ const Confirmation = (props: Props) => (
         <Icon size={48} color={colors.WARNING_PRIMARY} icon={icons.WARNING} />
         <StyledP isSmaller>If your device is ever lost or damaged, your funds will be lost. Backup your device first, to protect your coins against such events.</StyledP>
         <Row>
-            <Link href="https://wallet.trezor.io/?backup">
+            <Link href={`${getOldWalletUrl(props.device)}/?backup`}>
                 <BackupButton onClick={() => props.onReceiveConfirmation(false)}>Create a backup in 3 minutes</BackupButton>
             </Link>
             <ProceedButton isWhite onClick={() => props.onReceiveConfirmation(true)}>Show address, I will take the risk</ProceedButton>

src/components/modals/confirm/UnverifiedAddress/index.js

@@ -2,7 +2,7 @@
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import styled from 'styled-components';
-
+import { getOldWalletUrl } from 'utils/url';
 import icons from 'config/icons';
 import colors from 'config/colors';
 
@@ -151,7 +151,7 @@ class ConfirmUnverifiedAddress extends PureComponent<Props> {
                         </Content>
                         <Content>
                             <Row>
-                                <Link href="https://wallet.trezor.io/?backup">
+                                <Link href={`${getOldWalletUrl(device)}/?backup`}>
                                     <BackupButton>Create a backup in 3 minutes</BackupButton>
                                 </Link>
                             </Row>

src/components/modals/index.js

@@ -191,13 +191,13 @@ const getQrModal = (props: Props) => {
 };
 
 const getConfirmationModal = (props: Props) => {
-    const { modal, modalActions } = props;
+    const { modal, modalActions, wallet } = props;
 
     if (modal.context !== MODAL.CONTEXT_CONFIRMATION) return null;
 
     switch (modal.windowType) {
         case 'no-backup':
-            return (<ConfirmNoBackup onReceiveConfirmation={modalActions.onReceiveConfirmation} />);
+            return (<ConfirmNoBackup device={wallet.selectedDevice} onReceiveConfirmation={modalActions.onReceiveConfirmation} />);
         default:
             return null;
     }

src/constants/urls.js

@@ -0,0 +1,5 @@
+export default {
+    NEXT_WALLET: 'https://beta-wallet.trezor.io/next',
+    OLD_WALLET: 'https://wallet.trezor.io',
+    OLD_WALLET_BETA: 'https://beta-wallet.trezor.io',
+};

src/flowtype/index.js

@@ -38,6 +38,7 @@ import type {
     Device,
     Features,
     DeviceStatus,
+    FirmwareRelease,
     DeviceFirmwareStatus,
     DeviceMode,
     DeviceMessageType,
@@ -55,6 +56,7 @@ export type AcquiredDevice = $Exact<{
     +label: string,
     +features: Features,
     +firmware: DeviceFirmwareStatus,
+    +firmwareRelease: ?FirmwareRelease,
     status: DeviceStatus,
     +mode: DeviceMode,
     state: ?string,

src/utils/url.js

@@ -0,0 +1,24 @@
+/* @flow */
+import urlConstants from 'constants/urls';
+import type { TrezorDevice } from 'flowtype';
+
+const getOldWalletUrl = (device: ?TrezorDevice): string => {
+    if (!device || !device.firmwareRelease) return urlConstants.OLD_WALLET_BETA;
+    const release = device.firmwareRelease;
+    const url = release.channel === 'beta' ? urlConstants.OLD_WALLET_BETA : urlConstants.OLD_WALLET;
+    return url;
+};
+
+// TODO: use uri template to build urls
+const getOldWalletReleaseUrl = (device: ?TrezorDevice): string => {
+    if (!device || !device.firmwareRelease) return urlConstants.OLD_WALLET_BETA;
+    const release = device.firmwareRelease;
+    const url = getOldWalletUrl(device);
+    const version = release.version.join('.');
+    return `${url}?fw=${version}`;
+};
+
+export {
+    getOldWalletUrl,
+    getOldWalletReleaseUrl,
+};

src/views/Wallet/views/DeviceSettings/index.js

@@ -1,3 +1,4 @@
+/* @flow */
 import React from 'react';
 import styled from 'styled-components';
 import { H1 } from 'components/Heading';
@@ -7,9 +8,16 @@ import Button from 'components/Button';
 import P from 'components/Paragraph';
 import Link from 'components/Link';
 import ICONS from 'config/icons';
+import { getOldWalletUrl } from 'utils/url';
 import Content from 'views/Wallet/components/Content';
 import { connect } from 'react-redux';
 
+import type { TrezorDevice } from 'flowtype';
+
+type Props = {
+    device: ?TrezorDevice;
+}
+
 const Section = styled.section`
     display: flex;
     flex-direction: column;
@@ -32,7 +40,7 @@ const StyledH1 = styled(H1)`
     text-align: center;
 `;
 
-const DeviceSettings = () => (
+const DeviceSettings = (props: Props) => (
     <Content>
         <Section>
             <Row>
@@ -43,7 +51,7 @@ const DeviceSettings = () => (
                 />
                 <StyledH1>Device settings is under construction</StyledH1>
                 <StyledP>Please use Bitcoin wallet interface to change your device settings</StyledP>
-                <Link href="https://beta-wallet.trezor.io/">
+                <Link href={getOldWalletUrl(props.device)}>
                     <Button>Take me to the Bitcoin wallet</Button>
                 </Link>
             </Row>

src/views/Wallet/views/FirmwareUpdate/index.js

@@ -3,6 +3,7 @@
 import React from 'react';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
+import { getOldWalletReleaseUrl } from 'utils/url';
 
 import styled from 'styled-components';
 import { H1 } from 'components/Heading';
@@ -129,7 +130,7 @@ const FirmwareUpdate = (props: Props) => (
         </Image>
         <H1>It’s time to update your firmware</H1>
         <StyledP>Please use Bitcoin wallet interface to update your firmware.</StyledP>
-        <Link href="https://beta-wallet.trezor.io">
+        <Link href={getOldWalletReleaseUrl(props.device)}>
             <Button>Take me to the Bitcoin wallet</Button>
         </Link>
         {deviceUtils.isDeviceAccessible(props.device) && (

src/views/Wallet/views/Initialize/index.js

@@ -1,10 +1,18 @@
+/* @flow */
 import styled from 'styled-components';
 import { H1 } from 'components/Heading';
 import Button from 'components/Button';
+import { getOldWalletUrl } from 'utils/url';
 import Paragraph from 'components/Paragraph';
 import React from 'react';
 import { connect } from 'react-redux';
 
+import type { TrezorDevice } from 'flowtype';
+
+type Props = {
+    device: ?TrezorDevice;
+}
+
 const Wrapper = styled.div`
     display: flex;
     flex-direction: column;
@@ -25,12 +33,12 @@ const StyledParagraph = styled(Paragraph)`
     text-align: center;
 `;
 
-const Initialize = () => (
+const Initialize = (props: Props) => (
     <Wrapper data-test="Page__device__not__initialized">
         <Row>
             <H1>Your device is not initialized</H1>
             <StyledParagraph>Please use Bitcoin wallet interface to start initialization process</StyledParagraph>
-            <A href="https://beta-wallet.trezor.io/">
+            <A href={getOldWalletUrl(props.device)}>
                 <Button>Take me to the Bitcoin wallet</Button>
             </A>
         </Row>

src/views/Wallet/views/NoBackup/index.js

@@ -1,17 +1,22 @@
 /* @flow */
-
 import React from 'react';
 import styled from 'styled-components';
 import { H1 } from 'components/Heading';
 import P from 'components/Paragraph';
 import Link from 'components/Link';
+import { getOldWalletUrl } from 'utils/url';
 import Button from 'components/Button';
 import Icon from 'components/Icon';
-
 import { FONT_SIZE } from 'config/variables';
 import colors from 'config/colors';
 import icons from 'config/icons';
 
+import type { TrezorDevice } from 'flowtype';
+
+type Props = {
+    device: ?TrezorDevice;
+}
+
 const Wrapper = styled.section`
     display: flex;
     flex-direction: column;
@@ -40,7 +45,7 @@ const Message = styled.div`
     padding: 0 0 15px 0;
 `;
 
-const FirmwareUpdate = () => (
+const FirmwareUpdate = (props: Props) => (
     <Wrapper>
         <Icon
             size={128}
@@ -52,7 +57,7 @@ const FirmwareUpdate = () => (
             <StyledP>If your device is ever lost or damaged, your funds will be lost. Backup your device first, to protect your coins against such events.</StyledP>
             <P>Please use Bitcoin wallet interface to create a backup.</P>
         </Message>
-        <Link href="https://wallet.trezor.io?backup=1">
+        <Link href={`${getOldWalletUrl(props.device)}?backup=1`}>
             <Button>Take me to the Bitcoin wallet</Button>
         </Link>
         <StyledNavLink to="/">I’ll do that later.</StyledNavLink>

yarn.lock

@@ -738,6 +738,13 @@
   dependencies:
     regenerator-runtime "^0.12.0"
 
+"@babel/runtime@^7.3.1":
+  version "7.3.4"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.3.4.tgz#73d12ba819e365fcf7fd152aed56d6df97d21c83"
+  integrity sha512-IvfvnMdSaLBateu0jfsYIpZTxAc2cKEXEMiezGGN75QcBcecDUKd3PgLAncT0oOgxKy8dd8hrJKj9MfzgfZd6g==
+  dependencies:
+    regenerator-runtime "^0.12.0"
+
 "@babel/template@^7.0.0", "@babel/template@^7.1.0", "@babel/template@^7.1.2", "@babel/template@^7.2.2":
   version "7.2.2"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.2.2.tgz#005b3fdf0ed96e88041330379e0da9a708eb2907"
@@ -4250,10 +4257,15 @@ eventemitter3@3.1.0, eventemitter3@^3.0.0, eventemitter3@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-3.1.0.tgz#090b4d6cdbd645ed10bf750d4b5407942d7ba163"
 
-events@^1.0.0, events@^1.1.1:
+events@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/events/-/events-1.1.1.tgz#9ebdb7635ad099c70dcc4c2a1f5004288e8bd924"
 
+events@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/events/-/events-3.0.0.tgz#9a0a0dfaf62893d92b875b8f2698ca4114973e88"
+  integrity sha512-Dc381HFWJzEOhQ+d8pkNon++bk9h6cdAoAj4iE6Q4y6xgTzySWXlKn05/TVNpjnfRqi/X0EpJEJohPjNI3zpVA==
+
 eventsource@^1.0.7:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/eventsource/-/eventsource-1.0.7.tgz#8fbc72c93fcd34088090bc0a4e64f4b5cee6d8d0"
@@ -10564,13 +10576,14 @@ trezor-bridge-communicator@1.0.2:
     request "^2.88.0"
     whatwg-fetch "^3.0.0"
 
-trezor-connect@7.0.0-beta.2:
+trezor-connect@7.0.0-beta.3:
-  version "7.0.0-beta.2"
+  version "7.0.0-beta.3"
-  resolved "https://registry.yarnpkg.com/trezor-connect/-/trezor-connect-7.0.0-beta.2.tgz#10dc04e1b60804263e9873cd503a4fc9d3e940d2"
+  resolved "https://registry.yarnpkg.com/trezor-connect/-/trezor-connect-7.0.0-beta.3.tgz#34aff422e36745eac24a266bcdfa266282ac5255"
+  integrity sha512-aRh+Vzfqy/2GMJnsvtrzGhwi9j9wjOkBrNN62HTD2sDXLrcROlQMHBCd5lPjSZaJk1npjw5rrvhPS3G9IeyiVw==
   dependencies:
-    babel-runtime "^6.26.0"
+    "@babel/runtime" "^7.3.1"
-    events "^1.1.1"
+    events "^3.0.0"
-    whatwg-fetch "^2.0.4"
+    whatwg-fetch "^3.0.0"
 
 trim-newlines@^2.0.0:
   version "2.0.0"
@@ -11427,7 +11440,7 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3:
   dependencies:
     iconv-lite "0.4.19"
 
-whatwg-fetch@2.0.4, whatwg-fetch@^2.0.4:
+whatwg-fetch@2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.4.tgz#dde6a5df315f9d39991aa17621853d720b85566f"