Multi Language

{
  "heading": "Lorem Ipsum is simply dummy text of the printing and typesetting industry",
  "nested": {
    "nested1": "nested En"
  }
}

{
  "heading": "Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant impression",
  "nested": {
    "nested1": "nested Fr"
  }
}

import { useLocales, useTranslate } from 'src/locales';
 
function MultiLanguage() {
  const { t, onChangeLang } = useTranslate();
 
  const { allLang, currentLang } = useLocales();
 
  return (
    <>
      <RadioGroup row value={currentLang.value} onChange={(event) => onChangeLang(event.target.value)}>
        {allLang.map((lang) => (
          <FormControlLabel key={lang.label} value={lang.value} label={lang.label} control={<Radio />} />
        ))}
      </RadioGroup>
 
      <Typography variant="h2">{t('heading')}</Typography>
      <Typography variant="body2">{t('nested.nested1')}</Typography>
    </>
  );
}