42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import Autocomplete from "@mui/material/Autocomplete";
|
|
import TextField from "@mui/material/TextField";
|
|
import Box from "@mui/material/Box";
|
|
import React from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { useTranslation as useRefineTranslation } from "@refinedev/core";
|
|
|
|
const I18nPicker = () => {
|
|
const { i18n } = useTranslation();
|
|
const { getLocale, changeLocale } = useRefineTranslation();
|
|
const currentLocale = getLocale();
|
|
|
|
return (
|
|
<Autocomplete
|
|
value={currentLocale}
|
|
options={i18n.languages}
|
|
disableClearable={true}
|
|
renderInput={(params) => {
|
|
return <TextField {...params} label={ "Language" } variant="outlined" />
|
|
}}
|
|
renderOption={(props, option) => {
|
|
const { key, ...optionProps } = props;
|
|
return (
|
|
<Box
|
|
key={key}
|
|
component="li"
|
|
sx={{ '& > img': { mr: 2, flexShrink: 0 } }}
|
|
{...optionProps}
|
|
>
|
|
{ option }
|
|
</Box>
|
|
);
|
|
}}
|
|
onChange={(event, value) => {
|
|
changeLocale(value);
|
|
}}
|
|
/>
|
|
)
|
|
}
|
|
|
|
export default I18nPicker;
|