import { Events } from "../../../index";

export default function Footer({
    children,
    companyName,
    address,
    legal,
}: Footer.Footer1) {
    const date: Date = new Date();
    const year: number = date.getFullYear();

    return (
        <footer id="footerContainer" className="darkMode1">
            <div className="m-auto text-sm py-12 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 darkContainer text">
                {children}
            </div>
            <div id="footerLegalContainer" className="darkMode1 text">
                <div className="grid grid-cols-1 md:grid-cols-5">
                    <div></div>
                    <div className="block md:flex md:justify-center md:items-center md:gap-4 col-span-3">
                        {legal.map((item) => (
                            <a
                                key={`key-footer-legal-${Events.Utils.slugify(item.name)}`}
                                className="footerHover mx-auto text-center"
                                href={item.href}
                                aria-label={item.ariaLabel}
                                target={item.target || "_blank"}
                                rel={item.rel || "tag"}
                            >
                                {item.name}
                            </a>
                        ))}
                    </div>
                    <div></div>
                </div>
                <p className="pt-5 px-2">{address}</p>
                <p className="pt-2 px-2">
                    {`Copyright ©️ ${year} ${companyName} Todos los derechos reservados.`}
                </p>
                <p className="text-center md:text-right mx-5 mt-2">
                    Desarrollado por{" "}
                    <a
                        href="https://thejabb.com"
                        rel="external"
                        target="_blank"
                        aria-label="Visitar el sitio de la Agencia Jabb"
                        className="text-white font-semibold"
                    >
                        Agencia Jabb
                    </a>
                </p>
            </div>
        </footer>
    );
}