feat: implemented 1-click clipboard copy button for preview URLs (#49)

[prakshithamalla-art]

Closes #49

🎯 Overview & Motivation

Manually highlighting and selecting text segments for sandbox deployment URLs in the dashboard console page (app/console/deployments/page.tsx) can be cumbersome.

This PR incorporates a clean interactive clipboard copy macro next to deployment preview target fields.

🛠️ Changes Implemented

• Designed an independent client-side state <CopyButton /> module using navigator.clipboard.writeText.
• Configured stateful transition indicators (Copy and Check lucide badges) to provide a clean 2-second visual confirmation window.
• Wrapped links cleanly with an overlay boundary stopping propagation anomalies across table card click targets.

Summary by CodeRabbit

• New Features
  • Added copy-to-clipboard functionality next to each public preview link on the deployments page, allowing users to easily share preview URLs without manual copying
  • Enhanced public preview link visibility by improving how and when preview links are displayed to users
  • Implemented instant visual confirmation feedback that appears when a preview link is successfully copied to the clipboard

[vercel]

@prakshithamalla-art is attempting to deploy a commit to the Deekshith Gowda HS's projects Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

📝 Walkthrough

Walkthrough

The deployments page adds a CopyButton component for copying public preview URLs to the clipboard. Icon imports support the copy/check state visualization. The public preview section is refactored to render the new button whenever a deployment URL is available.

Changes

Preview URL Copy Feature

Layer / File(s)	Summary
CopyButton component with clipboard integration app/console/deployments/page.tsx	Icon imports (Copy, Check) added. New CopyButton component with local "copied" state, clipboard write on click with silent failure handling, and auto-reset success indicator.
Preview URL UI integration app/console/deployments/page.tsx	Public preview section updated to render whenever publicUrl exists; new CopyButton integrated next to the preview link. Status-dependent conditional rendering replaced with unified block. Minor formatting adjustment at module close.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Poem

A rabbit hops through code so clean,
Adds buttons where the URLs gleam,
With clipboard click and check-mark cheer,
Copy flows swift, the path is clear! ✨📋

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly summarizes the main feature added—a clipboard copy button for preview URLs—and is concise, specific, and directly related to the primary change in the changeset.
Linked Issues check	✅ Passed	All requirements from issue #49 are met: CopyButton component implemented with navigator.clipboard.writeText, Copy/Check lucide icons for visual feedback, copy button placed next to public preview URL, and changes made to app/console/deployments/page.tsx.
Out of Scope Changes check	✅ Passed	All changes are directly related to implementing the copy button feature. Minor modifications like removing an inline comment and adjusting closing braces are incidental code maintenance within scope.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

🤖 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/console/deployments/page.tsx`:
- Around line 52-58: The copy button lacks an accessible label for screen
readers; update the <button> that uses handleCopy and the copied state to
include an explicit aria-label (e.g., aria-label={copied ? "URL copied to
clipboard" : "Copy URL to clipboard"}) so the icon-only control has a proper
accessible name and reflects the copied state for assistive tech.

🪄 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

Run ID: 32c87bc6-2304-441d-b07a-d8e4365f7d5f

📥 Commits

Reviewing files that changed from the base of the PR and between d96a51d and d7f197d.

📒 Files selected for processing (1)

• app/console/deployments/page.tsx