From 72cc669ef68be3d692e62997dfe6dde0bfb691d2 Mon Sep 17 00:00:00 2001
From: David Walsh <davidwalsh83@gmail.com>
Date: Thu, 3 Aug 2023 09:20:03 -0500
Subject: [PATCH] Fix #20274 - Update locked network menu controls (#20277)

---
 .../network-list-menu/network-list-menu.js    |  9 +++++++--
 .../network-list-menu.test.js                 | 19 +++++++++++++++++++
 2 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/ui/components/multichain/network-list-menu/network-list-menu.js b/ui/components/multichain/network-list-menu/network-list-menu.js
index b3482358e..aa410abf8 100644
--- a/ui/components/multichain/network-list-menu/network-list-menu.js
+++ b/ui/components/multichain/network-list-menu/network-list-menu.js
@@ -74,6 +74,8 @@ export const NetworkListMenu = ({ onClose }) => {
 
   const lineaMainnetReleased = useSelector(isLineaMainnetNetworkReleased);
 
+  const isUnlocked = useSelector((state) => state.metamask.isUnlocked);
+
   const showSearch = nonTestNetworks.length > 3;
 
   useEffect(() => {
@@ -111,7 +113,9 @@ export const NetworkListMenu = ({ onClose }) => {
       }
 
       const isCurrentNetwork = currentNetwork.id === network.id;
-      const canDeleteNetwork = !isCurrentNetwork && network.removable;
+
+      const canDeleteNetwork =
+        isUnlocked && !isCurrentNetwork && network.removable;
 
       return (
         <NetworkListItem
@@ -227,7 +231,7 @@ export const NetworkListMenu = ({ onClose }) => {
             <Text>{t('showTestnetNetworks')}</Text>
             <ToggleButton
               value={showTestNetworks}
-              disabled={currentlyOnTestNetwork}
+              disabled={currentlyOnTestNetwork || !isUnlocked}
               onToggle={handleToggle}
             />
           </Box>
@@ -239,6 +243,7 @@ export const NetworkListMenu = ({ onClose }) => {
           <Box padding={4}>
             <ButtonSecondary
               size={BUTTON_SECONDARY_SIZES.LG}
+              disabled={!isUnlocked}
               block
               onClick={() => {
                 if (isFullScreen) {
diff --git a/ui/components/multichain/network-list-menu/network-list-menu.test.js b/ui/components/multichain/network-list-menu/network-list-menu.test.js
index ba91a979d..e86837654 100644
--- a/ui/components/multichain/network-list-menu/network-list-menu.test.js
+++ b/ui/components/multichain/network-list-menu/network-list-menu.test.js
@@ -23,10 +23,12 @@ const render = (
   showTestNetworks = false,
   currentChainId = '0x5',
   providerConfigId = 'chain5',
+  isUnlocked = true,
 ) => {
   const state = {
     metamask: {
       ...mockState.metamask,
+      isUnlocked,
       providerConfig: {
         ...mockState.metamask.providerConfig,
         chainId: currentChainId,
@@ -111,4 +113,21 @@ describe('NetworkListMenu', () => {
 
     expect(queryByText('Chain 5')).not.toBeInTheDocument();
   });
+
+  it('disables the "Add Network" button when MetaMask is locked', () => {
+    const { queryByText } = render(false, '0x5', 'chain5', false);
+    expect(queryByText('Add network')).toBeDisabled();
+  });
+
+  it('enables the "Add Network" button when MetaMask is true', () => {
+    const { queryByText } = render(false, '0x5', 'chain5', true);
+    expect(queryByText('Add network')).toBeEnabled();
+  });
+
+  it('does not allow deleting networks when locked', () => {
+    render(false, '0x5', 'chain5', false);
+    expect(
+      document.querySelectorAll('multichain-network-list-item__delete'),
+    ).toHaveLength(0);
+  });
 });