import { useTranslations } from "@/hooks/translations";
import "./styles.css";

type FooterProps = {
  color?: "white" | "black";
};

function Footer({ color = "white" }: FooterProps): JSX.Element {
  const { translate } = useTranslations();
  const year = new Date().getFullYear();
  const combinedClassNames = ["page-footer", `page-footer--${color}`]
    .filter(Boolean)
    .join(" ");
  return (
    <footer className={combinedClassNames}>
      <p>
        &copy; {year}, {translate("company_name")}
      </p>
    </footer>
  );
}

export default Footer;
