import Link from "next/link";
import { useState } from "react";
import { usePathname } from "next/navigation";

export default function MobileMenu({ handleMobileMenu }) {
  const pathname = usePathname();
  const [isActive, setIsActive] = useState({
    status: false,
    key: "",
  });

  const handleToggle = (key) => {
    if (isActive.key === key) {
      setIsActive({
        status: false,
      });
    } else {
      setIsActive({
        status: true,
        key,
      });
    }
  };

  const [sessionAccess, setSessionAccess] = useState(false);

  // Placeholder logic for session access
  // Adjust sessionAccess state as needed based on your logic

  return (
    <>
      <div>
        <ul className="navigation">
          <li>
            <Link href="/" onClick={handleMobileMenu}>
              home
            </Link>
          </li>
          <li>
            <Link href="/about" onClick={handleMobileMenu}>
              about
            </Link>
          </li>
          <li>
            <Link href="/services" onClick={handleMobileMenu}>
              services
            </Link>
          </li>
          <li>
            <Link href="/portfolio" onClick={handleMobileMenu}>
              portfolio
            </Link>
          </li>
          <li>
            <Link href="/team" onClick={handleMobileMenu}>
              our team
            </Link>
          </li>
          <li>
            <Link href="/#seocheck" onClick={handleMobileMenu}>
              SEO checker
            </Link>
          </li>
          <li>
            <Link href="/blog" onClick={handleMobileMenu}>
              blog
            </Link>
          </li>
          <li>
            <Link href="/contact" onClick={handleMobileMenu}>
              contact us
            </Link>
          </li>
        </ul>
        <div className="pl-20 pt-30">
          <div>
            {sessionAccess && (
              <Link href="/client-area" className="btn">
                User Area
              </Link>
            )}
            {!sessionAccess && (
              <Link href="/schedule" className="btn">
                Book a Discovery Call
              </Link>
            )}
          </div>
        </div>
      </div>
    </>
  );
}