diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 2f7055d33..f6a9b7d5a 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -2696,6 +2696,12 @@ "usePhishingDetectionDescription": { "message": "Display a warning for phishing domains targeting Ethereum users" }, + "useTokenDetection": { + "message": "Use Token Detection" + }, + "useTokenDetectionDescription": { + "message": "We use third-party APIs to detect and display new tokens sent to your wallet. Turn this off if you don’t want MetaMask to pull data from those those services." + }, "usedByClients": { "message": "Used by a variety of different clients" }, diff --git a/ui/pages/settings/security-tab/security-tab.component.js b/ui/pages/settings/security-tab/security-tab.component.js index 8eab40ec2..5cb75f454 100644 --- a/ui/pages/settings/security-tab/security-tab.component.js +++ b/ui/pages/settings/security-tab/security-tab.component.js @@ -19,6 +19,8 @@ export default class SecurityTab extends PureComponent { setShowIncomingTransactionsFeatureFlag: PropTypes.func.isRequired, setUsePhishDetect: PropTypes.func.isRequired, usePhishDetect: PropTypes.bool.isRequired, + useTokenDetection: PropTypes.bool.isRequired, + setUseTokenDetection: PropTypes.func.isRequired, }; renderSeedWords() { @@ -141,6 +143,32 @@ export default class SecurityTab extends PureComponent { ); } + renderTokenDetectionToggle() { + const { t } = this.context; + const { useTokenDetection, setUseTokenDetection } = this.props; + + return ( +
+
+ {t('useTokenDetection')} +
+ {t('useTokenDetectionDescription')} +
+
+
+
+ setUseTokenDetection(!value)} + offLabel={t('off')} + onLabel={t('on')} + /> +
+
+
+ ); + } + render() { const { warning } = this.props; @@ -151,6 +179,7 @@ export default class SecurityTab extends PureComponent { {this.renderIncomingTransactionsOptIn()} {this.renderPhishingDetectionToggle()} {this.renderMetaMetricsOptIn()} + {this.renderTokenDetectionToggle()} ); } diff --git a/ui/pages/settings/security-tab/security-tab.container.js b/ui/pages/settings/security-tab/security-tab.container.js index e6060f45b..61c7e63ee 100644 --- a/ui/pages/settings/security-tab/security-tab.container.js +++ b/ui/pages/settings/security-tab/security-tab.container.js @@ -5,6 +5,7 @@ import { setFeatureFlag, setParticipateInMetaMetrics, setUsePhishDetect, + setUseTokenDetection, } from '../../../store/actions'; import SecurityTab from './security-tab.component'; @@ -17,6 +18,7 @@ const mapStateToProps = (state) => { featureFlags: { showIncomingTransactions } = {}, participateInMetaMetrics, usePhishDetect, + useTokenDetection, } = metamask; return { @@ -24,6 +26,7 @@ const mapStateToProps = (state) => { showIncomingTransactions, participateInMetaMetrics, usePhishDetect, + useTokenDetection, }; }; @@ -34,6 +37,7 @@ const mapDispatchToProps = (dispatch) => { setShowIncomingTransactionsFeatureFlag: (shouldShow) => dispatch(setFeatureFlag('showIncomingTransactions', shouldShow)), setUsePhishDetect: (val) => dispatch(setUsePhishDetect(val)), + setUseTokenDetection: (val) => dispatch(setUseTokenDetection(val)), }; };