feat: blockaid banner UX improvements

[jpuri]

Description

Changes in blockaid banner UX to make it more intuitive for users.

Related issues

Fixes: MetaMask/MetaMask-planning#2038

Manual testing steps

1. Open app in emulator and go to test dapp
2. Submit a benign transaction
3. Check blockaid alerts that appear

Screenshots/Recordings

Screen.Recording.2024-02-07.at.2.18.19.PM.mov

Pre-merge author checklist

• I’ve followed MetaMask Coding Standards.
• I've clearly explained what problem this PR is solving and how it is solved.
• I've linked related issues
• I've included manual testing steps
• I've included screenshots/recordings if applicable
• 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.
• I’ve properly set the pull request status:
  • In case it's not yet "ready for review", I've set it to "draft".
  • In case it's "ready for review", I've changed it from "draft" to "non-draft".

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]

E2E test started on Bitrise: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/6848c6f4-f805-4c9e-a9d5-deb3fee976f0
You can also kick off another Bitrise E2E smoke test by removing and re-applying the (Run Smoke E2E) label

[codecov-commenter]

Codecov Report

Attention: 1 lines in your changes are missing coverage. Please review.

Comparison is base (bb6d073) 40.80% compared to head (a2cb960) 40.90%.
Report is 2 commits behind head on main.

Files	Patch %	Lines
...pp/components/UI/BlockaidBanner/BlockaidBanner.tsx	0.00%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #8544      +/-   ##
==========================================
+ Coverage   40.80%   40.90%   +0.10%     
==========================================
  Files        1245     1245              
  Lines       30119    30148      +29     
  Branches     2889     2894       +5     
==========================================
+ Hits        12289    12333      +44     
+ Misses      17127    17112      -15     
  Partials      703      703              

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

[sonarcloud]

Quality Gate passed

Kudos, no new issues were introduced!

0 New issues
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud