m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-25 11:28:51 +01:00
Code

UX: Multichain: Focus on test networks when setting is flipped on (#18996)

Browse Source
This commit is contained in:
David Walsh 2023-05-04 15:52:57 -05:00 committed by GitHub
parent 2c9306d8ed
commit 5793dd0193
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
ui/components/multichain/network-list-menu/network-list-menu.js
View File

@ -1,4 +1,4 @@
import React, { useContext } from 'react'; import React, { useContext, useEffect, useRef } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import { useHistory } from 'react-router-dom'; import { useHistory } from 'react-router-dom';
@ -48,10 +48,21 @@ export const NetworkListMenu = ({ onClose }) => {
const environmentType = getEnvironmentType(); const environmentType = getEnvironmentType();
const isFullScreen = environmentType === ENVIRONMENT_TYPE_FULLSCREEN; const isFullScreen = environmentType === ENVIRONMENT_TYPE_FULLSCREEN;
const showTestNetworksRef = useRef(showTestNetworks);
const networkListRef = useRef(null);
useEffect(() => {
if (showTestNetworks && !showTestNetworksRef.current) {
// Scroll to the bottom of the list
networkListRef.current.lastChild.scrollIntoView();
}
showTestNetworksRef.current = showTestNetworks;
}, [showTestNetworks, showTestNetworksRef]);
return ( return (
<Popover onClose={onClose} centerTitle title={t('networkMenuHeading')}> <Popover onClose={onClose} centerTitle title={t('networkMenuHeading')}>
<> <>
<Box className="multichain-network-list-menu"> <Box className="multichain-network-list-menu" ref={networkListRef}>
{networks.map((network) => { {networks.map((network) => {
const isCurrentNetwork = currentChainId === network.chainId; const isCurrentNetwork = currentChainId === network.chainId;
const canDeleteNetwork = const canDeleteNetwork =