import { useState, useEffect, useRef } from ‘react’;
import { Phone } from ‘lucide-react’;

const WhatsAppButton = () => {
const [greeting, setGreeting] = useState(”);
const [isAnimating, setIsAnimating] = useState(false);
const animationRef = useRef(null);

// Função para obter a saudação baseada na hora
const getGreeting = () => {
const hour = new Date().getHours();

if (hour >= 2 && hour < 5) {
return ‘Olá, boa madrugada 😁’;
} else if (hour >= 5 && hour < 12) {
return ‘Olá, bom dia 😁’;
} else if (hour >= 12 && hour < 18) {
return ‘Olá, boa tarde 😁’;
} else {
return ‘Olá, boa noite 😁’;
}
};

// Efeito de digitação
const typeText = async (text, setTextFunction) => {
let currentText = ”;

for (let i = 0; i < text.length; i++) {
currentText += text[i];
setTextFunction(currentText);
await new Promise(resolve => setTimeout(resolve, 100));
}
};

// Efeito de apagar
const eraseText = async (text, setTextFunction) => {
let currentText = text;

for (let i = text.length; i >= 0; i–) {
currentText = text.substring(0, i);
setTextFunction(currentText);
await new Promise(resolve => setTimeout(resolve, 50));
}
};

// Gerenciar ciclo de animação
useEffect(() => {
const startAnimationCycle = async () => {
if (isAnimating) return;
setIsAnimating(true);

const cycle = async () => {
const currentGreeting = getGreeting();
await typeText(currentGreeting, setGreeting);
await new Promise(resolve => setTimeout(resolve, 10000));
await eraseText(currentGreeting, setGreeting);
await typeText(‘Vamos crescer juntos?’, setGreeting);
await new Promise(resolve => setTimeout(resolve, 10000));
await eraseText(‘Vamos crescer juntos?’, setGreeting);
await new Promise(resolve => setTimeout(resolve, 30000));

animationRef.current = requestAnimationFrame(cycle);
};

cycle();
};

startAnimationCycle();

return () => {
if (animationRef.current) {
cancelAnimationFrame(animationRef.current);
}
setIsAnimating(false);
};
}, []);

const handleWhatsAppClick = () => {
const message = encodeURIComponent(‘Olá, vim pelo site e gostaria de mais informações sobre Panfletagem Digital, por favor.’);
const whatsappUrl = `https://api.whatsapp.com/send?phone=5512988515867&text=${message}`;
window.open(whatsappUrl, ‘_blank’);
};

return (
<div className=”fixed bottom-6 right-6 flex items-center gap-4″>
{greeting && (
<div className=”bg-white p-3 rounded-lg shadow-lg”>
<p className=”text-gray-800 whitespace-nowrap”>{greeting}</p>
</div>
)}
<button
onClick={handleWhatsAppClick}
className=”bg-green-500 hover:bg-green-600 text-white rounded-full p-4 shadow-lg”
style={{
animation: ‘spin 10s linear infinite’
}}
>
<Phone size={24} />
</button>
</div>
);
};

export default WhatsAppButton;