From 235cec47f09e98ba2d2fde99ffa7cca76c855579 Mon Sep 17 00:00:00 2001 From: yueying12345678-sudo Date: Sat, 6 Jun 2026 16:07:21 +0800 Subject: [PATCH] fix: click truncated address copies full address Add onClick handler to copy full address to clipboard. Visual feedback with 'Copied!' state + keyboard support. --- src/components/web3/AddressMini.tsx | 47 +++++++++++++++++++++++++---- 1 file changed, 41 insertions(+), 6 deletions(-) diff --git a/src/components/web3/AddressMini.tsx b/src/components/web3/AddressMini.tsx index 9dbe2d64..c032a32b 100644 --- a/src/components/web3/AddressMini.tsx +++ b/src/components/web3/AddressMini.tsx @@ -1,21 +1,56 @@ +import { useState } from 'react' + interface AddressMiniProps { value: string withSidebar?: boolean } const AddressMini: React.FC = ({ value, withSidebar = true }) => { - // Assuming use of a utility to shorten addresses; you'll need to implement this based on your needs - const shortAddress = `${value.substring(0, 6)}…${value.substring(value.length - 4)}` + const [copied, setCopied] = useState(false) + + const handleCopy = async () => { + try { + await navigator.clipboard.writeText(value) + setCopied(true) + setTimeout(() => setCopied(false), 1500) + } catch { + // Fallback for older environments + const textarea = document.createElement('textarea') + textarea.value = value + textarea.style.position = 'fixed' + textarea.style.opacity = '0' + document.body.appendChild(textarea) + textarea.select() + document.execCommand('copy') + document.body.removeChild(textarea) + setCopied(true) + setTimeout(() => setCopied(false), 1500) + } + } + + const shortAddress = `${value.substring(0, 6)}...${value.substring(value.length - 4)}` return ( -
+
{ if (e.key === 'Enter') handleCopy() }} + title="Click to copy full address" + > {withSidebar && (
A
- )}{' '} - {/* Placeholder for an avatar */} - {shortAddress} + )} + + {copied ? 'Copied!' : shortAddress} +
) }