mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 01:39:44 +01:00
Add snaps search (#14100)
* added snaps routes * changed settings search icons to font-awesome * removed manual input of id * added snap list to search * removed console.logs and changed settingsRef to an array to work with settings search helper functions * lint fixes * updated tests * test fix * fixed util function * renamed vars * fixed spelling * deps fix
This commit is contained in:
Hassan Malik
GitHub
parent
656fd276c0
commit
f192929a04
@ -8,15 +8,32 @@ import {
|
||||
NETWORKS_ROUTE,
|
||||
CONTACT_LIST_ROUTE,
|
||||
EXPERIMENTAL_ROUTE,
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
SNAPS_LIST_ROUTE,
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
} from '../constants/routes';
|
||||
|
||||
function showHideSettings(t, settings) {
|
||||
if (!process.env.COLLECTIBLES_V1) {
|
||||
return settings.filter(
|
||||
(e) =>
|
||||
e.section !== t('enableOpenSeaAPI') &&
|
||||
e.section !== t('useCollectibleDetection'),
|
||||
);
|
||||
if (process.env.COLLECTIBLES_V1) {
|
||||
return [
|
||||
...settings,
|
||||
{
|
||||
tab: t('experimental'),
|
||||
section: t('enableOpenSeaAPI'),
|
||||
description: t('enableOpenSeaAPIDescription'),
|
||||
route: `${EXPERIMENTAL_ROUTE}#opensea-api`,
|
||||
icon: 'fa fa-flask',
|
||||
id: settings.length + 1,
|
||||
},
|
||||
{
|
||||
tab: t('experimental'),
|
||||
section: t('useCollectibleDetection'),
|
||||
description: t('useCollectibleDetectionDescription'),
|
||||
route: `${EXPERIMENTAL_ROUTE}#autodetect-nfts`,
|
||||
icon: 'fa fa-flask',
|
||||
id: settings.length + 2,
|
||||
},
|
||||
];
|
||||
}
|
||||
return settings;
|
||||
}
|
||||
@ -28,297 +45,254 @@ export function getSettingsRoutes(t) {
|
||||
section: t('currencyConversion'),
|
||||
description: '',
|
||||
route: `${GENERAL_ROUTE}#currency-conversion`,
|
||||
image: 'general-icon.svg',
|
||||
id: 1,
|
||||
icon: 'fa fa-cog',
|
||||
},
|
||||
{
|
||||
tab: t('general'),
|
||||
section: t('primaryCurrencySetting'),
|
||||
description: t('primaryCurrencySettingDescription'),
|
||||
route: `${GENERAL_ROUTE}#primary-currency`,
|
||||
image: 'general-icon.svg',
|
||||
id: 2,
|
||||
icon: 'fa fa-cog',
|
||||
},
|
||||
{
|
||||
tab: t('general'),
|
||||
section: t('currentLanguage'),
|
||||
description: '',
|
||||
route: `${GENERAL_ROUTE}#current-language`,
|
||||
image: 'general-icon.svg',
|
||||
id: 3,
|
||||
icon: 'fa fa-cog',
|
||||
},
|
||||
{
|
||||
tab: t('general'),
|
||||
section: t('accountIdenticon'),
|
||||
description: '',
|
||||
route: `${GENERAL_ROUTE}#account-identicon`,
|
||||
image: 'general-icon.svg',
|
||||
id: 4,
|
||||
icon: 'fa fa-cog',
|
||||
},
|
||||
{
|
||||
tab: t('general'),
|
||||
section: t('hideZeroBalanceTokens'),
|
||||
description: '',
|
||||
route: `${GENERAL_ROUTE}#zero-balancetokens`,
|
||||
image: 'general-icon.svg',
|
||||
id: 5,
|
||||
icon: 'fa fa-cog',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('stateLogs'),
|
||||
description: t('stateLogsDescription'),
|
||||
route: `${ADVANCED_ROUTE}#state-logs`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 6,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('syncWithMobile'),
|
||||
description: '',
|
||||
route: `${ADVANCED_ROUTE}#sync-withmobile`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 7,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('resetAccount'),
|
||||
description: t('resetAccountDescription'),
|
||||
route: `${ADVANCED_ROUTE}#reset-account`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 8,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('showAdvancedGasInline'),
|
||||
description: t('showAdvancedGasInlineDescription'),
|
||||
route: `${ADVANCED_ROUTE}#advanced-gascontrols`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 9,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('showHexData'),
|
||||
description: t('showHexDataDescription'),
|
||||
route: `${ADVANCED_ROUTE}#show-hexdata`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 10,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('showFiatConversionInTestnets'),
|
||||
description: t('showFiatConversionInTestnetsDescription'),
|
||||
route: `${ADVANCED_ROUTE}#conversion-testnetworks`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 11,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('showTestnetNetworks'),
|
||||
description: t('showTestnetNetworksDescription'),
|
||||
route: `${ADVANCED_ROUTE}#show-testnets`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 12,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('nonceField'),
|
||||
description: t('nonceFieldDescription'),
|
||||
route: `${ADVANCED_ROUTE}#customize-nonce`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 13,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('autoLockTimeLimit'),
|
||||
description: t('autoLockTimeLimitDescription'),
|
||||
route: `${ADVANCED_ROUTE}#autolock-timer`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 14,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('syncWithThreeBox'),
|
||||
description: t('syncWithThreeBoxDescription'),
|
||||
route: `${ADVANCED_ROUTE}#sync-with3box`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 15,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('ipfsGateway'),
|
||||
description: t('ipfsGatewayDescription'),
|
||||
route: `${ADVANCED_ROUTE}#ipfs-gateway`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 16,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('preferredLedgerConnectionType'),
|
||||
description: t('preferredLedgerConnectionType'),
|
||||
route: `${ADVANCED_ROUTE}#ledger-connection`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 17,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('advanced'),
|
||||
section: t('dismissReminderField'),
|
||||
description: t('dismissReminderDescriptionField'),
|
||||
route: `${ADVANCED_ROUTE}#dimiss-secretrecovery`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 18,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
{
|
||||
tab: t('contacts'),
|
||||
section: t('contacts'),
|
||||
description: t('contacts'),
|
||||
route: CONTACT_LIST_ROUTE,
|
||||
image: 'contacts-icon.svg',
|
||||
id: 19,
|
||||
icon: 'fa fa-address-book',
|
||||
},
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
{
|
||||
tab: t('snaps'),
|
||||
section: t('snaps'),
|
||||
description: t('snaps'),
|
||||
route: SNAPS_LIST_ROUTE,
|
||||
icon: 'fa fa-flask',
|
||||
},
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
{
|
||||
tab: t('securityAndPrivacy'),
|
||||
section: t('revealSeedWords'),
|
||||
description: t('revealSeedWords'),
|
||||
route: `${SECURITY_ROUTE}#reveal-secretrecovery`,
|
||||
image: 'security-icon.svg',
|
||||
id: 20,
|
||||
icon: 'fa fa-lock',
|
||||
},
|
||||
{
|
||||
tab: t('securityAndPrivacy'),
|
||||
section: t('showIncomingTransactions'),
|
||||
description: t('showIncomingTransactionsDescription'),
|
||||
route: `${SECURITY_ROUTE}#incoming-transaction`,
|
||||
image: 'security-icon.svg',
|
||||
id: 21,
|
||||
icon: 'fa fa-lock',
|
||||
},
|
||||
{
|
||||
tab: t('securityAndPrivacy'),
|
||||
section: t('usePhishingDetection'),
|
||||
description: t('usePhishingDetectionDescription'),
|
||||
route: `${SECURITY_ROUTE}#phishing-detection`,
|
||||
image: 'security-icon.svg',
|
||||
id: 22,
|
||||
icon: 'fa fa-lock',
|
||||
},
|
||||
{
|
||||
tab: t('securityAndPrivacy'),
|
||||
section: t('participateInMetaMetrics'),
|
||||
description: t('participateInMetaMetricsDescription'),
|
||||
route: `${SECURITY_ROUTE}#metrametrics`,
|
||||
image: 'security-icon.svg',
|
||||
id: 23,
|
||||
icon: 'fa fa-lock',
|
||||
},
|
||||
{
|
||||
tab: t('alerts'),
|
||||
section: t('alertSettingsUnconnectedAccount'),
|
||||
description: t('alertSettingsUnconnectedAccount'),
|
||||
route: `${ALERTS_ROUTE}#unconnected-account`,
|
||||
image: 'alerts-icon.svg',
|
||||
id: 24,
|
||||
icon: 'fa fa-bell',
|
||||
},
|
||||
{
|
||||
tab: t('alerts'),
|
||||
section: t('alertSettingsWeb3ShimUsage'),
|
||||
description: t('alertSettingsWeb3ShimUsage'),
|
||||
route: `${ALERTS_ROUTE}#web3-shimusage`,
|
||||
image: 'alerts-icon.svg',
|
||||
id: 25,
|
||||
icon: 'fa fa-bell',
|
||||
},
|
||||
{
|
||||
tab: t('networks'),
|
||||
section: t('mainnet'),
|
||||
description: t('mainnet'),
|
||||
route: `${NETWORKS_ROUTE}#networks-mainnet`,
|
||||
image: 'network-icon.svg',
|
||||
id: 26,
|
||||
icon: 'fa fa-plug',
|
||||
},
|
||||
{
|
||||
tab: t('networks'),
|
||||
section: t('ropsten'),
|
||||
description: t('ropsten'),
|
||||
route: `${NETWORKS_ROUTE}#networks-ropsten`,
|
||||
image: 'network-icon.svg',
|
||||
id: 27,
|
||||
icon: 'fa fa-plug',
|
||||
},
|
||||
{
|
||||
tab: t('networks'),
|
||||
section: t('rinkeby'),
|
||||
description: t('rinkeby'),
|
||||
route: `${NETWORKS_ROUTE}#networks-rinkeby`,
|
||||
image: 'network-icon.svg',
|
||||
id: 28,
|
||||
icon: 'fa fa-plug',
|
||||
},
|
||||
{
|
||||
tab: t('networks'),
|
||||
section: t('goerli'),
|
||||
description: t('goerli'),
|
||||
route: `${NETWORKS_ROUTE}#networks-goerli`,
|
||||
image: 'network-icon.svg',
|
||||
id: 29,
|
||||
icon: 'fa fa-plug',
|
||||
},
|
||||
{
|
||||
tab: t('networks'),
|
||||
section: t('kovan'),
|
||||
description: t('kovan'),
|
||||
route: `${NETWORKS_ROUTE}#networtks-kovan`,
|
||||
image: 'network-icon.svg',
|
||||
id: 30,
|
||||
route: `${NETWORKS_ROUTE}#networks-kovan`,
|
||||
icon: 'fa fa-plug',
|
||||
},
|
||||
{
|
||||
tab: t('networks'),
|
||||
section: t('localhost'),
|
||||
description: t('localhost'),
|
||||
route: `${NETWORKS_ROUTE}#network-localhost`,
|
||||
image: 'network-icon.svg',
|
||||
id: 31,
|
||||
route: `${NETWORKS_ROUTE}#networks-localhost`,
|
||||
icon: 'fa fa-plug',
|
||||
},
|
||||
{
|
||||
tab: t('experimental'),
|
||||
section: t('enableOpenSeaAPI'),
|
||||
description: t('enableOpenSeaAPIDescription'),
|
||||
route: `${EXPERIMENTAL_ROUTE}#opensea-api`,
|
||||
image: 'experimental-icon.svg',
|
||||
id: 33,
|
||||
},
|
||||
{
|
||||
tab: t('experimental'),
|
||||
section: t('useCollectibleDetection'),
|
||||
description: t('useCollectibleDetectionDescription'),
|
||||
route: `${EXPERIMENTAL_ROUTE}#autodetect-nfts`,
|
||||
image: 'experimental-icon.svg',
|
||||
id: 34,
|
||||
},
|
||||
|
||||
{
|
||||
tab: t('about'),
|
||||
section: t('metamaskVersion'),
|
||||
description: t('builtAroundTheWorld'),
|
||||
route: `${ABOUT_US_ROUTE}#version`,
|
||||
image: 'info-icon.svg',
|
||||
id: 35,
|
||||
icon: 'fa fa-info-circle',
|
||||
},
|
||||
{
|
||||
tab: t('about'),
|
||||
section: t('links'),
|
||||
description: '',
|
||||
route: `${ABOUT_US_ROUTE}#links`,
|
||||
image: 'info-icon.svg',
|
||||
id: 36,
|
||||
icon: 'fa fa-info-circle',
|
||||
},
|
||||
{
|
||||
tab: t('about'),
|
||||
section: t('privacyMsg'),
|
||||
description: t('privacyMsg'),
|
||||
route: `${ABOUT_US_ROUTE}#privacy-policy`,
|
||||
image: 'info-icon.svg',
|
||||
id: 37,
|
||||
icon: 'fa fa-info-circle',
|
||||
},
|
||||
{
|
||||
tab: t('about'),
|
||||
section: t('terms'),
|
||||
description: t('terms'),
|
||||
route: `${ABOUT_US_ROUTE}#terms`,
|
||||
image: 'info-icon.svg',
|
||||
id: 38,
|
||||
icon: 'fa fa-info-circle',
|
||||
},
|
||||
|
||||
{
|
||||
@ -326,8 +300,7 @@ export function getSettingsRoutes(t) {
|
||||
section: t('attributions'),
|
||||
description: t('attributions'),
|
||||
route: `${ABOUT_US_ROUTE}#attributions`,
|
||||
image: 'info-icon.svg',
|
||||
id: 39,
|
||||
icon: 'fa fa-info-circle',
|
||||
},
|
||||
|
||||
{
|
||||
@ -335,8 +308,7 @@ export function getSettingsRoutes(t) {
|
||||
section: t('supportCenter'),
|
||||
description: t('supportCenter'),
|
||||
route: `${ABOUT_US_ROUTE}#supportcenter`,
|
||||
image: 'info-icon.svg',
|
||||
id: 40,
|
||||
icon: 'fa fa-info-circle',
|
||||
},
|
||||
|
||||
{
|
||||
@ -344,8 +316,7 @@ export function getSettingsRoutes(t) {
|
||||
section: t('visitWebSite'),
|
||||
description: t('visitWebSite'),
|
||||
route: `${ABOUT_US_ROUTE}#visitwebsite`,
|
||||
image: 'info-icon.svg',
|
||||
id: 41,
|
||||
icon: 'fa fa-info-circle',
|
||||
},
|
||||
|
||||
{
|
||||
@ -353,11 +324,9 @@ export function getSettingsRoutes(t) {
|
||||
section: t('contactUs'),
|
||||
description: t('contactUs'),
|
||||
route: `${ABOUT_US_ROUTE}#contactus`,
|
||||
image: 'info-icon.svg',
|
||||
id: 42,
|
||||
icon: 'fa fa-info-circle',
|
||||
},
|
||||
];
|
||||
|
||||
if (process.env.TOKEN_DETECTION_V2) {
|
||||
settingsRoutesList = [
|
||||
...settingsRoutesList,
|
||||
@ -367,8 +336,7 @@ export function getSettingsRoutes(t) {
|
||||
section: t('tokenDetection'),
|
||||
description: t('tokenDetectionToggleDescription'),
|
||||
route: `${ADVANCED_ROUTE}#token-description`,
|
||||
image: 'advanced-icon.svg',
|
||||
id: 32,
|
||||
icon: 'fas fa-sliders-h',
|
||||
},
|
||||
];
|
||||
} else {
|
||||
@ -380,12 +348,13 @@ export function getSettingsRoutes(t) {
|
||||
section: t('useTokenDetection'),
|
||||
description: t('useTokenDetectionDescription'),
|
||||
route: `${EXPERIMENTAL_ROUTE}#token-description`,
|
||||
image: 'experimental-icon.svg',
|
||||
id: 32,
|
||||
icon: 'fa fa-flask',
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
for (let i = 0; i < settingsRoutesList.length; i++) {
|
||||
settingsRoutesList[i].id = i + 1;
|
||||
}
|
||||
// TODO: write to json file?
|
||||
return showHideSettings(t, settingsRoutesList);
|
||||
}
|
||||
@ -403,7 +372,6 @@ export function handleSettingsRefs(t, tabName, settingsRefs) {
|
||||
const settingsRefsIndex = settingsSearchJsonFiltered.findIndex(
|
||||
(s) => s.route.substring(1) === window.location.hash.substring(1),
|
||||
);
|
||||
|
||||
if (
|
||||
settingsRefsIndex !== -1 &&
|
||||
settingsRefs[settingsRefsIndex].current !== null
|
||||
|
||||
@ -123,7 +123,7 @@ const t = (key) => {
|
||||
case 'enableOpenSeaAPI':
|
||||
return 'Enable OpenSea API';
|
||||
case 'enableOpenSeaAPIDescription':
|
||||
return 'Use OpenSea API to fetch NFT data.NFT auto - detection relies on OpenSea API, and will not be available when this is turned off.';
|
||||
return "Use OpenSea's API to fetch NFT data. NFT auto-detection relies on OpenSea's API, and will not be available when this is turned off.";
|
||||
case 'useCollectibleDetection':
|
||||
return 'Autodetect NFTs';
|
||||
case 'useCollectibleDetectionDescription':
|
||||
@ -148,7 +148,8 @@ const t = (key) => {
|
||||
return 'Visit our web site';
|
||||
case 'contactUs':
|
||||
return 'Contact us';
|
||||
|
||||
case 'snaps':
|
||||
return 'Snaps';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
@ -157,11 +158,10 @@ const t = (key) => {
|
||||
describe('Settings Search Utils', () => {
|
||||
describe('getSettingsRoutes', () => {
|
||||
it('should get all settings', () => {
|
||||
const settingsListExcepted = [
|
||||
const expectedSettingsList = [
|
||||
{
|
||||
description: '',
|
||||
id: 1,
|
||||
image: 'general-icon.svg',
|
||||
icon: 'fa fa-cog',
|
||||
route: '/settings/general#currency-conversion',
|
||||
section: 'Currency Conversion',
|
||||
tab: 'General',
|
||||
@ -169,32 +169,28 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Select native to prioritize displaying values in the native currency of the chain (e.g. ETH). Select Fiat to prioritize displaying values in your selected fiat currency.',
|
||||
id: 2,
|
||||
image: 'general-icon.svg',
|
||||
icon: 'fa fa-cog',
|
||||
route: '/settings/general#primary-currency',
|
||||
section: 'Primary Currenc',
|
||||
tab: 'General',
|
||||
},
|
||||
{
|
||||
description: '',
|
||||
id: 3,
|
||||
image: 'general-icon.svg',
|
||||
icon: 'fa fa-cog',
|
||||
route: '/settings/general#current-language',
|
||||
section: 'Current Language',
|
||||
tab: 'General',
|
||||
},
|
||||
{
|
||||
description: '',
|
||||
id: 4,
|
||||
image: 'general-icon.svg',
|
||||
icon: 'fa fa-cog',
|
||||
route: '/settings/general#account-identicon',
|
||||
section: 'Current Language"',
|
||||
tab: 'General',
|
||||
},
|
||||
{
|
||||
description: '',
|
||||
id: 5,
|
||||
image: 'general-icon.svg',
|
||||
icon: 'fa fa-cog',
|
||||
route: '/settings/general#zero-balancetokens',
|
||||
section: 'Hide Tokens Without Balance',
|
||||
tab: 'General',
|
||||
@ -202,16 +198,14 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'State logs contain your public account addresses and sent transactions.',
|
||||
id: 6,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#state-logs',
|
||||
section: 'State Logs',
|
||||
tab: 'Advanced',
|
||||
},
|
||||
{
|
||||
description: '',
|
||||
id: 7,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#sync-withmobile',
|
||||
section: 'Sync with mobile',
|
||||
tab: 'Advanced',
|
||||
@ -219,8 +213,7 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Resetting your account will clear your transaction history. This will not change the balances in your accounts or require you to re-enter your Secret Recovery Phrase.',
|
||||
id: 8,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#reset-account',
|
||||
section: 'Reset Account',
|
||||
tab: 'Advanced',
|
||||
@ -228,8 +221,7 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Select this to show gas price and limit controls directly on the send and confirm screens.',
|
||||
id: 9,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#advanced-gascontrols',
|
||||
section: 'Advanced gas controls',
|
||||
tab: 'Advanced',
|
||||
@ -237,24 +229,21 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Select this to show the hex data field on the send screen',
|
||||
id: 10,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#show-hexdata',
|
||||
section: 'Show Hex Data',
|
||||
tab: 'Advanced',
|
||||
},
|
||||
{
|
||||
description: 'Select this to show fiat conversion on test network',
|
||||
id: 11,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#conversion-testnetworks',
|
||||
section: 'Show Conversion on test networks',
|
||||
tab: 'Advanced',
|
||||
},
|
||||
{
|
||||
description: 'Select this to show test networks in network list',
|
||||
id: 12,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#show-testnets',
|
||||
section: 'Show test networks',
|
||||
tab: 'Advanced',
|
||||
@ -262,8 +251,7 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Turn this on to change the nonce (transaction number) on confirmation screens. This is an advanced feature, use cautiously.',
|
||||
id: 13,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#customize-nonce',
|
||||
section: 'Customize transaction nonce',
|
||||
tab: 'Advanced',
|
||||
@ -271,8 +259,7 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Set the idle time in minutes before MetaMask will become locked.',
|
||||
id: 14,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#autolock-timer',
|
||||
section: 'Auto-Lock Timer (minutes)',
|
||||
tab: 'Advanced',
|
||||
@ -280,8 +267,7 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Turn on to have your settings backed up with 3Box. This feature is currently experimental; use at your own risk.',
|
||||
id: 15,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#sync-with3box',
|
||||
section: 'Sync data with 3Box (experimental)',
|
||||
tab: 'Advanced',
|
||||
@ -289,16 +275,14 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Enter the URL of the IPFS CID gateway to use for ENS content resolution.',
|
||||
id: 16,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#ipfs-gateway',
|
||||
section: 'IPFS Gateway',
|
||||
tab: 'Advanced',
|
||||
},
|
||||
{
|
||||
description: 'Preferred Ledger Connection Type',
|
||||
id: 17,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#ledger-connection',
|
||||
section: 'Preferred Ledger Connection Type',
|
||||
tab: 'Advanced',
|
||||
@ -306,24 +290,30 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Turn this on to dismiss the Secret Recovery Phrase backup reminder message. We highly recommend that you back up your Secret Recovery Phrase to avoid loss of funds',
|
||||
id: 18,
|
||||
image: 'advanced-icon.svg',
|
||||
icon: 'fas fa-sliders-h',
|
||||
route: '/settings/advanced#dimiss-secretrecovery',
|
||||
section: 'Dismiss Secret Recovery Phrase backup reminder',
|
||||
tab: 'Advanced',
|
||||
},
|
||||
{
|
||||
description: '',
|
||||
id: 19,
|
||||
image: 'contacts-icon.svg',
|
||||
icon: 'fa fa-address-book',
|
||||
route: '/settings/contact-list',
|
||||
section: '',
|
||||
tab: '',
|
||||
},
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
{
|
||||
description: 'Snaps',
|
||||
icon: 'fa fa-flask',
|
||||
route: '/settings/snaps-list',
|
||||
section: 'Snaps',
|
||||
tab: 'Snaps',
|
||||
},
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
{
|
||||
description: 'Reveal Secret Recovery Phrase',
|
||||
id: 20,
|
||||
image: 'security-icon.svg',
|
||||
icon: 'fa fa-lock',
|
||||
route: '/settings/security#reveal-secretrecovery',
|
||||
section: 'Reveal Secret Recovery Phrase',
|
||||
tab: 'Security & Privacy',
|
||||
@ -331,8 +321,7 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Select this to use Etherscan to show incoming transactions in the transactions list',
|
||||
id: 21,
|
||||
image: 'security-icon.svg',
|
||||
icon: 'fa fa-lock',
|
||||
route: '/settings/security#incoming-transaction',
|
||||
section: 'Show Incoming Transactions',
|
||||
tab: 'Security & Privacy',
|
||||
@ -340,8 +329,7 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Display a warning for phishing domains targeting Ethereum users',
|
||||
id: 22,
|
||||
image: 'security-icon.svg',
|
||||
icon: 'fa fa-lock',
|
||||
route: '/settings/security#phishing-detection',
|
||||
section: 'Use Phishing Detection',
|
||||
tab: 'Security & Privacy',
|
||||
@ -349,8 +337,7 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Participate in MetaMetrics to help us make MetaMask better',
|
||||
id: 23,
|
||||
image: 'security-icon.svg',
|
||||
icon: 'fa fa-lock',
|
||||
route: '/settings/security#metrametrics',
|
||||
section: 'Participate in MetaMetrics',
|
||||
tab: 'Security & Privacy',
|
||||
@ -358,8 +345,7 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'Browsing a website with an unconnected account selected',
|
||||
id: 24,
|
||||
image: 'alerts-icon.svg',
|
||||
icon: 'fa fa-bell',
|
||||
route: '/settings/alerts#unconnected-account',
|
||||
section: 'Browsing a website with an unconnected account selected',
|
||||
tab: 'Alerts',
|
||||
@ -367,120 +353,105 @@ describe('Settings Search Utils', () => {
|
||||
{
|
||||
description:
|
||||
'When a website tries to use the removed window.web3 API',
|
||||
id: 25,
|
||||
image: 'alerts-icon.svg',
|
||||
icon: 'fa fa-bell',
|
||||
route: '/settings/alerts#web3-shimusage',
|
||||
section: 'When a website tries to use the removed window.web3 API',
|
||||
tab: 'Alerts',
|
||||
},
|
||||
{
|
||||
description: 'Ethereum Mainnet',
|
||||
id: 26,
|
||||
image: 'network-icon.svg',
|
||||
icon: 'fa fa-plug',
|
||||
route: '/settings/networks#networks-mainnet',
|
||||
section: 'Ethereum Mainnet',
|
||||
tab: 'Networks',
|
||||
},
|
||||
{
|
||||
description: 'Ropsten Test Network',
|
||||
id: 27,
|
||||
image: 'network-icon.svg',
|
||||
icon: 'fa fa-plug',
|
||||
route: '/settings/networks#networks-ropsten',
|
||||
section: 'Ropsten Test Network',
|
||||
tab: 'Networks',
|
||||
},
|
||||
{
|
||||
description: 'Rinkeby Test Network',
|
||||
id: 28,
|
||||
image: 'network-icon.svg',
|
||||
icon: 'fa fa-plug',
|
||||
route: '/settings/networks#networks-rinkeby',
|
||||
section: 'Rinkeby Test Network',
|
||||
tab: 'Networks',
|
||||
},
|
||||
{
|
||||
description: 'Goerli Test Network',
|
||||
id: 29,
|
||||
image: 'network-icon.svg',
|
||||
icon: 'fa fa-plug',
|
||||
route: '/settings/networks#networks-goerli',
|
||||
section: 'Goerli Test Network',
|
||||
tab: 'Networks',
|
||||
},
|
||||
{
|
||||
description: 'Kovan Test Network',
|
||||
id: 30,
|
||||
image: 'network-icon.svg',
|
||||
route: '/settings/networks#networtks-kovan',
|
||||
icon: 'fa fa-plug',
|
||||
route: '/settings/networks#networks-kovan',
|
||||
section: 'Kovan Test Network',
|
||||
tab: 'Networks',
|
||||
},
|
||||
{
|
||||
description: 'Localhost 8545',
|
||||
id: 31,
|
||||
image: 'network-icon.svg',
|
||||
route: '/settings/networks#network-localhost',
|
||||
icon: 'fa fa-plug',
|
||||
route: '/settings/networks#networks-localhost',
|
||||
section: 'Localhost 8545',
|
||||
tab: 'Networks',
|
||||
},
|
||||
{
|
||||
description: 'MetaMask is designed and built around the world.',
|
||||
id: 35,
|
||||
image: 'info-icon.svg',
|
||||
icon: 'fa fa-info-circle',
|
||||
route: '/settings/about-us#version',
|
||||
section: 'MetaMask Version',
|
||||
tab: 'About',
|
||||
},
|
||||
{
|
||||
description: '',
|
||||
id: 36,
|
||||
image: 'info-icon.svg',
|
||||
icon: 'fa fa-info-circle',
|
||||
route: '/settings/about-us#links',
|
||||
section: 'Links',
|
||||
tab: 'About',
|
||||
},
|
||||
{
|
||||
description: 'Privacy Policy',
|
||||
id: 37,
|
||||
image: 'info-icon.svg',
|
||||
icon: 'fa fa-info-circle',
|
||||
route: '/settings/about-us#privacy-policy',
|
||||
section: 'Privacy Policy',
|
||||
tab: 'About',
|
||||
},
|
||||
{
|
||||
description: 'Terms of Use',
|
||||
id: 38,
|
||||
image: 'info-icon.svg',
|
||||
icon: 'fa fa-info-circle',
|
||||
route: '/settings/about-us#terms',
|
||||
section: 'Terms of Use',
|
||||
tab: 'About',
|
||||
},
|
||||
{
|
||||
description: 'Attributions',
|
||||
id: 39,
|
||||
image: 'info-icon.svg',
|
||||
icon: 'fa fa-info-circle',
|
||||
route: '/settings/about-us#attributions',
|
||||
section: 'Attributions',
|
||||
tab: 'About',
|
||||
},
|
||||
{
|
||||
description: 'Visit our Support Center',
|
||||
id: 40,
|
||||
image: 'info-icon.svg',
|
||||
icon: 'fa fa-info-circle',
|
||||
route: '/settings/about-us#supportcenter',
|
||||
section: 'Visit our Support Center',
|
||||
tab: 'About',
|
||||
},
|
||||
{
|
||||
description: 'Visit our web site',
|
||||
id: 41,
|
||||
image: 'info-icon.svg',
|
||||
icon: 'fa fa-info-circle',
|
||||
route: '/settings/about-us#visitwebsite',
|
||||
section: 'Visit our web site',
|
||||
tab: 'About',
|
||||
},
|
||||
{
|
||||
description: 'Contact us',
|
||||
id: 42,
|
||||
image: 'info-icon.svg',
|
||||
icon: 'fa fa-info-circle',
|
||||
route: '/settings/about-us#contactus',
|
||||
section: 'Contact us',
|
||||
tab: 'About',
|
||||
@ -489,18 +460,20 @@ describe('Settings Search Utils', () => {
|
||||
/** TODO: Remove during TOKEN_DETECTION_V2 feature flag clean up */
|
||||
description:
|
||||
'We use third-party APIs to detect and display new tokens sent to your wallet. Turn off if you don’t want MetaMask to pull data from those services.',
|
||||
id: 32,
|
||||
image: 'experimental-icon.svg',
|
||||
icon: 'fa fa-flask',
|
||||
route: '/settings/experimental#token-description',
|
||||
section: 'Use Token Detection',
|
||||
tab: 'Experimental',
|
||||
},
|
||||
];
|
||||
expect(getSettingsRoutes(t)).toStrictEqual(settingsListExcepted);
|
||||
for (let i = 0; i < expectedSettingsList.length; i++) {
|
||||
expectedSettingsList[i].id = i + 1;
|
||||
}
|
||||
expect(getSettingsRoutes(t)).toStrictEqual(expectedSettingsList);
|
||||
});
|
||||
|
||||
it('should not get all settings', () => {
|
||||
const settingsListExcepted = [
|
||||
const expectedSettingsList = [
|
||||
{
|
||||
description: '',
|
||||
image: 'general-icon.svg',
|
||||
@ -516,7 +489,7 @@ describe('Settings Search Utils', () => {
|
||||
tab: 'About',
|
||||
},
|
||||
];
|
||||
expect(getSettingsRoutes(t)).not.toStrictEqual(settingsListExcepted);
|
||||
expect(getSettingsRoutes(t)).not.toStrictEqual(expectedSettingsList);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { useMemo, useEffect } from 'react';
|
||||
import { useDispatch, useSelector } from 'react-redux';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import SnapSettingsCard from '../../../../components/app/flask/snap-settings-card';
|
||||
@ -15,12 +15,14 @@ import Box from '../../../../components/ui/box';
|
||||
import { SNAPS_VIEW_ROUTE } from '../../../../helpers/constants/routes';
|
||||
import { disableSnap, enableSnap } from '../../../../store/actions';
|
||||
import { getSnaps } from '../../../../selectors';
|
||||
import { handleSettingsRefs } from '../../../../helpers/utils/settings-search';
|
||||
|
||||
const SnapListTab = () => {
|
||||
const t = useI18nContext();
|
||||
const history = useHistory();
|
||||
const dispatch = useDispatch();
|
||||
const snaps = useSelector(getSnaps);
|
||||
const settingsRef = useMemo(() => [React.createRef()], []);
|
||||
const onClick = (snap) => {
|
||||
const route = `${SNAPS_VIEW_ROUTE}/${window.btoa(
|
||||
unescape(encodeURIComponent(snap.id)),
|
||||
@ -35,8 +37,12 @@ const SnapListTab = () => {
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
handleSettingsRefs(t, t('snaps'), settingsRef);
|
||||
}, [t, settingsRef]);
|
||||
|
||||
return (
|
||||
<div className="snap-list-tab">
|
||||
<div className="snap-list-tab" ref={settingsRef}>
|
||||
{Object.entries(snaps).length ? (
|
||||
<div className="snap-list-tab__body">
|
||||
<Box display="flex" flexDirection={FLEX_DIRECTION.COLUMN}>
|
||||
|
||||
@ -13,17 +13,19 @@ export default function SettingsSearchList({ results, onClickSetting }) {
|
||||
return (
|
||||
<div className="settings-page__header__search__list">
|
||||
{results.slice(0, 5).map((result) => {
|
||||
const { image, tab, section, id } = result;
|
||||
const { icon, tab, section, id } = result;
|
||||
return (
|
||||
Boolean(image || tab || section) && (
|
||||
Boolean(icon || tab || section) && (
|
||||
<div key={`settings_${id}`}>
|
||||
<div
|
||||
className="settings-page__header__search__list__item"
|
||||
onClick={() => onClickSetting(result)}
|
||||
>
|
||||
<img
|
||||
className="settings-page__header__search__list__item__icon"
|
||||
src={`./images/${image}`}
|
||||
<i
|
||||
className={classnames(
|
||||
'settings-page__header__search__list__item__icon',
|
||||
icon,
|
||||
)}
|
||||
/>
|
||||
|
||||
<span
|
||||
|
||||
Loading…
Reference in New Issue
Block a user