diff --git a/src/actions/SignVerifyActions.js b/src/actions/SignVerifyActions.js index 9ce9d754..b2aece5b 100644 --- a/src/actions/SignVerifyActions.js +++ b/src/actions/SignVerifyActions.js @@ -17,6 +17,8 @@ export const sign = ( state: selected.state, }; + dispatch({ type: SIGN_VERIFY.SIGN_PROGRESS, isSignProgress: true }); + const response = await TrezorConnect.ethereumSignMessage({ device, path, @@ -25,6 +27,8 @@ export const sign = ( useEmptyPassphrase: selected.useEmptyPassphrase, }); + dispatch({ type: SIGN_VERIFY.SIGN_PROGRESS, isSignProgress: false }); + if (response && response.success) { dispatch({ type: SIGN_VERIFY.SIGN_SUCCESS, diff --git a/src/actions/constants/signVerify.js b/src/actions/constants/signVerify.js index b0b11fc1..fb43a1b2 100644 --- a/src/actions/constants/signVerify.js +++ b/src/actions/constants/signVerify.js @@ -1,5 +1,6 @@ /* @flow */ export const SIGN_SUCCESS: 'sign__verify__sign__success' = 'sign__verify__sign__success'; +export const SIGN_PROGRESS: 'sign__verify__sign_progress' = 'sign__verify__sign_progress'; export const VERIFY_SUCCESS: 'sign__verify__verify__success' = 'sign__verify__verify__success'; export const CLEAR: 'sign__verify__sign__clear' = 'sign__verify__sign__clear'; \ No newline at end of file diff --git a/src/components/Textarea/index.js b/src/components/Textarea/index.js index 3b025961..a29f0e2f 100644 --- a/src/components/Textarea/index.js +++ b/src/components/Textarea/index.js @@ -1,7 +1,7 @@ import React from 'react'; import Textarea from 'react-textarea-autosize'; import PropTypes from 'prop-types'; -import styled from 'styled-components'; +import styled, { css } from 'styled-components'; import colors from 'config/colors'; import { FONT_SIZE, FONT_WEIGHT, FONT_FAMILY } from 'config/variables'; @@ -82,6 +82,14 @@ const StyledTextarea = styled(Textarea)` opacity: 1; } } + + ${props => props.isInTrezorAction && css` + z-index: 10001; /* bigger than modal container */ + border-color: ${colors.WHITE}; + border-width: 2px; + transform: translate(-1px, -1px); + background: ${colors.DIVIDER}; + `} `; const TopLabel = styled.span` @@ -119,6 +127,7 @@ const TextArea = ({ topLabel, state = '', bottomText = '', + isInTrezorAction = false, }) => ( {bottomText && ( { case 'ButtonRequest_SignTx': return ; + case 'ButtonRequest_SignMessage': + return ; + case RECEIVE.REQUEST_UNVERIFIED: return ( { switch (action.type) { + case SIGN_VERIFY.SIGN_PROGRESS: + return { + ...state, + isSignProgress: action.isSignProgress, + }; + case SIGN_VERIFY.SIGN_SUCCESS: return { ...state, diff --git a/src/views/Wallet/views/Account/SignVerify/Container.js b/src/views/Wallet/views/Account/SignVerify/Container.js index 570b8f2b..84064762 100644 --- a/src/views/Wallet/views/Account/SignVerify/Container.js +++ b/src/views/Wallet/views/Account/SignVerify/Container.js @@ -19,6 +19,7 @@ export type Props = StateProps & DispatchProps; const mapStateToProps: MapStateToProps = (state: State): StateProps => ({ selectedAccount: state.selectedAccount, signature: state.signVerifyReducer.signature, + isSignProgress: state.signVerifyReducer.isSignProgress, isVerifySuccess: state.signVerifyReducer.isVerifySuccess, }); diff --git a/src/views/Wallet/views/Account/SignVerify/index.js b/src/views/Wallet/views/Account/SignVerify/index.js index 92c5b884..54678429 100644 --- a/src/views/Wallet/views/Account/SignVerify/index.js +++ b/src/views/Wallet/views/Account/SignVerify/index.js @@ -121,6 +121,7 @@ class SignVerify extends Component { onChange={this.handleInputChange} rows="2" maxLength="255" + isInTrezorAction={this.props.isSignProgress} />