umami/components/pages/settings/profile/LanguageSetting.js

32 lines
982 B
JavaScript
Raw Normal View History

2023-01-25 16:42:46 +01:00
import { useIntl } from 'react-intl';
import { Button, Dropdown, Item, Flexbox } from 'react-basics';
2022-03-01 05:54:32 +01:00
import useLocale from 'hooks/useLocale';
import { DEFAULT_LOCALE } from 'lib/constants';
import { languages } from 'lib/lang';
2023-01-25 16:42:46 +01:00
import { labels } from 'components/messages';
2022-03-01 05:54:32 +01:00
export default function LanguageSetting() {
const { formatMessage } = useIntl();
2022-03-01 05:54:32 +01:00
const { locale, saveLocale } = useLocale();
const options = Object.keys(languages);
2022-03-01 05:54:32 +01:00
const handleReset = () => saveLocale(DEFAULT_LOCALE);
const renderValue = value => languages[value].label;
2022-03-01 05:54:32 +01:00
return (
<Flexbox width={400} gap={10}>
<Dropdown
items={options}
value={locale}
renderValue={renderValue}
onChange={saveLocale}
menuProps={{ style: { height: 300, width: 300 } }}
>
{item => <Item key={item}>{languages[item].label}</Item>}
</Dropdown>
2023-01-25 16:42:46 +01:00
<Button onClick={handleReset}>{formatMessage(labels.reset)}</Button>
</Flexbox>
2022-03-01 05:54:32 +01:00
);
}