Add persistent message to Ledger unlock.

common/components/WalletDecrypt/components/LedgerNano.scss

@@ -1,6 +1,14 @@
+@import 'common/sass/variables';
+
 .LedgerDecrypt {
   text-align: center;
 
+  &-tip {
+    font-size: $font-size-xs-bump;
+    opacity: 0.7;
+    margin-bottom: $space;
+  }
+
   &-help {
     margin-top: 10px;
     font-size: 13px;

common/components/WalletDecrypt/components/LedgerNano.tsx

@@ -28,7 +28,6 @@ interface State {
   dPath: DPath;
   error: string | null;
   isLoading: boolean;
-  showTip: boolean;
 }
 
 type Props = OwnProps & StateProps;
@@ -39,8 +38,7 @@ class LedgerNanoSDecryptClass extends PureComponent<Props, State> {
     chainCode: '',
     dPath: this.props.dPath || this.props.dPaths[0],
     error: null,
-    isLoading: false,
+    isLoading: false
-    showTip: false
   };
 
   public UNSAFE_componentWillReceiveProps(nextProps: Props) {
@@ -51,7 +49,7 @@ class LedgerNanoSDecryptClass extends PureComponent<Props, State> {
 
   public render() {
     const { network } = this.props;
-    const { dPath, publicKey, chainCode, error, isLoading, showTip } = this.state;
+    const { dPath, publicKey, chainCode, error, isLoading } = this.state;
     const showErr = error ? 'is-showing' : '';
 
     if (!dPath) {
@@ -71,6 +69,15 @@ class LedgerNanoSDecryptClass extends PureComponent<Props, State> {
 
     return (
       <div className="LedgerDecrypt">
+        <div className="LedgerDecrypt-tip">
+          {translate('LEDGER_TIP', {
+            $network: network.unit,
+            $browserSupportState: process.env.BUILD_ELECTRON
+              ? translateRaw('DISABLED')
+              : translateRaw('ENABLED')
+          })}
+        </div>
+
         <button
           className="LedgerDecrypt-decrypt btn btn-primary btn-lg btn-block"
           onClick={this.handleNullConnect}
@@ -92,10 +99,6 @@ class LedgerNanoSDecryptClass extends PureComponent<Props, State> {
 
         <div className={`LedgerDecrypt-error alert alert-danger ${showErr}`}>{error || '-'}</div>
 
-        {showTip && (
-          <p className="LedgerDecrypt-tip">{translate('LEDGER_TIP', { $network: network.unit })}</p>
-        )}
-
         <div className="LedgerDecrypt-help">
           <NewTabLink href="https://support.ledgerwallet.com/hc/en-us/articles/115005200009">
             {translate('HELP_ARTICLE_1')}
@@ -123,8 +126,7 @@ class LedgerNanoSDecryptClass extends PureComponent<Props, State> {
   private handleConnect = (dPath: DPath) => {
     this.setState({
       isLoading: true,
-      error: null,
+      error: null
-      showTip: false
     });
 
     LedgerWallet.getChainCode(dPath.value)
@@ -138,8 +140,7 @@ class LedgerNanoSDecryptClass extends PureComponent<Props, State> {
       .catch(err => {
         this.setState({
           error: err.message,
-          isLoading: false,
+          isLoading: false
-          showTip: true
         });
       });
   };

common/translations/lang/en.json

@@ -413,7 +413,9 @@
     "OLD_MYCRYPTO": "MyCrypto (Legacy Site)",
     "LEDGER_REFERRAL_1": "Buy a Ledger Wallet",
     "LEDGER_REFERRAL_2": "Don’t have a Ledger? Order one now!",
-    "LEDGER_TIP": "**Tip:** Make sure you're logged into the $network app on your hardware wallet, and have enabled browser support in the settings",
+    "LEDGER_TIP": "Make sure your Ledger is unlocked, you've selected the **$network** app on your hardware wallet, and browser support is **$browserSupportState**.",
+    "ENABLED": "enabled",
+    "DISABLED": "disabled",
     "LEDGER_TIMEOUT": "The request timed out",
     "LEDGER_WRONG_APP": "Wrong application selected on your device",
     "LEDGER_LOCKED": "Your Ledger device is locked",