1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 09:57:02 +01:00

Fix for randomly resets of updated values in network edit form (#14370)

Code refactor

Fix test

Fix warning jank

Rerunning e2e tests

Co-authored-by: Alex Donesky <adonesky@gmail.com>
Co-authored-by: Ariella Vu <20778143+digiwand@users.noreply.github.com>
This commit is contained in:
amerkadicE 2022-08-17 19:13:03 +02:00 committed by GitHub
parent d09bdbe3df
commit f074c243d8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -12,6 +12,7 @@ import validUrl from 'valid-url';
import log from 'loglevel';
import classnames from 'classnames';
import { addHexPrefix } from 'ethereumjs-util';
import { isEqual } from 'lodash';
import { useI18nContext } from '../../../../hooks/useI18nContext';
import {
isPrefixedFormattedHexString,
@ -104,6 +105,8 @@ const NetworksForm = ({
const chainIdMatchesFeaturedRPC = FEATURED_RPCS.some(
(featuredRpc) => Number(featuredRpc.chainId) === Number(chainId),
);
const [isEditing, setIsEditing] = useState(Boolean(addNewNetwork));
const [previousNetwork, setPreviousNetwork] = useState(selectedNetwork);
const resetForm = useCallback(() => {
setNetworkName(selectedNetworkName || '');
@ -114,6 +117,8 @@ const NetworksForm = ({
setErrors({});
setWarnings({});
setIsSubmitting(false);
setIsEditing(false);
setPreviousNetwork(selectedNetwork);
}, [selectedNetwork, selectedNetworkName]);
const stateIsUnchanged = () => {
@ -149,11 +154,12 @@ const NetworksForm = ({
setErrors({});
setIsSubmitting(false);
} else if (
prevNetworkName.current !== selectedNetworkName ||
prevRpcUrl.current !== selectedNetwork.rpcUrl ||
prevChainId.current !== selectedNetwork.chainId ||
prevTicker.current !== selectedNetwork.ticker ||
prevBlockExplorerUrl.current !== selectedNetwork.blockExplorerUrl
(prevNetworkName.current !== selectedNetworkName ||
prevRpcUrl.current !== selectedNetwork.rpcUrl ||
prevChainId.current !== selectedNetwork.chainId ||
prevTicker.current !== selectedNetwork.ticker ||
prevBlockExplorerUrl.current !== selectedNetwork.blockExplorerUrl) &&
(!isEditing || !isEqual(selectedNetwork, previousNetwork))
) {
resetForm(selectedNetwork);
}
@ -161,14 +167,9 @@ const NetworksForm = ({
selectedNetwork,
selectedNetworkName,
addNewNetwork,
setNetworkName,
setRpcUrl,
setChainId,
setTicker,
setBlockExplorerUrl,
setErrors,
setIsSubmitting,
previousNetwork,
resetForm,
isEditing,
]);
useEffect(() => {
@ -607,14 +608,20 @@ const NetworksForm = ({
<FormField
autoFocus
error={errors.networkName?.msg || ''}
onChange={setNetworkName}
onChange={(value) => {
setIsEditing(true);
setNetworkName(value);
}}
titleText={t('networkName')}
value={networkName}
disabled={viewOnly}
/>
<FormField
error={errors.rpcUrl?.msg || ''}
onChange={setRpcUrl}
onChange={(value) => {
setIsEditing(true);
setRpcUrl(value);
}}
titleText={t('rpcUrl')}
value={
rpcUrl?.includes(`/v3/${infuraProjectId}`)
@ -625,7 +632,10 @@ const NetworksForm = ({
/>
<FormField
warning={warnings.chainId?.msg || ''}
onChange={setChainId}
onChange={(value) => {
setIsEditing(true);
setChainId(value);
}}
titleText={t('chainId')}
value={chainId}
disabled={viewOnly}
@ -633,14 +643,20 @@ const NetworksForm = ({
/>
<FormField
warning={warnings.ticker?.msg || ''}
onChange={setTicker}
onChange={(value) => {
setIsEditing(true);
setTicker(value);
}}
titleText={t('currencySymbol')}
value={ticker}
disabled={viewOnly}
/>
<FormField
error={errors.blockExplorerUrl?.msg || ''}
onChange={setBlockExplorerUrl}
onChange={(value) => {
setIsEditing(true);
setBlockExplorerUrl(value);
}}
titleText={t('blockExplorerUrl')}
titleUnit={t('optionalWithParanthesis')}
value={blockExplorerUrl}