daxi20/AdGuardHome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add translate Setting page

Browse Source
This commit is contained in:
hoangnd
2018-10-25 17:33:44 +07:00
parent e1069f6bd1
commit 3854a7acf9
4 changed files with 45 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
client/src/components/Settings/Upstream.js
View File

@@ -1,9 +1,10 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { Trans, withNamespaces } from 'react-i18next';
import Card from '../ui/Card';
export default class Upstream extends Component {
class Upstream extends Component {
handleChange = (e) => {
const { value } = e.currentTarget;
this.props.handleUpstreamChange(value);
@@ -23,11 +24,12 @@ export default class Upstream extends Component {
'btn btn-primary btn-standart mr-2': true,
'btn btn-primary btn-standart mr-2 btn-loading': this.props.processingTestUpstream,
});
const { t } = this.props;
return (
<Card
title="Upstream DNS servers"
subtitle="If you keep this field empty, AdGuard Home will use <a href='https://1.1.1.1/' target='_blank'>Cloudflare DNS</a> as an upstream. Use tls:// prefix for DNS over TLS servers."
title={ t('Upstream DNS servers') }
subtitle={ t('If you keep this field empty, AdGuard Home will use <a href="https://1.1.1.1/" target="_blank">Cloudflare DNS</a> as an upstream. Use tls:// prefix for DNS over TLS servers.') }
bodyType="card-body box-body--settings"
>
<div className="row">
@@ -44,14 +46,14 @@ export default class Upstream extends Component {
type="button"
onClick={this.handleTest}
>
Test upstreams
<Trans>Test upstreams</Trans>
</button>
<button
className="btn btn-success btn-standart"
type="submit"
onClick={this.handleSubmit}
>
Apply
<Trans>Apply</Trans>
</button>
</div>
</form>
@@ -68,4 +70,7 @@ Upstream.propTypes = {
handleUpstreamChange: PropTypes.func,
handleUpstreamSubmit: PropTypes.func,
handleUpstreamTest: PropTypes.func,
t: PropTypes.func,
};
export default withNamespaces()(Upstream);

32
client/src/components/Settings/index.js
View File

@@ -1,5 +1,6 @@
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import { withNamespaces, Trans } from 'react-i18next';
import Upstream from './Upstream';
import Checkbox from '../ui/Checkbox';
import Loading from '../ui/Loading';
@@ -7,27 +8,27 @@ import PageTitle from '../ui/PageTitle';
import Card from '../ui/Card';
import './Settings.css';
export default class Settings extends Component {
class Settings extends Component {
settings = {
filtering: {
enabled: false,
title: 'Block domains using filters and hosts files',
subtitle: 'You can setup blocking rules in the <a href="#filters">Filters</a> settings.',
title: this.props.t('Block domains using filters and hosts files'),
subtitle: this.props.t('You can setup blocking rules in the <a href="#filters">Filters</a> settings.'),
},
safebrowsing: {
enabled: false,
title: 'Use AdGuard browsing security web service',
subtitle: 'AdGuard Home will check if domain is blacklisted by the browsing security web service. It will use privacy-friendly lookup API to perform the check: only a short prefix of the domain name SHA256 hash is sent to the server.',
title: this.props.t('Use AdGuard browsing security web service'),
subtitle: this.props.t('AdGuard Home will check if domain is blacklisted by the browsing security web service. It will use privacy-friendly lookup API to perform the check: only a short prefix of the domain name SHA256 hash is sent to the server.'),
},
parental: {
enabled: false,
title: 'Use AdGuard parental control web service',
subtitle: 'AdGuard Home will check if domain contains adult materials. It uses the same privacy-friendly API as the browsing security web service.',
title: this.props.t('Use AdGuard parental control web service'),
subtitle: this.props.t('AdGuard Home will check if domain contains adult materials. It uses the same privacy-friendly API as the browsing security web service.'),
},
safesearch: {
enabled: false,
title: 'Enforce safe search',
subtitle: 'AdGuard Home can enforce safe search in the following search engines: Google, Bing, Yandex.',
title: this.props.t('Enforce safe search'),
subtitle: this.props.t('AdGuard Home can enforce safe search in the following search engines: Google, Bing, Yandex.'),
},
};
@@ -47,7 +48,7 @@ export default class Settings extends Component {
if (this.props.dashboard.upstreamDns.length > 0) {
this.props.testUpstream(this.props.dashboard.upstreamDns);
} else {
this.props.addErrorToast({ error: 'No servers specified' });
this.props.addErrorToast({ error: this.props.t('No servers specified') });
}
};
@@ -64,22 +65,22 @@ export default class Settings extends Component {
});
}
return (
<div>No settings</div>
<div><Trans>No settings</Trans></div>
);
}
render() {
const { settings } = this.props;
const { settings, t } = this.props;
const { upstreamDns } = this.props.dashboard;
return (
<Fragment>
<PageTitle title="Settings" />
<PageTitle title={ t('Settings') } />
{settings.processing && <Loading />}
{!settings.processing &&
<div className="content">
<div className="row">
<div className="col-md-12">
<Card title="General settings" bodyType="card-body box-body--settings">
<Card title={ t('General settings') } bodyType="card-body box-body--settings">
<div className="form">
{this.renderSettings(settings.settingsList)}
</div>
@@ -108,4 +109,7 @@ Settings.propTypes = {
handleUpstreamChange: PropTypes.func,
setUpstream: PropTypes.func,
upstream: PropTypes.string,
t: PropTypes.func,
};
export default withNamespaces()(Settings);