useLocaleState
The useLocaleState hook allows to read and update the locale. It uses a syntax similar to react’s useState hook.
Syntax
const [locale, setLocale] = useLocaleState();
Usage
useLocaleState is generally used in components allowing the user to switch the interface language:
import * as React from "react";
import Button from '@mui/material/Button';
import { useLocaleState } from 'react-admin';
const LocaleSwitcher = () => {
const [locale, setLocale] = useLocaleState();
return (
<div>
<div>Language</div>
<Button
disabled={locale === 'fr'}
onClick={() => setLocale('fr')}
>
English
</Button>
<Button
disabled={locale === 'en'}
onClick={() => setLocale('en')}
>
French
</Button>
</div>
);
};
export default LocaleSwitcher;
As this is a very common need, react-admin provides the <LocalesMenuButton> component.