feat: add eth stake button #9136

ameliejyc · 2024-04-04T10:51:47Z

Description

This change adds a 'Stake' button link to the Portfolio stake page next to the ETH token on mainnet. The reason for this change is to have parity with the extension, give users easier access to MM Staking, and drive revenue.

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/STAKE-629

Request template: https://www.notion.so/metamask-consensys/Add-Stake-Button-to-Mobile-f160ebc0f6b6437c9b3d0f943851771a

Manual testing steps

Go to Token Listing
Verify that the new staking icon shows on for ETH mainnet
Verify that the new staking icon doesn't show on any other token than ETH, and not on any other chain than mainnet
Verify that onPress, the MM browser opens up the Portfolio stake page with the correct query params
Verify that if a browser tab is already open on the stake page, the MM browser picks this tab rather than opening a new one

Screenshots/Recordings

stake.button.ios2.mov

Before

After

Pre-merge author checklist

I’ve followed MetaMask 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 · 2024-04-04T10:52:01Z

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.

app/components/UI/Tokens/index.tsx

ameliejyc · 2024-04-04T12:58:42Z

I have read the CLA Document and I hereby sign the CLA

ameliejyc · 2024-04-04T14:19:22Z

Two questions:

I have verified that MetaMetrics trackEvent is called with the expected params, however is there anything else I need to do to get this new event updated in Segment? I don't see a Segment mobile tracking plan.
I'm struggling to test this on Android due to build issues. I'm assuming the UI will work the same given it's RN but would like to sanity check regardless. Can someone please help me get it setup or test using my checked out branch?

UPDATE: I fixed my android issues and tested the UI:

codecov-commenter · 2024-04-05T09:23:15Z

Codecov Report

Attention: Patch coverage is 68.75000% with 5 lines in your changes are missing coverage. Please review.

Project coverage is 46.00%. Comparing base (4be64ff) to head (8bc449c).

Files	Patch %	Lines
app/components/UI/Tokens/index.tsx	68.75%	2 Missing and 3 partials ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #9136      +/-   ##
==========================================
+ Coverage   45.98%   46.00%   +0.01%     
==========================================
  Files        1273     1273              
  Lines       31342    31357      +15     
  Branches     3213     3217       +4     
==========================================
+ Hits        14414    14425      +11     
- Misses      16079    16081       +2     
- Partials      849      851       +2

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

georgewrmarshall

LGTM! I have once question for DS designers but I imagine it will be a change on the design side

app/component-library/components/Icons/Icon/Icon.types.ts

app/component-library/components/Icons/Icon/Icon.assets.ts

app/components/UI/Tokens/index.tsx

brianacnguyen

Looks good. Just 1 comment regarding not needing the Stake Icon

NicolasMassart

Tested and code approved.
Please run e2e smoke tests.
Nice work!

Simulator.Screen.Recording.-.iPhone.13.Pro.-.2024-04-08.at.18.48.21.mp4

github-actions · 2024-04-08T16:57:42Z

Bitrise

✅✅✅ pr_smoke_e2e_pipeline passed on Bitrise! ✅✅✅

Commit hash: e0ae61d
Build link: https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/cdbf9bc6-9557-4447-b34f-2c160dcedd74

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

sonarcloud · 2024-04-09T08:01:49Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

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

See analysis details on SonarCloud

ameliejyc changed the title ~~Add eth stake button~~ feat: add eth stake button Apr 4, 2024

github-advanced-security bot found potential problems Apr 4, 2024

View reviewed changes

app/components/UI/Tokens/index.tsx Fixed Show fixed Hide fixed

ameliejyc added team-stake design-review Any feature that needs feedback from the design team labels Apr 4, 2024

ameliejyc force-pushed the add-eth-stake-button branch 2 times, most recently from 21032ed to d50ea0f Compare April 4, 2024 14:00

ameliejyc force-pushed the add-eth-stake-button branch 2 times, most recently from bc8adc5 to 8bc449c Compare April 5, 2024 09:09

ameliejyc marked this pull request as ready for review April 5, 2024 09:34

ameliejyc requested review from a team as code owners April 5, 2024 09:34

ameliejyc force-pushed the add-eth-stake-button branch from e0c0bc8 to 0a77c44 Compare April 5, 2024 12:04

gauthierpetetin added the needs-dev-review PR needs reviews from other engineers (in order to receive required approvals) label Apr 5, 2024

