"use client";

import { FaApple, FaFacebookF } from "react-icons/fa6";
import { FcGoogle } from "react-icons/fc";

export type AuthProviderIconName = "facebook" | "google" | "apple";

export interface AuthProviderIconProps {
  provider: AuthProviderIconName;
  size?: number;
  className?: string;
}

export function AuthProviderIcon({
  provider,
  size = 20,
  className,
}: AuthProviderIconProps) {
  if (provider === "google") {
    return <FcGoogle size={size} className={className} aria-hidden="true" />;
  }

  if (provider === "apple") {
    return <FaApple size={size} className={className} aria-hidden="true" />;
  }

  return (
    <FaFacebookF
      size={size}
      className={className}
      color="var(--color-facebook-blue)"
      aria-hidden="true"
    />
  );
}
