"use client";

import type { ReactNode } from "react";
import { trackWhatsAppOpen } from "@/lib/analytics";
import { buildWhatsAppUrl } from "@/lib/whatsapp";

interface WhatsAppLinkProps {
  children: ReactNode;
  className?: string;
  /** Para o botão flutuante achar o convite (HERO_CTA_ID). */
  id?: string;
  /** Assunto da conversa, na frase "Quero conversar sobre {service}". Sem ele, a mensagem fala de "um projeto". */
  service?: string;
  placement: string;
  /** Chamado junto com a abertura do link, por exemplo para fechar o menu do celular. */
  onClick?: () => void;
}

/** Rótulo de métrica quando o link não traz um assunto; o texto da mensagem usa "um projeto". */
const DEFAULT_ANALYTICS_SERVICE = "Contato";

export default function WhatsAppLink({
  children,
  className = "",
  id,
  service,
  placement,
  onClick,
}: WhatsAppLinkProps) {
  // assunto vazio ou só com espaços vale como ausente: sem isso a mensagem sairia "sobre ."
  const subject = service?.trim() || undefined;
  const analyticsService = subject ?? DEFAULT_ANALYTICS_SERVICE;
  return (
    <a
      id={id}
      href={buildWhatsAppUrl(
        `Olá, Evandro! Quero conversar sobre ${subject ?? "um projeto"}. Contato iniciado pelo site evandro.dev.br.`,
      )}
      target="_blank"
      rel="noopener noreferrer"
      className={`${className} focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--slash)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--ink)]`}
      onClick={(event) => {
        if (event.button === 0)
          trackWhatsAppOpen({ service: analyticsService, placement });
        onClick?.();
      }}
      onAuxClick={(event) => {
        if (event.button === 1)
          trackWhatsAppOpen({ service: analyticsService, placement });
      }}
    >
      {children}
    </a>
  );
}