"use client";
import { useCallback, useEffect, useState } from "react";
import { ArrowUp, Phone } from "lucide-react";
import CallbackModal from "./CallbackModal";
const WA_LINK =
"https://wa.me/919818993537?text=Hello%20MxERP%20team%2C%20I%27m%20interested%20in%20a%20demo%20for%20my%20business.%20Please%20share%20the%20details.";
const TEL_LINK = "tel:+919818993537";
/* Official WhatsApp glyph (lucide ships no brand icons) */
function WhatsAppIcon({ size = 26 }: { size?: number }) {
return (
);
}
export default function FloatingActions() {
const [showTop, setShowTop] = useState(false);
const [callbackOpen, setCallbackOpen] = useState(false);
const closeCallback = useCallback(() => {
setCallbackOpen(false);
// Return focus to the trigger for keyboard users
document.getElementById("floating-call-btn")?.focus();
}, []);
// Touch devices get the native dialer; desktops get the callback popup.
const handleCall = () => {
const coarse = window.matchMedia("(pointer: coarse)").matches;
if (coarse) {
window.location.href = TEL_LINK;
} else {
setCallbackOpen(true);
}
};
// Any page can open the callback popup: window.dispatchEvent(new Event("mx:open-callback"))
useEffect(() => {
const open = () => {
const coarse = window.matchMedia("(pointer: coarse)").matches;
if (coarse) {
window.location.href = TEL_LINK;
} else {
setCallbackOpen(true);
}
};
window.addEventListener("mx:open-callback", open);
return () => window.removeEventListener("mx:open-callback", open);
}, []);
useEffect(() => {
// Show the arrow once the visitor scrolls a short way down. A low
// threshold (not 600) so it appears consistently on every viewport,
// and rAF-throttled so no scroll event is ever missed.
let ticking = false;
const update = () => {
ticking = false;
const y = window.scrollY || document.documentElement.scrollTop || 0;
setShowTop(y > 1000);
};
const onScroll = () => {
if (!ticking) {
ticking = true;
requestAnimationFrame(update);
}
};
update();
window.addEventListener("scroll", onScroll, { passive: true });
return () => window.removeEventListener("scroll", onScroll);
}, []);
return (
{showTop && (
)}
{callbackOpen &&
}