import Link from "next/link";
import { Github, Linkedin, Gamepad2 } from "lucide-react";

const Footer = () => {
  const currentYear = new Date().getFullYear();

  const socialLinks = [
    {
      title: "github",
      href: "https://github.com/GKaszewski",
      icon: <Github />,
    },
    {
      title: "linkedin",
      href: "https://www.linkedin.com/in/gabriel-kaszewski-5344b3183",
      icon: <Linkedin />,
    },
    {
      title: "itch.io",
      href: "https://gabrielkaszewski.itch.io/",
      icon: <Gamepad2 />,
    },
  ];

  return (
    <footer className="flex w-full flex-col gap-4 bg-gray-900 p-4 text-white">
      <div className="flex items-center gap-2">
        <h1 className="text-xl">Gabriel Kaszewski</h1>
        <span className="flex-1"></span>
        <div className="flex gap-2">
          {socialLinks.map((link) => (
            <a
              key={link.title}
              title={link.title}
              href={link.href}
              target="_blank"
              rel="noopener noreferrer"
              className="hover:text-yellow-400 transition-colors"
            >
              {link.icon}
            </a>
          ))}
        </div>
      </div>

      <div className="text-sm">
        <p>
          Background photo by{" "}
          <a className="underline" href="https://duckwithsunglasses.com">
            Liam
          </a>
        </p>
      </div>

      <div className="flex flex-wrap gap-x-4 gap-y-2 text-sm">
        <p className="font-semibold">
          &copy; Gabriel Kaszewski, {currentYear}. All rights reserved.
        </p>
        <p>Made with 💗 in Poland</p>
        <span className="flex-1"></span>
        <div className="flex gap-4">
          <Link
            href="/projects"
            className="hover:text-yellow-400 transition-colors"
          >
            Projects
          </Link>
          <a
            href="https://blog.gabrielkaszewski.dev/"
            target="_blank"
            rel="noopener noreferrer"
            className="hover:text-yellow-400 transition-colors"
          >
            Blog
          </a>
          <Link
            href="/about"
            className="hover:text-yellow-400 transition-colors"
          >
            About
          </Link>
        </div>
      </div>
    </footer>
  );
};

export default Footer;