import { Text } from '@react-email/components';
import { TFunction } from 'i18next';

import { EmailFooter } from './footer';

export default function CommonFooter({ t }: { t: TFunction }) {
  const namespace = 'common';

  return (
    <EmailFooter>
      <Text className="text-[16px] leading-[24px] text-[#242424]">
        {t(`${namespace}:footer.title`)}
      </Text>
      <Text className="text-[16px] leading-[24px] text-[#242424]">
        {t(`${namespace}:footer.emailField`)}{' '}
        <a href={`mailto:${t(`${namespace}:footer.title`)}`}>
          {t(`${namespace}:footer.email`)}
        </a>
      </Text>
      <Text className="text-[16px] leading-[24px] text-[#242424]">
        {t(`${namespace}:footer.phoneField`)}{' '}
        <a href={`tel:${t(`${namespace}:footer.phone`)}`}>
          {t(`${namespace}:footer.phone`)}
        </a>
      </Text>
      <Text className="text-[16px] leading-[24px] text-[#242424]">
        <a href={`https://${t(`${namespace}:footer.website`)}`}>
          {t(`${namespace}:footer.website`)}
        </a>
      </Text>
    </EmailFooter>
  );
}