53 lines
1.3 KiB
JavaScript
53 lines
1.3 KiB
JavaScript
// @flow
|
|
|
|
import React, { useState } from 'react';
|
|
import { FormField } from 'component/common/form';
|
|
import Spinner from 'component/spinner';
|
|
import SUPPORTED_LANGUAGES from '../../constants/supported_languages';
|
|
|
|
type Props = {
|
|
language: string,
|
|
setLanguage: string => void,
|
|
};
|
|
|
|
function SettingLanguage(props: Props) {
|
|
const { language, setLanguage } = props;
|
|
|
|
const [previousLanguage, setPreviousLanguage] = useState(null);
|
|
const languages = SUPPORTED_LANGUAGES;
|
|
|
|
if (previousLanguage && language !== previousLanguage) {
|
|
setPreviousLanguage(null);
|
|
}
|
|
|
|
function onLanguageChange(e) {
|
|
const { value } = e.target;
|
|
setPreviousLanguage(language);
|
|
setLanguage(value);
|
|
}
|
|
|
|
return (
|
|
<React.Fragment>
|
|
<FormField
|
|
name="language_select"
|
|
type="select"
|
|
label={__('Language')}
|
|
onChange={onLanguageChange}
|
|
value={language}
|
|
helper={__(
|
|
'Multi-language support is brand new and incomplete. Switching your language may have unintended consequences, like glossolalia.'
|
|
)}
|
|
>
|
|
{Object.keys(languages).map(language => (
|
|
<option key={language} value={language}>
|
|
{languages[language]}
|
|
</option>
|
|
))}
|
|
</FormField>
|
|
{previousLanguage && <Spinner type="small" />}
|
|
</React.Fragment>
|
|
);
|
|
}
|
|
|
|
export default SettingLanguage;
|