fix: add nft modal enabled button logic

[ameliejyc]

Description

This PR improves the Import NFT modal by requiring users to select a network before importing an NFT. Previously, the Import button validation only checked for a valid address and token ID, but did not enforce network selection, which lead to the button being enabled when it shouldn't have.

Changes:

1. Refactored the disabled state management to use a computed isFormDisabled value instead of manually syncing state across multiple validation functions
2. Added network selection as a required validation criterion for enabling the Import button
3. Renamed selectedNetworkClientId to selectedNetworkClientIdForCustomImport for clarity
4. Removed unnecessary await keywords from dispatch() calls that don't need to be awaited

Changelog

CHANGELOG entry: Fixed Import NFT modal to require network selection before enabling button

Related issues

Fixes: #35531

Manual testing steps

1. Open MetaMask extension
2. Navigate to the NFTs tab
3. Click "Import NFT"
4. Verify the Import button is disabled initially
5. Enter a valid NFT address and token ID without selecting a network
6. Verify the Import button remains disabled
7. Select a network from the network selector
8. Verify the Import button is now enabled
9. Click Import and verify the NFT is added successfully

Screenshots/Recordings

Before

After

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Extension Coding Standards.
• I've completed the PR template to the best of my ability
• I've included tests if applicable
• I've documented my code using JSDoc format if applicable
• I've applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

---

Note

Require network selection to enable Import in the NFT modal, refactor validation to a computed isFormDisabled, and update tests accordingly.

• UI (Import NFTs Modal):
  • Compute isFormDisabled (requires selected network, valid nftAddress, numeric tokenId, and no validation errors) and use it for the Import button.
  • Remove manual disabled state; simplify validators to only set errors/values.
  • Introduce selectedNetworkClientIdForCustomImport and pass it to addNftVerifyOwnership; reset inputs on network change.
  • Dispatch ignoreTokens without await and keep success/error messaging and navigation flow.
• Tests:
  • Require network selection for enabling Import; add test for "no network selected" case.
  • Update validity tests and error handling; verify large tokenId handling and correct networkClientId passed (using last call for robustness).
  • Confirm routing on cancel/close and dropdown state updates.

^{Written by Cursor Bugbot for commit 44b0a9d. This will update automatically on new commits. Configure here.}

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[metamaskbot]

✨ Files requiring CODEOWNER review ✨

👨‍🔧 @MetaMask/core-extension-ux (2 files, +82 -24)

• 📁 ui/
  • 📁 components/
    • 📁 multichain/
      • 📁 import-nfts-modal/
        • 📄 import-nfts-modal.js +19 -15
        • 📄 import-nfts-modal.test.js +63 -9

[metamaskbot]

Builds ready [44b0a9d]

• builds: chrome, firefox
• builds (beta): chrome, firefox
• builds (flask): chrome, firefox
• builds (test): chrome, firefox
• builds (test-flask): chrome, firefox
• bundle size: Bundle Size Stats
• user-actions-benchmark: User Actions Stats
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
  • common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15
  • ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18
  • content-script: 0
  • offscreen: 0

UI Startup Metrics (1196 ± 113 ms)

Platform	BuildType	Page	Metric	Mean (ms)	Min (ms)	Max (ms)	Std Dev (ms)	P 75 (ms)	P 95 (ms)
Chrome	Browserify	Standard Home	uiStartup	1196	957	1630	113	1277	1375
			load	980	798	1349	95	1039	1158
			domContentLoaded	973	793	1342	93	1033	1138
			domInteractive	24	14	103	18	21	77
			firstPaint	672	92	1201	389	1025	1097
			backgroundConnect	193	175	238	13	199	220
			firstReactRender	40	29	75	10	47	62
			getState	33	10	95	14	38	58
			initialActions	1	0	7	1	1	2
			loadScripts	787	622	1115	88	848	939
			setupStore	11	6	37	5	12	23
			numNetworkReqs	14	6	85	21	6	78
	Browserify	Power User Home	uiStartup	1902	1558	2298	164	1992	2193
			load	1052	890	1435	121	1140	1300
			domContentLoaded	1043	885	1429	120	1134	1290
			domInteractive	30	17	124	24	27	92
			firstPaint	551	82	1305	413	1008	1229
			backgroundConnect	252	201	607	94	237	537
			firstReactRender	47	38	78	7	48	62
			getState	201	150	743	93	199	260
			initialActions	1	0	2	1	1	2
			loadScripts	832	682	1194	120	920	1084
			setupStore	15	7	36	6	14	34
			numNetworkReqs	72	58	149	20	71	127
	Webpack	Standard Home	uiStartup	861	718	1064	90	916	1043
			load	656	575	874	77	695	826
			domContentLoaded	651	571	866	77	690	818
			domInteractive	27	16	137	23	22	94
			firstPaint	239	74	872	186	226	702
			backgroundConnect	11	6	79	9	12	29
			firstReactRender	52	33	152	27	60	132
			getState	29	9	84	12	37	49
			initialActions	1	0	4	1	1	2
			loadScripts	648	569	864	76	687	812
			setupStore	11	6	29	4	14	20
			numNetworkReqs	14	6	82	20	6	74
	Webpack	Power User Home	uiStartup	1497	1222	2131	177	1572	1850
			load	718	594	921	88	798	890
			domContentLoaded	711	586	909	87	790	879
			domInteractive	30	16	152	27	25	108
			firstPaint	341	81	922	244	630	841
			backgroundConnect	84	8	661	157	63	581
			firstReactRender	49	40	73	5	50	57
			getState	187	143	731	64	186	270
			initialActions	1	0	4	1	1	2
			loadScripts	708	584	907	86	788	876
			setupStore	15	7	38	8	14	36
			numNetworkReqs	72	59	216	23	67	126
