Add copy button to user messages in chat sidebar

[Copilot]

Adds a copy button at the bottom-left of user-sent messages in the chat sidebar to allow copying message content to clipboard.

Changes

• Added Copy and Check icons from lucide-react
• Implemented clipboard copy with 2-second visual feedback (check icon turns green)
• Extracted text content from message parts via getMessageTextContent helper

Implementation

{userMessageText && (
    <div className="flex justify-start mt-1">
        <button
            onClick={() => copyMessageToClipboard(message.id, userMessageText)}
            className="p-1 text-gray-400 hover:text-gray-600 transition-colors"
            title={copiedMessageId === message.id ? "Copied!" : "Copy message"}
        >
            {copiedMessageId === message.id ? (
                <Check className="h-3.5 w-3.5 text-green-500" />
            ) : (
                <Copy className="h-3.5 w-3.5" />
            )}
        </button>
    </div>
)}

Screenshot

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• fonts.googleapis.com
  • Triggering command: /usr/local/bin/node /usr/local/bin/node /home/REDACTED/work/next-ai-draw-io/next-ai-draw-io/node_modules/next/dist/compiled/jest-worker/processChild.js (dns block)
  • Triggering command: /usr/local/bin/node /usr/local/bin/node /home/REDACTED/work/next-ai-draw-io/next-ai-draw-io/node_modules/next/dist/server/lib/start-server.js (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

Original prompt

我想要在Next-AI-Drawio的这个侧边栏这边，在我已经发送的消息的消息框的底部的左边，添加一个复制按钮，来复制已经发送的消息内容

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[huminglong]

添加消息复制按钮