MetaMask / MetaMask/metamask-extension

No UI feedback when clicking the "Copy Address" button

Open
#30,706 0 comments 0 reactions 0 assignees View on GitHub
external-contributor
Dominant language
TypeScript
Stars
13.2k
Forks
5.6k
Avg merge
2d 5h
Merged PRs (30d)
451

Description

### What is this about?

Currently, in MetaMask's Account Detail screen, clicking the "Copy address" button successfully copies the address to the clipboard, but there is no UI feedback to indicate that the action was successful.

![Image](https://github.com/user-attachments/assets/1159548e-fd42-412a-8621-e9477d36ed1d)

When a user clicks the "Copy address" button, visual feedback (such as a tooltip) should be provided to indicate that the copy action was successful.

### Scenario

- GIVEN the user is on the MetaMask Account Detail page.
- WHEN the user clicks the "Copy address" button.
- AND the address is copied to the clipboard.
- THEN a UI feedback such as "Address copied!" should be displayed.

### Design

If possible, add a tooltip consistent with the existing MetaMask UI style. The existing toast notification system can also be leveraged.

### Technical Details

- Detect "Copy address" button click event in "ui/components/ui/qr-code-view/qr-code-view.tsx"
- Add a tooltip

### Threat Modeling Framework

- This feature does not impact security but aims to improve user trust through better UX.

### Acceptance Criteria

- UI feedback should appear immediately when the "Copy address" button is clicked.
- The feedback should be consistent with the existing MetaMask UI style.
- Tooltip should be used to inform users of the copy action.

### Stakeholder review needed before the work gets merged

- [ ] Engineering (needed in most cases)
- [ ] Design
- [ ] Product
- [ ] QA (automation tests are required to pass before merging PRs but not all changes are covered by automation tests - please review if QA is needed beyond automation tests)
- [ ] Security
- [ ] Legal
- [ ] Marketing
- [ ] Management (please specify)
- [ ] Other (please specify)

### References

_No response_

Contributor guide

Open the contributing guide

Research direction

Start in ui/components/ui/qr-code-view/qr-code-view.tsx and trace the existing "Copy address" click handling. Inspect nearby MetaMask UI patterns for tooltips or the toast notification system, then verify that feedback appears immediately after a successful copy and matches the stated acceptance criteria.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
58/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.