import Image from "next/image";
import { Poppins } from "next/font/google";

import { cn } from "@/lib/utils";

const font = Poppins({
  subsets: ["latin"],
  weight: ["400", "600"],
});

interface LogoProps {
  text?: string;
  showText?: boolean;
  showCopyright?: boolean;
}

const Logo = ({ text, showText, showCopyright }: LogoProps) => {
  return (
    <div className="flex items-center gap-x-2">
      <Image
        src="/logo.png"
        height="40"
        width="40"
        alt="Logo"
        className="dark:hidden"
      />
      <Image
        src="/logo-white.png"
        height="40"
        width="40"
        alt="Logo"
        className="hidden dark:block"
      />
      {showText && (
        <p className={cn("font-semibold invisible md:visible", font.className)}>
          {text}
        </p>
      )}
      {showCopyright && (
        <div className="w-[230px] text-sm font-medium text-muted-foreground">
          &copy; {new Date().getFullYear()} G-SPACE, Inc
        </div>
      )}
    </div>
  );
};

export default Logo;