georgewrmarshall previously approved these changes Apr 5, 2024

View reviewed changes

app/component-library/components/Icons/Icon/Icon.types.ts Outdated Show resolved Hide resolved

brianacnguyen reviewed Apr 5, 2024

View reviewed changes

app/component-library/components/Icons/Icon/Icon.assets.ts Outdated Show resolved Hide resolved

brianacnguyen reviewed Apr 5, 2024

View reviewed changes

app/components/UI/Tokens/index.tsx Outdated Show resolved Hide resolved

brianacnguyen requested changes Apr 5, 2024

View reviewed changes

ameliejyc dismissed georgewrmarshall’s stale review via 1520c9a April 8, 2024 09:23

ameliejyc force-pushed the add-eth-stake-button branch 2 times, most recently from 1520c9a to 3952bf3 Compare April 8, 2024 10:22

ameliejyc requested review from brianacnguyen and georgewrmarshall April 8, 2024 10:37

ameliejyc added 3 commits April 8, 2024 17:15

chore: add stake icon

1855b67

feat: add stake button for mainnet ETH token

0d66fca

chore: remove regex and add unit tests

a0aef18

ameliejyc added 6 commits April 8, 2024 17:15

chore: update font size to 16px

38247ec

chore: use View instead of Text to make styling easier

9f1f8e0

chore: run lint

9e685f4

chore: fix snapshot

3f8a1f8

chore: remove Stake icon and use Pressable instead of TouchableOpacity

80db4eb

chore: fix android icon positioning

419182e

ameliejyc force-pushed the add-eth-stake-button branch from b925648 to 419182e Compare April 8, 2024 16:15

ameliejyc added 2 commits April 8, 2024 17:32

fix: snapshot

4503578

Merge branch 'main' into add-eth-stake-button

93851df

NicolasMassart approved these changes Apr 8, 2024

View reviewed changes

ameliejyc added the Run Smoke E2E Triggers smoke e2e on Bitrise label Apr 8, 2024

Merge branch 'main' into add-eth-stake-button

e0ae61d

Merge branch 'main' into add-eth-stake-button

1526b01

ameliejyc removed the request for review from georgewrmarshall April 9, 2024 07:46

brianacnguyen approved these changes Apr 9, 2024

View reviewed changes

ameliejyc merged commit 226d82d into main Apr 10, 2024
31 checks passed

ameliejyc deleted the add-eth-stake-button branch April 10, 2024 14:38

github-actions bot locked and limited conversation to collaborators Apr 10, 2024

github-actions bot removed the needs-dev-review PR needs reviews from other engineers (in order to receive required approvals) label Apr 10, 2024

metamaskbot added the release-7.21.0 Issue or pull request that will be included in release 7.21.0 label Apr 10, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: add eth stake button #9136

feat: add eth stake button #9136

ameliejyc commented Apr 4, 2024 •

edited

github-actions bot commented Apr 4, 2024 •

edited

ameliejyc commented Apr 4, 2024

ameliejyc commented Apr 4, 2024 •

edited

codecov-commenter commented Apr 5, 2024

georgewrmarshall left a comment

brianacnguyen left a comment

NicolasMassart left a comment •

edited

github-actions bot commented Apr 8, 2024 •

edited by metamaskbot

sonarcloud bot commented Apr 9, 2024

feat: add eth stake button #9136

feat: add eth stake button #9136

Conversation

ameliejyc commented Apr 4, 2024 • edited

Description

Related issues

Manual testing steps

Screenshots/Recordings

Before

After

Pre-merge author checklist

Pre-merge reviewer checklist

github-actions bot commented Apr 4, 2024 • edited

ameliejyc commented Apr 4, 2024

ameliejyc commented Apr 4, 2024 • edited

codecov-commenter commented Apr 5, 2024

Codecov Report

georgewrmarshall left a comment

Choose a reason for hiding this comment

brianacnguyen left a comment

Choose a reason for hiding this comment

NicolasMassart left a comment • edited

Choose a reason for hiding this comment

github-actions bot commented Apr 8, 2024 • edited by metamaskbot

Bitrise

sonarcloud bot commented Apr 9, 2024

Quality Gate passed

ameliejyc commented Apr 4, 2024 •

edited

github-actions bot commented Apr 4, 2024 •

edited

ameliejyc commented Apr 4, 2024 •

edited

NicolasMassart left a comment •

edited

github-actions bot commented Apr 8, 2024 •

edited by metamaskbot