diff --git a/frontend/src/app/components/BurnerWallet/BurnerWallet.tsx b/frontend/src/app/components/BurnerWallet/BurnerWallet.tsx index 18198e5..b784f33 100644 --- a/frontend/src/app/components/BurnerWallet/BurnerWallet.tsx +++ b/frontend/src/app/components/BurnerWallet/BurnerWallet.tsx @@ -5,6 +5,7 @@ import AssetTransferModal from "../AssetTransferModal"; import ConnectionModal from "../ConnectionModal"; import { useAccount, useBalance } from "@starknet-react/core"; import { Account, RpcProvider } from "starknet"; +import CopyButton from "../CopyButton"; interface IWallet { address: string; @@ -36,11 +37,6 @@ function BurnerWallet({ wallet }: { wallet: IWallet }) { token: "0x4718f5a0fc34cc1af16a1cdee98ffb20c31f5cd61d6ab07201858f4287c938d", }); - useEffect(() => { - console.log("eth balance.....", ethBalance); - console.log("strk balance....", strkBalance); - }, [ethBalance, strkBalance]); - function handleConnect() { const provider = new RpcProvider({ nodeUrl: @@ -54,8 +50,6 @@ function BurnerWallet({ wallet }: { wallet: IWallet }) { setAccount(account); setIsConnected(true); setIsConnecting(false); - - console.log("account connected"); } return ( @@ -103,12 +97,15 @@ function BurnerWallet({ wallet }: { wallet: IWallet }) { -

- {wallet.address - .slice(0, 12) - .concat("....") - .concat(wallet.address.slice(-6))} -

+
+

+ {wallet.address + .slice(0, 7) + .concat("....") + .concat(wallet.address.slice(-6))} +

+ +
{isConnected ? ( diff --git a/frontend/src/app/components/ConnectionModal.tsx b/frontend/src/app/components/ConnectionModal.tsx index 6848d24..19a67fb 100644 --- a/frontend/src/app/components/ConnectionModal.tsx +++ b/frontend/src/app/components/ConnectionModal.tsx @@ -1,4 +1,5 @@ "use client"; +import CopyButton from "./CopyButton"; import GenericModal from "./GenericModal"; import { useEffect, useState } from "react"; @@ -62,10 +63,13 @@ function ConnectionModal({ isOpen, onClose, handleConnect, wallet }: Props) {

Connect Account

-
+
-

Private Key

+
+

Private Key

+ +
-

Account Address

+
+

Account Address

+ +
Connect diff --git a/frontend/src/app/components/CopyButton.tsx b/frontend/src/app/components/CopyButton.tsx new file mode 100644 index 0000000..a79847a --- /dev/null +++ b/frontend/src/app/components/CopyButton.tsx @@ -0,0 +1,46 @@ +import Image from "next/image"; +import { useEffect, useState } from "react"; + +type Props = { + data: string; +}; + +function CopyButton({ data }: Props) { + const [isCopied, setIsCopied] = useState(false); + + useEffect(() => { + const id = setTimeout(() => { + setIsCopied(false); + }, 1500); + + return () => clearTimeout(id); + }, [isCopied]); + + function handleCopyClick() { + if (!data) return; + navigator.clipboard.writeText(data); + setIsCopied(true); + } + + if (!data) { + return null; + } + return ( + + ); +} + +export default CopyButton;