Fix #17848 - Ensure NFT collections toggle appropriately

[darkwing]

Explanation

• Fixes [Bug]: NFT dropdown for owned and previously owned NFTs displays/hiddens NFTs after some seconds #17848

This weird effect of the collections toggling themselves was due to mutating the current state, as evidenced by this error:

Uncaught Error: Invariant failed: A state mutation was detected between dispatches, in the path 'metamask.nftsDropdownState.0x0836f5ed6b62baf60706fe3adc0ff0fd1df833da.0x1'.  This may cause incorrect behavior. (https://redux.js.org/style-guide/style-guide#do-not-mutate-state)

This PR prevents the mutation and thus fixes the issue.

Manual Testing Steps

1. Start the extension with NFTS turned on: NFTS_V1 yarn start
2. Toggle a collection chevron to hide the collection
3. Wait 10 seconds, see the collection is still closed

Pre-merge author checklist

• I've clearly explained:
  • What problem this PR is solving
  • How this problem was solved
  • How reviewers can test my changes
• Sufficient automated test coverage has been added

Pre-merge reviewer checklist

• Manual testing (e.g. pull and build branch, run in browser, test code being changed)
• PR is linked to the appropriate GitHub issue
• IF this PR fixes a bug in the release milestone, add this PR to the release milestone

If further QA is required (e.g. new feature, complex testing steps, large refactor), add the Extension QA Board label.

In this case, a QA Engineer approval will be be required.

[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.

[darkwing]

This PR relies on #17988 being merged.

[metamaskbot]

Builds ready [3c64642]

• builds: chrome, firefox
• builds (beta): chrome, firefox
• builds (flask): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4
  • common: 0, 1, 2, 3, 4, 5
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • inpage: inpage
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1844 ± 68 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	100	155	126	14	7
		domContentLoaded	1541	2084	1797	155	74
		load	1596	2161	1844	141	68
		domInteractive	1541	2084	1797	155	74

Bundle size diffs

• background: 0 bytes
• ui: 11 bytes
• common: 0 bytes

[codecov]

Codecov Report

Merging #17972 (2f918bf) into develop (abff495) will increase coverage by 0.00%.
The diff coverage is 100.00%.

❗ Current head 2f918bf differs from pull request most recent head c7de835. Consider uploading reports for the commit c7de835 to get more accurate results

@@           Coverage Diff            @@
##           develop   #17972   +/-   ##
========================================
  Coverage    63.44%   63.44%           
========================================
  Files          903      903           
  Lines        35267    35266    -1     
  Branches      8920     8920           
========================================
+ Hits         22373    22374    +1     
+ Misses       12894    12892    -2     

Impacted Files	Coverage Δ
ui/components/app/nfts-items/nfts-items.js	93.55% <100.00%> (-0.10%)	⬇️
app/scripts/migrations/023.js	93.75% <0.00%> (-3.12%)	⬇️
app/scripts/metamask-controller.js	60.18% <0.00%> (+0.25%)	⬆️

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

[metamaskbot]

Builds ready [d2988a3]

• builds: chrome, firefox
• builds (beta): chrome, firefox
• builds (flask): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4
  • common: 0, 1, 2, 3, 4, 5
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • inpage: inpage
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1684 ± 71 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	97	150	128	15	7
		domContentLoaded	1472	1931	1652	127	61
		load	1482	2024	1684	147	71
		domInteractive	1472	1931	1652	127	61

[metamaskbot]

Builds ready [2f918bf]

• builds: chrome, firefox
• builds (beta): chrome, firefox
• builds (flask): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4
  • common: 0, 1, 2, 3, 4, 5
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • inpage: inpage
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1635 ± 55 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	101	262	128	35	17
		domContentLoaded	1368	1743	1592	89	43
		load	1368	1844	1635	115	55
		domInteractive	1368	1743	1592	89	43

Bundle size diffs

• background: 0 bytes
• ui: 11 bytes
• common: 0 bytes

[darkwing]

These tests will pass after #18044 is merged.

[metamaskbot]

Builds ready [288a9b7]

• builds: chrome, firefox
• builds (beta): chrome, firefox
• builds (flask): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4
  • common: 0, 1, 2, 3, 4, 5
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • inpage: inpage
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1559 ± 39 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	98	131	116	9	4
		domContentLoaded	1310	1683	1534	82	39
		load	1322	1686	1559	82	39
		domInteractive	1310	1683	1534	82	39

Bundle size diffs

• background: 0 bytes
• ui: 11 bytes
• common: 0 bytes

[adonesky1]

LGTM!