import { useEffect, useState, useCallback } from 'react';
import { useRouter } from 'next/router';
import { useDispatch, useSelector } from 'react-redux';
import { IRootState } from '@/store';
import { setUser } from '@/store/userConfigSlice';

interface RedirectHomeProps {
    children: React.ReactNode;
}

const RedirectHome: React.FC<RedirectHomeProps> = ({ children }) => {
    const router = useRouter();
    const [isLogin, setIsLogin] = useState(false); // Replace with your login state logic
    const [isMounted, setIsMounted] = useState(false);

    useEffect(() => {
        setIsMounted(true);
    }, []);
    const user = useSelector((state: IRootState) => state.userConfig.user);
    const dispatch = useDispatch();
    const getAccount = useCallback(async () => {
        try {
            const api_url = process.env.API_URL;

            const response = await fetch(`${api_url}api/users/admin-account`, {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json',
                },
                credentials: 'include', // Include this option
            });

            const res = await response.json();
            console.log(res);
            if (!response.ok) {
                dispatch(setUser('false'));
                return;
            }
            setIsLogin(true);
        } catch (error) {
            console.error(error);
        }
    }, []);
    useEffect(() => {
        if (isMounted) {
            if (user === 'false') {
                setIsLogin(false);
                return;
            }
            getAccount();
        }
    }, [getAccount, user, isMounted]);

    useEffect(() => {
        if (isLogin) {
            router.replace('/'); // Redirect to login page if not logged out
            return;
        }
    }, [isLogin]);

    return <>{children}</>;
};

export default RedirectHome;