Firefox	Browserify	Standard Home	uiStartup	1565	1293	2397	197	1636	1983
			load	1223	1046	1736	105	1274	1398
			domContentLoaded	1222	1046	1736	106	1274	1398
			domInteractive	92	34	339	56	110	206
			firstPaint	-	-	-	-	-	-
			backgroundConnect	75	23	256	55	104	209
			firstReactRender	46	34	79	9	48	67
			getState	21	7	212	29	16	90
			initialActions	1	0	3	1	2	2
			loadScripts	1183	1023	1580	95	1231	1349
			setupStore	18	7	138	21	15	46
			numNetworkReqs	15	6	87	21	9	74
	Browserify	Power User Home	uiStartup	2559	1595	3915	530	2958	3326
			load	1552	979	2986	490	2008	2320
			domContentLoaded	1552	979	2986	490	2008	2320
			domInteractive	160	31	1698	281	95	956
			firstPaint	-	-	-	-	-	-
			backgroundConnect	238	26	1183	308	208	1016
			firstReactRender	59	36	183	22	62	92
			getState	130	68	435	46	156	186
			initialActions	2	0	34	3	2	5
			loadScripts	1448	960	2971	455	1872	2297
			setupStore	36	4	314	56	39	181
			numNetworkReqs	75	57	130	22	70	123
	Webpack	Standard Home	uiStartup	1577	1316	2269	168	1674	1902
			load	1275	1094	1803	115	1324	1507
			domContentLoaded	1275	1094	1802	115	1324	1507
			domInteractive	68	27	220	37	90	131
			firstPaint	-	-	-	-	-	-
			backgroundConnect	58	22	216	42	59	154
			firstReactRender	42	31	90	10	43	56
			getState	13	6	57	9	14	27
			initialActions	1	0	4	1	2	3
			loadScripts	1244	1078	1642	102	1290	1419
			setupStore	16	6	82	16	16	46
			numNetworkReqs	16	6	88	22	8	80
	Webpack	Power User Home	uiStartup	2859	1820	4143	568	3270	3704
			load	1919	1165	2863	519	2362	2680
			domContentLoaded	1918	1165	2863	519	2361	2680
			domInteractive	223	29	990	326	194	972
			firstPaint	-	-	-	-	-	-
			backgroundConnect	167	28	1006	206	202	922
			firstReactRender	55	35	101	11	60	71
			getState	134	77	281	47	164	246
			initialActions	2	0	7	1	2	6
			loadScripts	1820	1139	2746	496	2280	2569
			setupStore	43	5	459	81	29	315
			numNetworkReqs	75	52	130	22	68	123

📊 Page Load Benchmark Results

Current Commit: 44b0a9d | Date: 12/9/2025

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

• pageLoadTime-> current mean value: 1.05s (±88ms) 🟡 | historical mean value: 1.05s ⬇️ (historical data)
• domContentLoaded-> current mean value: 734ms (±86ms) 🟢 | historical mean value: 736ms ⬇️ (historical data)
• firstContentfulPaint-> current mean value: 82ms (±65ms) 🟢 | historical mean value: 80ms ⬆️ (historical data)

📈 Detailed Results

Metric	Mean	Std Dev	Min	Max	P95	P99
pageLoadTime	1.05s	88ms	1.01s	1.88s	1.07s	1.88s
domContentLoaded	734ms	86ms	702ms	1.55s	749ms	1.55s
firstPaint	82ms	65ms	60ms	724ms	84ms	724ms
firstContentfulPaint	82ms	65ms	60ms	724ms	84ms	724ms
largestContentfulPaint	0ms	0ms	0ms	0ms	0ms	0ms

Bundle size diffs [🚨 Warning! Bundle size has increased!]

• background: 58 Bytes (0%)
• ui: 403 Bytes (0.01%)
• common: 20 Bytes (0%)