ConnectWalletButton.tsx
1 import { useConnectModal } from "@rainbow-me/rainbowkit"; 2 3 export default function ConnectWalletButton( 4 { onClick, disabled }: { onClick?: () => void; disabled?: boolean }, 5 ) { 6 const { openConnectModal } = useConnectModal(); 7 return ( 8 <button 9 data-testid="rainbowkit-connect-wallet" 10 className={`rounded-lg flex flex-col items-center gap-2 ${ 11 disabled ? "opacity-50" : "" 12 }`} 13 style={{ backgroundColor: "transparent", padding: 0 }} 14 onClick={onClick ?? openConnectModal} 15 type="button" 16 disabled={disabled} 17 > 18 <img 19 src="/icons/wallet-icon.svg" 20 width={40} 21 height={40} 22 alt="wallet-icon" 23 className="w-10 h-10" 24 /> 25 <div className="flex gap-2 items-center"> 26 <p>Connect wallet</p> 27 <img 28 src="/icons/chevron-right.svg" 29 width={12} 30 height={12} 31 alt="chevron" 32 className="w-3 h-3" 33 /> 34 </div> 35 </button> 36 ); 37 }