diff --git a/apps/web-roo-code/src/components/homepage/install-section.tsx b/apps/web-roo-code/src/components/homepage/install-section.tsx index 79e2fbe857..94f2d6e804 100644 --- a/apps/web-roo-code/src/components/homepage/install-section.tsx +++ b/apps/web-roo-code/src/components/homepage/install-section.tsx @@ -3,12 +3,38 @@ import { VscVscode } from "react-icons/vsc" import Link from "next/link" import { motion } from "framer-motion" +import { Copy, Check } from "lucide-react" +import { useState } from "react" interface InstallSectionProps { downloads: string | null } export function InstallSection({ downloads }: InstallSectionProps) { + const [copied, setCopied] = useState(false) + const installCmd = "code --install-extension RooVeterinaryInc.roo-cline" + + const handleCopy = async () => { + try { + await navigator.clipboard.writeText(installCmd) + setCopied(true) + setTimeout(() => setCopied(false), 1000) + } catch (_e) { + // Fallback for environments without Clipboard API support + const textarea = document.createElement("textarea") + textarea.value = installCmd + document.body.appendChild(textarea) + textarea.select() + try { + document.execCommand("copy") + setCopied(true) + setTimeout(() => setCopied(false), 1000) + } finally { + document.body.removeChild(textarea) + } + } + } + const backgroundVariants = { hidden: { opacity: 0, @@ -84,12 +110,27 @@ export function InstallSection({ downloads }: InstallSectionProps) {
-
or via CLI
+
+
or via CLI
+ +
 												
-													code --install-extension RooVeterinaryInc.roo-cline
+													{installCmd}