arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2025-01-12 00:50:58 +00:00
Code Issues Releases Wiki Activity

Merge branch 'master' into fix-send-form-css

Browse Source
This commit is contained in:
Vaclav Mlejnsky 2018-09-21 13:32:37 +02:00 committed by GitHub
commit 2f988beb05
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
33 changed files with 485 additions and 161 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.eslintrc
View File

@ -4,6 +4,9 @@
"plugin:flowtype/recommended",
"plugin:jest/recommended"
],
"globals": {
"COMMITHASH": true
},
"env": {
"browser": true,
"jest": true

8
jest.config.js
View File

@ -1,11 +1,19 @@
module.exports = {
rootDir: './src',
automock: false,
coverageDirectory: 'coverage/',
collectCoverage: true,
testURL: 'http://localhost',
modulePathIgnorePatterns: [
'node_modules',
'utils/windowUtils.js',
'utils/promiseUtils.js',
'utils/networkUtils.js',
],
collectCoverageFrom: [
'utils/**.js',
],
setupFiles: [
'./support/setupJest.js',
],
};

6
package.json
View File

@ -31,8 +31,11 @@
"ethereumjs-tx": "^1.3.3",
"ethereumjs-units": "^0.2.0",
"ethereumjs-util": "^5.1.4",
"git-revision-webpack-plugin": "^3.0.3",
"flow-webpack-plugin": "^1.2.0",
"hdkey": "^0.8.0",
"html-webpack-plugin": "^3.2.0",
"jest-fetch-mock": "^1.6.5",
"npm-run-all": "^4.1.3",
"prop-types": "^15.6.2",
"raf": "^3.4.0",
@ -47,8 +50,7 @@
"react-router-redux": "next",
"react-scale-text": "^1.2.2",
"react-select": "2.0.0",
"react-sticky-el": "^1.0.20",
"react-transition-group": "^2.2.1",
"react-transition-group": "^2.4.0",
"redbox-react": "^1.6.0",
"redux": "4.0.0",
"redux-logger": "^3.0.6",

36
src/actions/SendFormActions.js
View File

@ -13,6 +13,7 @@ import { initialState } from 'reducers/SendFormReducer';
import { findToken } from 'reducers/TokensReducer';
import { findDevice, getPendingAmount, getPendingNonce } from 'reducers/utils';
import * as stateUtils from 'reducers/utils';
import { validateAddress } from 'utils/ethUtils';
import type {
Dispatch,
@ -345,32 +346,19 @@ export const validation = (props: Props): void => {
if (state.untouched) return;
// valid address
if (state.touched.address) {
/* if (state.address.length < 1) {
errors.address = 'Address is not set';
} else if (!EthereumjsUtil.isValidAddress(state.address)) {
errors.address = 'Address is not valid';
} else {
// address warning or info are set in addressValidation ThunkAction
// do not override this
if (state.warnings.address) {
warnings.address = state.warnings.address;
} else if (state.infos.address) {
infos.address = state.infos.address;
}
} */
const addressError = validateAddress(state.address);
if (addressError) {
errors.address = addressError;
}
/* eslint (no-lonely-if) */
if (state.address.length < 1) {
errors.address = 'Address is not set';
} else if (!EthereumjsUtil.isValidAddress(state.address)) {
errors.address = 'Address is not valid';
} else if (state.warnings.address) {
// address warning or info are set in addressValidation ThunkAction
// do not override this
// address warning or info may be set in addressValidation ThunkAction
// do not override them
if (state.warnings.address) {
warnings.address = state.warnings.address;
if (state.infos.address) {
infos.address = state.infos.address;
}
}
if (state.infos.address) {
infos.address = state.infos.address;
}
}

15
src/components/Checkbox/index.js
View File

@ -1,6 +1,6 @@
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import styled, { css } from 'styled-components';
import colors from 'config/colors';
import Icon from 'components/Icon';
import icons from 'config/icons';
@ -34,8 +34,10 @@ const IconWrapper = styled.div`
&:hover,
&:focus {
border: 1px solid ${colors.TEXT_PRIMARY};
background: ${props => (props.checked ? colors.TEXT_PRIMARY : colors.WHITE)};
${props => !props.checked && css`
border: 1px solid ${colors.GREEN_PRIMARY};
`}
background: ${props => (props.checked ? colors.GREEN_PRIMARY : colors.WHITE)};
}
`;
@ -74,7 +76,12 @@ class Checkbox extends PureComponent {
<IconWrapper checked={checked}>
{checked && (
<Tick>
<Icon size={26} color={checked ? colors.WHITE : colors.GREEN_PRIMARY} icon={icons.SUCCESS} />
<Icon
hoverColor={colors.WHITE}
size={26}
color={checked ? colors.WHITE : colors.GREEN_PRIMARY}
icon={icons.SUCCESS}
/>
</Tick>
)
}

2
src/components/Footer/index.js
View File

@ -29,7 +29,7 @@ const Copy = styled.div`
const Footer = ({ toggle }) => (
<Wrapper>
<Copy>&copy; {getYear(new Date())}</Copy>
<Copy title={COMMITHASH}>&copy; {getYear(new Date())}</Copy>
<StyledLink href="http://satoshilabs.com" target="_blank" rel="noreferrer noopener" isGreen>SatoshiLabs</StyledLink>
<StyledLink href="/assets/tos.pdf" target="_blank" rel="noreferrer noopener" isGreen>Terms</StyledLink>
<StyledLink onClick={toggle} isGreen>Show Log</StyledLink>

5
src/components/Paragraph/index.js
View File

@ -26,10 +26,7 @@ const P = ({ children, className, isSmaller = false }) => (
P.propTypes = {
className: PropTypes.string,
isSmaller: PropTypes.bool,
children: PropTypes.oneOfType([
PropTypes.array,
PropTypes.string,
]),
children: PropTypes.node,
};
export default P;

12
src/components/Tooltip/index.js
View File

@ -3,15 +3,10 @@ import RcTooltip from 'rc-tooltip';
import colors from 'config/colors';
import styled from 'styled-components';
import PropTypes from 'prop-types';
import { FONT_SIZE } from 'config/variables';
const TooltipContent = styled.div`
width: ${props => (props.isAside ? '260px' : '320px')};
font-size: ${FONT_SIZE.SMALLEST};
`;
const Wrapper = styled.div`
.rc-tooltip {
max-width: ${props => `${props.maxWidth}px` || 'auto'};
position: absolute;
z-index: 1070;
display: block;
@ -177,9 +172,11 @@ class Tooltip extends Component {
placement,
content,
children,
maxWidth,
} = this.props;
return (
<Wrapper
maxWidth={maxWidth}
className={className}
innerRef={(node) => { this.tooltipContainerRef = node; }}
>
@ -187,7 +184,7 @@ class Tooltip extends Component {
getTooltipContainer={() => this.tooltipContainerRef}
arrowContent={<div className="rc-tooltip-arrow-inner" />}
placement={placement}
overlay={<TooltipContent>{content}</TooltipContent>}
overlay={content}
>
{children}
</RcTooltip>
@ -203,6 +200,7 @@ Tooltip.propTypes = {
PropTypes.element,
PropTypes.string,
]),
maxWidth: PropTypes.number,
content: PropTypes.oneOfType([
PropTypes.element,
PropTypes.string,

4
src/components/inputs/Input/index.js
View File

@ -113,6 +113,7 @@ class Input extends Component {
)}
<StyledInput
hasIcon={!!this.props.state}
innerRef={this.props.innerRef}
hasAddon={!!this.props.sideAddons}
type={this.props.type}
placeholder={this.props.placeholder}
@ -142,13 +143,14 @@ class Input extends Component {
Input.propTypes = {
className: PropTypes.string,
innerRef: PropTypes.func,
placeholder: PropTypes.string,
type: PropTypes.string,
autoComplete: PropTypes.string,
autoCorrect: PropTypes.string,
autoCapitalize: PropTypes.string,
spellCheck: PropTypes.string,
value: PropTypes.string.isRequired,
value: PropTypes.string,
onChange: PropTypes.func,
state: PropTypes.string,
bottomText: PropTypes.string,

9
src/components/modals/confirm/SignTx/index.js
View File

@ -5,6 +5,7 @@ import P from 'components/Paragraph';
import Icon from 'components/Icon';
import icons from 'config/icons';
import { H3 } from 'components/Heading';
import { LINE_HEIGHT } from 'config/variables';
const Wrapper = styled.div`
width: 390px;
@ -21,6 +22,12 @@ const Content = styled.div`
padding: 24px 48px;
`;
const StyledP = styled(P)`
word-wrap: break-word;
padding: 5px 0;
line-height: ${LINE_HEIGHT.SMALL}
`;
const Label = styled.div`
padding-top: 5px;
font-size: 10px;
@ -49,7 +56,7 @@ const ConfirmSignTx = (props) => {
<Label>Send</Label>
<P>{`${amount} ${currency}` }</P>
<Label>To</Label>
<P>{ address }</P>
<StyledP>{ address }</StyledP>
<Label>Fee</Label>
<P>{ selectedFeeLevel.label }</P>
</Content>

70
src/components/modals/passphrase/Passphrase/index.js
View File

@ -2,6 +2,7 @@
import React, { Component } from 'react';
import raf from 'raf';
import colors from 'config/colors';
import { H2 } from 'components/Heading';
import P from 'components/Paragraph';
import { FONT_SIZE } from 'config/variables';
import Link from 'components/Link';
@ -23,7 +24,10 @@ const Label = styled.div`
padding-bottom: 5px;
`;
const PassphraseError = styled.div``;
const PassphraseError = styled.div`
margin-top: 8px;
color: ${colors.ERROR_PRIMARY};
`;
const Row = styled.div`
position: relative;
@ -137,22 +141,25 @@ export default class PinModal extends Component<Props, State> {
} = this.state;
// } = this.props.modal;
let passphraseInputValue: string = passphrase;
let passphraseRevisionInputValue: string = passphraseRevision;
if (!visible && !passphraseFocused) {
passphraseInputValue = passphrase.replace(/./g, '•');
}
if (!visible && !passphraseRevisionFocused) {
passphraseRevisionInputValue = passphraseRevision.replace(/./g, '•');
}
const passphraseInputValue: string = passphrase;
const passphraseRevisionInputValue: string = passphraseRevision;
// if (!visible && !passphraseFocused) {
// passphraseInputValue = passphrase.replace(/./g, '•');
// }
// if (!visible && !passphraseRevisionFocused) {
// passphraseRevisionInputValue = passphraseRevision.replace(/./g, '•');
// }
if (this.passphraseInput) {
this.passphraseInput.value = passphraseInputValue;
this.passphraseInput.setAttribute('type', visible || (!visible && !passphraseFocused) ? 'text' : 'password');
// this.passphraseInput.value = passphraseInputValue;
// this.passphraseInput.setAttribute('type', visible || (!visible && !passphraseFocused) ? 'text' : 'password');
this.passphraseInput.setAttribute('type', visible ? 'text' : 'password');
}
if (this.passphraseRevisionInput) {
this.passphraseRevisionInput.value = passphraseRevisionInputValue;
this.passphraseRevisionInput.setAttribute('type', visible || (!visible && !passphraseRevisionFocused) ? 'text' : 'password');
// this.passphraseRevisionInput.value = passphraseRevisionInputValue;
// this.passphraseRevisionInput.setAttribute('type', visible || (!visible && !passphraseRevisionFocused) ? 'text' : 'password');
this.passphraseRevisionInput.setAttribute('type', visible ? 'text' : 'password');
}
}
@ -174,6 +181,14 @@ export default class PinModal extends Component<Props, State> {
match: previousState.singleInput || previousState.passphraseRevision === value,
passphrase: value,
}));
if (this.state.visible && this.passphraseRevisionInput) {
this.setState({
match: true,
passphraseRevision: value,
});
this.passphraseRevisionInput.value = value;
}
} else {
this.setState(previousState => ({
match: previousState.passphrase === value,
@ -211,12 +226,29 @@ export default class PinModal extends Component<Props, State> {
this.setState({
visible: true,
});
if (this.passphraseRevisionInput) {
this.passphraseRevisionInput.disabled = true;
this.passphraseRevisionInput.value = this.state.passphrase;
this.setState(previousState => ({
passphraseRevision: previousState.passphrase,
match: true,
}));
}
}
onPassphraseHide = (): void => {
this.setState({
visible: false,
});
if (this.passphraseRevisionInput) {
const emptyPassphraseRevisionValue = '';
this.passphraseRevisionInput.value = emptyPassphraseRevisionValue;
this.setState(previousState => ({
passphraseRevision: emptyPassphraseRevisionValue,
match: emptyPassphraseRevisionValue === previousState.passphrase,
}));
this.passphraseRevisionInput.disabled = false;
}
}
submit = (empty: boolean = false): void => {
@ -232,7 +264,7 @@ export default class PinModal extends Component<Props, State> {
//this.passphraseRevisionInput.style.display = 'none';
//this.passphraseRevisionInput.setAttribute('readonly', 'readonly');
const p = passphrase;
// const p = passphrase;
this.setState({
passphrase: '',
@ -271,11 +303,10 @@ export default class PinModal extends Component<Props, State> {
//let passphraseRevisionInputType: string = visible || passphraseRevisionFocused ? "text" : "password";
const showPassphraseCheckboxFn: Function = visible ? this.onPassphraseHide : this.onPassphraseShow;
console.log('passphraseInputType', passphraseInputType);
return (
<Wrapper>
{/* ?<H2>Enter { deviceLabel } passphrase</H2> */}
{/* <P isSmaller>Note that passphrase is case-sensitive.</P> */}
<H2>Enter { deviceLabel } passphrase</H2>
<P isSmaller>Note that passphrase is case-sensitive.</P>
<Row>
<Label>Passphrase</Label>
<Input
@ -289,7 +320,7 @@ export default class PinModal extends Component<Props, State> {
data-lpignore="true"
onFocus={() => this.onPassphraseFocus('passphrase')}
onBlur={() => this.onPassphraseBlur('passphrase')}
tabIndex="1"
tabIndex="0"
/>
</Row>
{!singleInput && (
@ -306,7 +337,6 @@ export default class PinModal extends Component<Props, State> {
data-lpignore="true"
onFocus={() => this.onPassphraseFocus('revision')}
onBlur={() => this.onPassphraseBlur('revision')}
tabIndex="2"
/>
{!match && passphraseRevisionTouched && <PassphraseError>Passphrases do not match</PassphraseError> }
</Row>
@ -315,7 +345,7 @@ export default class PinModal extends Component<Props, State> {
<Checkbox onClick={showPassphraseCheckboxFn} checked={visible}>Show passphrase</Checkbox>
</Row>
<Row>
<Button type="button" tabIndex="4" disabled={!match} onClick={event => this.submit()}>Enter</Button>
<Button type="button" disabled={!match} onClick={() => this.submit()}>Enter</Button>
</Row>
<Footer>
<P isSmaller>If you want to access your default account</P>

1
src/config/variables.js
View File

@ -41,5 +41,6 @@ export const TRANSITION = {
};
export const LINE_HEIGHT = {
SMALL: '1.4',
BASE: '1.8',
};

1
src/reducers/ModalReducer.js
View File

@ -57,6 +57,7 @@ export default function modal(state: State = initialState, action: Action): Stat
if (state.opened && action.device.path === state.device.path && action.device.status === 'occupied') {
return initialState;
}
return state;
case DEVICE.DISCONNECT:

38
src/support/BaseStyles.js
View File

@ -63,6 +63,44 @@ const baseStyles = () => injectGlobal`
url('./fonts/roboto/roboto-mono-v4-greek_cyrillic-ext_greek-ext_latin_cyrillic_vietnamese_latin-ext-regular.svg#RobotoMono') format('svg'); /* Legacy iOS */
}
.slide-left-enter {
transform: translate(100%);
pointer-events: none;
}
.slide-left-enter.slide-left-enter-active {
transform: translate(0%);
transition: transform 300ms ease-in-out;
}
.slide-left-exit {
transform: translate(-100%);
}
.slide-left-exit.slide-left-exit-active {
transform: translate(0%);
transition: transform 300ms ease-in-out;
}
.slide-right-enter {
transform: translate(-100%);
pointer-events: none;
}
.slide-right-enter.slide-right-enter-active {
transform: translate(0%);
transition: transform 300ms ease-in-out;
}
.slide-right-exit {
transform: translate(-100%);
}
.slide-right-exit.slide-right-exit-active {
transform: translate(-200%);
transition: transform 300ms ease-in-out;
}
`;
export default baseStyles;

1
src/support/setupJest.js Normal file
View File

@ -0,0 +1 @@
global.fetch = require('jest-fetch-mock');

10
src/utils/__tests__/__snapshots__/device.test.js.snap
View File

@ -55,3 +55,13 @@ exports[`device utils get version 4`] = `"1"`;
exports[`device utils get version 5`] = `"1"`;
exports[`device utils get version 6`] = `"T"`;
exports[`device utils isDisabled 1`] = `false`;
exports[`device utils isDisabled 2`] = `true`;
exports[`device utils isWebUSB 1`] = `true`;
exports[`device utils isWebUSB 2`] = `false`;
exports[`device utils isWebUSB 3`] = `true`;

36
src/utils/__tests__/__snapshots__/ethUtils.test.js.snap
View File

@ -1,5 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`eth utils calcGasPrice 1`] = `"89090990901"`;
exports[`eth utils decimalToHex 1`] = `"0"`;
exports[`eth utils decimalToHex 2`] = `"1"`;
@ -8,4 +10,36 @@ exports[`eth utils decimalToHex 3`] = `"2"`;
exports[`eth utils decimalToHex 4`] = `"64"`;
exports[`eth utils decimalToHex 5`] = `"3e7"`;
exports[`eth utils decimalToHex 5`] = `"2540be3ff"`;
exports[`eth utils hexToDecimal 1`] = `"9999999999"`;
exports[`eth utils hexToDecimal 2`] = `"100"`;
exports[`eth utils hexToDecimal 3`] = `"2"`;
exports[`eth utils hexToDecimal 4`] = `"1"`;
exports[`eth utils hexToDecimal 5`] = `"0"`;
exports[`eth utils hexToDecimal 6`] = `"null"`;
exports[`eth utils padLeftEven 1`] = `"02540be3ff"`;
exports[`eth utils sanitizeHex 1`] = `"0x02540be3ff"`;
exports[`eth utils sanitizeHex 2`] = `"0x01"`;
exports[`eth utils sanitizeHex 3`] = `"0x02"`;
exports[`eth utils sanitizeHex 4`] = `"0x0100"`;
exports[`eth utils sanitizeHex 5`] = `null`;
exports[`eth utils sanitizeHex 6`] = `""`;
exports[`eth utils strip 1`] = `""`;
exports[`eth utils strip 2`] = `"02540be3ff"`;
exports[`eth utils strip 3`] = `"02540be3ff"`;

45
src/utils/__tests__/__snapshots__/formatUtils.test.js.snap Normal file
View File

@ -0,0 +1,45 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`format utils btckb2satoshib 1`] = `0`;
exports[`format utils btckb2satoshib 2`] = `100000`;
exports[`format utils btckb2satoshib 3`] = `200000`;
exports[`format utils btckb2satoshib 4`] = `10000000`;
exports[`format utils btckb2satoshib 5`] = `99900000`;
exports[`format utils formatAmount 1`] = `"0 btc"`;
exports[`format utils formatAmount 2`] = `"10 mBTC"`;
exports[`format utils formatAmount 3`] = `"0.000005 mBTC"`;
exports[`format utils formatAmount 4`] = `"1e-8 eth"`;
exports[`format utils formatAmount 5`] = `"0.00099999 tau"`;
exports[`format utils formatTime 1`] = `"No time estimate"`;
exports[`format utils formatTime 2`] = `"1 minutes"`;
exports[`format utils formatTime 3`] = `"2 minutes"`;
exports[`format utils formatTime 4`] = `"1 hour 40 minutes"`;
exports[`format utils formatTime 5`] = `"16 hours 39 minutes"`;
exports[`format utils formatTime 6`] = `"45 minutes"`;
exports[`format utils hexToString 1`] = `"test"`;
exports[`format utils hexToString 2`] = `"0001"`;
exports[`format utils hexToString 3`] = `"test99999"`;
exports[`format utils stringToHex 1`] = `"0074006500730074"`;
exports[`format utils stringToHex 2`] = `"0030003000300031"`;
exports[`format utils stringToHex 3`] = `"007400650073007400390039003900390039"`;

23
src/utils/__tests__/device.test.js
View File

@ -38,6 +38,29 @@ describe('device utils', () => {
});
});
it('isWebUSB', () => {
const data = [
{ transport: { version: ['webusb'] } },
{ transport: { version: ['aaaaaa'] } },
{ transport: { version: ['webusb', 'test'] } },
];
data.forEach((item) => {
expect(dUtils.isWebUSB(item.transport)).toMatchSnapshot();
});
});
it('isDisabled', () => {
const data = [
{ selectedDevice: { features: null }, devices: [1, 2, 3], transport: { version: ['webusb', 'test'] } },
{ selectedDevice: { features: null }, devices: [], transport: { version: ['test'] } },
];
data.forEach((item) => {
expect(dUtils.isDisabled(item.selectedDevice, item.devices, item.transport)).toMatchSnapshot();
});
});
it('get version', () => {
const deviceMock = [
{ },

44
src/utils/__tests__/ethUtils.test.js
View File

@ -1,11 +1,53 @@
import BigNumber from 'bignumber.js';
import * as ethUtils from '../ethUtils';
describe('eth utils', () => {
it('decimalToHex', () => {
const input = [0, 1, 2, 100, 999];
const input = [0, 1, 2, 100, 9999999999];
input.forEach((entry) => {
expect(ethUtils.decimalToHex(entry)).toMatchSnapshot();
});
});
it('hexToDecimal', () => {
const input = ['2540be3ff', '64', '2', '1', '0', ''];
input.forEach((entry) => {
expect(ethUtils.hexToDecimal(entry)).toMatchSnapshot();
});
});
it('padLeftEven', () => {
const input = ['2540be3ff'];
input.forEach((entry) => {
expect(ethUtils.padLeftEven(entry)).toMatchSnapshot();
});
});
it('sanitizeHex', () => {
const input = ['0x2540be3ff', '1', '2', '100', 999, ''];
input.forEach((entry) => {
expect(ethUtils.sanitizeHex(entry)).toMatchSnapshot();
});
});
it('strip', () => {
const input = ['0x', '0x2540be3ff', '2540be3ff'];
input.forEach((entry) => {
expect(ethUtils.strip(entry)).toMatchSnapshot();
});
});
it('calcGasPrice', () => {
const input = [{ price: new BigNumber(9898998989), limit: '9' }];
input.forEach((entry) => {
expect(ethUtils.calcGasPrice(entry.price, entry.limit)).toMatchSnapshot();
});
});
});

49
src/utils/__tests__/formatUtils.test.js Normal file
View File

@ -0,0 +1,49 @@
import * as formatUtils from '../formatUtils';
describe('format utils', () => {
it('formatAmount', () => {
const input = [
{ amount: 0, coinInfo: { isBitcoin: true, currencyUnits: 'mbtc', shortcut: 'btc' } },
{ amount: 1000000, coinInfo: { isBitcoin: true, currencyUnits: 'mbtc', shortcut: 'btc' } },
{ amount: 0.5, coinInfo: { isBitcoin: true, currencyUnits: 'mbtc', shortcut: 'btc' } },
{ amount: 1, coinInfo: { isBitcoin: false, shortcut: 'eth' } },
{ amount: 99999, coinInfo: { isBitcoin: false, shortcut: 'tau' } },
];
input.forEach((entry) => {
expect(formatUtils.formatAmount(entry.amount, entry.coinInfo, entry.coinInfo.currencyUnits)).toMatchSnapshot();
});
});
it('formatTime', () => {
const input = [0, 1, 2, 100, 999, 45];
input.forEach((entry) => {
expect(formatUtils.formatTime(entry)).toMatchSnapshot();
});
});
it('btckb2satoshib', () => {
const input = [0, 1, 2, 100, 999];
input.forEach((entry) => {
expect(formatUtils.btckb2satoshib(entry)).toMatchSnapshot();
});
});
it('stringToHex', () => {
const input = ['test', '0001', 'test99999'];
input.forEach((entry) => {
expect(formatUtils.stringToHex(entry)).toMatchSnapshot();
});
});
it('hexToString', () => {
const input = ['0074006500730074', '0030003000300031', '007400650073007400390039003900390039'];
input.forEach((entry) => {
expect(formatUtils.hexToString(entry)).toMatchSnapshot();
});
});
});

15
src/utils/ethUtils.js
View File

@ -1,6 +1,7 @@
/* @flow */
import BigNumber from 'bignumber.js';
import EthereumjsUtil from 'ethereumjs-util';
export const decimalToHex = (dec: number): string => new BigNumber(dec).toString(16);
@ -28,4 +29,16 @@ export const strip = (str: string): string => {
return padLeftEven(str);
};
export const calcGasPrice = (price: BigNumber, limit: string): string => price.times(limit).toString();
export const calcGasPrice = (price: BigNumber, limit: string): string => price.times(limit).toString();
export const validateAddress = (address: string): ?string => {
const hasUpperCase = new RegExp('^(.*[A-Z].*)$');
if (address.length < 1) {
return 'Address is not set';
} else if (!EthereumjsUtil.isValidAddress(address)) {
return 'Address is not valid';
} else if (address.match(hasUpperCase) && !EthereumjsUtil.isValidChecksumAddress(address)) {
return 'Address is not a valid checksum';
}
return null;
}

6
src/utils/formatUtils.js
View File

@ -1,11 +1,9 @@
/* @flow */
const currencyUnits: string = 'mbtc2';
// TODO: chagne currency units
const currencyUnitsConstant: string = 'mbtc2';
export const formatAmount = (n: number, coinInfo: any): string => {
export const formatAmount = (n: number, coinInfo: any, currencyUnits: string = currencyUnitsConstant): string => {
const amount = (n / 1e8);
if (coinInfo.isBitcoin && currencyUnits === 'mbtc' && amount <= 0.1 && n !== 0) {
const s = (n / 1e5).toString();

11
src/utils/networkUtils.js
View File

@ -1,6 +1,5 @@
/* @flow */
import 'whatwg-fetch';
export const httpRequest = async (url: string, type: string = 'text'): any => {
@ -15,16 +14,6 @@ export const httpRequest = async (url: string, type: string = 'text'): any => {
await response.text();
}
throw new Error(`${url} ${response.statusText}`);
// return fetch(url, { credentials: 'same-origin' }).then((response) => {
// if (response.status === 200) {
// return response.text().then(result => (json ? JSON.parse(result) : result));
// } else {
// throw new Error(response.statusText);
// }
// })
};
export const JSONRequest = async (url: string): Promise<JSON> => {

2
src/views/Landing/components/ConnectDevice/index.js
View File

@ -86,7 +86,7 @@ class ConnectDevice extends Component<Props> {
</React.Fragment>
)}
</ConnectTrezorWrapper>
{this.props.showWebUsb && (
{this.props.showWebUsb && !this.props.showDisconnect && (
<React.Fragment>
<P>and</P>
<Button isWebUsb>

32
src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
View File

@ -20,7 +20,6 @@ import type { Props } from '../common';
import Row from '../Row';
import RowCoin from '../RowCoin';
const Wrapper = styled.div``;
const Text = styled.span`
@ -28,6 +27,10 @@ const Text = styled.span`
color: ${colors.TEXT_SECONDARY};
`;
const TooltipContent = styled.div`
font-size: ${FONT_SIZE.SMALLEST};
`;
const RowAccountWrapper = styled.div`
width: 100%;
display: flex;
@ -115,12 +118,12 @@ const AccountMenu = (props: Props): ?React$Element<string> => {
const selectedCoin = config.coins.find(c => c.network === location.state.network);
if (!selected || !selectedCoin) return;
const fiatRate = props.fiat.find(f => f.network === selectedCoin.network);
const deviceAccounts: Accounts = findDeviceAccounts(accounts, selected, location.state.network);
let selectedAccounts = deviceAccounts.map((account, i) => {
const selectedAccounts = deviceAccounts.map((account, i) => {
// const url: string = `${baseUrl}/network/${location.state.network}/account/${i}`;
const url: string = location.pathname.replace(/account+\/([0-9]*)/, `account/${i}`);
@ -158,26 +161,6 @@ const AccountMenu = (props: Props): ?React$Element<string> => {
);
});
if (selectedAccounts.length < 1) {
if (selected.connected) {
const url: string = location.pathname.replace(/account+\/([0-9]*)/, 'account/0');
selectedAccounts = (
<NavLink
to={url}
>
<Row column>
<RowAccountWrapper
isSelected
borderTop
>
Account #1
</RowAccountWrapper>
</Row>
</NavLink>
);
}
}
let discoveryStatus = null;
const discovery = props.discovery.find(d => d.deviceState === selected.state && d.network === location.state.network);
@ -204,7 +187,8 @@ const AccountMenu = (props: Props): ?React$Element<string> => {
} else {
discoveryStatus = (
<Tooltip
content={<React.Fragment>To add a new account, last account must have some transactions.</React.Fragment>}
maxWidth={300}
content={<TooltipContent>To add a new account, last account must have some transactions.</TooltipContent>}
placement="bottom"
>
<Row>

2
src/views/Wallet/components/LeftNavigation/components/RowCoin/index.js
View File

@ -20,6 +20,8 @@ const RowCoinWrapper = styled.div`
display: block;
font-size: ${FONT_SIZE.BASE};
color: ${colors.TEXT_PRIMARY};
transition: background-color 0.3s, color 0.3s;
&:hover {
background-color: ${colors.GRAY_LIGHT};
}

1
src/views/Wallet/components/LeftNavigation/components/StickyContainer/index.js
View File

@ -19,6 +19,7 @@ const AsideWrapper = styled.aside`
position: relative;
top: 0;
width: 320px;
min-width: 320px;
overflow: hidden;
background: ${colors.MAIN};
border-right: 1px solid ${colors.DIVIDER};

77
src/views/Wallet/components/LeftNavigation/index.js
View File

@ -24,15 +24,15 @@ const TransitionContentWrapper = styled.div`
`;
const Footer = styled.div`
position: fixed;
position: relative;
width: 320px;
bottom: 0;
background: ${colors.MAIN};
border-right: 1px solid ${colors.DIVIDER};
`;
const Body = styled.div`
overflow: auto;
background: ${colors.LANDING};
width: 320px;
`;
const Help = styled.div`
@ -58,6 +58,25 @@ const A = styled.a`
}
`;
const TransitionMenu = (props: TransitionMenuProps): React$Element<TransitionGroup> => (
<TransitionGroupWrapper component="div" className="transition-container">
<CSSTransition
key={props.animationType}
onExit={() => { window.dispatchEvent(new Event('resize')); }}
onExited={() => window.dispatchEvent(new Event('resize'))}
in
out
classNames={props.animationType}
appear={false}
timeout={300}
>
<TransitionContentWrapper>
{ props.children }
</TransitionContentWrapper>
</CSSTransition>
</TransitionGroupWrapper>
);
class LeftNavigation extends Component {
constructor(props) {
super(props);
@ -96,39 +115,6 @@ class LeftNavigation extends Component {
}
}
// TODO: refactor to transition component for reuse of transitions
getMenuTransition(children) {
return (
<TransitionGroupWrapper component="div" className="transition-container">
<CSSTransition
key={this.state.animationType}
onEnter={() => {
console.warn('ON ENTER');
}}
onEntering={() => {
console.warn('ON ENTERING (ACTIVE)');
}}
onExit={() => {
console.warn('ON EXIT');
window.dispatchEvent(new Event('resize'));
}}
onExiting={() => {
console.warn('ON EXITING (ACTIVE)');
}}
onExited={() => window.dispatchEvent(new Event('resize'))}
classNames={this.state.animationType}
appear={false}
timeout={30000}
in
out
>
<TransitionContentWrapper>
{children}
</TransitionContentWrapper>
</CSSTransition>
</TransitionGroupWrapper>);
}
shouldRenderAccounts() {
const { selectedDevice } = this.props.wallet;
return selectedDevice
@ -148,6 +134,22 @@ class LeftNavigation extends Component {
}
render() {
const { props } = this;
let menu;
if (this.shouldRenderAccounts()) {
menu = (
<TransitionMenu animationType="slide-left">
<AccountMenu {...props} />
</TransitionMenu>
);
} else if (this.shouldRenderCoins()) {
menu = (
<TransitionMenu animationType="slide-right">
<CoinMenu {...props} />
</TransitionMenu>
);
}
return (
<StickyContainer
location={this.props.location.pathname}
@ -163,8 +165,7 @@ class LeftNavigation extends Component {
/>
<Body>
{this.state.shouldRenderDeviceSelection && <DeviceMenu {...this.props} />}
{this.shouldRenderAccounts() && this.getMenuTransition(<AccountMenu {...this.props} />)}
{this.shouldRenderCoins() && this.getMenuTransition(<CoinMenu {...this.props} />)}
{menu}
</Body>
<Footer className="sticky-bottom">
<Help>

10
webpack/dev.babel.js
View File

@ -1,12 +1,15 @@
import webpack from 'webpack';
import GitRevisionPlugin from 'git-revision-webpack-plugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import FlowWebpackPlugin from 'flow-webpack-plugin';
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
import {
SRC, BUILD, PORT, PUBLIC,
} from './constants';
const gitRevisionPlugin = new GitRevisionPlugin();
module.exports = {
watch: true,
@ -46,6 +49,7 @@ module.exports = {
{
loader: 'stylelint-custom-processor-loader',
options: {
emitWarning: true,
configPath: '.stylelintrc',
},
},
@ -89,6 +93,10 @@ module.exports = {
hints: false,
},
plugins: [
new webpack.DefinePlugin({
COMMITHASH: JSON.stringify(gitRevisionPlugin.commithash()),
}),
new FlowWebpackPlugin(),
new HtmlWebpackPlugin({
chunks: ['index'],
template: `${SRC}index.html`,

5
webpack/local.babel.js
View File

@ -1,5 +1,6 @@
import webpack from 'webpack';
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
import GitRevisionPlugin from 'git-revision-webpack-plugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import CopyWebpackPlugin from 'copy-webpack-plugin';
import MiniCssExtractPlugin from '../../trezor-connect/node_modules/mini-css-extract-plugin';
@ -15,6 +16,8 @@ import {
PORT,
} from './constants';
const gitRevisionPlugin = new GitRevisionPlugin();
module.exports = {
watch: true,
mode: 'development',
@ -115,7 +118,6 @@ module.exports = {
filename: '[name].css',
chunkFilename: '[id].css',
}),
new HtmlWebpackPlugin({
chunks: ['index'],
template: `${SRC}index.html`,
@ -164,6 +166,7 @@ module.exports = {
new webpack.DefinePlugin({
LOCAL: JSON.stringify(`http://localhost:${PORT}/`),
COMMITHASH: JSON.stringify(gitRevisionPlugin.commithash()),
}),
// ignore node lib from trezor-link

8
webpack/production.babel.js
View File

@ -1,9 +1,13 @@
import webpack from 'webpack';
import GitRevisionPlugin from 'git-revision-webpack-plugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import CopyWebpackPlugin from 'copy-webpack-plugin';
import FlowWebpackPlugin from 'flow-webpack-plugin';
import { SRC, BUILD, PUBLIC } from './constants';
const gitRevisionPlugin = new GitRevisionPlugin();
module.exports = {
mode: 'production',
entry: {
@ -60,6 +64,10 @@ module.exports = {
hints: false,
},
plugins: [
new webpack.DefinePlugin({
COMMITHASH: JSON.stringify(gitRevisionPlugin.commithash()),
}),
new FlowWebpackPlugin(),
new HtmlWebpackPlugin({
chunks: ['index'],
template: `${SRC}index.html`,

59
yarn.lock
View File

@ -255,6 +255,10 @@
version "0.7.0"
resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.7.0.tgz#9a06f4f137ee84d7df0460c1fdb1135ffa6c50fd"
"@types/jest@^23.0.0":
version "23.3.2"
resolved "https://registry.yarnpkg.com/@types/jest/-/jest-23.3.2.tgz#07b90f6adf75d42c34230c026a2529e56c249dbb"
"@webassemblyjs/ast@1.5.13":
version "1.5.13"
resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.5.13.tgz#81155a570bd5803a30ec31436bc2c9c0ede38f25"
@ -3293,6 +3297,10 @@ dom-helpers@^3.2.0:
version "3.2.1"
resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.2.1.tgz#3203e07fed217bd1f424b019735582fc37b2825a"
dom-helpers@^3.3.1:
version "3.3.1"
resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.3.1.tgz#fc1a4e15ffdf60ddde03a480a9c0fece821dd4a6"
dom-serializer@0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
@ -4306,6 +4314,10 @@ flow-parser@^0.*:
version "0.72.0"
resolved "https://registry.yarnpkg.com/flow-parser/-/flow-parser-0.72.0.tgz#6c8041e76ac7d0be1a71ce29c00cd1435fb6013c"
flow-webpack-plugin@^1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/flow-webpack-plugin/-/flow-webpack-plugin-1.2.0.tgz#1958821d16135028e391cad5ee2f3a4fa78197ec"
flush-write-stream@^1.0.0:
version "1.0.2"
resolved "https://registry.yarnpkg.com/flush-write-stream/-/flush-write-stream-1.0.2.tgz#c81b90d8746766f1a609a46809946c45dd8ae417"
@ -4519,6 +4531,10 @@ gh-got@^6.0.0:
got "^7.0.0"
is-plain-obj "^1.1.0"
git-revision-webpack-plugin@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/git-revision-webpack-plugin/-/git-revision-webpack-plugin-3.0.3.tgz#f909949d7851d1039ed530518f73f5d46594e66f"
github-username@^4.0.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/github-username/-/github-username-4.1.0.tgz#cbe280041883206da4212ae9e4b5f169c30bf417"
@ -5589,7 +5605,7 @@ isobject@^3.0.0, isobject@^3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
isomorphic-fetch@^2.1.1:
isomorphic-fetch@^2.1.1, isomorphic-fetch@^2.2.1:
version "2.2.1"
resolved "https://registry.yarnpkg.com/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz#611ae1acf14f5e81f729507472819fe9733558a9"
dependencies:
@ -5781,6 +5797,14 @@ jest-environment-node@^23.4.0:
jest-mock "^23.2.0"
jest-util "^23.4.0"
jest-fetch-mock@^1.6.5:
version "1.6.5"
resolved "https://registry.yarnpkg.com/jest-fetch-mock/-/jest-fetch-mock-1.6.5.tgz#178fa1a937ef6f61fb8e8483b6d4602b17e0d96d"
dependencies:
"@types/jest" "^23.0.0"
isomorphic-fetch "^2.2.1"
promise-polyfill "^7.1.1"
jest-get-type@^22.1.0:
version "22.4.3"
resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-22.4.3.tgz#e3a8504d8479342dd4420236b322869f18900ce4"
@ -8030,6 +8054,10 @@ promise-inflight@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"
promise-polyfill@^7.1.1:
version "7.1.2"
resolved "https://registry.yarnpkg.com/promise-polyfill/-/promise-polyfill-7.1.2.tgz#ab05301d8c28536301622d69227632269a70ca3b"
promise@^7.1.1:
version "7.3.1"
resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
@ -8051,13 +8079,6 @@ prop-types@15.x, prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.8, pr
loose-envify "^1.3.1"
object-assign "^4.1.1"
prop-types@>=15.5.10, prop-types@^15.6.2:
version "15.6.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
dependencies:
loose-envify "^1.3.1"
object-assign "^4.1.1"
prop-types@^15.6.1:
version "15.6.1"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.1.tgz#36644453564255ddda391191fb3a125cbdf654ca"
@ -8066,6 +8087,13 @@ prop-types@^15.6.1:
loose-envify "^1.3.1"
object-assign "^4.1.1"
prop-types@^15.6.2:
version "15.6.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
dependencies:
loose-envify "^1.3.1"
object-assign "^4.1.1"
proxy-addr@~2.0.3:
version "2.0.3"
resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-2.0.3.tgz#355f262505a621646b3130a728eb647e22055341"
@ -8398,12 +8426,6 @@ react-select@2.0.0:
react-input-autosize "^2.2.1"
react-transition-group "^2.2.1"
react-sticky-el@^1.0.20:
version "1.0.20"
resolved "https://registry.yarnpkg.com/react-sticky-el/-/react-sticky-el-1.0.20.tgz#b3c5e7128218633f440dc67aec239d1cd078342d"
dependencies:
prop-types ">=15.5.10"
react-transition-group@^2.2.1:
version "2.2.1"
resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.2.1.tgz#e9fb677b79e6455fd391b03823afe84849df4a10"
@ -8415,6 +8437,15 @@ react-transition-group@^2.2.1:
prop-types "^15.5.8"
warning "^3.0.0"
react-transition-group@^2.4.0:
version "2.4.0"
resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.4.0.tgz#1d9391fabfd82e016f26fabd1eec329dbd922b5a"
dependencies:
dom-helpers "^3.3.1"
loose-envify "^1.3.1"
prop-types "^15.6.2"
react-lifecycles-compat "^3.0.4"
"react@^15.4.2 || ^16.0.0":
version "16.2.0"
resolved "https://registry.yarnpkg.com/react/-/react-16.2.0.tgz#a31bd2dab89bff65d42134fa187f24d054c273ba"