refactor: Replace redesign confirmation BottomModal with BottomSheet

[digiwand]

Description

Updates:

• Replaces BottomModal with BottomSheet in redesign Confirm page
  • Remove min height to prevent redesign Confirm page from showing excess space
  • Allow BottomSheet styles (rounded corners, footer bottom styles, and device padding detection padding) rather than custom BottomModal styles
• Update BlockaidBanner to remove surrounding margin to allow for better reusability
  • Replace BlockaidBanner instances margin overrides with surrounding container margins
• Update BottomSheet to pass style to BottomSheetDialog sheet cc: @brianacnguyen
  • Note: I think we don't need the additional background colors for header and footer since the parent, BottomSheet animated view sets the background color. Once I removed them, it triggered many snapshot tests and code owner reviews from 5 additional teams. Instead of making this change, we will continue to update the bottomsheet, footer, and header when applicable

Fixes:

• Fix TransactionReview BlockaidBanner negative padding → turn to positive padding to allow space between next element
• Fix Confirm.test console.errors

Related issues

Fixes: #13267
Todo follow-up - Related Issue: #12656

Manual testing steps

Test BottomSheets and BlockaidBanner alerts work as expected. Test redesign confirmation page works as expected

Screenshots/Recordings

Before using BottomModal and no scroll behavior

CleanShot.2025-01-30.at.01.11.16.mp4

After using BottomSheet with scroll behavior

CleanShot.2025-01-30.at.02.18.53.mp4

Before 70% min height

After remove 70% min height

Before Transaction Review BlockaidBanner negative padding

**After Transaction Review BlockaidBanner positive padding **

Before Confirm.test console errors

After Confirm.test no console.errors

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.

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

[github-actions]

Bitrise

✅✅✅ pr_smoke_e2e_pipeline passed on Bitrise! ✅✅✅

Commit hash: 50594e4
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/e9a940ea-e242-4a48-9a81-9bb840e70aa0

Note

• You can kick off another pr_smoke_e2e_pipeline on Bitrise by removing and re-applying the Run Smoke E2E label on the pull request

[jpuri]

A small thing I see missing in screenshots this small rectangle at top of bottom modal, its required by the designs:

[jpuri]

Changes look good, I added some feedback that need to be addressed.

[codecov-commenter]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 63.46%. Comparing base (256bc97) to head (a7c539a).
Report is 45 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main   #13268      +/-   ##
==========================================
+ Coverage   62.91%   63.46%   +0.55%     
==========================================
  Files        2035     2095      +60     
  Lines       44539    45301     +762     
  Branches     6050     6236     +186     
==========================================
+ Hits        28020    28750     +730     
+ Misses      14685    14670      -15     
- Partials     1834     1881      +47     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[sonarqubecloud]

Quality Gate passed

Issues
1 New issue
0 Accepted issues

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

See analysis details on SonarQube Cloud