diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json index f91355ee..14f353aa 100644 --- a/client/src/__locales/en.json +++ b/client/src/__locales/en.json @@ -108,6 +108,7 @@ "upstream_dns": "Upstream DNS servers", "upstream_dns_hint": "If you keep this field empty, AdGuard Home will use Quad9 as an upstream.", "test_upstream_btn": "Test upstreams", + "upstreams": "Upstreams", "apply_btn": "Apply", "disabled_filtering_toast": "Disabled filtering", "enabled_filtering_toast": "Enabled filtering", diff --git a/client/src/components/Settings/Clients/ClientsTable.js b/client/src/components/Settings/Clients/ClientsTable.js index 50bb48ab..fca7de51 100644 --- a/client/src/components/Settings/Clients/ClientsTable.js +++ b/client/src/components/Settings/Clients/ClientsTable.js @@ -4,6 +4,7 @@ import { Trans, withNamespaces } from 'react-i18next'; import ReactTable from 'react-table'; import { MODAL_TYPE } from '../../../helpers/constants'; +import { normalizeTextarea } from '../../../helpers/helpers'; import Card from '../../ui/Card'; import Modal from './Modal'; import WrapCell from './WrapCell'; @@ -20,13 +21,20 @@ class ClientsTable extends Component { }; handleSubmit = (values) => { - let config = values; + const config = values; - if (values && values.blocked_services) { - const blocked_services = Object - .keys(values.blocked_services) - .filter(service => values.blocked_services[service]); - config = { ...values, blocked_services }; + if (values) { + if (values.blocked_services) { + config.blocked_services = Object + .keys(values.blocked_services) + .filter(service => values.blocked_services[service]); + } + + if (values.upstreams && typeof values.upstreams === 'string') { + config.upstreams = normalizeTextarea(values.upstreams); + } else { + config.upstreams = []; + } } if (this.props.modalType === MODAL_TYPE.EDIT) { @@ -40,10 +48,10 @@ class ClientsTable extends Component { const client = clients.find(item => name === item.name); if (client) { + const { upstreams, whois_info, ...values } = client; return { - use_global_settings: true, - use_global_blocked_services: true, - ...client, + upstreams: (upstreams && upstreams.join('\n')) || '', + ...values, }; } @@ -143,6 +151,24 @@ class ClientsTable extends Component { ); }, }, + { + Header: this.props.t('upstreams'), + accessor: 'upstreams', + minWidth: 120, + Cell: ({ value }) => { + const title = value && value.length > 0 ? ( + settings_custom + ) : ( + settings_global + ); + + return ( +
+
{title}
+
+ ); + }, + }, { Header: this.props.t('whois'), accessor: 'whois_info', diff --git a/client/src/components/Settings/Clients/Form.js b/client/src/components/Settings/Clients/Form.js index 6e3ceced..63199d76 100644 --- a/client/src/components/Settings/Clients/Form.js +++ b/client/src/components/Settings/Clients/Form.js @@ -7,6 +7,7 @@ import flow from 'lodash/flow'; import i18n from '../../../i18n'; import Tabs from '../../ui/Tabs'; +import Examples from '../Dns/Upstream/Examples'; import { toggleAllServices } from '../../../helpers/helpers'; import { renderField, @@ -223,6 +224,17 @@ let Form = (props) => { +
+ + +