feat(wallet): add copy NWC connection string button to header

Adds a copy button (Copy/Check icons) in the wallet header before the
refresh button that copies the NWC connection string to clipboard for
easy sharing or backup.

https://claude.ai/code/session_01CnJgjFMvZHZWs2ujAiWAiQ
This commit is contained in:
Claude
2026-01-29 15:22:16 +00:00
parent 6b38aa365b
commit 1c8b240696

View File

@@ -452,6 +452,9 @@ export default function WalletViewer() {
const [showRawTransaction, setShowRawTransaction] = useState(false);
const [copiedRawTx, setCopiedRawTx] = useState(false);
// Copy NWC connection string state
const [copiedNwc, setCopiedNwc] = useState(false);
// Reset state when connection changes
useEffect(() => {
// Detect connection state changes
@@ -604,6 +607,24 @@ export default function WalletViewer() {
}
}
function copyNwcString() {
if (!state.nwcConnection) return;
const { service, relays, secret, lud16 } = state.nwcConnection;
const params = new URLSearchParams();
relays.forEach((relay) => params.append("relay", relay));
params.append("secret", secret);
if (lud16) params.append("lud16", lud16);
const nwcString = `nostr+walletconnect://${service}?${params.toString()}`;
navigator.clipboard.writeText(nwcString).then(() => {
setCopiedNwc(true);
toast.success("Connection string copied");
setTimeout(() => setCopiedNwc(false), 2000);
});
}
async function handleConfirmSend() {
if (!sendInvoice.trim()) {
toast.error("Please enter an invoice or Lightning address");
@@ -1091,6 +1112,23 @@ export default function WalletViewer() {
</DropdownMenu>
)}
<Tooltip>
<TooltipTrigger asChild>
<button
onClick={copyNwcString}
className="flex items-center gap-1 text-muted-foreground hover:text-foreground transition-colors"
aria-label="Copy connection string"
>
{copiedNwc ? (
<Check className="size-3 text-green-500" />
) : (
<Copy className="size-3" />
)}
</button>
</TooltipTrigger>
<TooltipContent>Copy Connection String</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<button