// The full list of languages in FLORES-200 is available here:
// https://github.com/facebookresearch/flores/blob/main/flores200/README.md#languages-in-flores-200

const LANGUAGES = {
  English: "en",
  French: "fr",
  German: "de",
  Spanish: "es",
  Italian: "it",
  Portuguese: "pt",
  Dutch: "nl",
  Russian: "ru",
  Chinese: "zh",
  Japanese: "ja",
  Korean: "ko",
  Arabic: "ar",
  Hindi: "hi",
  Bengali: "bn",
  Punjabi: "pa",
  Javanese: "jv",
  Vietnamese: "vi",
  "Bidaio Jagoi": "bj",
  Indonesian: "id",
  Malay: "ms",
};

export default function LanguageSelector({ type, onChange, defaultLanguage }) {
  return (
    <div className='language-selector'>
      <label>{type}: </label>
      <select onChange={onChange} defaultValue={defaultLanguage}>
        {Object.entries(LANGUAGES).map(([key, value]) => {
          return <option key={key} value={value}>{key}</option>
        })}
      </select>
    </div>
  )
}