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)),
};
};