diff --git a/src/components/TokenDropdown.tsx b/src/components/TokenDropdown.tsx index 9aeb126..3fe28dc 100644 --- a/src/components/TokenDropdown.tsx +++ b/src/components/TokenDropdown.tsx @@ -1,3 +1,5 @@ +"use client"; + import React, { useState, useRef, useEffect, useMemo } from "react"; import { ChevronDown, Search, X, Copy } from "lucide-react"; import { useDebounce } from "../hooks/useDebounce"; @@ -25,11 +27,13 @@ export default function TokenDropdown({ onTokenChange }: TokenDropdownProps) { // Hardcoded array of tokens const tokens = ["XLM", "USDC", "yXLM"]; - // Mock addresses so the copy function has something to grab + /** * ISSUE #86: Mock addresses for copy functionality. + * In a production environment, these would come from a token list API. + */ const mockAddresses: Record = { "XLM": "native", - "USDC": "CBQ6O7Y4O7Z5J2...", // Dummy Stellar contract address - "yXLM": "CBP3T2...", + "USDC": "CBQ6O7Y4O7Z5J2... (Stellar Contract)", + "yXLM": "CBP3T2... (Yield Stellar Asset)", }; // Memoize filtered tokens based on debounced search value @@ -69,17 +73,19 @@ export default function TokenDropdown({ onTokenChange }: TokenDropdownProps) { } }; - /* * ISSUE #86: Handler to copy token address to clipboard without closing the dropdown */ + /** + * ISSUE #86: Clipboard handler. + * Uses stopPropagation to ensure the dropdown doesn't close when copying. + */ const handleCopyAddress = (e: React.MouseEvent, token: string) => { - e.stopPropagation(); // Prevents the parent button's onClick (handleTokenSelect) from firing - const address = mockAddresses[token] || "Unknown Address"; - + e.stopPropagation(); + const address = mockAddresses[token] || "Address not found"; + navigator.clipboard.writeText(address) .then(() => { toast.success("Token Address Copied!"); }) - .catch((err) => { - console.error("Failed to copy text: ", err); + .catch(() => { toast.error("Failed to copy address"); }); }; @@ -119,7 +125,7 @@ export default function TokenDropdown({ onTokenChange }: TokenDropdownProps) { {searchInput && (