-
-
-
- History
-
-
- Send
-
-
- Receive
-
-
- );
-}
-
-export default AddressTab;
\ No newline at end of file
diff --git a/src/js/components/Devices.js b/src/js/components/Devices.js
deleted file mode 100644
index a0f493c6..00000000
--- a/src/js/components/Devices.js
+++ /dev/null
@@ -1,42 +0,0 @@
-/* @flow */
-'use strict';
-
-import React, { Component } from 'react';
-
-export default class Devices extends Component {
- render() {
- const { devices, selectedDevice } = this.props.connect;
- const deviceList: Array{ currentAddress.address }
-
-
- onAddressChange(event.target.value) } />
-
-
-
-
- onAmountChange(event.target.value) } />
-
-
-
-
- onGasLimitChange(event.target.value) } />
-
-
-
-
- onGasPriceChange(event.target.value) } />
- GWEI
-
-
-
-
- onDataChange(event.target.value) } />
-
-
-
-
-
-
-
-
- TrezorConnect
+
+ );
+}
\ No newline at end of file
diff --git a/src/js/components/common/Log.js b/src/js/components/common/Log.js
new file mode 100644
index 00000000..62ac4e18
--- /dev/null
+++ b/src/js/components/common/Log.js
@@ -0,0 +1,40 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+
+import * as SendFormActions from '../../actions/SendFormActions';
+import { getAddress } from '../../actions/TrezorConnectActions';
+
+
+const Log = (props: any) => {
+ return (
+ { props.label }
+ +
+ Log
+
+ )
+}
+
+function mapStateToProps(state, own) {
+
+}
+
+function mapDispatchToProps(dispatch) {
+
+}
+
+export default connect(
+ (state) => {
+ return {
+ accounts: state.accounts,
+ receive: state.receive
+ };
+ },
+ (dispatch) => {
+ return {
+ getAddress: bindActionCreators(getAddress, dispatch),
+ };
+ }
+)(Log);
\ No newline at end of file
diff --git a/src/js/components/common/Notification.js b/src/js/components/common/Notification.js
new file mode 100644
index 00000000..21ecbff5
--- /dev/null
+++ b/src/js/components/common/Notification.js
@@ -0,0 +1,74 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+
+import * as NOTIFICATION from '../../actions/constants/notification';
+
+
+export const Notification = (props: any) => {
+ const className = `notification ${ props.className }`;
+
+
+ const actionButtons = !props.actions ? null : props.actions.map((a, i) => {
+ return (
+
+ )
+ });
+
+ return (
+
+ { props.cancelable ? (
+
+ ) : null }
+
+ )
+}
+
+export const NotificationGroup = (props: any) => {
+ const { notifications, close } = props;
+ return notifications.map((n, i) => {
+ return (
+
+
+ { props.actions && props.actions.length > 0 ? (
+ { props.title }
+ +
+ { actionButtons }
+
+ ) : null }
+
+
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/js/components/landing/LandingPage.js b/src/js/components/landing/LandingPage.js
new file mode 100644
index 00000000..440ba3f8
--- /dev/null
+++ b/src/js/components/landing/LandingPage.js
@@ -0,0 +1,73 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import Preloader from './Preloader';
+import ConnectDevice from './ConnectDevice';
+import LocalStorageError from './LocalStorageError';
+import TrezorConnectError from './TrezorConnectError';
+import Header from '../common/Header';
+import Footer from '../common/Footer';
+import { Notification } from '../common/Notification';
+
+export default (props: any): any => {
+
+ const web3 = props.web3;
+ const { devices } = props.connect;
+ const localStorageError = props.localStorage.error;
+ const connectError = props.connect.error;
+
+ let notification = null;
+
+ if (localStorageError) {
+ notification = (The private bank in your hands.
+TREZOR Wallet is an easy-to-use interface for your TREZOR.
+TREZOR Wallet allows you to easily control your funds, manage your balance and initiate transfers.
+
+
+
+ + + Connect TREZOR to continue +
+ {/*Don't have TREZOR? Get one
*/} +Don't have TREZOR? Get one
+
+
+
+
+
+ );
+ } else {
+ return (The private bank in your hands.
+TREZOR Wallet is an easy-to-use interface for your TREZOR.
+TREZOR Wallet allows you to easily control your funds, manage your balance and initiate transfers.
+
+
+
+ + + + Connect TREZOR to continue + +
+ {/* */} + {/*Don't have TREZOR? Get one
*/} +Don't have TREZOR? Get one
+
-
-
- )
- });
-
- const header: string = complete ? `Select ${ coinInfo.label } account` : `Loading ${ coinInfo.label } accounts...`;
-
- return (
-
-
- );
-}
-
-export default AccountSelection;
\ No newline at end of file
diff --git a/src/js/components/modal/ConfirmAddress.js b/src/js/components/modal/ConfirmAddress.js
new file mode 100644
index 00000000..7af6ddf3
--- /dev/null
+++ b/src/js/components/modal/ConfirmAddress.js
@@ -0,0 +1,55 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import { findSelectedDevice } from '../../reducers/TrezorConnectReducer';
+
+const ConfirmAddress = (props: any): any => {
+
+ const account = props.accounts.find(a => a.checksum === props.receive.checksum && a.index === props.receive.accountIndex && a.coin === props.receive.coin);
+
+ return (
+ { header }
-
-
- Accounts
- Legacy Accounts
-
- { accountsCollection }
-
-
+
+ );
+}
+export default ConfirmAddress;
+
+export const ConfirmUnverifiedAddress = (props: any): any => {
+
+ const account = props.accounts.find(a => a.checksum === props.receive.checksum && a.index === props.receive.accountIndex && a.coin === props.receive.coin);
+
+ const {
+ onCancel
+ } = props.modalActions;
+
+ const {
+ showUnverifiedAddress,
+ showAddress
+ } = props.receiveActions;
+
+
+ return (
+
+
+ Confirm address on TREZOR
+Please compare your address on device with address shown bellow.
+
+
+ { account.address }
+ +
+
+
+ );
+}
diff --git a/src/js/components/modal/ConfirmSignTx.js b/src/js/components/modal/ConfirmSignTx.js
new file mode 100644
index 00000000..1fa9621a
--- /dev/null
+++ b/src/js/components/modal/ConfirmSignTx.js
@@ -0,0 +1,34 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+
+const Confirmation = (props): any => {
+ const {
+ amount,
+ address,
+ coin,
+ token,
+ total,
+ selectedFeeLevel
+ } = props.sendForm;
+
+ return (
+ Your TREZOR is not connected
+To prevent phishing attacks, you should verify the address on your TREZOR first. Please reconnect your device to continue with the verification process.
+ + +
+
+ );
+}
+
+export default Confirmation;
\ No newline at end of file
diff --git a/src/js/components/modal/Confirmation.js b/src/js/components/modal/Confirmation.js
deleted file mode 100644
index dbe7552e..00000000
--- a/src/js/components/modal/Confirmation.js
+++ /dev/null
@@ -1,17 +0,0 @@
-/* @flow */
-'use strict';
-
-import React from 'react';
-
-const Confirmation = (props): any => {
- const { onConfirmation, onConfirmationCancel } = props.modalActions;
- return (
-
+
+ Confirm transaction on your TREZOR
+Details are shown on device
+
+
+
+ { `${amount} ${token.toUpperCase() }` }
+ +{ address }
+ +{ selectedFeeLevel.label }
+
-
- );
-}
-
-export default Confirmation;
\ No newline at end of file
diff --git a/src/js/components/modal/DuplicateDevice.js b/src/js/components/modal/DuplicateDevice.js
new file mode 100644
index 00000000..a8ad19a6
--- /dev/null
+++ b/src/js/components/modal/DuplicateDevice.js
@@ -0,0 +1,21 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+
+const RememberDevice = (props: any): any => {
+ const { device } = props.modal;
+ const { onCancel, onDuplicateDevice } = props.modalActions;
+ return (
+ Confirm
- - -
+
+ );
+}
+
+export default RememberDevice;
\ No newline at end of file
diff --git a/src/js/components/modal/FeeSelection.js b/src/js/components/modal/FeeSelection.js
deleted file mode 100644
index d913a007..00000000
--- a/src/js/components/modal/FeeSelection.js
+++ /dev/null
@@ -1,95 +0,0 @@
-/* @flow */
-'use strict';
-
-import React from 'react';
-import { formatAmount, formatTime } from '../../utils/formatUtils';
-
-const FeeSelection = (props): any => {
-
- const {
- onChangeAccount,
- onCustomFeeOpen,
- onCustomFeeChange,
- onFeeSelect
- } = props.modalActions;
-
- const {
- feeList,
- coinInfo,
- customFeeOpened,
- customFee
- } = props.modal;
-
-
- const feesCollection = feeList.map((feeItem, index) => {
- // skip custom
- if (feeItem.name === 'custom') return null;
- let feeName;
- if (feeItem.name === 'normal' && feeItem.bytes > 0) {
- feeName = (
- Duplicate { device.label } ?
+ + + + + +
- { feeItem.name }
- recommended
-
- );
- } else {
- feeName = ({ feeItem.name });
- }
-
- let feeButton: string;
-
- if (feeItem.fee > 0) {
- return (
-
-
-
- );
- } else {
- return (
-
-
-
- );
- }
- });
-
- return (
-
-
- );
-}
-
-export default FeeSelection;
\ No newline at end of file
diff --git a/src/js/components/modal/InvalidPin.js b/src/js/components/modal/InvalidPin.js
index 4682a26a..63933764 100644
--- a/src/js/components/modal/InvalidPin.js
+++ b/src/js/components/modal/InvalidPin.js
@@ -4,9 +4,11 @@
import React from 'react';
const InvalidPin = (props): any => {
+ const { device } = props.modal;
return (
- Select fee:
-
- Change account
-
-
- { feesCollection }
-
-
-
-
-
-
-
- onCustomFeeChange(event.target.value) } />
-
- sat/B
-
-
- Setting custom fee is not recommended.
- If you set too low fee, it might get stuck forever.
-
-
-
- {(state) => (
-
-);
-
-const Fade = ({ children, ...props }) => (
-
- { children }
-
-);
-
-export default class Modal extends Component {
- render() {
- const { opened, windowType } = this.props.modal;
-
- let component = null;
- switch(windowType) {
- case UI.REQUEST_PIN :
- component = (
-
- );
- }
-
- return ch;
- }
-}
diff --git a/src/js/components/modal/ModalContainer.js b/src/js/components/modal/ModalContainer.js
new file mode 100644
index 00000000..ce1266cd
--- /dev/null
+++ b/src/js/components/modal/ModalContainer.js
@@ -0,0 +1,119 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import { withRouter } from 'react-router-dom';
+
+import { CSSTransition, Transition } from 'react-transition-group';
+
+import { UI } from 'trezor-connect';
+
+import * as ModalActions from '../../actions/ModalActions';
+import * as ReceiveActions from '../../actions/ReceiveActions';
+
+import Pin from './Pin';
+import InvalidPin from './InvalidPin';
+import Passphrase from './Passphrase';
+import ConfirmSignTx from './ConfirmSignTx';
+import ConfirmAddress, { ConfirmUnverifiedAddress } from './ConfirmAddress';
+import RememberDevice, { ForgetDevice, DisconnectDevice } from './RememberDevice';
+import DuplicateDevice from './DuplicateDevice';
+
+import * as RECEIVE from '../../actions/constants/receive';
+import * as MODAL from '../../actions/constants/Modal';
+import * as CONNECT from '../../actions/constants/TrezorConnect';
+
+const duration = 300;
+
+
+const Fade = ({ children, ...props }) => (
+
+ { children }
+
+);
+
+class Modal extends Component {
+ render() {
+ const { opened, windowType } = this.props.modal;
+
+ let component = null;
+ switch (windowType) {
+ case UI.REQUEST_PIN :
+ component = (
+
+ );
+ }
+
+ return ch;
+ }
+}
+
+const mapStateToProps = (state: any, own: any): any => {
+ return {
+ modal: state.modal,
+ accounts: state.accounts,
+ devices: state.connect.devices,
+ sendForm: state.sendForm,
+ receive: state.receive,
+ };
+}
+
+const mapDispatchToProps = (dispatch: any): any => {
+ return {
+ modalActions: bindActionCreators(ModalActions, dispatch),
+ receiveActions: bindActionCreators(ReceiveActions, dispatch),
+ };
+}
+
+// export default connect(mapStateToProps, mapDispatchToProps)(Modal);
+export default withRouter(
+ connect(mapStateToProps, mapDispatchToProps)(Modal)
+);
diff --git a/src/js/components/modal/Passphrase.js b/src/js/components/modal/Passphrase.js
index 9c0b8041..dde75b65 100644
--- a/src/js/components/modal/Passphrase.js
+++ b/src/js/components/modal/Passphrase.js
@@ -1,94 +1,308 @@
/* @flow */
'use strict';
-import React, { Component, KeyboardEvent, FocusEvent } from 'react';
+import React, { Component } from 'react';
+import raf from 'raf';
+
+type State = {
+ singleInput: boolean;
+ passphrase: string;
+ passphraseRevision: string;
+ passphraseFocused: boolean;
+ passphraseRevisionFocused: boolean;
+ passphraseRevisionTouched: boolean;
+ match: boolean;
+ visible: boolean;
+}
export default class PinModal extends Component {
- input: HTMLInputElement;
+ state: State;
+ passphraseInput: HTMLInputElement;
+ passphraseRevisionInput: HTMLInputElement;
+
+ constructor(props: any) {
+ super(props);
+
+ console.warn("PROPZ", props)
+ const isSavedDevice = props.devices.find(d => d.path === props.modal.device.path && d.remember);
+
+ this.state = {
+ singleInput: isSavedDevice ? true : false,
+ passphrase: '',
+ passphraseRevision: '',
+ passphraseFocused: false,
+ passphraseRevisionFocused: false,
+ passphraseRevisionTouched: false,
+ match: true,
+ visible: false
+ }
+ }
+
+ keyboardHandler(event: KeyboardEvent): void {
+
+
+ if (event.keyCode === 13) {
+ event.preventDefault();
+ //this.passphraseInput.blur();
+ //this.passphraseRevisionInput.blur();
+
+ //this.passphraseInput.type = 'text';
+ //this.passphraseRevisionInput.type = 'text';
+
+ this.submit();
+
+ // TODO: set timeout, or wait for blur event
+ //onPassphraseSubmit(passphrase, passphraseCached);
+ //raf(() => onPassphraseSubmit(passphrase));
+ }
+ }
componentDidMount(): void {
// one time autofocus
- this.input.focus();
+ this.passphraseInput.focus();
this.keyboardHandler = this.keyboardHandler.bind(this);
window.addEventListener('keydown', this.keyboardHandler, false);
+
+
+
+ // document.oncontextmenu = (event) => {
+ // const el = window.event.srcElement || event.target;
+ // const type = el.tagName.toLowerCase() || '';
+ // if (type === 'input') {
+ // return false;
+ // }
+ // };
}
componentWillUnmount(): void {
window.removeEventListener('keydown', this.keyboardHandler, false);
+ // this.passphraseInput.type = 'text';
+ // this.passphraseInput.style.display = 'none';
+ // this.passphraseRevisionInput.type = 'text';
+ // this.passphraseRevisionInput.style.display = 'none';
}
- keyboardHandler(event: KeyboardEvent): void {
- const { onPassphraseSubmit } = this.props;
- const { passphrase, passphraseCached } = this.props.modal;
-
- if (event.keyCode === 13) {
- event.preventDefault();
- this.input.blur();
- onPassphraseSubmit(passphrase, passphraseCached);
- }
- }
// we don't want to keep password inside "value" attribute,
// so we need to replace it thru javascript
componentDidUpdate() {
- const { passphrase, passphraseFocused, passphraseVisible } = this.props.modal;
- let inputValue: string = passphrase;
- if (!passphraseVisible && !passphraseFocused) {
- inputValue = passphrase.replace(/./g, '•');
+ const {
+ passphrase,
+ passphraseRevision,
+ passphraseFocused,
+ passphraseRevisionFocused,
+ visible
+ } = 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, '•');
+ }
+
+ this.passphraseInput.value = passphraseInputValue;
+ this.passphraseInput.setAttribute("type", visible ? "text" : "password");
+
+ if (this.passphraseRevisionInput) {
+ this.passphraseRevisionInput.value = passphraseRevisionInputValue;
+ this.passphraseRevisionInput.setAttribute("type", visible ? "text" : "password");
+ }
+
+ }
+
+ onPassphraseChange = (input: string, value: string): void => {
+ // https://codepen.io/MiDri/pen/PGqvrO
+ // or
+ // https://github.com/zakangelle/react-password-mask/blob/master/src/index.js
+ if (input === 'passphrase') {
+ this.setState({
+ match: this.state.singleInput || this.state.passphraseRevision === value,
+ passphrase: value
+ });
+ } else {
+ this.setState({
+ match: this.state.passphrase === value,
+ passphraseRevision: value,
+ passphraseRevisionTouched: true
+ });
+ }
+ }
+
+ onPassphraseFocus = (input: string): void => {
+ if (input === 'passphrase') {
+ this.setState({
+ passphraseFocused: true
+ });
+ } else {
+ this.setState({
+ passphraseRevisionFocused: true
+ });
+ }
+ }
+
+ onPassphraseBlur = (input: string): void => {
+ if (input === 'passphrase') {
+ this.setState({
+ passphraseFocused: false
+ });
+ } else {
+ this.setState({
+ passphraseRevisionFocused: false
+ });
}
- this.input.value = inputValue;
}
- render(): void {
+ onPassphraseShow = (): void => {
+ this.setState({
+ visible: true
+ });
+ }
+
+ onPassphraseHide = (): void => {
+ this.setState({
+ visible: false
+ });
+ }
+
+ submit = (empty: boolean = false): void => {
+ const { onPassphraseSubmit } = this.props.modalActions;
+ const { passphrase } = this.state;
+
+ //this.passphraseInput.type = 'text';
+ // this.passphraseInput.style.display = 'none';
+ //this.passphraseInput.setAttribute('readonly', 'readonly');
+ // this.passphraseRevisionInput.type = 'text';
+ //this.passphraseRevisionInput.style.display = 'none';
+ //this.passphraseRevisionInput.setAttribute('readonly', 'readonly');
+
+ const p = passphrase;
+
+ this.setState({
+ passphrase: '',
+ passphraseRevision: '',
+ passphraseFocused: false,
+ passphraseRevisionFocused: false,
+ visible: false
+ })
+
+ raf(() => onPassphraseSubmit(empty ? '' : passphrase));
+ }
+
+ render(): any {
const {
- onPassphraseChange,
- onPassphraseSubmit,
- onPassphraseForget,
- onPassphraseFocus,
- onPassphraseBlur,
- onPassphraseSave,
- onPassphraseShow,
- onPassphraseHide
+ //onPassphraseChange,
+ //onPassphraseSubmit,
+ //onPassphraseSubmitEmpty,
+ //onPassphraseForget,
+ //onPassphraseFocus,
+ //onPassphraseBlur,
+ //onPassphraseSave,
+ //onPassphraseShow,
+ //onPassphraseHide
} = this.props.modalActions;
- const { passphrase, passphraseFocused, passphraseVisible, passphraseCached } = this.props.modal;
- let inputType: string = passphraseVisible || (!passphraseVisible && !passphraseFocused) ? "text" : "password";
- const showPassphraseCheckboxFn: Function = passphraseVisible ? onPassphraseHide : onPassphraseShow;
- const savePassphraseCheckboxFn: Function = passphraseCached ? onPassphraseForget : onPassphraseSave;
+ const {
+ device,
+ //passphrase,
+ //passphraseRevision,
+ //passphraseFocused,
+ //passphraseRevisionFocused,
+ //passphraseVisible,
+ //passphraseMatch,
+ //passphraseRevisionTouched,
+ passphraseCached
+ } = this.props.modal;
+
+ const {
+ singleInput,
+ passphrase,
+ passphraseRevision,
+ passphraseFocused,
+ passphraseRevisionFocused,
+ visible,
+ match,
+ passphraseRevisionTouched,
+ } = this.state;
+
+ let passphraseInputType: string = visible || (!visible && !passphraseFocused) ? "text" : "password";
+ let passphraseRevisionInputType: string = visible || (!visible && !passphraseRevisionFocused) ? "text" : "password";
+ passphraseInputType = passphraseRevisionInputType = "text";
+ //let passphraseInputType: string = visible || passphraseFocused ? "text" : "password";
+ //let passphraseRevisionInputType: string = visible || passphraseRevisionFocused ? "text" : "password";
+
+
+ const showPassphraseCheckboxFn: Function = visible ? this.onPassphraseHide : this.onPassphraseShow;
return (
Entered PIN is not correct. Retrying...
+
+
);
}
diff --git a/src/js/components/modal/Modal.js b/src/js/components/modal/Modal.js
deleted file mode 100644
index 760adc58..00000000
--- a/src/js/components/modal/Modal.js
+++ /dev/null
@@ -1,100 +0,0 @@
-/* @flow */
-'use strict';
-
-import React, { Component } from 'react';
-import { CSSTransition, Transition } from 'react-transition-group';
-
-import { UI } from 'trezor-connect';
-
-import Pin from './Pin';
-import InvalidPin from './InvalidPin';
-import Passphrase from './Passphrase';
-import Permission from './Permission';
-import Confirmation from './Confirmation';
-
-import AccountSelection from './AccountSelection';
-import FeeSelection from './FeeSelection';
-
-const duration = 300;
-
-const defaultStyle = {
- transition: `opacity ${duration}ms ease-in-out`,
- opacity: 0,
- padding: 20,
- display: 'inline-block',
- backgroundColor: '#8787d8'
-}
-
-const transitionStyles = {
- entering: { opacity: 0 },
- entered: { opacity: 1 },
-};
-
-const Fade2 = ({ in: inProp }) => (
- Entered PIN for { device.label } is not correct.
+Retrying...
- I'm A fade Transition2
-
- )}
-
-
-
- { component }
-
-
+
+
+ { component }
+
+
-
Please enter your passphrase.
-Note that passphrase is case-sensitive.
-
+ {/* */}
+
Enter { device.label } passphrase
+Note that passphrase is case-sensitive.
+
+
{ this.input = element; } }
- onChange={ event => onPassphraseChange(event.currentTarget.value) }
- type={ inputType }
+ ref={ (element) => { this.passphraseInput = element; } }
+ onChange={ event => this.onPassphraseChange('passphrase', event.currentTarget.value) }
+ type={ passphraseInputType }
autoComplete="off"
autoCorrect="off"
autoCapitalize="off"
spellCheck="false"
data-lpignore="true"
- onFocus={ onPassphraseFocus }
- onBlur={ onPassphraseBlur }
+ onFocus={ event => this.onPassphraseFocus('passphrase') }
+ onBlur={ event => this.onPassphraseBlur('passphrase') }
+
tabIndex="1" />
-
-
-
);
}
diff --git a/src/js/components/modal/Permission.js b/src/js/components/modal/Permission.js
deleted file mode 100644
index 1ed8193d..00000000
--- a/src/js/components/modal/Permission.js
+++ /dev/null
@@ -1,18 +0,0 @@
-/* @flow */
-'use strict';
-
-import React from 'react';
-
-const Permission = (props): any => {
- const { onPermissionGranted, onPermissionRejected } = props.modalActions;
- return (
-
-
- );
-}
-
-export default Permission;
\ No newline at end of file
diff --git a/src/js/components/modal/Pin.js b/src/js/components/modal/Pin.js
index 5b041915..782c988f 100644
--- a/src/js/components/modal/Pin.js
+++ b/src/js/components/modal/Pin.js
@@ -3,20 +3,41 @@
import React, { Component, KeyboardEvent } from 'react';
+type State = {
+ pin: string;
+}
+
export default class Pin extends Component {
- componentWillMount(): void {
- this.keyboardHandler = this.keyboardHandler.bind(this);
- window.addEventListener('keydown', this.keyboardHandler, false);
+ state: State;
+
+ constructor(props: any) {
+ super(props);
+
+ this.state = {
+ pin: '',
+ }
}
- componentWillUnmount(): void {
- window.removeEventListener('keydown', this.keyboardHandler, false);
+ onPinAdd = (input: number): void => {
+ let pin: string = this.state.pin;
+ if (pin.length < 9) {
+ pin += input;
+ this.setState({
+ pin: pin
+ });
+ }
+ }
+
+ onPinBackspace = (): void => {
+ this.setState({
+ pin: this.state.pin.substring(0, this.state.pin.length - 1),
+ });
}
keyboardHandler(event: KeyboardEvent): void {
const { onPinAdd, onPinBackspace, onPinSubmit } = this.props.modalActions;
- const { pin } = this.props.modal;
+ const { pin } = this.state;
event.preventDefault();
switch (event.keyCode) {
@@ -26,76 +47,94 @@ export default class Pin extends Component {
break;
// backspace
case 8 :
- onPinBackspace();
+ this.onPinBackspace();
break;
// numeric and numpad
case 49 :
case 97 :
- onPinAdd(1);
+ this.onPinAdd(1);
break;
case 50 :
case 98 :
- onPinAdd(2);
+ this.onPinAdd(2);
break;
case 51 :
case 99 :
- onPinAdd(3);
+ this.onPinAdd(3);
break;
case 52 :
case 100 :
- onPinAdd(4);
+ this.onPinAdd(4);
break;
case 53 :
case 101 :
- onPinAdd(5);
+ this.onPinAdd(5);
break;
case 54 :
case 102 :
- onPinAdd(6);
+ this.onPinAdd(6);
break;
case 55 :
case 103 :
- onPinAdd(7);
+ this.onPinAdd(7);
break;
case 56 :
case 104 :
- onPinAdd(8);
+ this.onPinAdd(8);
break;
case 57 :
case 105 :
- onPinAdd(9);
+ this.onPinAdd(9);
break;
}
}
- render(): void {
- const { onPinAdd, onPinBackspace, onPinSubmit } = this.props.modalActions;
- const { pin } = this.props.modal;
+
+
+ componentWillMount(): void {
+ this.keyboardHandler = this.keyboardHandler.bind(this);
+ window.addEventListener('keydown', this.keyboardHandler, false);
+ }
+
+ componentWillUnmount(): void {
+ window.removeEventListener('keydown', this.keyboardHandler, false);
+ }
+
+ render(): any {
+ const { onPinSubmit } = this.props.modalActions;
+ const { device } = this.props.modal;
+ const { pin } = this.state;
+
return (
HOST is requesting permissions to:
- - - -
-
Please enter your PIN.
-Look at the device for number positions.
-
-
-
-
+ {/* */}
+
+
+ { !device.connected ? (
+
+
+
+
+
+ );
+}
diff --git a/src/js/components/wallet/summary/Summary.1.js b/src/js/components/wallet/summary/Summary.1.js
new file mode 100644
index 00000000..463c41c1
--- /dev/null
+++ b/src/js/components/wallet/summary/Summary.1.js
@@ -0,0 +1,248 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import BigNumber from 'bignumber.js';
+import ColorHash from 'color-hash';
+import ScaleText from 'react-scale-text';
+import Blockies from 'react-blockies';
+import { Async } from 'react-select';
+import { resolveAfter } from '../../../utils/promiseUtils';
+import AbstractAccount from '../account/AbstractAccount';
+import { Notification } from '../Notification';
+
+
+export default class Summary extends AbstractAccount {
+
+ componentDidMount() {
+ super.componentDidMount();
+ //this.props.summaryActions.init();
+ }
+
+ componentWillUpdate(newProps: any) {
+ super.componentWillUpdate(newProps);
+ //if (newProps.location.pathname !== this.props.location.pathname || (!newProps.summary.loaded && !this.props.summary.loaded)) {
+ //if (newProps.router.pathname !== this.props.router.pathname || (!newProps.summary.loaded && !this.props.summary.loaded)) {
+ // this.props.summaryActions.init();
+ //}
+ }
+
+ componentWillUnmount() {
+ super.componentWillUnmount();
+ //this.props.summaryActions.dispose();
+ }
+
+ render() {
+ return _render(this.props);
+ }
+}
+
+const _render = (props: any): any => {
+
+ const currentAccount = props.account;
+ const fiatRate = props.fiatRate || '1030';
+
+ const {
+ loaded,
+ address,
+ summary,
+ addForm,
+ search,
+ customAddress,
+ customName,
+ customShortcut,
+ customDecimal,
+
+ selectedToken
+ } = props.summary;
+
+ if (currentAccount.deviceStateError) {
+ return (
+
+
+ );
+ }
+
+
+ // if (!loaded) return null;
+
+ const {
+ onSummaryToggle,
+ onTokenSearch,
+ onCustomTokenToggle,
+ onCustomTokenAddressChange,
+ onCustomTokenNameChange,
+ onCustomTokenShortcutChange,
+ onCustomTokenDecimalChange,
+ onCustomTokenAdd
+ } = props.summaryActions;
+
+ const tokens = props.tokens.filter(t => t.ethAddress === address);
+
+
+ let summaryClassName: string = "summary closed";
+ let summaryContent = null;
+ if (summary) {
+ summaryClassName = "summary";
+ if (currentAccount && currentAccount.balance) {
+
+ const balance = new BigNumber(currentAccount.balance);
+ const fiat = balance.times(fiatRate).toFixed(2);
+
+ summaryContent = (
+
+
+
+ );
+}
+
+const onChange = () => {
+}
+
+const gotoUser = () => {
+}
\ No newline at end of file
diff --git a/src/js/components/wallet/summary/Summary.js b/src/js/components/wallet/summary/Summary.js
new file mode 100644
index 00000000..5c583fc7
--- /dev/null
+++ b/src/js/components/wallet/summary/Summary.js
@@ -0,0 +1,74 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import BigNumber from 'bignumber.js';
+import { Async } from 'react-select';
+import { resolveAfter } from '../../../utils/promiseUtils';
+import AbstractAccount from '../account/AbstractAccount';
+import { Notification } from '../../common/Notification';
+import SummaryDetails from './SummaryDetails.js';
+import SummaryTokens from './SummaryTokens.js';
+
+
+export default class Summary extends AbstractAccount {
+ render() {
+ return super.render(this.props.summary) || _render(this.props);
+ }
+}
+
+const _render = (props: any): any => {
+
+ const device = props.devices.find(d => d.checksum === props.summary.checksum);
+ const discovery = props.discovery.find(d => d.checksum === device.checksum && d.coin === props.summary.coin);
+ const account = props.accounts.find(a => a.checksum === props.summary.checksum && a.index === props.summary.accountIndex && a.coin === props.summary.coin);
+ const tokens = props.tokens.filter(t => t.ethAddress === account.address);
+
+ return (
+
+
+ { !device.connected ? (
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/js/components/wallet/summary/SummaryContainer.js b/src/js/components/wallet/summary/SummaryContainer.js
new file mode 100644
index 00000000..18d6717f
--- /dev/null
+++ b/src/js/components/wallet/summary/SummaryContainer.js
@@ -0,0 +1,32 @@
+/* @flow */
+'use strict';
+
+import React, { Component, PropTypes } from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+
+import Summary from './Summary';
+import * as SummaryActions from '../../../actions/SummaryActions';
+
+function mapStateToProps(state, own) {
+ return {
+ location: state.router.location,
+ devices: state.connect.devices,
+ accounts: state.accounts,
+ discovery: state.discovery,
+ tokens: state.tokens,
+ summary: state.summary,
+ fiatRate: state.web3.fiatRate
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ return {
+ summaryActions: bindActionCreators(SummaryActions, dispatch),
+ initAccount: bindActionCreators(SummaryActions.init, dispatch),
+ updateAccount: bindActionCreators(SummaryActions.update, dispatch),
+ disposeAccount: bindActionCreators(SummaryActions.dispose, dispatch),
+ };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(Summary)
\ No newline at end of file
diff --git a/src/js/components/wallet/summary/SummaryDetails.js b/src/js/components/wallet/summary/SummaryDetails.js
new file mode 100644
index 00000000..f685f838
--- /dev/null
+++ b/src/js/components/wallet/summary/SummaryDetails.js
@@ -0,0 +1,37 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+
+const SummaryDetails = (props: any): any => {
+
+ if (!props.summary.details) {
+ return (
+
+
+ {/*
+ );
+}
+
+function mapStateToProps(state, own) {
+ return {
+
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ return {
+
+ };
+}
+
+export default withRouter(
+ connect(mapStateToProps, mapDispatchToProps)(Article)
+);
\ No newline at end of file
diff --git a/src/js/containers/DashboardContainer.js b/src/js/containers/DashboardContainer.js
new file mode 100644
index 00000000..b3cd6406
--- /dev/null
+++ b/src/js/containers/DashboardContainer.js
@@ -0,0 +1,21 @@
+/* @flow */
+'use strict';
+
+import React, { Component, PropTypes } from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+
+import Dashboard from '../components/wallet/Dashboard';
+
+function mapStateToProps(state, own) {
+ return {
+
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ return {
+ };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(Dashboard);
\ No newline at end of file
diff --git a/src/js/containers/HistoryContainer.js b/src/js/containers/HistoryContainer.js
index a597b0fa..7723fea9 100644
--- a/src/js/containers/HistoryContainer.js
+++ b/src/js/containers/HistoryContainer.js
@@ -5,13 +5,12 @@ import React, { Component, PropTypes } from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
-import History from '../components/History';
+import History from '../components/wallet/History';
import * as SendFormActions from '../actions/SendFormActions';
function mapStateToProps(state, own) {
return {
web3: state.web3.web3,
- addresses: state.addresses,
};
}
diff --git a/src/js/containers/LandingPageContainer.js b/src/js/containers/LandingPageContainer.js
new file mode 100644
index 00000000..e48f66de
--- /dev/null
+++ b/src/js/containers/LandingPageContainer.js
@@ -0,0 +1,25 @@
+/* @flow */
+'use strict';
+
+import React, { Component, PropTypes } from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+
+import LandingPage from '../components/landing/LandingPage';
+
+function mapStateToProps(state, own) {
+ return {
+ localStorage: state.localStorage,
+ modal: state.modal,
+ web3: state.web3,
+ connect: state.connect,
+ router: state.router
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ return {
+ };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(LandingPage);
\ No newline at end of file
diff --git a/src/js/containers/ReceiveContainer.js b/src/js/containers/ReceiveContainer.js
index 1f22d51d..ec729912 100644
--- a/src/js/containers/ReceiveContainer.js
+++ b/src/js/containers/ReceiveContainer.js
@@ -5,18 +5,26 @@ import React, { Component, PropTypes } from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
-import Receive from '../components/Receive';
-import * as SendFormActions from '../actions/SendFormActions';
+import Receive from '../components/wallet/Receive';
+import * as ReceiveActions from '../actions/ReceiveActions';
+import { getAddress } from '../actions/TrezorConnectActions';
function mapStateToProps(state, own) {
return {
- addresses: state.addresses
+ location: state.router.location,
+ devices: state.connect.devices,
+ accounts: state.accounts,
+ discovery: state.discovery,
+ receive: state.receive
};
}
function mapDispatchToProps(dispatch) {
return {
- sendFormActions: bindActionCreators(SendFormActions, dispatch),
+ initAccount: bindActionCreators(ReceiveActions.init, dispatch),
+ updateAccount: bindActionCreators(ReceiveActions.update, dispatch),
+ disposeAccount: bindActionCreators(ReceiveActions.dispose, dispatch),
+ showAddress: bindActionCreators(ReceiveActions.showAddress, dispatch),
};
}
diff --git a/src/js/containers/SendFormContainer.js b/src/js/containers/SendFormContainer.js
index 5708e9db..6c63c3e3 100644
--- a/src/js/containers/SendFormContainer.js
+++ b/src/js/containers/SendFormContainer.js
@@ -5,19 +5,27 @@ import React, { Component, PropTypes } from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
-import SendForm from '../components/SendForm';
+import SendForm from '../components/wallet/send/SendForm';
import * as SendFormActions from '../actions/SendFormActions';
function mapStateToProps(state, own) {
return {
- addresses: state.addresses,
- sendForm: state.sendForm
+ location: state.router.location,
+ devices: state.connect.devices,
+ accounts: state.accounts,
+ discovery: state.discovery,
+ tokens: state.tokens,
+ sendForm: state.sendForm,
+ fiatRate: state.web3.fiatRate
};
}
function mapDispatchToProps(dispatch) {
return {
sendFormActions: bindActionCreators(SendFormActions, dispatch),
+ initAccount: bindActionCreators(SendFormActions.init, dispatch),
+ updateAccount: bindActionCreators(SendFormActions.update, dispatch),
+ disposeAccount: bindActionCreators(SendFormActions.dispose, dispatch),
};
}
diff --git a/src/js/containers/SettingsContainer.js b/src/js/containers/SettingsContainer.js
new file mode 100644
index 00000000..c63cc894
--- /dev/null
+++ b/src/js/containers/SettingsContainer.js
@@ -0,0 +1,20 @@
+/* @flow */
+'use strict';
+
+import React, { Component, PropTypes } from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+
+import Settings from '../components/wallet/Settings';
+
+function mapStateToProps(state, own) {
+ return {
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ return {
+ };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(Settings);
\ No newline at end of file
diff --git a/src/js/containers/SignVerifyContainer.js b/src/js/containers/SignVerifyContainer.js
new file mode 100644
index 00000000..8a811e7e
--- /dev/null
+++ b/src/js/containers/SignVerifyContainer.js
@@ -0,0 +1,20 @@
+/* @flow */
+'use strict';
+
+import React, { Component, PropTypes } from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+
+import SignVerify from '../components/wallet/SignVerify';
+
+function mapStateToProps(state, own) {
+ return {
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ return {
+ };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(SignVerify);
\ No newline at end of file
diff --git a/src/js/containers/TopNavigationContainer.js b/src/js/containers/TopNavigationContainer.js
new file mode 100644
index 00000000..95dd0eb4
--- /dev/null
+++ b/src/js/containers/TopNavigationContainer.js
@@ -0,0 +1,31 @@
+/* @flow */
+'use strict';
+
+import React, { Component, PropTypes } from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import { withRouter } from 'react-router-dom';
+
+import TopNavigation from '../components/TopNavigation';
+import * as TrezorConnectActions from '../actions/TrezorConnectActions';
+import { resizeAppContainer, toggleDeviceDropdown } from '../actions/AppActions';
+
+function mapStateToProps(state, own) {
+ return {
+ connect: state.connect
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ return {
+ toggleDeviceDropdown: bindActionCreators(toggleDeviceDropdown, dispatch),
+ resizeAppContainer: bindActionCreators(resizeAppContainer, dispatch),
+ acquireDevice: bindActionCreators(TrezorConnectActions.acquire, dispatch),
+ onSelectDevice: bindActionCreators(TrezorConnectActions.onSelectDevice, dispatch),
+ };
+}
+
+// export default connect(mapStateToProps, mapDispatchToProps)(TopNavigation);
+export default withRouter(
+ connect(mapStateToProps, mapDispatchToProps)(TopNavigation)
+);
\ No newline at end of file
diff --git a/src/js/containers/WalletContainer.js b/src/js/containers/WalletContainer.js
new file mode 100644
index 00000000..d05ef8fe
--- /dev/null
+++ b/src/js/containers/WalletContainer.js
@@ -0,0 +1,40 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import { withRouter } from 'react-router-dom';
+
+import Header from '../components/common/Header';
+import AsideContainer from './AsideContainer';
+import ContentContainer from './ContentContainer';
+import ModalContainer from '../components/modal/ModalContainer';
+
+const Wallet = (props: any): any => {
+ return (
+
-
- { router }
-
- ,
+ router,
document.getElementById('root')
);
+// handle resize event and pass it to DOM reducer
window.addEventListener('resize', () => {
- store.dispatch(onResize());
+ store.dispatch( onResize() );
});
+window.onbeforeunload = () => {
+ store.dispatch( onBeforeUnload() );
+}
+
// workaround
// yarn add web3@^0.19.0
\ No newline at end of file
diff --git a/src/js/reducers/AccountDetailReducer.js b/src/js/reducers/AccountDetailReducer.js
new file mode 100644
index 00000000..5996c4f3
--- /dev/null
+++ b/src/js/reducers/AccountDetailReducer.js
@@ -0,0 +1,42 @@
+/* @flow */
+'use strict';
+
+import * as ACCOUNT from '../actions/constants/account';
+import * as CONNECT from '../actions/constants/TrezorConnect';
+
+export type State = {
+ +index: number;
+ +checksum: ?string;
+ +coin: string;
+ location: string;
+}
+
+export const initialState: State = {
+ index: 0,
+ checksum: null,
+ coin: '',
+};
+
+
+export default (state: State = initialState, action: any): State => {
+
+ switch (action.type) {
+
+ case ACCOUNT.INIT :
+ return action.state;
+
+ case CONNECT.DEVICE_STATE_EXCEPTION :
+ return {
+ ...state,
+ deviceStateError: true
+ }
+
+ case ACCOUNT.DISPOSE :
+ return initialState;
+
+
+ default:
+ return state;
+ }
+
+}
\ No newline at end of file
diff --git a/src/js/reducers/AccountsReducer.js b/src/js/reducers/AccountsReducer.js
new file mode 100644
index 00000000..f355e482
--- /dev/null
+++ b/src/js/reducers/AccountsReducer.js
@@ -0,0 +1,96 @@
+/* @flow */
+'use strict';
+
+import * as CONNECT from '../actions/constants/TrezorConnect';
+import * as ADDRESS from '../actions/constants/Address';
+
+export type Account = {
+ loaded: boolean;
+ +checksum: string;
+ +coin: string;
+ +index: number;
+ +addressPath: Array;
+ +address: string;
+ balance: string;
+ nonce: number;
+}
+
+const initialState: Array = [];
+
+const createAccount = (state: Array, action: any): Array => {
+
+ // TODO check witch checksum
+ // check if account was created before
+ const exist: ?Account = state.find(addr => addr.address === action.address);
+ if (exist) {
+ return state;
+ }
+
+ const address: Account = {
+ loaded: false,
+ checksum: action.device.checksum,
+ coin: action.coin,
+ index: action.index,
+ addressPath: action.path,
+ address: action.address,
+ balance: '0',
+ nonce: 0,
+ }
+
+ const newState: Array = [ ...state ];
+ newState.push(address);
+ return newState;
+}
+
+const removeAccounts = (state: Array, action: any): Array => {
+ // TODO: all instances od device (multiple checksums)
+ return state.filter(addr => addr.checksum !== action.device.checksum);
+}
+
+const forgetAccounts = (state: Array, action: any): Array => {
+ return state.filter(addr => action.accounts.indexOf(addr) === -1);
+}
+
+const setBalance = (state: Array, action: any): Array => {
+ const index: number = state.findIndex(addr => addr.address === action.address);
+ const newState: Array = [ ...state ];
+ newState[index].loaded = true;
+ newState[index].balance = action.balance;
+ return newState;
+}
+
+const setNonce = (state: Array, action: any): Array => {
+ const index: number = state.findIndex(addr => addr.address === action.address);
+ const newState: Array = [ ...state ];
+ newState[index].loaded = true;
+ newState[index].nonce = action.nonce;
+ return newState;
+}
+
+export default (state: Array = initialState, action: any): Array => {
+
+ switch (action.type) {
+
+ case ADDRESS.CREATE :
+ return createAccount(state, action);
+
+ case CONNECT.FORGET :
+ case CONNECT.FORGET_SINGLE :
+ return removeAccounts(state, action);
+
+ //case CONNECT.FORGET_SINGLE :
+ // return forgetAccounts(state, action);
+
+ case ADDRESS.SET_BALANCE :
+ return setBalance(state, action);
+ case ADDRESS.SET_NONCE :
+ return setNonce(state, action);
+
+ case ADDRESS.FROM_STORAGE :
+ return action.payload;
+
+ default:
+ return state;
+ }
+
+}
\ No newline at end of file
diff --git a/src/js/reducers/AddressesReducer.js b/src/js/reducers/AddressesReducer.js
deleted file mode 100644
index ff6dfea1..00000000
--- a/src/js/reducers/AddressesReducer.js
+++ /dev/null
@@ -1,127 +0,0 @@
-/* @flow */
-'use strict';
-
-import HDKey from 'hdkey';
-import EthereumjsUtil from 'ethereumjs-util';
-
-import * as ACTIONS from '../actions';
-import BigNumber from 'bignumber.js';
-import { access, stat } from 'fs';
-
-type AddressType = {
- devicePath: string;
- index: number;
- path: Array;
- address: string;
-}
-
-type State = {
- addresses: Array;
- pendingTxs: Array;
-}
-
-const initialState: State = {
- addresses: [],
- pendingTxs: [],
-};
-
-export class Address {
-
- devicePath: string;
- index: number;
- path: Array;
- address: string;
- balance: string;
- pendingTx: Array;
- history: JSON;
-
- constructor(devicePath: string, index: number, path: Array, address: string) {
- this.devicePath = devicePath;
- this.index = index;
- this.path = path;
- this.address = address;
- this.pendingTx = [];
- }
-
- setBalance(balance: string): void {
- this.balance = balance;
- }
-
- setHistory(json): void {
- this.history = json;
- }
-
- addPendingTx(txid, txData): void {
- this.pendingTx.push({
- txid,
- txData
- });
- }
-
- findPendingTx(txid): boolean {
- let index = this.pendingTx.findIndex(tx => tx.txid === txid);
- return index >= 0;
- }
-
- removePendingTx(txid): void {
- let index = this.pendingTx.findIndex(tx => tx.txid === txid);
- if (index >= 0) {
- this.pendingTx.splice(index, 1);
- console.error("-----> RMEOVE PENDiNG TX", this.pendingTx)
- }
- }
-}
-
-export default (state: State = initialState, action: any): State => {
-
- switch (action.type) {
-
- case ACTIONS.ON_TX_COMPLETE :
- action.address.addPendingTx(action.txid, action.txData);
- state.pendingTxs.push(action.txid);
- return {
- ...state,
- }
-
- case ACTIONS.TX_STATUS_OK :
- for (let addr of state.addresses) {
- addr.removePendingTx(action.txid);
- }
- let pendingIndex = state.pendingTxs.indexOf(action.txid);
- if (pendingIndex >= 0) {
- state.pendingTxs.splice(pendingIndex, 1);
- }
- return {
- ...state,
- }
-
- break;
-
- case ACTIONS.ADDRESS_CREATE :
- return {
- ...state,
- addresses: state.addresses.concat([ action.address ])
- }
-
- case ACTIONS.ADDRESS_SET_BALANCE :
- action.address.setBalance( action.balance );
- return {
- ...state,
- }
-
- case ACTIONS.ADDRESS_SET_HISTORY :
- action.address.setHistory( action.history );
- return {
- ...state,
- }
-
- case ACTIONS.ADDRESS_DELETE :
- return {
- ...state,
- addresses: action.addresses
- }
- default:
- return state;
- }
-
-}
\ No newline at end of file
diff --git a/src/js/reducers/AppReducer.js b/src/js/reducers/AppReducer.js
new file mode 100644
index 00000000..a033b40a
--- /dev/null
+++ b/src/js/reducers/AppReducer.js
@@ -0,0 +1,49 @@
+/* @flow */
+'use strict';
+
+import { ON_RESIZE, TOGGLE_DEVICE_DROPDOWN, RESIZE_CONTAINER } from '../actions/AppActions';
+import * as WEB3 from '../actions/constants/Web3';
+
+const WIDTH: number = 1080;
+const HEIGHT: number = 1920;
+
+const initialState: Object = {
+ orginalWidth: WIDTH,
+ orginalHeight: HEIGHT,
+ width: window.innerWidth,
+ height: window.innerHeight,
+ scale: Math.min(window.innerWidth / WIDTH, window.innerHeight / HEIGHT),
+ coinDropdownOpened: false,
+ deviceDropdownOpened: false,
+ initialized: false,
+ landingPage: true,
+};
+
+export default function DOM(state: Object = initialState, action: Object): any {
+ switch(action.type) {
+ case ON_RESIZE :
+ return {
+ ...state,
+ scale: Math.min(window.innerWidth / WIDTH, window.innerHeight / HEIGHT),
+ }
+ case RESIZE_CONTAINER :
+ return {
+ ...state,
+ coinDropdownOpened: action.opened
+ }
+ case TOGGLE_DEVICE_DROPDOWN :
+ return {
+ ...state,
+ deviceDropdownOpened: action.opened
+ }
+
+ case WEB3.READY :
+ return {
+ ...state,
+ initialized: true
+ }
+
+ default:
+ return state;
+ }
+}
diff --git a/src/js/reducers/DOMReducer.js b/src/js/reducers/DOMReducer.js
deleted file mode 100644
index 4c317991..00000000
--- a/src/js/reducers/DOMReducer.js
+++ /dev/null
@@ -1,27 +0,0 @@
-/* @flow */
-'use strict';
-
-import { ON_RESIZE } from '../actions/DOMActions';
-
-const WIDTH: number = 1080;
-const HEIGHT: number = 1920;
-
-const initialState: Object = {
- orginalWidth: WIDTH,
- orginalHeight: HEIGHT,
- width: window.innerWidth,
- height: window.innerHeight,
- scale: Math.min(window.innerWidth / WIDTH, window.innerHeight / HEIGHT),
-};
-
-export default function DOM(state: Object = initialState, action: Object): void {
- switch(action.type) {
- case ON_RESIZE :
- return {
- ...state,
- scale: Math.min(window.innerWidth / WIDTH, window.innerHeight / HEIGHT),
- }
- default:
- return state;
- }
-}
diff --git a/src/js/reducers/DiscoveryReducer.js b/src/js/reducers/DiscoveryReducer.js
new file mode 100644
index 00000000..446830ed
--- /dev/null
+++ b/src/js/reducers/DiscoveryReducer.js
@@ -0,0 +1,138 @@
+/* @flow */
+'use strict';
+
+import * as DISCOVERY from '../actions/constants/Discovery';
+import * as ADDRESS from '../actions/constants/Address';
+import * as CONNECT from '../actions/constants/TrezorConnect';
+
+export type Discovery = {
+ coin: string;
+ checksum: string;
+ xpub: string;
+ accountIndex: number;
+ interrupted: boolean;
+ completed: boolean;
+ waitingForDevice: boolean;
+ waitingForAuth?: boolean;
+}
+
+const initialState: Array = [];
+
+const start = (state: Array, action: any): Array => {
+
+ const instance: Discovery = {
+ coin: action.coin,
+ xpub: action.xpub,
+ hdKey: action.hdKey,
+ basePath: action.basePath,
+ checksum: action.device.checksum,
+ accountIndex: 0,
+ interrupted: false,
+ completed: false,
+ waitingForDevice: false
+ }
+
+ const newState: Array = [ ...state ];
+ const index: number = state.findIndex(d => {
+ return d.coin === action.coin && d.checksum === action.device.checksum;
+ });
+
+ console.warn("START DISCO", index);
+
+ if (index >= 0) {
+ newState[index] = instance;
+ } else {
+ newState.push(instance);
+ }
+ return newState;
+}
+
+const complete = (state: Array, action: any): Array => {
+ const index: number = state.findIndex(d => {
+ return d.coin === action.coin && d.checksum === action.device.checksum;
+ });
+ const newState: Array = [ ...state ];
+ newState[index].completed = true;
+ return newState;
+}
+
+const addressCreate = (state: Array, action: any): Array => {
+ const index: number = state.findIndex(d => {
+ return d.coin === action.coin && d.checksum === action.device.checksum;
+ });
+ const newState: Array = [ ...state ];
+ newState[index].accountIndex++;
+ return newState;
+}
+
+const forgetDiscovery = (state: Array, action: any): Array => {
+ return state.filter(d => d.checksum !== action.device.checksum);
+}
+
+const stop = (state: Array, action: any): Array => {
+ const newState: Array = [ ...state ];
+ return newState.map( (d: Discovery) => {
+ if (d.checksum === action.device.checksum && !d.completed) {
+ d.interrupted = true;
+ d.waitingForDevice = false;
+ }
+ return d;
+ });
+}
+
+const waiting = (state: Array, action: any): Array => {
+
+ const instance: Discovery = {
+ coin: action.coin,
+ checksum: action.device.checksum,
+ xpub: '',
+ accountIndex: 0,
+ interrupted: false,
+ completed: false,
+ waitingForDevice: true
+ }
+
+ const index: number = state.findIndex(d => {
+ return d.coin === action.coin && d.checksum === action.device.checksum;
+ });
+
+ const newState: Array = [ ...state ];
+ if (index >= 0) {
+ newState[index] = instance;
+ } else {
+ newState.push(instance);
+ }
+
+ return newState;
+}
+
+export default function discovery(state: Array = initialState, action: any): any {
+
+ switch (action.type) {
+ case DISCOVERY.START :
+ return start(state, action);
+ case ADDRESS.CREATE :
+ return addressCreate(state, action);
+ case DISCOVERY.STOP :
+ return stop(state, action);
+ case DISCOVERY.COMPLETE :
+ return complete(state, action);
+ case DISCOVERY.WAITING :
+ return waiting(state, action)
+ case DISCOVERY.FROM_STORAGE :
+ return action.payload.map(d => {
+ return {
+ ...d,
+ interrupted: false,
+ waitingForDevice: false
+ }
+ })
+ case CONNECT.FORGET :
+ case CONNECT.FORGET_SINGLE :
+ return forgetDiscovery(state, action);
+
+ default:
+ return state;
+ }
+
+}
\ No newline at end of file
diff --git a/src/js/reducers/LocalStorageReducer.js b/src/js/reducers/LocalStorageReducer.js
new file mode 100644
index 00000000..4e1e2481
--- /dev/null
+++ b/src/js/reducers/LocalStorageReducer.js
@@ -0,0 +1,47 @@
+/* @flow */
+'use strict';
+
+import * as STORAGE from '../actions/constants/LocalStorage';
+
+type State = {
+ initialized: boolean;
+ error: any;
+ config: any;
+ ethERC20: any;
+ ethTokens: any;
+}
+
+const initialState: State = {
+ initialized: false,
+ error: null,
+ config: null,
+ ethERC20: null,
+ ethTokens: null,
+};
+
+export default function localStorage(state: State = initialState, action: any): any {
+
+ switch (action.type) {
+
+ case STORAGE.READY :
+ return {
+ ...state,
+ initialized: true,
+ config: action.appConfig,
+ ethERC20: action.ethERC20,
+ ethTokens: action.ethTokens,
+ error: null
+ }
+
+ case STORAGE.ERROR :
+ return {
+ ...state,
+ error: action.error
+ }
+
+
+ default:
+ return state;
+ }
+
+}
\ No newline at end of file
diff --git a/src/js/reducers/ModalReducer.js b/src/js/reducers/ModalReducer.js
index b84e572f..c4a35633 100644
--- a/src/js/reducers/ModalReducer.js
+++ b/src/js/reducers/ModalReducer.js
@@ -3,116 +3,105 @@
import { UI, DEVICE } from 'trezor-connect';
import * as ACTIONS from '../actions';
+import * as RECEIVE from '../actions/constants/receive';
+import * as MODAL from '../actions/constants/Modal';
+import * as CONNECT from '../actions/constants/TrezorConnect';
type ModalState = {
opened: boolean;
+ device: any;
windowType: ?string;
- pin: string;
- passphrase: string;
- passphraseFocused: boolean;
- passphraseVisible: boolean;
- passphraseCached: boolean;
- confirmation: ?string;
}
const initialState: ModalState = {
opened: false,
- windowType: null,
- pin: "",
- passphrase: "",
- passphraseFocused: false,
- passphraseVisible: false,
- passphraseCached: true,
- confirmation: null,
+ device: null,
+ windowType: null
};
export default function modal(state: ModalState = initialState, action: any): any {
switch (action.type) {
- case UI.REQUEST_PIN :
- case UI.INVALID_PIN :
- case UI.REQUEST_PASSPHRASE :
+ case RECEIVE.REQUEST_UNVERIFIED :
return {
...state,
opened: true,
windowType: action.type
- };
+ }
- case UI.REQUEST_CONFIRMATION :
+ case CONNECT.REMEMBER_REQUEST :
+ case CONNECT.FORGET_REQUEST :
+ case CONNECT.DISCONNECT_REQUEST :
return {
...state,
+ device: action.device,
opened: true,
- confirmation: action.data.label,
windowType: action.type
};
- case UI.REQUEST_PERMISSION :
+ case CONNECT.TRY_TO_DUPLICATE :
return {
...state,
+ device: action.device,
opened: true,
- confirmation: action.data.label,
windowType: action.type
};
- case ACTIONS.CLOSE_MODAL :
- return {
- ...initialState,
- passphraseCached: state.passphraseCached
- };
-
+ case DEVICE.CHANGED :
+ if (state.opened && state.device && action.device.path === state.device.path && action.device.isUsedElsewhere) {
+ return {
+ ...initialState,
+ };
+ }
+ return state;
- case ACTIONS.ON_PIN_ADD :
- let pin: string = state.pin;
- if (pin.length < 9) {
- pin += action.number;
+ case DEVICE.DISCONNECT :
+ if (state.device && action.device.path === state.device.path) {
+ return {
+ ...initialState,
+ }
}
- return {
- ...state,
- pin: pin,
- };
- case ACTIONS.ON_PIN_BACKSPACE :
- return {
- ...state,
- pin: state.pin.substring(0, state.pin.length - 1),
- };
+ return state;
+ // case DEVICE.CONNECT :
+ // case DEVICE.CONNECT_UNACQUIRED :
+ // if (state.opened && state.windowType === CONNECT.TRY_TO_FORGET) {
+ // return {
+ // ...initialState,
+ // passphraseCached: state.passphraseCached
+ // }
+ // }
+ // return state;
- case ACTIONS.ON_PASSPHRASE_CHANGE :
- return {
- ...state,
- passphrase: action.value
- }
- case ACTIONS.ON_PASSPHRASE_SHOW :
- return {
- ...state,
- passphraseVisible: true
- }
- case ACTIONS.ON_PASSPHRASE_HIDE :
- return {
- ...state,
- passphraseVisible: false
- }
- case ACTIONS.ON_PASSPHRASE_SAVE :
- return {
- ...state,
- passphraseCached: true
- }
- case ACTIONS.ON_PASSPHRASE_FORGET :
+ case UI.REQUEST_PIN :
+ case UI.INVALID_PIN :
+ case UI.REQUEST_PASSPHRASE :
return {
...state,
- passphraseCached: false
- }
- case ACTIONS.ON_PASSPHRASE_FOCUS :
+ device: action.data.device,
+ opened: true,
+ windowType: action.type
+ };
+
+ case UI.REQUEST_BUTTON :
return {
...state,
- passphraseFocused: true
+ opened: true,
+ windowType: action.data.code
}
- case ACTIONS.ON_PASSPHRASE_BLUR :
+
+ case UI.CLOSE_UI_WINDOW :
+ case ACTIONS.CLOSE_MODAL :
+
+ case CONNECT.FORGET :
+ case CONNECT.FORGET_SINGLE :
+ case CONNECT.REMEMBER :
return {
- ...state,
- passphraseFocused: false
- }
+ ...initialState,
+ };
+
+
default:
return state;
diff --git a/src/js/reducers/NotificationReducer.js b/src/js/reducers/NotificationReducer.js
new file mode 100644
index 00000000..b0edf133
--- /dev/null
+++ b/src/js/reducers/NotificationReducer.js
@@ -0,0 +1,68 @@
+/* @flow */
+'use strict';
+
+import { LOCATION_CHANGE } from 'react-router-redux';
+import * as NOTIFICATION from '../actions/constants/notification';
+
+type NotificationAction = {
+ label: string;
+ callback: any;
+}
+
+type NotificationEntry = {
+ +id: ?string;
+ +type: string;
+ +title: string;
+ +message: string;
+ +cancelable: boolean;
+ +actions: Array;
+}
+
+const initialState: Array = [
+ // {
+ // id: undefined,
+ // type: "info",
+ // title: "Some static notification",
+ // message: "This one is not cancelable",
+ // cancelable: false,
+ // actions: []
+ // }
+];
+
+const addNotification = (state: Array, payload: any): Array => {
+ const newState: Array = state.filter(e => !e.cancelable);
+ newState.push({
+ id: payload.id,
+ type: payload.type,
+ title: payload.title.toString(),
+ message: payload.message.toString(),
+ cancelable: payload.cancelable,
+ actions: payload.actions
+ });
+
+ // TODO: sort
+ return newState;
+}
+
+const closeNotification = (state: Array, payload: any): Array => {
+ if (payload && typeof payload.id === 'string') {
+ return state.filter(e => e.id !== payload.id);
+ } else {
+ return state.filter(e => !e.cancelable);
+ }
+}
+
+export default function notification(state: Array = initialState, action: Object): Array {
+ switch(action.type) {
+
+ case NOTIFICATION.ADD :
+ return addNotification(state, action.payload);
+
+ case LOCATION_CHANGE :
+ case NOTIFICATION.CLOSE :
+ return closeNotification(state, action.payload);
+
+ default:
+ return state;
+ }
+}
diff --git a/src/js/reducers/ReceiveReducer.js b/src/js/reducers/ReceiveReducer.js
new file mode 100644
index 00000000..40819ed5
--- /dev/null
+++ b/src/js/reducers/ReceiveReducer.js
@@ -0,0 +1,51 @@
+/* @flow */
+'use strict';
+
+import * as RECEIVE from '../actions/constants/receive';
+
+export type State = {
+ +checksum: ?string;
+ +accountIndex: ?number;
+ +coin: ?string;
+ location: string;
+ addressVerified: boolean;
+ adressUnverified: boolean;
+}
+
+export const initialState: State = {
+ checksum: null,
+ accountIndex: null,
+ coin: null,
+ location: '',
+ addressVerified: false,
+ addressUnverified: false,
+};
+
+export default (state: State = initialState, action: any): State => {
+
+ switch (action.type) {
+
+ case RECEIVE.INIT :
+ return action.state;
+
+ case RECEIVE.DISPOSE :
+ return initialState;
+
+ case RECEIVE.SHOW_ADDRESS :
+ return {
+ ...state,
+ addressVerified: true,
+ addressUnverified: false
+ }
+ case RECEIVE.SHOW_UNVERIFIED_ADDRESS :
+ return {
+ ...state,
+ addressVerified: false,
+ addressUnverified: true
+ }
+
+ default:
+ return state;
+ }
+
+}
\ No newline at end of file
diff --git a/src/js/reducers/SendFormReducer.1.js b/src/js/reducers/SendFormReducer.1.js
new file mode 100644
index 00000000..693d27c3
--- /dev/null
+++ b/src/js/reducers/SendFormReducer.1.js
@@ -0,0 +1,199 @@
+/* @flow */
+'use strict';
+
+import { LOCATION_CHANGE } from 'react-router-redux';
+import * as SEND from '../actions/constants/SendForm';
+import * as WEB3 from '../actions/constants/Web3';
+import * as ADDRESS from '../actions/constants/Address';
+import EthereumjsUnits from 'ethereumjs-units';
+import BigNumber from 'bignumber.js';
+import { getFeeLevels } from '../actions/SendFormActions';
+
+export type State = {
+ +senderAddress: ?string;
+ +coin: string;
+ token: string;
+ balance: string;
+ tokenBalance: string;
+ balanceNeedUpdate: boolean;
+
+
+ // form fields
+ advanced: boolean;
+ untouched: boolean; // set to true when user made some changes in form
+ touched: {[k: string]: boolean};
+ address: string;
+ amount: string;
+ setMax: boolean;
+ feeLevels: Array;
+ selectedFeeLevel: ?FeeLevel;
+ recommendedGasPrice: string;
+ gasPriceNeedsUpdate: boolean;
+ gasLimit: string;
+ gasPrice: string;
+ data: string;
+ nonce: string;
+ total: string;
+ sending: boolean;
+ sendingStatus: ?SendStatus;
+ errors: {[k: string]: string};
+ warnings: {[k: string]: string};
+ infos: {[k: string]: string};
+}
+
+export type FeeLevel = {
+ label: string;
+ gasPrice: string;
+ value: string;
+}
+
+type SendStatus = {
+ success: boolean;
+ message: string;
+}
+
+export const initialState: State = {
+ senderAddress: null,
+ coin: '',
+ token: '',
+ advanced: false,
+ untouched: true,
+ touched: {},
+ balance: '0',
+ tokenBalance: '0',
+ balanceNeedUpdate: false,
+ //address: '',
+ address: '0x574BbB36871bA6b78E27f4B4dCFb76eA0091880B',
+ amount: '',
+ setMax: false,
+ feeLevels: [],
+ selectedFeeLevel: null,
+ recommendedGasPrice: '0',
+ gasPriceNeedsUpdate: false,
+ gasLimit: '0',
+ gasPrice: '0',
+ data: '',
+ nonce: '0',
+ total: '0',
+ sending: false,
+ sendingStatus: null,
+ errors: {},
+ warnings: {},
+ infos: {},
+}
+
+
+const onGasPriceUpdated = (state: State, action: any): State => {
+
+ function getRandomInt(min, max) {
+ return Math.floor(Math.random() * (max - min + 1)) + min;
+ }
+ const newPrice = getRandomInt(10, 50).toString();
+ //const newPrice = EthereumjsUnits.convert(action.gasPrice, 'wei', 'gwei');
+ if (action.coin === state.coin && newPrice !== state.recommendedGasPrice) {
+ const newState: State = { ...state };
+ if (!state.untouched) {
+ newState.gasPriceNeedsUpdate = true;
+ newState.recommendedGasPrice = newPrice;
+ } else {
+ const newFeeLevels = getFeeLevels(state.coin, newPrice, state.gasLimit);
+ const selectedFeeLevel = newFeeLevels.find(f => f.value === 'Normal');
+ newState.recommendedGasPrice = newPrice;
+ newState.feeLevels = newFeeLevels;
+ newState.selectedFeeLevel = selectedFeeLevel;
+ newState.gasPrice = selectedFeeLevel.gasPrice;
+ }
+ return newState;
+ }
+ return state;
+}
+
+const onBalanceUpdated = (state: State, action: any): State => {
+ // balanceNeedUpdate
+ if (state.senderAddress === action.address) {
+ return {
+ ...state,
+ balance: '1'
+ }
+ }
+ return state;
+}
+
+
+export default (state: State = initialState, action: any): State => {
+
+ switch (action.type) {
+
+ case SEND.INIT :
+ return action.state;
+
+ case SEND.DISPOSE :
+ return initialState;
+
+ // this will be called right after Web3 instance initialization before any view is shown
+ // and async during app live time
+ case WEB3.GAS_PRICE_UPDATED :
+ return onGasPriceUpdated(state, action);
+
+ case ADDRESS.SET_BALANCE :
+ return onBalanceUpdated(state, action);
+
+ case SEND.TOGGLE_ADVANCED :
+ return {
+ ...state,
+ advanced: !state.advanced
+ }
+
+
+ // user actions
+ case SEND.ADDRESS_CHANGE :
+ case SEND.AMOUNT_CHANGE :
+ case SEND.SET_MAX :
+ case SEND.CURRENCY_CHANGE :
+ case SEND.FEE_LEVEL_CHANGE :
+ case SEND.UPDATE_FEE_LEVELS :
+ case SEND.GAS_PRICE_CHANGE :
+ case SEND.GAS_LIMIT_CHANGE :
+ case SEND.DATA_CHANGE :
+ return action.state;
+
+ case SEND.SEND :
+ return {
+ ...state,
+ sending: true,
+ sendingStatus: null,
+ }
+
+ case SEND.TX_COMPLETE :
+ return {
+ ...state,
+ sending: false,
+ sendingStatus: {
+ success: true,
+ message: action.txid
+ }
+ }
+ case SEND.TX_ERROR :
+ return {
+ ...state,
+ sending: false,
+ sendingStatus: {
+ success: false,
+ message: action.response
+ }
+ }
+
+
+ case SEND.VALIDATION :
+ return {
+ ...state,
+ errors: action.errors,
+ warnings: action.warnings,
+ infos: action.infos,
+ }
+
+ default:
+ return state;
+ }
+
+}
\ No newline at end of file
diff --git a/src/js/reducers/SendFormReducer.js b/src/js/reducers/SendFormReducer.js
index 2ef1799b..f65dc313 100644
--- a/src/js/reducers/SendFormReducer.js
+++ b/src/js/reducers/SendFormReducer.js
@@ -1,71 +1,200 @@
/* @flow */
'use strict';
-import * as ACTIONS from '../actions/index';
+import { LOCATION_CHANGE } from 'react-router-redux';
+import * as SEND from '../actions/constants/SendForm';
+import * as WEB3 from '../actions/constants/Web3';
+import * as ADDRESS from '../actions/constants/Address';
+import EthereumjsUnits from 'ethereumjs-units';
+import BigNumber from 'bignumber.js';
+import { getFeeLevels } from '../actions/SendFormActions';
-type State = {
+export type State = {
+ +checksum: ?string;
+ +accountIndex: number;
+ +coin: string;
+ token: string;
+ location: string;
+
+ balanceNeedUpdate: boolean;
+
+
+ // form fields
+ advanced: boolean;
+ untouched: boolean; // set to true when user made any changes in form
+ touched: {[k: string]: boolean};
address: string;
- amount: number;
- gasPrice: number;
- gasLimit: number;
+ amount: string;
+ setMax: boolean;
+ feeLevels: Array;
+ selectedFeeLevel: ?FeeLevel;
+ recommendedGasPrice: string;
+ gasPriceNeedsUpdate: boolean;
+ gasLimit: string;
+ gasPrice: string;
data: string;
+ nonce: string;
+ total: string;
+ sending: boolean;
+ sendingStatus: ?SendStatus;
+ errors: {[k: string]: string};
+ warnings: {[k: string]: string};
+ infos: {[k: string]: string};
+}
+
+export type FeeLevel = {
+ label: string;
+ gasPrice: string;
+ value: string;
+}
+
+type SendStatus = {
+ success: boolean;
+ message: string;
+}
+
+export const initialState: State = {
+ checksum: null,
+ accountIndex: 0,
+ coin: '',
+ token: '',
+ location: '',
+
+ advanced: false,
+ untouched: true,
+ touched: {},
+ balanceNeedUpdate: false,
+ //address: '',
+ address: '0x574BbB36871bA6b78E27f4B4dCFb76eA0091880B',
+ amount: '',
+ setMax: false,
+ feeLevels: [],
+ selectedFeeLevel: null,
+ recommendedGasPrice: '0',
+ gasPriceNeedsUpdate: false,
+ gasLimit: '0',
+ gasPrice: '0',
+ data: '',
+ nonce: '0',
+ total: '0',
+ sending: false,
+ sendingStatus: null,
+ errors: {},
+ warnings: {},
+ infos: {},
+}
+
+
+const onGasPriceUpdated = (state: State, action: any): State => {
+
+ function getRandomInt(min, max) {
+ return Math.floor(Math.random() * (max - min + 1)) + min;
+ }
+ const newPrice = getRandomInt(10, 50).toString();
+ //const newPrice = EthereumjsUnits.convert(action.gasPrice, 'wei', 'gwei');
+ if (action.coin === state.coin && newPrice !== state.recommendedGasPrice) {
+ const newState: State = { ...state };
+ if (!state.untouched) {
+ newState.gasPriceNeedsUpdate = true;
+ newState.recommendedGasPrice = newPrice;
+ } else {
+ const newFeeLevels = getFeeLevels(state.coin, newPrice, state.gasLimit);
+ const selectedFeeLevel = newFeeLevels.find(f => f.value === 'Normal');
+ newState.recommendedGasPrice = newPrice;
+ newState.feeLevels = newFeeLevels;
+ newState.selectedFeeLevel = selectedFeeLevel;
+ newState.gasPrice = selectedFeeLevel.gasPrice;
+ }
+ return newState;
+ }
+ return state;
+}
+
+const onBalanceUpdated = (state: State, action: any): State => {
+ // balanceNeedUpdate
+ // if (state.senderAddress === action.address) {
+ // return {
+ // ...state,
+ // balance: '1'
+ // }
+ // }
+
+ // TODO: handle balance update during send form lifecycle
+ return state;
}
-const initialState: State = {
- //address: '0x7314e0f1C0e28474bDb6be3E2c3E0453255188f8', //metamask acc1
- address: '0xa738ea40b69d87f4f9ac94c9a0763f96248df23b', // trezor acc3
- amount: 0.0001,
- gasPrice: 0,
- gasPriceChanged: false,
- gasLimit: 21000,
- data: ''
-};
export default (state: State = initialState, action: any): State => {
switch (action.type) {
- case 'update_gas' :
- if (!state.gasPriceChanged) {
- return {
- ...state,
- gasPrice: action.gasPrice
- }
- }
- return {
- ...state,
- }
-
-
- case ACTIONS.ON_ADDRESS_CHANGE :
+ case SEND.INIT :
+ return action.state;
+
+ case SEND.DISPOSE :
+ return initialState;
+
+ // this will be called right after Web3 instance initialization before any view is shown
+ // and async during app live time
+ case WEB3.GAS_PRICE_UPDATED :
+ return onGasPriceUpdated(state, action);
+
+ case ADDRESS.SET_BALANCE :
+ // case ADDRESS.SET_TOKEN_BALANCE :
+ return onBalanceUpdated(state, action);
+
+ case SEND.TOGGLE_ADVANCED :
return {
...state,
- address: action.address
+ advanced: !state.advanced
}
- case ACTIONS.ON_AMOUNT_CHANGE :
+
+ // user actions
+ case SEND.ADDRESS_CHANGE :
+ case SEND.AMOUNT_CHANGE :
+ case SEND.SET_MAX :
+ case SEND.CURRENCY_CHANGE :
+ case SEND.FEE_LEVEL_CHANGE :
+ case SEND.UPDATE_FEE_LEVELS :
+ case SEND.GAS_PRICE_CHANGE :
+ case SEND.GAS_LIMIT_CHANGE :
+ case SEND.DATA_CHANGE :
+ return action.state;
+
+ case SEND.SEND :
return {
...state,
- amount: action.amount
+ sending: true,
+ sendingStatus: null,
}
- case ACTIONS.ON_GAS_PRICE_CHANGE :
+ case SEND.TX_COMPLETE :
return {
...state,
- gasPriceChanged: true,
- gasPrice: action.gasPrice
+ sending: false,
+ sendingStatus: {
+ success: true,
+ message: action.txid
+ }
}
-
- case ACTIONS.ON_GAS_LIMIT_CHANGE :
+ case SEND.TX_ERROR :
return {
...state,
- gasLimit: action.gasLimit
+ sending: false,
+ sendingStatus: {
+ success: false,
+ message: action.response
+ }
}
- case ACTIONS.ON_TX_DATA_CHANGE :
+
+ case SEND.VALIDATION :
return {
...state,
- data: action.data
+ errors: action.errors,
+ warnings: action.warnings,
+ infos: action.infos,
}
default:
diff --git a/src/js/reducers/SummaryReducer.js b/src/js/reducers/SummaryReducer.js
new file mode 100644
index 00000000..41a59499
--- /dev/null
+++ b/src/js/reducers/SummaryReducer.js
@@ -0,0 +1,47 @@
+/* @flow */
+'use strict';
+
+import * as SUMMARY from '../actions/constants/summary';
+
+export type State = {
+ +checksum: ?string;
+ +accountIndex: ?number;
+ +coin: ?string;
+ location: string;
+
+ details: boolean;
+ selectedToken: any;
+}
+
+export const initialState: State = {
+ checksum: null,
+ accountIndex: null,
+ coin: null,
+ location: '',
+
+ details: true,
+ selectedToken: null
+};
+
+
+export default (state: State = initialState, action: any): State => {
+
+ switch (action.type) {
+
+ case SUMMARY.INIT :
+ return action.state;
+
+ case SUMMARY.DISPOSE :
+ return initialState;
+
+ case SUMMARY.DETAILS_TOGGLE :
+ return {
+ ...state,
+ details: !state.details
+ }
+
+ default:
+ return state;
+ }
+
+}
\ No newline at end of file
diff --git a/src/js/reducers/TokensReducer.js b/src/js/reducers/TokensReducer.js
new file mode 100644
index 00000000..68feb7f7
--- /dev/null
+++ b/src/js/reducers/TokensReducer.js
@@ -0,0 +1,71 @@
+/* @flow */
+'use strict';
+
+import * as CONNECT from '../actions/constants/TrezorConnect';
+import * as TOKEN from '../actions/constants/Token';
+
+export type Token = {
+ loaded: boolean;
+ +checksum: string;
+ +name: string;
+ +symbol: string;
+ +address: string;
+ +ethAddress: string; // foreign key
+ +decimals: string;
+ balance: string;
+}
+
+const initialState: Array = [];
+
+const setBalance = (state: Array, payload: any): Array => {
+ const newState: Array = [ ...state ];
+ let index: number = state.findIndex(t => t.address === payload.address && t.ethAddress === payload.ethAddress);
+ if (index >= 0) {
+ newState[index].loaded = true;
+ newState[index].balance = payload.balance;
+ }
+ return newState;
+}
+
+const create = (state: Array, payload: any): Array => {
+ const newState: Array = [ ...state ];
+ const token: Token = {
+ loaded: false,
+ checksum: payload.checksum,
+ name: payload.name,
+ symbol: payload.symbol,
+ address: payload.address,
+ ethAddress: payload.ethAddress,
+ decimals: payload.decimals,
+ balance: '0'
+ }
+ newState.push(token);
+ return newState;
+}
+
+const forget = (state: Array, action: any): Array => {
+ return state.filter(t => t.checksum !== action.device.checksum);
+}
+
+export default (state: Array = initialState, action: any): Array => {
+
+ switch (action.type) {
+
+ case TOKEN.ADD :
+ return create(state, action.payload);
+
+ case TOKEN.SET_BALANCE :
+ return setBalance(state, action.payload);
+
+ case CONNECT.FORGET :
+ case CONNECT.FORGET_SINGLE :
+ return forget(state, action);
+
+ case TOKEN.FROM_STORAGE :
+ return action.payload;
+
+ default:
+ return state;
+ }
+
+}
\ No newline at end of file
diff --git a/src/js/reducers/TrezorConnectReducer.js b/src/js/reducers/TrezorConnectReducer.js
index cd7a7837..cbae74f1 100644
--- a/src/js/reducers/TrezorConnectReducer.js
+++ b/src/js/reducers/TrezorConnectReducer.js
@@ -1,81 +1,361 @@
/* @flow */
'use strict';
-import { DEVICE } from 'trezor-connect';
+import { TRANSPORT, DEVICE } from 'trezor-connect';
+import * as CONNECT from '../actions/constants/TrezorConnect';
+
+export type TrezorDevice = {
+ initialized: boolean;
+ remember: boolean;
+ connected: boolean;
+ path: string;
+ +label: string;
+ +checksum: string;
+ +instance?: number;
+ instanceLabel: string;
+ features?: Object;
+ unacquired?: boolean;
+ acquiring: boolean;
+ isUsedElsewhere?: boolean;
+ featuresNeedsReload?: boolean;
+ ts: number;
+}
+
+export type SelectedDevice = {
+ id: string;
+ instance: ?number;
+}
type State = {
- devices: Array
Enter { device.label } PIN
+The PIN layout is displayed on your TREZOR.
+ +
+
+
-
-
-
-
+
+
+ )
+}
+
+export default AdvancedForm;
\ No newline at end of file
diff --git a/src/js/components/wallet/send/CoinSelectOption.js b/src/js/components/wallet/send/CoinSelectOption.js
new file mode 100644
index 00000000..d98b0652
--- /dev/null
+++ b/src/js/components/wallet/send/CoinSelectOption.js
@@ -0,0 +1,60 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+
+
+// export default (props: any): any => {
+// console.log("RENDER CUSTOM OPTION", props)
+// return (
+//
+
+
+
-
-
-
-
+
+
+ );
+}
+
+export default Acquire;
diff --git a/src/js/components/wallet/Bootloader.js b/src/js/components/wallet/Bootloader.js
new file mode 100644
index 00000000..c30a8fed
--- /dev/null
+++ b/src/js/components/wallet/Bootloader.js
@@ -0,0 +1,14 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+
+const Bootloader = (props: any): any => {
+ return (
+
+
+ );
+}
+
+export default Bootloader;
diff --git a/src/js/components/wallet/Dashboard.js b/src/js/components/wallet/Dashboard.js
new file mode 100644
index 00000000..6f0935f6
--- /dev/null
+++ b/src/js/components/wallet/Dashboard.js
@@ -0,0 +1,19 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+
+const Dashboard = (props: any): any => {
+ return (
+
+
+ );
+}
+
+export default Dashboard;
diff --git a/src/js/components/History.js b/src/js/components/wallet/History.js
similarity index 70%
rename from src/js/components/History.js
rename to src/js/components/wallet/History.js
index 650b57f0..45f7ebe4 100644
--- a/src/js/components/History.js
+++ b/src/js/components/wallet/History.js
@@ -2,7 +2,6 @@
'use strict';
import React, { Component } from 'react';
-import AddressTab from './AddressTab';
const formatTime = (ts) => {
var date = new Date(ts * 1000);
@@ -35,46 +34,33 @@ const History = (props): any => {
if (pending.length > 0) {
pendingTransactions = pending.map((tx, i) => {
- const etherscanLink = `https://ropsten.etherscan.io/tx/${ tx.txid }`;
+ const etherscanLink = `https://ropsten.etherscan.io/tx/${ tx.hash }`;
return (
)
});
}
- const history = JSON.parse(currentAddress.history).result;
- txs = history.map((tx, i) => {
-
+ txs = currentAddress.history.map((tx, i) => {
const etherscanLink = `https://ropsten.etherscan.io/tx/${ tx.hash }`;
- const txType = tx.from === currentAddress.address ? 'out' : 'in';
- const txAddress = txType === 'out' ? tx.to : tx.from;
return (
-
-
-
+
+
+
+
+
-
-
-
+
);
}
diff --git a/src/js/components/modal/RememberDevice.js b/src/js/components/modal/RememberDevice.js
new file mode 100644
index 00000000..c361282f
--- /dev/null
+++ b/src/js/components/modal/RememberDevice.js
@@ -0,0 +1,102 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import Loader from '../common/LoaderCircle';
+
+type Props = {
+ modal: any;
+}
+
+type State = {
+ +countdown: number;
+ ticker?: number;
+}
+
+export default class RememberDevice extends Component {
+
+ state: State;
+
+ constructor(props: any) {
+ super(props);
+
+ this.state = {
+ countdown: 10,
+ }
+ // this.setState({
+ // countdown: 10
+ // });
+ }
+
+ componentDidMount(): void {
+
+ const ticker = () => {
+ if (this.state.countdown - 1 <= 0) {
+ // TODO: possible race condition,
+ // device could be already connected but it didn't emit Device.CONNECT event yet
+ window.clearInterval(this.state.ticker);
+ const { device } = this.props.modal;
+ this.props.modalActions.onForgetDevice(device);
+ } else {
+ this.setState({
+ countdown: this.state.countdown - 1
+ });
+ }
+ }
+
+ this.setState({
+ countdown: 10,
+ ticker: window.setInterval(ticker, 1000)
+ });
+
+
+
+ //this.keyboardHandler = this.keyboardHandler.bind(this);
+ //window.addEventListener('keydown', this.keyboardHandler, false);
+ }
+
+ componentWillUnmount(): void {
+ //window.removeEventListener('keydown', this.keyboardHandler, false);
+ if (this.state.ticker) {
+ window.clearInterval(this.state.ticker);
+ }
+ }
+
+ render(): any {
+ const { device } = this.props.modal;
+ const { onForgetDevice, onRememberDevice } = this.props.modalActions;
+ return (
+
+
+
+
-
+
+
+ Not sure how PIN works? Learn more
+
+ );
+ }
+}
+
+export const ForgetDevice = (props: any): any => {
+ const { device } = props.modal;
+ const { onForgetSingleDevice, onCancel } = props.modalActions;
+ return (
+ Forget { device.label } ?
+Would you like TREZOR Wallet to forget your device or to remember it, so that it is still visible even while disconnected?
+ + +
+
+ );
+}
+
+export const DisconnectDevice = (props: any): any => {
+ const { device } = props.modal;
+ const { onForgetSingleDevice, onCancel } = props.modalActions;
+ return (
+ Forget { device.label } ?
+Forgetting only removes the device from the list on the left, your bitcoins are still safe and you can access them by reconnecting your TREZOR again.
+ + +
+
+ );
+}
\ No newline at end of file
diff --git a/src/js/components/wallet/Acquire.js b/src/js/components/wallet/Acquire.js
new file mode 100644
index 00000000..bf8ff741
--- /dev/null
+++ b/src/js/components/wallet/Acquire.js
@@ -0,0 +1,20 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+
+const Acquire = (props: any): any => {
+ return (
+ Unplug { device.label }
+TREZOR Wallet will forget your TREZOR right after you disconnect it.
+ TODO: its not true, actually i've already forget those data!!! +
+
+
+
+
+ Device is used in other window
+Do you want to use your device in this window?
+Bootloader mode
+Dashboard
+
+ 
+
+ Please select your coin
+You will gain access to recieving & sending selected coin
+
+
- Details
+
-
+ { !device.connected ? (
+
+ );
+
+
+}
+
diff --git a/src/js/components/wallet/Settings.js b/src/js/components/wallet/Settings.js
new file mode 100644
index 00000000..27d5535e
--- /dev/null
+++ b/src/js/components/wallet/Settings.js
@@ -0,0 +1,12 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+
+export default (props: any): any => {
+ return (
+
+ Settings
+
+ );
+}
diff --git a/src/js/components/wallet/SignVerify.js b/src/js/components/wallet/SignVerify.js
new file mode 100644
index 00000000..d07e41d5
--- /dev/null
+++ b/src/js/components/wallet/SignVerify.js
@@ -0,0 +1,29 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+
+export default (props: any): any => {
+ return (
+
+
+ );
+}
diff --git a/src/js/components/wallet/account/AbstractAccount.js b/src/js/components/wallet/account/AbstractAccount.js
new file mode 100644
index 00000000..9ad898ee
--- /dev/null
+++ b/src/js/components/wallet/account/AbstractAccount.js
@@ -0,0 +1,80 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import { Notification } from '../../common/Notification';
+
+export default class AbstractAccount extends Component {
+
+ componentDidMount() {
+ this.props.initAccount();
+ }
+
+ componentWillUpdate(newProps: any) {
+ this.props.updateAccount();
+ }
+
+ // shouldInitAccount(newProps: any): boolean {
+ // const locationChanged: boolean = newProps.location.pathname !== this.props.location.pathname;
+ // const accountNotLoaded: boolean = !newProps.detail.loaded && !this.props.detail.loaded;
+ // return (locationChanged || accountNotLoaded);
+ // }
+
+ // shouldUpdateAccount(newProps: any): boolean {
+ // const { detail } = this.props;
+ // const loaded: boolean = detail.loaded;
+
+ // if (detail.address === '') {
+ // const currentAccount = this.props.accounts.find(a => a.index === detail.addressIndex && a.coin === detail.coin && a.checksum === detail.checksum);
+
+ // }
+
+
+ // // return (loaded && );
+ // }
+
+ componentWillUnmount() {
+ this.props.disposeAccount();
+ }
+
+ render(state: any): any {
+
+ const props = this.props;
+
+ if (!state.checksum) {
+ return ();
+ }
+
+ const device = this.props.devices.find(d => d.checksum === state.checksum);
+ const discovery = props.discovery.find(d => d.checksum === device.checksum && d.coin === state.coin);
+ const account = props.accounts.find(a => a.checksum === state.checksum && a.index === state.accountIndex && a.coin === state.coin);
+
+ if (!account) {
+ if (!discovery || discovery.waitingForDevice) {
+ return (
+
+
+ );
+ } else if (discovery.completed) {
+ return (
+
+
+ );
+ } else {
+ return (
+
+
+ );
+ }
+ }
+
+ return null;
+ }
+}
\ No newline at end of file
diff --git a/src/js/components/wallet/account/AccountTabs.js b/src/js/components/wallet/account/AccountTabs.js
new file mode 100644
index 00000000..34f4c086
--- /dev/null
+++ b/src/js/components/wallet/account/AccountTabs.js
@@ -0,0 +1,34 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import { NavLink } from 'react-router-dom';
+
+const AccountTabs = (props: any): any => {
+
+ const urlParams = props.match.params;
+ //const urlParams = props.match ? props.match.params : { address: '0' };
+ const basePath = `/device/${urlParams.device}/coin/${urlParams.coin}/address/${urlParams.address}`;
+
+ return (
+ = getAccounts(accounts, selected, location.params.coin);
+ let selectedAccounts = deviceAddresses.map((address, i) => {
+ // const url: string = `${baseUrl}/coin/${location.params.coin}/address/${i}`;
+ const url: string = location.pathname.replace(/address+\/([0-9]*)/, `address/${i}`);
+ const b = new BigNumber(address.balance);
+ const fiat = b.times(fiatRate).toFixed(2);
+ const balance = address.balance !== '' ? `${ address.balance } ${ location.params.coin.toUpperCase() } / $${ fiat }` : 'Loading...';
+ return (
+
+ { `Address #${(address.index + 1 )}` }
+ { address.loaded ? balance : "Loading..." }
+
+ )
+ });
+
+ if (selectedAccounts.length < 1) {
+ if (selected.connected) {
+ const url: string = location.pathname.replace(/address+\/([0-9]*)/, `address/0`);
+ selectedAccounts = (
+
+ Address #1
+ Loading...
+
+ )
+ }
+ }
+
+ let discoveryStatus = null;
+ const discovery = props.discovery.find(d => d.checksum === selected.checksum && d.coin === location.params.coin);
+
+ if (discovery) {
+ if (discovery.completed) {
+ // TODO: add only if last one is not empty
+ discoveryStatus = (
+
+ { selectedCoin.name }
+
+ );
+ }
+
+ return (
+
+ { backButton }
+ { selectedAccounts }
+ { discoveryStatus }
+
+ );
+}
+
+export default AccountSelection;
\ No newline at end of file
diff --git a/src/js/components/wallet/aside/Aside.js b/src/js/components/wallet/aside/Aside.js
new file mode 100644
index 00000000..52df1446
--- /dev/null
+++ b/src/js/components/wallet/aside/Aside.js
@@ -0,0 +1,82 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import { Link, NavLink } from 'react-router-dom';
+import { TransitionGroup, CSSTransition } from 'react-transition-group';
+
+import { DeviceSelect, DeviceDropdown } from './DeviceSelection';
+import AccountSelection from './AccountSelection';
+import CoinSelection from './CoinSelection';
+import StickyContainer from './StickyContainer';
+import { findSelectedDevice } from '../../../reducers/TrezorConnectReducer';
+
+const TransitionMenu = (props: any) => {
+ return (
+
+ { window.dispatchEvent( new Event('resize') ) } }
+ onExited= { () => window.dispatchEvent( new Event('resize') ) }
+ in={ true }
+ out={ true }
+ classNames={ props.animationType }
+ appear={false}
+ timeout={ 300 }>
+ { props.children }
+
+
+ )
+}
+
+const Aside = (props: any): any => {
+
+ const selected = findSelectedDevice(props.connect);
+ const { location } = props.router;
+
+ if (location.pathname === '/' || !selected) return ();
+
+ // TODO
+ // if (selectedDevice.unacquired) {
+ // return (
+ //
+ // );
+ // }
+
+ let menu = null;
+
+ if (props.deviceDropdownOpened) {
+ menu =
+
+ );
+ } else if (!selected.unacquired) {
+ menu = (
+
+
+ );
+ }
+
+ console.warn("ASIDEE", props)
+
+ return (
+
+
+ )
+}
+
+export default Aside;
\ No newline at end of file
diff --git a/src/js/components/wallet/aside/CoinSelection.js b/src/js/components/wallet/aside/CoinSelection.js
new file mode 100644
index 00000000..a28692a4
--- /dev/null
+++ b/src/js/components/wallet/aside/CoinSelection.js
@@ -0,0 +1,49 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import { Link, NavLink } from 'react-router-dom';
+
+const CoinSelection = (props: any): any => {
+ const { location } = props.router;
+ const { config } = props.localStorage;
+
+ const walletCoins = config.coins.map(item => {
+ const url = `${ location.pathname }/coin/${ item.shortcut }/address/0`;
+ const className = `coin ${ item.shortcut }`
+ return (
+
+ { item.name }
+
+ )
+ })
+
+ return (
+
+ { walletCoins }
+
+ );
+}
+
+export default CoinSelection;
\ No newline at end of file
diff --git a/src/js/components/wallet/aside/DeviceSelection.js b/src/js/components/wallet/aside/DeviceSelection.js
new file mode 100644
index 00000000..35efd0d9
--- /dev/null
+++ b/src/js/components/wallet/aside/DeviceSelection.js
@@ -0,0 +1,140 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import Select from 'react-select';
+
+import { findSelectedDevice } from '../../../reducers/TrezorConnectReducer';
+
+
+const Value = (props: any): any => {
+ const device = props.value; // device is passed as value of selected item
+
+ // prevent onMouseDown event
+ const onMouseDown = event => {
+ if (props.onClick) {
+ event.preventDefault();
+ event.stopPropagation();
+ }
+ }
+
+ const onClick = (item, device) => {
+ if (props.onClick)
+ props.onClick(item, device);
+ }
+
+ let deviceStatus: string = "Connected";
+ let css: string = "device";
+ const deviceMenuItems: Array = [];
+ // deviceMenuItems.push("settings");
+
+ if (device.unacquired) {
+ css += " unacquired";
+ deviceStatus = "Used in other window";
+ }
+ if (device.isUsedElsewhere) {
+ css += " used-elsewhere";
+ deviceStatus = "Used in other window";
+ deviceMenuItems.push("acquire");
+ } else if (device.featuresNeedsReload) {
+ css += " reload-features";
+ //deviceMenuItems.push("acquire");
+ }
+ if (!device.connected) {
+ css += " reload-features";
+ deviceStatus = "Disconnected";
+ }
+
+ if (device.remember) {
+ deviceMenuItems.push("forget");
+ }
+
+ const deviceMenuButtons = deviceMenuItems.map((item, index) => {
+ return (
+
+
+
+ Details
{ formatTime( parseInt(tx.timeStamp) ) }
- { txAddress }
+ { tx.address }
{ web3.fromWei(tx.value, 'ether') }
- //
- // { `Account #${(address.index + 1 )}` }
- // { address.balance } ETH
- // { address.address }
- //
)
})
}
return (
Pending:
diff --git a/src/js/components/wallet/Receive.js b/src/js/components/wallet/Receive.js new file mode 100644 index 00000000..b39a4a22 --- /dev/null +++ b/src/js/components/wallet/Receive.js @@ -0,0 +1,88 @@ +/* @flow */ +'use strict'; + +import React, { Component } from 'react'; +import { QRCode } from 'react-qr-svg'; +import AbstractAccount from './account/AbstractAccount'; +import { Notification } from '../common/Notification'; +import Tooltip from 'rc-tooltip'; + +export default class Receive extends AbstractAccount { + render() { + return super.render(this.props.receive) || _render(this.props); + } +} + +const _render = (props: any): any => { + + const { + checksum, + accountIndex, + coin, + addressVerified, + addressUnverified, + } = props.receive; + + const device = props.devices.find(d => d.checksum === checksum); + const account = props.accounts.find(a => a.checksum === checksum && a.index === accountIndex && a.coin === coin); + + let qrCode = null; + let address = `${account.address.substring(0, 20)}...`; + let className = 'address hidden'; + let button = ( + + ); + + if (addressVerified || addressUnverified) { + qrCode = ( +Unverified address.
{ device.connected ? 'Show on TREZOR' : 'Connect your TREZOR to verify it.' }
)
+ :
+ ({ device.connected ? 'Show on TREZOR' : 'Connect your TREZOR to verify it.' }
{ device.connected ? 'Show on TREZOR' : 'Connect your TREZOR to verify address.' }
);
+
+ button = (
+ Receive Ethereum or tokens
+ +
+
+ { qrCode }
+
+ { address }
+
+ { button }
+
+
+ Sign message
+ + + + + + +
+
+ Verify message
+ + + + + + +
+ {/*
+ History
+ */}
+
+ Summary
+
+
+ Send
+
+
+ Receive
+
+
+ Sign & Verify
+
+
+ );
+}
+
+export default AccountTabs;
\ No newline at end of file
diff --git a/src/js/components/wallet/aside/AccountSelection.js b/src/js/components/wallet/aside/AccountSelection.js
new file mode 100644
index 00000000..8a8bc53e
--- /dev/null
+++ b/src/js/components/wallet/aside/AccountSelection.js
@@ -0,0 +1,98 @@
+/* @flow */
+'use strict';
+
+import React, { PureComponent } from 'react';
+import { Link, NavLink } from 'react-router-dom';
+import BigNumber from 'bignumber.js';
+
+import { getAccounts } from '../../../utils/reducerUtils';
+import { findSelectedDevice } from '../../../reducers/TrezorConnectReducer';
+import Loader from '../../common/LoaderCircle';
+
+const AccountSelection = (props: any): any => {
+
+ const selected = findSelectedDevice(props.connect);
+ if (!selected) return null;
+
+ const { location } = props.router;
+ const accounts = props.accounts;
+ const baseUrl: string = `/device/${location.params.device}`;
+ const fiatRate = props.fiatRate || '1';
+
+ // console.warn("AccountSelectionRender", selected, props);
+
+ const deviceAddresses: Array
+ Add address
+
+ )
+ } else if (!selected.connected) {
+ discoveryStatus = (
+
+ Addresses could not be loaded
+ { `Connect ${ selected.instanceLabel } device` }
+
+ )
+ } else {
+ discoveryStatus = (
+
+
+ )
+ }
+ }
+
+ const { config } = props.localStorage;
+ const selectedCoin = config.coins.find(c => c.shortcut === location.params.coin);
+ let backButton = null;
+ if (selectedCoin) {
+ backButton = (
+
+ Need help?
+
+
+ Other coins (You will be redirected)
+
+
+ Bitcoin
+
+
+ Litecoin
+
+
+ Bitcoin Cash
+
+
+ Bitcoin Gold
+
+
+ Dash
+
+
+ Zcash
+
+ onClick(item, device) }>
+ )
+ });
+ const deviceMenu = deviceMenuButtons.length < 1 ? null : (
+
+ { deviceMenuButtons }
+
+ );
+
+ return (
+
+
+ );
+}
+
+export const DeviceSelect = (props: any): any => {
+
+ const { devices } = props.connect;
+ const selected = findSelectedDevice(props.connect);
+ if (!selected) return null;
+
+ const handleMenuClick = (type, device) => {
+ console.log("handleMenuClick", type, device)
+ if (type === 'acquire') {
+ props.acquireDevice(device);
+ } else if (type === 'forget') {
+ props.forgetDevice(device);
+ }else if (type === 'settings') {
+ props.duplicateDevice(device);
+ }
+ }
+
+ return (
+
+ { device.instanceLabel }
+ { deviceStatus }
+
+ { deviceMenu }
+
+
}
+ overlay={ dataTooltip }
+ placement="top">
+
+
+
+
+ { errors.data ? ({ errors.data }) : null }
+
+ { props.children }
+
+
+ 1
+// )
+// }
+
+class FeeSelectOption extends Component {
+ constructor(props) {
+ super(props);
+ }
+
+ handleMouseDown(event) {
+ event.preventDefault();
+ event.stopPropagation();
+ this.props.onSelect(this.props.option, event);
+ }
+
+ handleMouseEnter(event) {
+ this.props.onFocus(this.props.option, event);
+ }
+
+ handleMouseMove(event) {
+ if (this.props.isFocused) return;
+ this.props.onFocus(this.props.option, event);
+ }
+
+ render() {
+ const css = `${this.props.className} ${this.props.option.value}`;
+ return (
+
+ { this.props.children }
+
+ );
+ }
+}
+
+FeeSelectOption.propTypes = {
+ children: PropTypes.node,
+ className: PropTypes.string,
+ isDisabled: PropTypes.bool,
+ isFocused: PropTypes.bool,
+ isSelected: PropTypes.bool,
+ onFocus: PropTypes.func,
+ onSelect: PropTypes.func,
+ option: PropTypes.object.isRequired,
+};
+
+export default FeeSelectOption;
\ No newline at end of file
diff --git a/src/js/components/wallet/send/FeeSelect.js b/src/js/components/wallet/send/FeeSelect.js
new file mode 100644
index 00000000..6877996a
--- /dev/null
+++ b/src/js/components/wallet/send/FeeSelect.js
@@ -0,0 +1,63 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+
+
+export const FeeSelectValue = (props: any): any => {
+ return (
+
+
+ );
+}
+
+export class FeeSelectOption extends Component {
+ constructor(props) {
+ super(props);
+ }
+
+ handleMouseDown(event) {
+ event.preventDefault();
+ event.stopPropagation();
+ this.props.onSelect(this.props.option, event);
+ }
+
+ handleMouseEnter(event) {
+ this.props.onFocus(this.props.option, event);
+ }
+
+ handleMouseMove(event) {
+ if (this.props.isFocused) return;
+ this.props.onFocus(this.props.option, event);
+ }
+
+ render() {
+ return (
+
+ { props.value.value }
+ { props.value.label }
+
+
+ { this.props.option.value }
+ { this.props.option.label }
+
+ );
+ }
+}
+
+FeeSelectOption.propTypes = {
+ children: PropTypes.node,
+ className: PropTypes.string,
+ isDisabled: PropTypes.bool,
+ isFocused: PropTypes.bool,
+ isSelected: PropTypes.bool,
+ onFocus: PropTypes.func,
+ onSelect: PropTypes.func,
+ option: PropTypes.object.isRequired,
+};
+
+
diff --git a/src/js/components/wallet/send/FeeSelectOption.js b/src/js/components/wallet/send/FeeSelectOption.js
new file mode 100644
index 00000000..58481ac0
--- /dev/null
+++ b/src/js/components/wallet/send/FeeSelectOption.js
@@ -0,0 +1,60 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+
+
+// export default (props: any): any => {
+// console.log("RENDER CUSTOM OPTION", props)
+// return (
+// 1
+// )
+// }
+
+class FeeSelectOption extends Component {
+ constructor(props) {
+ super(props);
+ }
+
+ handleMouseDown(event) {
+ event.preventDefault();
+ event.stopPropagation();
+ this.props.onSelect(this.props.option, event);
+ }
+
+ handleMouseEnter(event) {
+ this.props.onFocus(this.props.option, event);
+ }
+
+ handleMouseMove(event) {
+ if (this.props.isFocused) return;
+ this.props.onFocus(this.props.option, event);
+ }
+
+ render() {
+ return (
+
+ { this.props.children }
+
+ $10.20 / 8.828392159996002 ETH
+
+ );
+ }
+}
+
+FeeSelectOption.propTypes = {
+ children: PropTypes.node,
+ className: PropTypes.string,
+ isDisabled: PropTypes.bool,
+ isFocused: PropTypes.bool,
+ isSelected: PropTypes.bool,
+ onFocus: PropTypes.func,
+ onSelect: PropTypes.func,
+ option: PropTypes.object.isRequired,
+};
+
+export default FeeSelectOption;
\ No newline at end of file
diff --git a/src/js/components/wallet/send/PendingTransactions.js b/src/js/components/wallet/send/PendingTransactions.js
new file mode 100644
index 00000000..e69de29b
diff --git a/src/js/components/wallet/send/SendForm.js b/src/js/components/wallet/send/SendForm.js
new file mode 100644
index 00000000..7527344f
--- /dev/null
+++ b/src/js/components/wallet/send/SendForm.js
@@ -0,0 +1,177 @@
+/* @flow */
+'use strict';
+
+import React, { Component } from 'react';
+import Select from 'react-select';
+import AdvancedForm from './AdvancedForm';
+import { FeeSelectValue, FeeSelectOption } from './FeeSelect';
+import { Notification } from '../../common/Notification';
+import AbstractAccount from '../account/AbstractAccount';
+
+export default class Send extends AbstractAccount {
+ render() {
+ return super.render(this.props.sendForm) || _render(this.props);
+ }
+}
+
+
+const _render = (props: any): any => {
+
+ const device = props.devices.find(d => d.checksum === props.sendForm.checksum);
+ const discovery = props.discovery.find(d => d.checksum === device.checksum && d.coin === props.sendForm.coin);
+ const account = props.accounts.find(a => a.checksum === props.sendForm.checksum && a.index === props.sendForm.accountIndex && a.coin === props.sendForm.coin);
+ const addressTokens = props.tokens.filter(t => t.ethAddress === account.address);
+
+ const {
+ address,
+ amount,
+ setMax,
+ coin,
+ token,
+ feeLevels,
+ fee,
+ selectedFeeLevel,
+ gasPriceNeedsUpdate,
+ total,
+ errors,
+ warnings,
+ infos,
+ advanced,
+ sending,
+ sendingStatus
+ } = props.sendForm;
+
+ const {
+ onAddressChange,
+ onAmountChange,
+ onSetMax,
+ onCurrencyChange,
+ onFeeLevelChange,
+ updateFeeLevels,
+ onSend,
+ } = props.sendFormActions;
+
+ //const addressTokens = props.tokens.filter(t => t.ethAddress === currentAccount.address);
+ const tokens = addressTokens.map(t => {
+ return { value: t.symbol, label: t.symbol };
+ });
+ tokens.unshift({ value: coin, label: coin.toUpperCase() });
+
+ const setMaxClassName: string = setMax ? 'set-max enabled' : 'set-max';
+
+ let updateFeeLevelsButton = null;
+ if (gasPriceNeedsUpdate) {
+ updateFeeLevelsButton = (
+ Recommended fees updated. Click here to use them
+ )
+ }
+
+ let addressClassName: ?string;
+ if (errors.address) {
+ addressClassName = 'not-valid';
+ } else if (warnings.address) {
+ addressClassName = 'warning';
+ } else if (address.length > 0) {
+ addressClassName = 'valid';
+ }
+
+ let buttonDisabled: boolean = Object.keys(errors).length > 0 || total === '0' || address.length === 0 || sending;
+ let buttonLabel: string = 'Send';
+ if (coin !== token && amount.length > 0 && !errors.amount) {
+ buttonLabel += ` ${amount} ${ token.toUpperCase() }`
+ } else if (coin === token && total !== '0') {
+ buttonLabel += ` ${total} ${ token.toUpperCase() }`;
+ }
+
+ //const device = props.devices.find(d => d.checksum === currentAccount.checksum);
+ if (device && !device.connected) {
+ buttonLabel = 'Device is not connected';
+ buttonDisabled = true;
+ }
+
+ let notification = null;
+ // if (sendingStatus) {
+ // if (sendingStatus.success) {
+ // notification = (Send Ethereum or tokens
+
+
+ onAddressChange(event.target.value) } />
+
+ { errors.address ? ({ errors.address }) : null }
+ { warnings.address ? ({ warnings.address }) : null }
+ { infos.address ? ({ infos.address }) : null }
+
+
+
+
+
+
+
+ onAmountChange(event.target.value) } />
+
+ Set max
+
+
+
+ { errors.amount ? ({ errors.amount }) : null }
+ { warnings.amount ? ({ warnings.amount }) : null }
+
+
+
+
+
+
+
+ )
+ } else {
+ summaryContent = (
+
+
+ Balance
+ ${ fiat }
+ { currentAccount.balance } ETH
+
+
+ Rate
+ ${ fiatRate }
+ 1.00 ETH
+
+
+ )
+ }
+
+ }
+
+ let addFormClassName = "add-token-form closed";
+ let addFormContent = null;
+ if (addForm) {
+ addFormClassName = "add-token-form";
+ addFormContent = (
+
+
+ Balance
+ Loading...
+ Loading...
+
+
+ Rate
+ ${ fiatRate }
+ 1.00 ETH
+
+
+ )
+ }
+
+ const bg = new ColorHash({lightness: 0.7});
+ //const colorHash2 = new ColorHash({lightness: 0.5});
+ const colorHash2 = new ColorHash();
+
+ console.log("SUM", tokens, address, props.tokens)
+ //let tokensContent = null;
+ let tokensContent = tokens.map((t, i) => {
+
+ // if (search.length > 0) {
+ // if (t.name.toLowerCase().indexOf(search) < 0 && t.shortcut.toLowerCase().indexOf(search) < 0) return null;
+ // }
+ let iconColor = {
+ color: colorHash2.hex(t.name),
+ background: bg.hex(t.name),
+ borderColor: bg.hex(t.name)
+ }
+ return (
+
+
+ onCustomTokenAddressChange(event.target.value) } />
+
+
+
+ onCustomTokenNameChange(event.target.value) } />
+
+
+
+ onCustomTokenShortcutChange(event.target.value) } />
+
+
+
+ onCustomTokenDecimalChange(event.target.value) } />
+
+
+
+
+
+
+ )
+ });
+
+ let ethIcon = null;
+ if (currentAccount) {
+ ethIcon = (
+
+
+
+
+ { t.symbol }
{ t.name }
+ { t.balance }
+ { ethIcon } Address #{ parseInt(props.match.params.address) + 1 }
+ +
+ { summaryContent }
+
+
+
+
+ {/* onTokenSearch(event.target.value) } /> */}
+ 0x58cda554935e4a1f2acbe15f8757400af275e084
+ {
+ console.log("FILTERRR", opt, str, values);
+ return opt;
+ }
+ }
+
+
+ value={ selectedToken }
+ onChange={ props.summaryActions.selectToken }
+ valueKey="symbol"
+ labelKey="symbol"
+ placeholder="Search for token"
+ loadOptions={ props.summaryActions.loadTokens }
+ backspaceRemoves={true} />
+
+
+
+
+
+
+
+ Add token
+
+ { addFormContent }
+
+ { tokensContent }
+
+ Address #{ parseInt(props.match.params.address) + 1 }
+ +
+ 0x58cda554935e4a1f2acbe15f8757400af275e084
+ {
+ console.log("TODO: filter already added", opt, str, values);
+ return opt;
+ }
+ }
+
+
+ value={ props.summary.selectedToken }
+ onChange={ token => props.summaryActions.selectToken(token, account) }
+ valueKey="symbol"
+ labelKey="symbol"
+ placeholder="Search for token"
+ loadOptions={ props.summaryActions.loadTokens }
+ backspaceRemoves={true} />
+
+
+
+
+
+
+ )
+ }
+
+ const fiatValue = "0";
+
+ return (
+
+
+ );
+}
+
+export default SummaryDetails;
\ No newline at end of file
diff --git a/src/js/components/wallet/summary/SummaryTokens.js b/src/js/components/wallet/summary/SummaryTokens.js
new file mode 100644
index 00000000..22c261e3
--- /dev/null
+++ b/src/js/components/wallet/summary/SummaryTokens.js
@@ -0,0 +1,46 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import ColorHash from 'color-hash';
+import ScaleText from 'react-scale-text';
+
+const SummaryTokens = (props: any): any => {
+
+ if (!props.tokens || props.tokens.length < 1) return null;
+
+ const bgColor = new ColorHash({lightness: 0.7});
+ const textColor = new ColorHash();
+
+ const tokens = props.tokens.map((t, i) => {
+
+ // if (search.length > 0) {
+ // if (t.name.toLowerCase().indexOf(search) < 0 && t.shortcut.toLowerCase().indexOf(search) < 0) return null;
+ // }
+ let iconColor = {
+ color: textColor.hex(t.name),
+ background: bgColor.hex(t.name),
+ borderColor: bgColor.hex(t.name)
+ }
+ return (
+
+
+
+
+
+ Balance
+ ${ fiatValue }
+ { props.balance } ETH
+
+
+ Rate
+ ${ props.fiatRate }
+ 1.00 ETH
+
+
+ )
+ });
+
+ return (
+
+
+
+
+ { t.symbol }
{ t.name }
+ { t.balance }
+
+ { tokens }
+
+ )
+
+}
+
+export default SummaryTokens;
\ No newline at end of file
diff --git a/src/js/containers/DevicesContainer.js b/src/js/containers/AcquireContainer.js
similarity index 63%
rename from src/js/containers/DevicesContainer.js
rename to src/js/containers/AcquireContainer.js
index 2aa120cb..31f2f6c7 100644
--- a/src/js/containers/DevicesContainer.js
+++ b/src/js/containers/AcquireContainer.js
@@ -5,7 +5,7 @@ import React, { Component, PropTypes } from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
-import Devices from '../components/Devices';
+import Acquire from '../components/wallet/Acquire';
import * as TrezorConnectActions from '../actions/TrezorConnectActions';
function mapStateToProps(state, own) {
@@ -15,9 +15,9 @@ function mapStateToProps(state, own) {
}
function mapDispatchToProps(dispatch) {
- return {
- onSelectDevice: bindActionCreators(TrezorConnectActions.onSelectDevice, dispatch)
+ return {
+ acquireDevice: bindActionCreators(TrezorConnectActions.acquire, dispatch),
};
}
-export default connect(mapStateToProps, mapDispatchToProps)(Devices);
\ No newline at end of file
+export default connect(mapStateToProps, mapDispatchToProps)(Acquire);
\ No newline at end of file
diff --git a/src/js/containers/AddressMenuContainer.js b/src/js/containers/AddressMenuContainer.js
deleted file mode 100644
index 86b58c3e..00000000
--- a/src/js/containers/AddressMenuContainer.js
+++ /dev/null
@@ -1,23 +0,0 @@
-/* @flow */
-'use strict';
-
-import React, { Component, PropTypes } from 'react';
-import { bindActionCreators } from 'redux';
-import { connect } from 'react-redux';
-import AddressMenu from '../components/AddressMenu';
-//import * as AccountActions from '../actions/AccountActions';
-
-function mapStateToProps(state, own) {
- return {
- web3: state.web3.web3,
- addresses: state.addresses
- };
-}
-
-function mapDispatchToProps(dispatch) {
- return {
- //onAccountSelect: bindActionCreators(AccountActions.onAccountSelect, dispatch)
- };
-}
-
-export default connect(mapStateToProps, mapDispatchToProps)(AddressMenu);
\ No newline at end of file
diff --git a/src/js/containers/AppContainer.js b/src/js/containers/AppContainer.js
deleted file mode 100644
index 686f97a5..00000000
--- a/src/js/containers/AppContainer.js
+++ /dev/null
@@ -1,30 +0,0 @@
-/* @flow */
-'use strict';
-
-import React, { Component } from 'react';
-import { Link } from 'react-router-dom';
-import TrezorConnect from 'trezor-connect';
-
-import Devices from './DevicesContainer';
-import Modal from './ModalContainer';
-
-import Header from '../components/Header';
-import AddressMenuContainer from './AddressMenuContainer';
-import Footer from '../components/Footer';
-
-export default class AppContainer extends Component {
- render() {
- return (
-
-
-
-
-
- );
- }
-}
\ No newline at end of file
diff --git a/src/js/containers/AsideContainer.js b/src/js/containers/AsideContainer.js
new file mode 100644
index 00000000..d1a66594
--- /dev/null
+++ b/src/js/containers/AsideContainer.js
@@ -0,0 +1,39 @@
+/* @flow */
+'use strict';
+
+import React, { Component, PropTypes } from 'react';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import { withRouter } from 'react-router-dom';
+import Aside from '../components/wallet/aside/Aside';
+import * as TrezorConnectActions from '../actions/TrezorConnectActions';
+import { toggleDeviceDropdown } from '../actions/AppActions';
+
+function mapStateToProps(state, own) {
+ return {
+ connect: state.connect,
+ accounts: state.accounts,
+ router: state.router,
+ deviceDropdownOpened: state.DOM.deviceDropdownOpened,
+ fiatRate: state.web3.fiatRate,
+ localStorage: state.localStorage,
+ discovery: state.discovery
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ return {
+ //onAccountSelect: bindActionCreators(AccountActions.onAccountSelect, dispatch),
+ toggleDeviceDropdown: bindActionCreators(toggleDeviceDropdown, dispatch),
+ addAddress: bindActionCreators(TrezorConnectActions.addAddress, dispatch),
+ acquireDevice: bindActionCreators(TrezorConnectActions.acquire, dispatch),
+ forgetDevice: bindActionCreators(TrezorConnectActions.forget, dispatch),
+ duplicateDevice: bindActionCreators(TrezorConnectActions.duplicateDevice, dispatch),
+ onSelectDevice: bindActionCreators(TrezorConnectActions.onSelectDevice, dispatch),
+ };
+}
+
+//export default connect(mapStateToProps, mapDispatchToProps)(AddressMenu);
+export default withRouter(
+ connect(mapStateToProps, mapDispatchToProps)(Aside)
+);
\ No newline at end of file
diff --git a/src/js/containers/ModalContainer.js b/src/js/containers/BootloaderContainer.js
similarity index 50%
rename from src/js/containers/ModalContainer.js
rename to src/js/containers/BootloaderContainer.js
index 67033faa..6db873cf 100644
--- a/src/js/containers/ModalContainer.js
+++ b/src/js/containers/BootloaderContainer.js
@@ -5,19 +5,17 @@ import React, { Component, PropTypes } from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
-import Modal from '../components/modal/Modal';
-import * as ModalActions from '../actions/ModalActions';
+import Bootloader from '../components/wallet/Bootloader';
function mapStateToProps(state, own) {
return {
- modal: state.modal
+
};
}
function mapDispatchToProps(dispatch) {
- return {
- modalActions: bindActionCreators(ModalActions, dispatch),
+ return {
};
}
-export default connect(mapStateToProps, mapDispatchToProps)(Modal);
\ No newline at end of file
+export default connect(mapStateToProps, mapDispatchToProps)(Bootloader);
\ No newline at end of file
diff --git a/src/js/containers/ContentContainer.js b/src/js/containers/ContentContainer.js
new file mode 100644
index 00000000..620ebbc6
--- /dev/null
+++ b/src/js/containers/ContentContainer.js
@@ -0,0 +1,45 @@
+/* @flow */
+'use strict';
+
+import React from 'react';
+import { Route } from 'react-router-dom';
+
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import { withRouter } from 'react-router-dom';
+import Log from '../components/common/Log';
+import Notifications from '../components/common/Notification';
+import Footer from '../components/common/Footer';
+import AccountTabs from '../components/wallet/account/AccountTabs';
+
+import * as TrezorConnectActions from '../actions/TrezorConnectActions';
+
+const Article = (props) => {
+ return (
+
+
+
+ { props.children }
+
+
+
+ );
+}
+
+function mapStateToProps(state, own) {
+ return {
+
+ };
+}
+
+function mapDispatchToProps(dispatch) {
+ return { };
+}
+
+export default withRouter(
+ connect(mapStateToProps, mapDispatchToProps)(Wallet)
+);
diff --git a/src/js/containers/index.js b/src/js/containers/index.js
index 64fe942f..0adc537c 100644
--- a/src/js/containers/index.js
+++ b/src/js/containers/index.js
@@ -1,7 +1,19 @@
/* @flow */
'use strict';
-export { default as AppContainer } from './AppContainer';
+// wrapper layouts
+export { default as LandingPageContainer } from './LandingPageContainer';
+export { default as WalletContainer } from './WalletContainer';
+
+// wallet sections
+export { default as AcquireContainer } from './AcquireContainer';
+export { default as BootloaderContainer } from './BootloaderContainer';
+
+export { default as DashboardContainer } from './DashboardContainer';
export { default as HistoryContainer } from './HistoryContainer';
export { default as SendFormContainer } from './SendFormContainer';
export { default as ReceiveContainer } from './ReceiveContainer';
+export { default as SignVerifyContainer } from './SignVerifyContainer';
+
+
+export { default as SettingsContainer } from './SettingsContainer';
diff --git a/src/js/index.js b/src/js/index.js
index 66c69b6b..6b77704f 100644
--- a/src/js/index.js
+++ b/src/js/index.js
@@ -3,26 +3,25 @@
import React from 'react';
import { render } from 'react-dom';
-import { Provider } from 'react-redux';
-import { ConnectedRouter } from 'react-router-redux';
-import store, { history } from './store';
+import store from './store';
import router from './router';
-import { onResize } from './actions/DOMActions';
+import { onResize, onBeforeUnload } from './actions/AppActions';
import styles from '../styles/index.less';
render(
-