From c7c17843b041b4ce45f3262be293ecbfa7378dd2 Mon Sep 17 00:00:00 2001
From: William O'Beirne <wbobeirne@gmail.com>
Date: Mon, 16 Apr 2018 11:36:14 -0400
Subject: [PATCH] Deprecation Warning for Insecure Unlocks (#1526)

---
 .../WalletDecrypt/components/DeprecationWarning.tsx  | 12 ++++++++++++
 .../components/WalletDecrypt/components/Keystore.tsx |  2 ++
 .../components/WalletDecrypt/components/Mnemonic.tsx |  6 ++++--
 .../WalletDecrypt/components/PrivateKey.tsx          |  2 ++
 common/sass/styles/scaffolding.scss                  |  4 ++++
 common/translations/lang/en.json                     |  1 +
 6 files changed, 25 insertions(+), 2 deletions(-)
 create mode 100644 common/components/WalletDecrypt/components/DeprecationWarning.tsx

diff --git a/common/components/WalletDecrypt/components/DeprecationWarning.tsx b/common/components/WalletDecrypt/components/DeprecationWarning.tsx
new file mode 100644
index 00000000..82eab917
--- /dev/null
+++ b/common/components/WalletDecrypt/components/DeprecationWarning.tsx
@@ -0,0 +1,12 @@
+import React from 'react';
+import translate from 'translations';
+
+const DeprecationWarning: React.SFC<{}> = () => {
+  if (process.env.BUILD_DOWNLOADABLE) {
+    return null;
+  }
+
+  return <div className="alert alert-warning">{translate('INSECURE_WALLET_DEPRECATION')}</div>;
+};
+
+export default DeprecationWarning;
diff --git a/common/components/WalletDecrypt/components/Keystore.tsx b/common/components/WalletDecrypt/components/Keystore.tsx
index 952eb0ab..7fb12414 100644
--- a/common/components/WalletDecrypt/components/Keystore.tsx
+++ b/common/components/WalletDecrypt/components/Keystore.tsx
@@ -4,6 +4,7 @@ import translate, { translateRaw } from 'translations';
 import Spinner from 'components/ui/Spinner';
 import { TShowNotification } from 'actions/notifications';
 import { Input } from 'components/ui';
+import DeprecationWarning from './DeprecationWarning';
 
 export interface KeystoreValue {
   file: string;
@@ -44,6 +45,7 @@ export class KeystoreDecrypt extends PureComponent {
 
     return (
       <form onSubmit={this.unlock}>
+        <DeprecationWarning />
         <div className="form-group">
           <input
             className="hidden"
diff --git a/common/components/WalletDecrypt/components/Mnemonic.tsx b/common/components/WalletDecrypt/components/Mnemonic.tsx
index 88ff969c..f255dbbb 100644
--- a/common/components/WalletDecrypt/components/Mnemonic.tsx
+++ b/common/components/WalletDecrypt/components/Mnemonic.tsx
@@ -9,6 +9,7 @@ import { connect } from 'react-redux';
 import { getSingleDPath, getPaths } from 'selectors/config/wallet';
 import { TogglablePassword } from 'components';
 import { Input } from 'components/ui';
+import DeprecationWarning from './DeprecationWarning';
 
 interface OwnProps {
   onUnlock(param: any): void;
@@ -49,7 +50,8 @@ class MnemonicDecryptClass extends PureComponent<Props, State> {
     const isValidMnemonic = validateMnemonic(formattedPhrase);
 
     return (
-      <div>
+      <React.Fragment>
+        <DeprecationWarning />
         <div id="selectedTypeKey">
           <div className="form-group">
             <TogglablePassword
@@ -92,7 +94,7 @@ class MnemonicDecryptClass extends PureComponent<Props, State> {
           onConfirmAddress={this.handleUnlock}
           onPathChange={this.handlePathChange}
         />
-      </div>
+      </React.Fragment>
     );
   }
 
diff --git a/common/components/WalletDecrypt/components/PrivateKey.tsx b/common/components/WalletDecrypt/components/PrivateKey.tsx
index 425edb3c..3bef3636 100644
--- a/common/components/WalletDecrypt/components/PrivateKey.tsx
+++ b/common/components/WalletDecrypt/components/PrivateKey.tsx
@@ -4,6 +4,7 @@ import React, { PureComponent } from 'react';
 import translate, { translateRaw } from 'translations';
 import { TogglablePassword } from 'components';
 import { Input } from 'components/ui';
+import DeprecationWarning from './DeprecationWarning';
 
 export interface PrivateKeyValue {
   key: string;
@@ -54,6 +55,7 @@ export class PrivateKeyDecrypt extends PureComponent<Props> {
 
     return (
       <form id="selectedTypeKey" onSubmit={this.unlock}>
+        <DeprecationWarning />
         <div className="input-group-wrapper">
           <label className="input-group">
             <TogglablePassword
diff --git a/common/sass/styles/scaffolding.scss b/common/sass/styles/scaffolding.scss
index 1610ca44..86dde2e9 100644
--- a/common/sass/styles/scaffolding.scss
+++ b/common/sass/styles/scaffolding.scss
@@ -78,6 +78,10 @@ hr {
   border-top: 1px solid $hr-border;
 }
 
+a {
+  text-decoration-skip-ink: none;
+}
+
 #app {
   overflow-x: hidden;
 }
diff --git a/common/translations/lang/en.json b/common/translations/lang/en.json
index db6a7ae3..06b1d4b2 100644
--- a/common/translations/lang/en.json
+++ b/common/translations/lang/en.json
@@ -451,6 +451,7 @@
     "INSECURE_WALLET_RECOMMEND_1": "Using [MetaMask]($metamask_article) or a [Hardware Wallet]($hardware_wallet_article) to access your wallet",
     "INSECURE_WALLET_RECOMMEND_2": "[Downloading MyCrypto and running it offline & locally]($run_local_article)",
     "INSECURE_WALLET_RECOMMEND_3": "Reading [How to Protect Yourself and Your Funds]($secure_your_eth_article)",
+    "INSECURE_WALLET_DEPRECATION": "**Warning:** Accessing this type of wallet via the web interface will be disabled soon. You’ll need to [run MyCrypto locally](https://download.mycrypto.com) going forward.",
     "DONT_HAVE_WALLET_PROMPT": "Don’t have a wallet?",
     "DL_WALLET_WARNING_1": "**Don't lose it!** It can't be recovered if you lose it.",
     "DL_WALLET_WARNING_2": "**Don't share it!** Your funds will be stolen if you use this file on a malicious site.",