alva/src/components/StripeEmbeddedCheckout.tsx

import { EmbeddedCheckoutProvider, EmbeddedCheckout } from "@stripe/react-stripe-js";
import { getStripe } from "@/lib/stripe";

interface Props {
  fetchClientSecret: () => Promise<string>;
}

export function StripeEmbeddedCheckout({ fetchClientSecret }: Props) {
  return (
    <div id="checkout">
      <EmbeddedCheckoutProvider stripe={getStripe()} options={{ fetchClientSecret }}>
        <EmbeddedCheckout />
      </EmbeddedCheckoutProvider>
    </div>
  );
}