Repository: freeCodeCamp/freeCodeCamp
File: client/src/templates/Introduction/components/super-block-intro.tsx (TypeScript)

Code before:
import React from 'react';
import { useTranslation } from 'react-i18next';
import { Alert, Spacer } from '@freecodecamp/ui';
import { SuperBlocks } from '../../../../../shared/config/curriculum';
import { SuperBlockIcon } from '../../../assets/icons/superblock-icon';
import { Link } from '../../../components/helpers';

interface SuperBlockIntroProps {
  superBlock: SuperBlocks;
  onCertificationDonationAlertClick: () => void;
  isDonating: boolean;
}

export const ConditionalDonationAlert = ({
  superBlock,
  onCertificationDonationAlertClick,
  isDonating
}: SuperBlockIntroProps): JSX.Element => {
  const { t } = useTranslation();

  const betaCertifications = [
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.A2English,
    SuperBlocks.UpcomingPython,
    SuperBlocks.FrontEndDevelopment,
    SuperBlocks.SciCompPy
  ];

  if (!isDonating && betaCertifications.includes(superBlock))
    return (
      <Alert variant='info' className='annual-donation-alert'>
        <p>{t('donate.beta-certification')}</p>
        <hr />
        <p className='btn-container'>
          <Link
            className='btn donate-button'
            key='donate'
            sameTab={false}
            to='/donate'
            onClick={onCertificationDonationAlertClick}
          >
            {t('buttons.donate-now')}
          </Link>
        </p>
      </Alert>
    );
  return <></>;
};

function SuperBlockIntro(props: SuperBlockIntroProps): JSX.Element {
  const { t } = useTranslation();

Review comment (suggestion):
The difference between `betaCertifications` and `unfinishedCertifications` is the former already offer a certification while the latter have not.

Code after:
import React from 'react';
import { useTranslation } from 'react-i18next';
import { Alert, Spacer } from '@freecodecamp/ui';
import { SuperBlocks } from '../../../../../shared/config/curriculum';
import { SuperBlockIcon } from '../../../assets/icons/superblock-icon';
import { Link } from '../../../components/helpers';

interface SuperBlockIntroProps {
  superBlock: SuperBlocks;
  onCertificationDonationAlertClick: () => void;
  isDonating: boolean;
}

export const ConditionalDonationAlert = ({
  superBlock,
  onCertificationDonationAlertClick,
  isDonating
}: SuperBlockIntroProps): JSX.Element => {
  const { t } = useTranslation();

  const betaCertifications = [
    SuperBlocks.JsAlgoDataStructNew,
    SuperBlocks.SciCompPy
  ];

  const unfinishedCertifications = [
    SuperBlocks.A2English,
    SuperBlocks.B1English,
    SuperBlocks.FullStackDeveloper,
    SuperBlocks.UpcomingPython
  ];

  if (!isDonating && betaCertifications.includes(superBlock))
    return (
      <Alert variant='info' className='annual-donation-alert'>
        <p>{t('donate.beta-certification')}</p>
        <hr />
        <p className='btn-container'>
          <Link
            className='btn donate-button'
            key='donate'
            sameTab={false}
            to='/donate'
            onClick={onCertificationDonationAlertClick}
          >
            {t('buttons.donate-now')}
          </Link>
        </p>
      </Alert>
    );