import Link from "next/link";
import Image from "next/image";
import {
  FaPhoneAlt,
  FaEnvelope,
  FaMapMarkerAlt,
  FaFacebookF,
  FaLinkedinIn,
  FaYoutube,
  FaInstagram,
} from "react-icons/fa";
import { FaXTwitter } from "react-icons/fa6";
import { getCategories } from "@/lib/products";

export default function Footer() {
  const categories = getCategories();
  const year = new Date().getFullYear();

  const quickLinks = [
    { title: "Home", href: "/" },
    { title: "Products", href: "/products" },
    { title: "Company Profile", href: "/company-profile" },
    { title: "Sitemap", href: "/sitemap" },
    { title: "Contact", href: "/contact" },
    { title: "Our Catalogue", href: "/catalogue" },
  ];

  const socialLinks = [
    { icon: <FaFacebookF size={14} />, href: "#" },
    { icon: <FaXTwitter size={14} />, href: "#" },
    { icon: <FaLinkedinIn size={14} />, href: "#" },
    { icon: <FaYoutube size={14} />, href: "#" },
    { icon: <FaInstagram size={14} />, href: "#" },
  ];

  return (
    <footer className="bg-[#232831] text-gray-300 mt-auto">
      <div className="max-w-7xl mx-auto px-5 py-14">
        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-10">
          {/* About */}
          <div>
            <Image
              src="/logo.jpeg"
              alt="GS Machinery"
              width={70}
              height={70}
              className="object-contain bg-white p-1 mb-4"
            />
            <p className="text-sm leading-6 text-gray-400">
              Manufacturer of PET blowing machines, bottle &amp; jar making
              machines, blow moulding machines and water filling machines.
            </p>
            <div className="flex items-center gap-2 mt-5">
              {socialLinks.map((item, index) => (
                <Link
                  key={index}
                  href={item.href}
                  className="w-8 h-8 rounded-sm bg-white/10 hover:bg-[#b99631] transition-all duration-300 flex items-center justify-center"
                >
                  {item.icon}
                </Link>
              ))}
            </div>
          </div>

          {/* Quick Links */}
          <div>
            <h3 className="text-white text-[15px] font-semibold uppercase tracking-wide mb-5">
              Quick Links
            </h3>
            <ul className="space-y-3 text-sm">
              {quickLinks.map((item) => (
                <li key={item.title}>
                  <Link
                    href={item.href}
                    className="hover:text-[#c3ab5d] transition-colors duration-300"
                  >
                    {item.title}
                  </Link>
                </li>
              ))}
            </ul>
          </div>

          {/* Categories */}
          <div>
            <h3 className="text-white text-[15px] font-semibold uppercase tracking-wide mb-5">
              Categories
            </h3>
            <ul className="space-y-3 text-sm">
              {categories.map((category) => (
                <li key={category.slug}>
                  <Link
                    href={`/products?category=${category.slug}`}
                    className="hover:text-[#c3ab5d] transition-colors duration-300"
                  >
                    {category.name}
                  </Link>
                </li>
              ))}
            </ul>
          </div>

          {/* Contact */}
          <div>
            <h3 className="text-white text-[15px] font-semibold uppercase tracking-wide mb-5">
              Contact Us
            </h3>
            <ul className="space-y-4 text-sm">
              <li className="flex items-start gap-3">
                <FaMapMarkerAlt className="mt-1 text-[#c3ab5d] shrink-0" />
                <span>GST : 07AICPG7964K1ZW</span>
              </li>
              <li className="flex items-center gap-3">
                <FaPhoneAlt className="text-[#c3ab5d] shrink-0" />
                <a
                  href="tel:+919910050448"
                  className="hover:text-[#c3ab5d] transition-colors duration-300"
                >
                  +91 9910050448
                </a>
              </li>
              <li className="flex items-center gap-3">
                <FaEnvelope className="text-[#c3ab5d] shrink-0" />
                <a
                  href="mailto:info@gsmachinery1.com"
                  className="hover:text-[#c3ab5d] transition-colors duration-300"
                >
                  info@gsmachinery1.com
                </a>
              </li>
            </ul>
          </div>
        </div>
      </div>

      <div className="border-t border-white/10">
        <div className="max-w-7xl mx-auto px-5 py-5 flex flex-col sm:flex-row items-center justify-between gap-3 text-xs text-gray-400">
          <p>&copy; {year} GS Machinery. All Rights Reserved.</p>
          <p>Designed &amp; Developed with care</p>
        </div>
      </div>
    </footer>
  );
}