swagger-api / swagger-api/swagger-ui
Enhance User Feedback for Copy Action in `CopyToClipboardBtn` Component
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 29k
- Forks
- 9.3k
- Avg merge
- 2d 23h
- Merged PRs (30d)
- 25
Description
Is your feature request related to a problem?
Yes, the current implementation of the CopyToClipboardBtn component does not provide feedback to the user when the text is copied. Users are not aware if the copy action was successful when they click on the copy icon.
Describe the solution you'd like
Add an onCopy event handler to the CopyToClipboardBtn component to set a copied state. Display a confirmation Tootltip, such as "Copied!", when the text is successfully copied. This will give users immediate feedback and improve the user experience.
Describe alternatives you've considered
- Using a toast notification library to show a notification when the text is copied.
- Making the copy icon to pop-up for the bit temporarily to indicate the copy action was successful.
- Simply by changing the color of the icon.
Additional context
Before
After
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at the CopyToClipboardBtn component and trace how its copy action is handled. Add the requested copied state and confirmation tooltip after a successful copy, then verify that the feedback appears when the copy icon is used.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100