1  import React from 'react';
 2  import translate from 'translations';
 3  import { NewTabLink } from 'components/ui';
 4  import './InsecureWalletWarning.scss';
 5  
 6  interface Props {
 7    walletType: string;
 8    onCancel(): void;
 9  }
10  
11  export class InsecureWalletWarning extends React.Component<Props> {
12    constructor(props: Props) {
13      super(props);
14    }
15  
16    public render() {
17      const { walletType, onCancel } = this.props;
18  
19      return (
20        <div className="WalletWarning">
21          <h2 className="WalletWarning-title">
22            {translate('INSECURE_WALLET_TYPE_TITLE', { $wallet_type: walletType })}
23          </h2>
24          <p className="WalletWarning-desc">
25            {translate('INSECURE_WALLET_TYPE_DESC', { $wallet_type: walletType })}
26          </p>
27  
28          <div className="WalletWarning-buttons">
29            <NewTabLink
30              href="https://download.mycrypto.com/"
31              className="WalletWarning-buttons-btn is-download btn btn-lg btn-primary"
32            >
33              {translate('WALLET_SUGGESTION_DESKTOP_APP')}
34            </NewTabLink>
35            <button className="WalletWarning-buttons-btn is-cancel" onClick={onCancel}>
36              <i className="fa fa-arrow-left" />
37              {translate('INSECURE_WALLET_GO_BACK')}
38            </button>
39          </div>
40        </div>
41      );
42    }
43  }