feat: add visual feedback when profile link is copied - #98
feat: add visual feedback when profile link is copied#98aditya2206-afk wants to merge 5 commits into
Conversation
|
@aditya2206-afk is attempting to deploy a commit to the vishnukothakapu's projects Team on Vercel. A member of the Team first needs to authorize it. |
📝 WalkthroughWalkthroughLinkIdCard now copies full profile URLs asynchronously, shows success or failure toasts, adds copy-button accessibility attributes, and secures its external link. LinkItem renders its external link through an ChangesDashboard link clipboard and UI updates
Estimated code review effort: 3 (Moderate) | ~20 minutes Suggested labels: Suggested reviewers: 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 Biome (2.5.3)app/dashboard/LinkItem.tsxFile contains syntax errors that prevent linting: Line 122: Illegal return statement outside of a function; Line 323: Expected a statement but instead found '} 🔧 ESLint
app/dashboard/LinkItem.tsxParsing error: Declaration or statement expected. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@app/dashboard/LinkIdCard.tsx`:
- Line 18: The clipboard copy currently writes a scheme-less URL; update the
navigator.clipboard.writeText call in LinkIdCard.tsx (the place where you build
the profile link) to copy a fully-qualified URL by prepending the scheme (e.g.,
"https://") so it writes "https://linkid.qzz.io/${username}" instead of
"linkid.qzz.io/${username}".
In `@app/dashboard/LinkItem.tsx`:
- Around line 41-43: The copy action currently writes a scheme-less path via
navigator.clipboard.writeText(`linkid.qzz.io/${username}/${link.platform}`); —
change it to write a full URL by prepending the scheme (e.g. use
`https://linkid.qzz.io/${username}/${link.platform}`) so pasted output is
clickable; update the code in LinkItem.tsx where navigator.clipboard.writeText
is called and ensure the template uses the existing username and link.platform
variables unchanged.
- Around line 113-126: The JSX in the LinkItem component nests a <Button> inside
an <a>, which is invalid; change to render the <Button> with asChild and place
the <a> as the child so the anchor becomes the actual interactive element.
Specifically, in the block using link.url / link.label / link.platform and the
ExternalLink icon, replace the outer <a> wrapping the <Button> with <Button
asChild> and move href, target, rel, aria-label (and any link-specific props)
onto the inner <a> so the anchor receives those attributes while the Button
styles/behavior are preserved; keep title and the ExternalLink element as
before. Ensure you update the JSX in the LinkItem component (the fragment using
Button, ExternalLink, and link.url/link.label/link.platform) accordingly.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 301077c8-8442-4f69-a09b-a0fd4c4cf8cd
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (2)
app/dashboard/LinkIdCard.tsxapp/dashboard/LinkItem.tsx
|
Thanks for the review ✅ Updated the copy actions to use fully-qualified URLs (https://) and refactored nested interactive elements using the Please let me know if any further changes are needed. |
|
All issues fixed. Ready for review. Please approve workflow and merge. |
|
Thanks for pointing that out ✅ Removed duplicate URL argument and corrected the nested button structure. Everything should now follow proper accessibility and clipboard usage. Please let me know if anything else needs refinement. |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
vishnukothakapu
added
gssoc:approved
type:feature
level:beginner
completed
and removed
completed
labels
|
@vishnukothakapu (or @aparna24bce11388 if they are the primary maintainer) Hi, it looks like the Could you please take a look at this? If it's a non-blocking check, or if you can adjust the workflow permissions, the PR should be ready for merge. Thanks for your time and guidance! |
|
✅ All checks (except Copilot permission issue) have passed. Kindly review and merge the PR when possible. Thank you! |
|
Hi @aditya2206-afk, the Copilot review error is from our workflow side, not from your PR. Your PR looks good and the required checks have passed successfully. Please wait for the mentor review. Once the mentor review is completed, the PR will be merged. |
|
Hi @aditya2206-afk, could you please resolve the merge conflicts as well? |
|
✅ Merge conflicts resolved successfully. Kindly review and merge the PR when possible. Thank you! |
|
✅ All checks are passing and conflicts resolved. Kindly merge when possible. Thank you! |
Hi @aditya2206-afk, Please wait for the mentor review. Once the mentor review is completed, the PR will be merged. |
|
hey @aditya2206-afk. pls review ur pr again: 1.the last commit deleted the package-lock.json file |
|
@aditya2206-afk any updates? |
|
hi @aditya2206-afk. pls update your progress and resolve conflicts |
|
Hi @aditya2206-afk , |
|
hey @aditya2206-afk. Pls resolve conflicts |
|
Hey @aditya2206-afk! Saw your work on GSSoC 2026. We are building TermUI, a TypeScript terminal UI framework with React-style hooks and JSX, rendered entirely in the terminal. We have 99 unassigned GSSoC issues open, including new widgets, hooks, and CLI tooling. Your TypeScript background transfers directly. Karanjot, TermUI maintainer |
|
hey @aditya2206-afk. pls resolve conflicts |
|
Conflicts resolved |
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
app/dashboard/LinkItem.tsx (2)
88-90: 🎯 Functional Correctness | 🟠 MajorThe copied URL is still scheme-less.
This repeats the previously reported issue:
linkid.qzz.io/...is not a fully qualified, reliably clickable profile URL. Prefix it withhttps://.Proposed fix
- `linkid.qzz.io/${username}/${link.alias || link.platform}` + `https://linkid.qzz.io/${username}/${link.alias || link.platform}`🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@app/dashboard/LinkItem.tsx` around lines 88 - 90, Update the URL passed to navigator.clipboard.writeText in LinkItem so it starts with https:// while preserving the existing username and alias/platform path construction.
88-93: 🩺 Stability & Availability | 🟠 Major | ⚡ Quick winHandle clipboard failures before showing success.
navigator.clipboard.writeText()returns a promise, but the handler neither awaits nor catches it. Failed copies still show “Copied” and can produce unhandled promise errors.Proposed fix
- navigator.clipboard.writeText( - `linkid.qzz.io/${username}/${link.alias || link.platform}` - ); - setCopied(true); - toast.success("Copied"); - setTimeout(() => setCopied(false), 1200); + try { + await navigator.clipboard.writeText( + `https://linkid.qzz.io/${username}/${link.alias || link.platform}` + ); + setCopied(true); + toast.success("Copied"); + setTimeout(() => setCopied(false), 1200); + } catch { + toast.error("Failed to copy"); + }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@app/dashboard/LinkItem.tsx` around lines 88 - 93, Update the clipboard handler in LinkItem to await navigator.clipboard.writeText before calling setCopied, toast.success, or scheduling the reset; catch failures and avoid showing the success state or toast when the copy operation rejects.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@app/dashboard/LinkItem.tsx`:
- Around line 95-97: Remove the extra closing brace immediately before the save
function in LinkItem, keeping save and the later JSX return inside the LinkItem
component function so the file compiles.
---
Outside diff comments:
In `@app/dashboard/LinkItem.tsx`:
- Around line 88-90: Update the URL passed to navigator.clipboard.writeText in
LinkItem so it starts with https:// while preserving the existing username and
alias/platform path construction.
- Around line 88-93: Update the clipboard handler in LinkItem to await
navigator.clipboard.writeText before calling setCopied, toast.success, or
scheduling the reset; catch failures and avoid showing the success state or
toast when the copy operation rejects.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: b6d0dae1-0880-4ba0-9410-8d6fc694df9e
⛔ Files ignored due to path filters (1)
dev.dbis excluded by!**/*.db
📒 Files selected for processing (1)
app/dashboard/LinkItem.tsx
| } | ||
|
|
||
| async function save() { |
There was a problem hiding this comment.
🎯 Functional Correctness | 🔴 Critical | ⚡ Quick win
Remove the extra closing brace.
Line 95 closes LinkItem before save() and the component’s later JSX return, leaving the return outside a function and breaking compilation.
Proposed fix
setTimeout(() => setCopied(false), 1200);
}
- }
async function save() {📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| } | |
| async function save() { | |
| async function save() { |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@app/dashboard/LinkItem.tsx` around lines 95 - 97, Remove the extra closing
brace immediately before the save function in LinkItem, keeping save and the
later JSX return inside the LinkItem component function so the file compiles.
5 participants
Fixes #94
Description
Added visual feedback when the profile link is copied.
Changes Made
GSSoC
Participant
Summary by CodeRabbit