"use client";

import { whatsappOrderUrl } from "@/lib/whatsapp";
import { useMemo } from "react";

export function WhatsappOrderButton({
  itemName,
  prefetchName,
  prefetchEmail,
  className,
}: {
  itemName: string;
  prefetchName?: string | null;
  prefetchEmail?: string | null;
  className?: string;
}) {
  const href = useMemo(
    () =>
      whatsappOrderUrl({
        itemName,
        memberName: prefetchName ?? "Pengunjung",
        memberEmail: prefetchEmail ?? "-",
      }),
    [itemName, prefetchEmail, prefetchName],
  );

  return (
    <a
      href={href}
      target="_blank"
      rel="noopener noreferrer"
      className={
        className ??
        "inline-flex items-center justify-center rounded-xl border border-emerald-500/40 bg-emerald-500/15 px-4 py-2 text-sm font-semibold text-emerald-200 transition hover:bg-emerald-500/25"
      }
    >
      Order WhatsApp
    </a>
  );
}