feat(translations): new translation system

This commit is contained in:
David Ralph
2021-09-10 16:38:53 +01:00
parent 941c168486
commit b0eeff1bf8
63 changed files with 651 additions and 593 deletions

View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent } from 'react';
import { toast } from 'react-toastify';
@@ -12,6 +13,9 @@ const searchEngines = require('components/widgets/search/search_engines.json');
const autocompleteProviders = require('components/widgets/search/autocomplete_providers.json');
export default class SearchSettings extends PureComponent {
getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
languagecode = variables.languagecode;
constructor() {
super();
this.state = {
@@ -27,7 +31,7 @@ export default class SearchSettings extends PureComponent {
customValue: ''
});
toast(window.language.toasts.reset);
toast(this.getMessage(this.languagecode, 'toasts.reset'));
}
componentDidMount() {
@@ -67,32 +71,29 @@ export default class SearchSettings extends PureComponent {
}
render() {
const language = window.language.modals.main.settings;
const { search } = language.sections;
return (
<>
<h2>{search.title}</h2>
<Switch name='searchBar' text={language.enabled} category='widgets' />
<h2>{this.getMessage(this.languagecode, 'modals.main.settings.sections.search.title')}</h2>
<Switch name='searchBar' text={this.getMessage(this.languagecode, 'modals.main.settings.enabled')} category='widgets' />
{/* not supported on firefox */}
{(navigator.userAgent.includes('Chrome') && typeof InstallTrigger === 'undefined') ?
<Checkbox name='voiceSearch' text={search.voice_search} category='search'/>
<Checkbox name='voiceSearch' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.voice_search')} category='search'/>
: null}
<Checkbox name='searchDropdown' text={search.dropdown} category='search' element='.other'/>
<Dropdown label={search.search_engine} name='searchEngine' onChange={(value) => this.setSearchEngine(value)}>
<Checkbox name='searchDropdown' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.dropdown')} category='search' element='.other'/>
<Dropdown label={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.search_engine')} name='searchEngine' onChange={(value) => this.setSearchEngine(value)}>
{searchEngines.map((engine) => (
<option key={engine.name} value={engine.settingsName}>{engine.name}</option>
))}
<option value='custom'>{search.custom.split(' ')[0]}</option>
<option value='custom'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.search.custom').split(' ')[0]}</option>
</Dropdown>
<ul style={{ display: this.state.customDisplay }}>
<br/>
<p style={{ marginTop: '0px' }}>{search.custom} <span className='modalLink' onClick={() => this.resetSearch()}>{language.buttons.reset}</span></p>
<p style={{ marginTop: '0px' }}>{this.getMessage(this.languagecode, 'modals.main.settings.sections.search.custom')} <span className='modalLink' onClick={() => this.resetSearch()}>{this.getMessage(this.languagecode, 'modals.main.settings.buttons.reset')}</span></p>
<input type='text' value={this.state.customValue} onInput={(e) => this.setState({ customValue: e.target.value })}></input>
</ul>
<br/>
<Checkbox name='autocomplete' text={search.autocomplete} category='search' />
<Radio title={search.autocomplete_provider} options={autocompleteProviders} name='autocompleteProvider' category='search'/>
<Checkbox name='autocomplete' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.autocomplete')} category='search' />
<Radio title={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.autocomplete_provider')} options={autocompleteProviders} name='autocompleteProvider' category='search'/>
</>
);
}