1  import React, { Component } from 'react';
 2  import { connect } from 'react-redux';
 3  
 4  import { translate } from 'translations';
 5  import { AppState } from 'features/reducers';
 6  import * as selectors from 'features/selectors';
 7  import { Spinner } from 'components/ui';
 8  import './SigningStatus.scss';
 9  
10  interface StateProps {
11    isSignaturePending: boolean;
12    isHardwareWallet: boolean;
13  }
14  
15  class SigningStatusClass extends Component<StateProps> {
16    public render() {
17      const { isHardwareWallet, isSignaturePending } = this.props;
18  
19      const HWWalletPrompt: React.SFC<{}> = () =>
20        isHardwareWallet ? (
21          <p>
22            <b>{translate('CONFIRM_HARDWARE_WALLET_TRANSACTION')}</b>
23          </p>
24        ) : null;
25  
26      return isSignaturePending ? (
27        <div className="SigningStatus text-center">
28          <HWWalletPrompt />
29          <Spinner size="x2" />
30        </div>
31      ) : null;
32    }
33  }
34  
35  export const SigningStatus = connect((state: AppState) => selectors.signaturePending(state))(
36    SigningStatusClass
37  );