"use client";

import { useState } from "react";
import WhatsAppPrompt from "@/components/WhatsAppPrompt";
import type { Lang } from "@/lib/config";

type WhatsAppButtonProps = {
  label: string;
  description?: string;
  className?: string;
  lang: Lang;
};

export default function WhatsAppButton({
  label,
  description,
  className,
  lang,
}: WhatsAppButtonProps) {
  const [isModalOpen, setIsModalOpen] = useState(false);

  return (
    <>
      <button
        onClick={() => setIsModalOpen(true)}
        className={
          className ||
          "inline-flex items-center gap-2 rounded-lg bg-[#25D366] px-4 py-2.5 text-sm font-semibold text-white hover:bg-[#22c55e]"
        }
      >
        <span className="block text-xl font-bold text-neutral-900 mb-2 pr-10">
          {label}
        </span>
        {description && (
          <span className="block text-neutral-600">{description}</span>
        )}
      </button>
      <WhatsAppPrompt
        isOpen={isModalOpen}
        onClose={() => setIsModalOpen(false)}
        lang={lang}
      />
    </>
  );
}