'use client';

import { appConstants } from '@/assets/constants';
import images from '@/assets/images/images';
import { Icon, IconName } from '@/components/uikit/icons';
import Image from 'next/image';
import Link from 'next/link';
import { useTranslations } from 'next-intl';
import LanguageSwitch from '../languageSwitch';

export default function FooterInfo({
  withLogo,
  className,
}: {
  withLogo?: boolean;
  className?: string;
}) {
  const t = useTranslations();

  return (
    <div
      className={`flex w-full flex-col gap-3 max-lg:text-center lg:w-auto ${className}`}
    >
      {withLogo && (
        <Link href="/" className="mx-auto h-8 w-auto">
          <Image
            alt="logo"
            src={images.logo}
            className="h-full w-auto object-contain"
          />
        </Link>
      )}

      <p className="text-sm tracking-normal">{t('footer_slogan')}</p>
      <div className="flex items-center gap-4 max-lg:justify-center">
        {appConstants.socials.map((social) => (
          <Link
            href={social.link}
            key={social.title}
            className="text-white lg:flex-1"
          >
            <Icon name={social.icon as IconName} className="text-primary" />
          </Link>
        ))}
      </div>
      <LanguageSwitch />
    </div>
  );
}
