fix: update Nft metadata when toggles are on

app/scripts/metamask-controller.js

@@ -3079,6 +3079,8 @@ export default class MetamaskController extends EventEmitter {
       // NftController
       addNft: nftController.addNft.bind(nftController),
 
+      updateNftMetadata: nftController.updateNftMetadata.bind(nftController),
+
       addNftVerifyOwnership:
         nftController.addNftVerifyOwnership.bind(nftController),
 

ui/components/app/nfts-tab/nfts-tab.js

@@ -18,11 +18,14 @@ import {
   getCurrentNetwork,
   getIsMainnet,
   getUseNftDetection,
+  getIpfsGateway,
+  getOpenSeaEnabled,
 } from '../../../selectors';
 import {
   checkAndUpdateAllNftsOwnershipStatus,
   detectNfts,
   showImportNftsModal,
+  updateNftMetadata,
 } from '../../../store/actions';
 import { Box, ButtonLink, IconName, Text } from '../../component-library';
 import NFTsDetectionNoticeNFTsTab from '../nfts-detection-notice-nfts-tab/nfts-detection-notice-nfts-tab';
@@ -47,6 +50,8 @@ export default function NftsTab() {
   const t = useI18nContext();
   const dispatch = useDispatch();
   const trackEvent = useContext(MetaMetricsContext);
+  const isIpfsEnabled = useSelector(getIpfsGateway);
+  const openSeaEnabled = useSelector(getOpenSeaEnabled);
 
   const { nftsLoading, collections, previouslyOwnedCollection } =
     useNftsCollections();
@@ -66,6 +71,34 @@ export default function NftsTab() {
   const showNftBanner = hasAnyNfts === false;
   const currentNetwork = useSelector(getCurrentNetwork);
   const currentLocale = useSelector(getCurrentLocale);
+  const hasAnyPreviouslyOwnedNfts = previouslyOwnedCollection.nfts.length > 0;
+  useEffect(() => {
+    if (
+      (isIpfsEnabled || openSeaEnabled) &&
+      (hasAnyNfts || hasAnyPreviouslyOwnedNfts)
+    ) {
+      const allNfts = previouslyOwnedCollection.nfts.concat(
+        Object.values(collections).flatMap((collection) => collection.nfts),
+      );
+      const nftsToUpdateMetadata = allNfts.filter(
+        (singleNft) =>
+          !singleNft.name && !singleNft.description && !singleNft.image,
+      );
+
+      if (nftsToUpdateMetadata.length !== 0) {
+        dispatch(updateNftMetadata(nftsToUpdateMetadata));
+      }
+    }
+  }, [
+    collections,
+    hasAnyNfts,
+    previouslyOwnedCollection,
+    hasAnyPreviouslyOwnedNfts,
+    isIpfsEnabled,
+    openSeaEnabled,
+    dispatch,
+  ]);
+
   useEffect(() => {
     if (!showNftBanner) {
       return;

ui/store/actions.test.js

@@ -2191,4 +2191,97 @@ describe('Actions', () => {
       expect(expectedAction.payload.originalTransactionId).toBe(txId);
     });
   });
+
+  describe('updateNftMetadata', () => {
+    it('should throw if there is no address in nft', async () => {
+      const store = mockStore();
+      const testNfts = [
+        {
+          description: null,
+          favorite: false,
+          image: null,
+          isCurrentlyOwned: true,
+          name: null,
+          standard: 'ERC721',
+          tokenId: '2',
+          tokenURI: 'testUrI2',
+        },
+        {
+          address: 'Oxtest',
+          description: null,
+          favorite: false,
+          image: null,
+          isCurrentlyOwned: true,
+          name: null,
+          standard: 'ERC721',
+          tokenId: '3',
+          tokenURI: 'testUrI3',
+        },
+      ];
+
+      await expect(
+        store.dispatch(actions.updateNftMetadata(testNfts)),
+      ).rejects.toThrow('MetaMask - Cannot updateNftMetadata without address');
+    });
+
+    it('should throw if there is no tokenId in nft', async () => {
+      const store = mockStore();
+      const testNfts = [
+        {
+          address: 'Oxtest',
+          description: null,
+          favorite: false,
+          image: null,
+          isCurrentlyOwned: true,
+          name: null,
+          standard: 'ERC721',
+          tokenURI: 'testUrI2',
+        },
+        {
+          address: 'Oxtest',
+          description: null,
+          favorite: false,
+          image: null,
+          isCurrentlyOwned: true,
+          name: null,
+          standard: 'ERC721',
+          tokenId: '3',
+          tokenURI: 'testUrI3',
+        },
+      ];
+
+      await expect(
+        store.dispatch(actions.updateNftMetadata(testNfts)),
+      ).rejects.toThrow('MetaMask - Cannot updateNftMetadata without tokenId');
+    });
+
+    it('calls updateNftMetadata in background', async () => {
+      const store = mockStore();
+      const testNfts = [
+        {
+          address: 'Oxtest',
+          description: null,
+          favorite: false,
+          image: null,
+          isCurrentlyOwned: true,
+          name: null,
+          standard: 'ERC721',
+          tokenId: '3',
+          tokenURI: 'testUrI3',
+        },
+      ];
+
+      const updateNftMetadataStub = sinon.stub().callsFake((_, cb) => cb());
+
+      background.getApi.returns({
+        updateNftMetadata: updateNftMetadataStub,
+        getState: sinon.stub().callsFake((cb) => cb(null, baseMockState)),
+      });
+
+      setBackgroundConnection(background.getApi());
+
+      await store.dispatch(actions.updateNftMetadata(testNfts));
+      expect(updateNftMetadataStub.callCount).toStrictEqual(1);
+    });
+  });
 });

ui/store/actions.ts

@@ -2027,6 +2027,34 @@ export function addNft(
   };
 }
 
+export function updateNftMetadata(
+  nfts: [],
+): ThunkAction<void, MetaMaskReduxState, unknown, AnyAction> {
+  return async (dispatch: MetaMaskReduxDispatch, getState) => {
+    if (nfts.some((nft) => !nft.address)) {
+      throw new Error('MetaMask - Cannot updateNftMetadata without address');
+    }
+    if (nfts.some((nft) => !nft.tokenId)) {
+      throw new Error('MetaMask - Cannot updateNftMetadata without tokenId');
+    }
+    try {
+      const networkClientId = getSelectedNetworkClientId(getState());
+      await submitRequestToBackground('updateNftMetadata', [
+        {
+          nfts,
+          networkClientId,
+        },
+      ]);
+    } catch (error) {
+      logErrorWithMessage(error);
+      dispatch(displayWarning(error));
+    } finally {
+      await forceUpdateMetamaskState(dispatch);
+      dispatch(hideLoadingIndication());
+    }
+  };
+}
+
 export function addNftVerifyOwnership(
   address: string,
   tokenID: string,

yarn.lock

@@ -36049,4 +36049,4 @@ __metadata:
   resolution: "zxcvbn@patch:zxcvbn@npm%3A4.4.2#./.yarn/patches/zxcvbn-npm-4.4.2-6527983856.patch::version=4.4.2&hash=e3565a&locator=metamask-crx%40workspace%3A."
   checksum: 4413b5c71428a92b08fa11ef238987609af399447f33a76b6aa66ab2f964c88037a3d7692bf3d644bc68dd386e4ebe0476bae041fe6b515963f497879c04fbff
   languageName: node
-  linkType: hard
+  linkType: hard