import { getCoinbaseBuyUrl } from "@dynamic-labs-sdk/client";

const { url } = await getCoinbaseBuyUrl({
  destinationAddress: "0x1234...",
  defaultAsset: "ETH",
  networks: ["ethereum"],
  fiatCurrency: "USD",
  presetCryptoAmount: "0.1",
});

// Open in a new window
window.open(url, "_blank", "width=500,height=600");

import { getCoinbaseBuyUrl } from "@dynamic-labs-sdk/client";

const BuyWithCoinbaseButton = ({ walletAddress }) => {
  const handleBuy = async () => {
    const { url } = await getCoinbaseBuyUrl({
      destinationAddress: walletAddress,
      defaultAsset: "ETH",
      networks: ["ethereum"],
      fiatCurrency: "USD",
      presetCryptoAmount: "0.1",
    });

    // Open Coinbase in a popup window
    window.open(url, "_blank", "width=500,height=600");
  };

  return <button onClick={handleBuy}>Buy with Coinbase</button>;
};

import { getCoinbaseBuyUrl } from "@dynamic-labs-sdk/client";

const redirectToCoinbase = async (walletAddress) => {
  const { url } = await getCoinbaseBuyUrl({
    destinationAddress: walletAddress,
    defaultAsset: "USDC",
    networks: ["polygon"],
    fiatCurrency: "USD",
  });

  // Redirect the entire page to Coinbase
  window.location.href = url;
};

import { useGetCoinbaseBuyUrl } from "@dynamic-labs-sdk/react-hooks";

function BuyWithCoinbase({ walletAddress }) {
  const { data: coinbaseBuyUrl, isLoading } = useGetCoinbaseBuyUrl({
    destinationAddress: walletAddress,
    defaultAsset: "ETH",
    networks: ["ethereum"],
    fiatCurrency: "USD",
  });

  return (
    <button
      disabled={isLoading || !coinbaseBuyUrl?.url}
      onClick={() => {
        const url = coinbaseBuyUrl?.url;
        if (url && new URL(url).protocol === "https:") {
          window.open(url, "_blank", "width=500,height=600");
        }
      }}
    >
      {isLoading ? "Loading..." : "Buy with Coinbase"}
    </button>
  );
}