react-component-form/example/components/Header/Language/LanguageFlag.tsx

import Image from 'next/image'

export interface LanguageFlagProps {
  language: string
}

export const LanguageFlag: React.FC<LanguageFlagProps> = (props) => {
  const { language } = props

  return (
    <>
      <Image
        quality={100}
        width={35}
        height={35}
        src={`/images/languages/${language}.svg`}
        alt={language}
      />
      <p data-cy='language-flag-text' className='mx-2 text-base'>
        {language.toUpperCase()}
      </p>
    </>
  )
}