src/renderer/ui/components/settings/LocaleSelector.js
import fs from 'fs';
import path from 'path';
import { remote } from 'electron';
import React, { Component, PropTypes } from 'react';
import SelectField from 'material-ui/SelectField';
import MenuItem from 'material-ui/MenuItem';
import { requireSettings } from '../generic/SettingsProvider';
import { languageMap } from '../../utils/constants';
class LocaleSelector extends Component {
static propTypes = {
locale: PropTypes.string.isRequired,
};
onChooseLocale = (event, key, value) => {
Settings.set('locale', value);
}
render() {
let items = fs.readdirSync(path.resolve(__dirname, '..', '..', '..', '..', '_locales'))
.filter((fileName) => fileName.endsWith('.json'))
.map((fileName) => fileName.replace(/\.json/g, ''))
.filter((fileName) => !!languageMap[fileName])
.map((fileName) => (
<MenuItem key={fileName} value={fileName} primaryText={languageMap[fileName]} />
));
return (
<div style={{ width: '90%' }}>
<SelectField
value={this.props.locale}
onChange={this.onChooseLocale}
floatingLabelText={
`${TranslationProvider.query('settings-option-change-locale')} (${TranslationProvider.query('settings-requires-restart')})`
}
maxHeight={200}
disabled={items.length === 0}
fullWidth
>
{items}
</SelectField>
</div>
);
}
}
export default requireSettings(LocaleSelector, ['locale'], { locale: remote.app.getLocale() });