refactor: replace native ActionSheet with BottomSheet for NFT actions

[juanmigdr]

Description

• NftGridItemBottomSheet.tsx (new) — Design-system bottom sheet replacing the native ActionSheet, with the same "Refresh metadata / Remove / Cancel" actions. Follows the identical state-driven visibility pattern as RemoveTokenBottomSheet.
• NftGrid.tsx — Swapped NftGridItemActionSheet + actionSheetRef + useEffect for the new NftGridItemBottomSheet driven by longPressedCollectible !== null.
• NFTsSection.tsx — Homepage NFT section now wires long-press to open the bottom sheet (was previously a noop).
• RemoveTokenBottomSheet.tsx — Migrated the deprecated BottomSheetHeader import from the component-library to @metamask/design-system-react-native.

Changelog

CHANGELOG entry: updated NFT long-press actions to use a bottom sheet consistent with the token list experience

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/ASSETS-2958 & https://consensyssoftware.atlassian.net/browse/ASSETS-2971

Manual testing steps

Feature: my feature name

  Scenario: user [verb for user action]
    Given [describe expected initial app state]

    When user [verb for user action]
    Then [describe expected outcome]

Screenshots/Recordings

Before

After

Screen.Recording.2026-03-23.at.12.55.06.mov

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Mobile 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

Medium Risk
Moderate UI refactor that changes the long-press interaction path for NFT actions and adds controller calls behind new bottom-sheet handlers; regressions would mainly impact NFT refresh/remove flows.

Overview
Replaces the native ActionSheet-based NFT long-press menu with a design-system NftGridItemBottomSheet, driven by state (isVisible + onClose) instead of an imperative ref.

Enables long-press actions in both NftGrid and the homepage NFTsSection (previously a no-op on homepage), and adds/updates tests to assert the bottom sheet opens and that refresh/remove invoke NftController.addNft / removeAndIgnoreNft with the resolved networkClientId.

Aligns token removal UI by switching RemoveTokenBottomSheet to use BottomSheetHeader from @metamask/design-system-react-native.

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

[cursor]

Cursor Bugbot has reviewed your changes and found 2 potential issues.

^{Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, have a team admin enable autofix in the Cursor dashboard.}

[github-actions]

🔍 Smart E2E Test Selection

• Selected E2E tags: SmokeWalletPlatform
• Selected Performance tags: None (no tests recommended)
• Risk Level: low
• AI Confidence: 72%

click to see 🤖 AI reasoning details

E2E Test Selection:
The changes are UI-level modifications to NFT components:

1. NftGrid.tsx: Replaced NftGridItemActionSheet (old ActionSheet) with new NftGridItemBottomSheet. Removed the actionSheetRef and useEffect trigger pattern.
2. NftGridItemBottomSheet.tsx: New component implementing a proper BottomSheet for NFT item actions (refresh metadata, remove NFT). Uses Engine.context.NftController and NetworkController.
3. NFTsSection.tsx: Added long-press functionality to NFT items in the homepage section (previously was a no-op noop function), now shows the new NftGridItemBottomSheet.
4. RemoveTokenBottomSheet.tsx: Minor import refactor - BottomSheetHeader now imported from @metamask/design-system-react-native instead of local component library. No functional change.

No dedicated E2E tests for NFT grid interactions were found in the codebase (no .e2e.* files reference NFT/collectible). The changes are contained to NFT UI components and don't affect core flows like swaps, confirmations, accounts, or network management.

SmokeWalletPlatform is selected as it covers wallet platform features including the homepage/wallet view where NFTs are displayed. This provides a smoke check that the wallet homepage still renders correctly after these component changes. No other tags are warranted as the changes don't touch confirmations, accounts, trading, or network flows.

Performance Test Selection:
The changes are UI component replacements (ActionSheet → BottomSheet) for NFT item actions. These are not in critical rendering paths like account lists, asset loading, or app startup. The NFT grid is not covered by any performance test tags, and the changes don't affect data loading, state management, or rendering performance of measured flows.

View GitHub Actions results

[github-actions]

✅ E2E Fixture Validation — Schema is up to date
17 value mismatches detected (expected — fixture represents an existing user).
View details

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
87.5% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud