'use client'
import { useEffect, useState } from "react";

export default function Preloader() {
  const [loading, setLoading] = useState(true);

  useEffect(() => {

    const timer = setTimeout(() => {
      setLoading(false);
    }, 2000); 

    return () => clearTimeout(timer);
  }, []);

  if (!loading) return null; 

  return (
    <div className="loader-wrap  d-flex justify-content-center align-items-center" style={{height:"100vh"}}>
      <div className="preloader">
        <img src="/assets/images/logo.png" alt="Rapha Rehab Etobicoke" className="preloader-icon" />
        {/* <div className="preloader-close">Preloader Close</div> */}
      </div>
      <div className="layer layer-one"><span className="overlay" /></div>
      <div className="layer layer-two"><span className="overlay" /></div>
      <div className="layer layer-three"><span className="overlay" /></div>
    </div>
  );
}
