import dynamic from 'next/dynamic';
import Image from 'next/image';
import { useRouter } from 'next/router';
import { useEffect, useState, useRef } from 'react';
import { useProductContext } from '@/contexts/ProductContext';
import odooApi from '@/core/api/odooApi';
import whatsappUrl from '@/core/utils/whatsappUrl';
import Navbar from '../elements/Navbar/Navbar';
import { AnimatePresence, motion } from 'framer-motion';
const AnimationLayout = dynamic(() => import('./AnimationLayout'), {
ssr: false,
});
const BasicFooter = dynamic(() => import('../elements/Footer/BasicFooter'), {
ssr: false,
});
const BasicLayout = ({ children }) => {
const [templateWA, setTemplateWA] = useState(null);
const [payloadWA, setPayloadWa] = useState(null);
const [urlPath, setUrlPath] = useState(null);
const [isVisible, setIsVisible] = useState(true);
const router = useRouter();
const whatsappRef = useRef(null);
const { product } = useProductContext();
useEffect(() => {
if (
router.pathname === '/shop/product/[slug]' ||
router.pathname === '/shop/product/variant/[slug]'
) {
setPayloadWa({
name: product?.name,
manufacture: product?.manufacture.name,
url: process.env.NEXT_PUBLIC_SELF_HOST + router.asPath,
});
setTemplateWA('product');
setUrlPath(router.asPath);
}
}, [product, router]);
const recordActivity = async (pathname) => {
const ONLY_ON_PATH = false;
const recordedPath = [];
if (ONLY_ON_PATH && !recordedPath.includes(pathname)) return;
const ip = await odooApi('GET', '/api/ip-address');
const data = new URLSearchParams({
page_title: document.title,
url: window.location.href,
ip,
});
fetch(`/api/user-activity?${data.toString()}`);
};
useEffect(() => {
recordActivity(router.pathname);
}, [router.pathname]);
useEffect(() => {
const handleMouseOut = (event) => {
if (event.clientY <= 0) {
setIsVisible(false);
} else {
setIsVisible(true);
}
};
window.addEventListener('mouseout', handleMouseOut);
return () => {
window.removeEventListener('mouseout', handleMouseOut);
};
}, []);
const getWhatsappPosition = () => {
if (whatsappRef.current) {
const rect = whatsappRef.current.getBoundingClientRect();
return {
x: rect.left + 80,
y: rect.top + 40,
width: rect.width,
height: rect.height,
};
}
return { x: 0, y: 0, width: 0, height: 0 };
};
return (
<>
{!isVisible && (
)}
{children}
);
};
export default BasicLayout;