Summary
Users have no quick way to copy their public profile URL (/u/[username]) from the dashboard. This is a great beginner-friendly UI task!
What needs to be done
- Create a new file
src/components/ShareProfileButton.tsx
- Add a "Share Profile" button near the user avatar in the dashboard header
- On click, copy
https://devtrack-delta.vercel.app/u/[username] to clipboard
- Show a "Link copied!" toast using the existing shadcn/ui toast system
- Switch the button icon from
Link2 → Check for 2 seconds after copy
Files to touch
src/components/ShareProfileButton.tsx (new file)
src/app/dashboard/page.tsx (add button near avatar)
Hints
- Use
navigator.clipboard.writeText() for clipboard copy
- Use
lucide-react icons — already installed (Link2, Check)
- Use shadcn/ui
Button, Tooltip, and useToast — all already in the project
- Wrap clipboard call in try/catch for error handling
Good for
Someone comfortable with React + TypeScript basics looking for their first Next.js contribution.
Summary
Users have no quick way to copy their public profile URL (
/u/[username]) from the dashboard. This is a great beginner-friendly UI task!What needs to be done
src/components/ShareProfileButton.tsxhttps://devtrack-delta.vercel.app/u/[username]to clipboardLink2→Checkfor 2 seconds after copyFiles to touch
src/components/ShareProfileButton.tsx(new file)src/app/dashboard/page.tsx(add button near avatar)Hints
navigator.clipboard.writeText()for clipboard copylucide-reacticons — already installed (Link2,Check)Button,Tooltip, anduseToast— all already in the projectGood for
Someone comfortable with React + TypeScript basics looking for their first Next.js contribution.