'use client';

import React from 'react';
import {useTranslations} from 'next-intl';
import Link from 'next/link';
import AppBadges from '@/components/shared/AppBadges/AppBadges';

import './CommunitySection.css';

interface CommunitySectionProps {
  locale: string;
}

export default function CommunitySection({locale}: CommunitySectionProps) {
  const t = useTranslations('HomePage');

  return (
    <section className="tk-community">
      <div className="container text-center">
        <h2 className="tk-community__title">{t('community_title')}</h2>
        <p className="tk-community__subtitle">{t('community_subtitle')}</p>

        <div className="tk-community__ctas">
          <Link href={`/${locale}/adhesion`} className="tk-community__cta tk-community__cta--solid">
            {t('community_cta_join')}
          </Link>
          <Link href={`/${locale}/don`} className="tk-community__cta tk-community__cta--outline">
            {t('community_cta_donate')}
          </Link>
        </div>

        <AppBadges />
      </div>
    </section>
  );
}