import { useEffect } from "react";
import { useLocation } from "react-router";
import GenerateNISS from "../components/Geradores/Tipos/GenerateNISS";
import GenerateCC from "../components/Geradores/Tipos/GenerateCC";
import GenerateNIF from "../components/Geradores/Tipos/GenerateNIF";

export default function Home() {
  const location = useLocation(); // Pegando a rota atual

  // Efeito para rolar até a seção correspondente ao path
  useEffect(() => {
    const featuresSection = document.getElementById(location.hash.substring(1));
    if (featuresSection) {
      featuresSection.scrollIntoView({ behavior: "smooth" });
    }

  }, [location]);

  return (
    <div >
      <div >
        {/* Seção de Funcionalidades */}
        <section id="features" className="py-16 px-4 md:px-8">
          <div className="max-w-6xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-8">
            <div id="nif">
              <GenerateNIF />
            </div>
            <div id="niss">
              <GenerateNISS />
            </div>
            <div id="cc">
              <GenerateCC />
            </div>
          </div>
        </section>
      </div>
    </div>
  );
}