diff --git a/AGHTechDoc.md b/AGHTechDoc.md index 469c1c79..0041f3e2 100644 --- a/AGHTechDoc.md +++ b/AGHTechDoc.md @@ -988,6 +988,7 @@ Response: { "upstream_dns": ["tls://...", ...], + "upstream_dns_file": "", "bootstrap_dns": ["1.2.3.4", ...], "protection_enabled": true | false, @@ -1013,6 +1014,7 @@ Request: { "upstream_dns": ["tls://...", ...], + "upstream_dns_file": "", "bootstrap_dns": ["1.2.3.4", ...], "protection_enabled": true | false, diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json index c1aaa839..ece13f64 100644 --- a/client/src/__locales/en.json +++ b/client/src/__locales/en.json @@ -132,7 +132,8 @@ "encryption_settings": "Encryption settings", "dhcp_settings": "DHCP settings", "upstream_dns": "Upstream DNS servers", - "upstream_dns_hint": "If you keep this field empty, AdGuard Home will use Quad9 as an upstream.", + "upstream_dns_help": "Enter servers addresses one per line. <0>Learn more0> about configuring upstream DNS servers.", + "upstream_dns_configured_in_file": "Configured in {{path}}", "test_upstream_btn": "Test upstreams", "upstreams": "Upstreams", "apply_btn": "Apply", diff --git a/client/src/components/Settings/Dns/Upstream/Form.js b/client/src/components/Settings/Dns/Upstream/Form.js index 2678edac..0ebb6605 100644 --- a/client/src/components/Settings/Dns/Upstream/Form.js +++ b/client/src/components/Settings/Dns/Upstream/Form.js @@ -7,49 +7,56 @@ import classnames from 'classnames'; import Examples from './Examples'; import { renderRadioField, renderTextareaField } from '../../../../helpers/form'; -import { DNS_REQUEST_OPTIONS, FORM_NAME } from '../../../../helpers/constants'; +import { DNS_REQUEST_OPTIONS, FORM_NAME, UPSTREAM_CONFIGURATION_WIKI_LINK } from '../../../../helpers/constants'; import { testUpstream } from '../../../../actions'; import { removeEmptyLines } from '../../../../helpers/helpers'; -const getInputFields = () => [{ - // eslint-disable-next-line react/display-name - getTitle: () => , - name: 'upstream_dns', - type: 'text', - component: renderTextareaField, - className: 'form-control form-control--textarea font-monospace', - placeholder: 'upstream_dns', - normalizeOnBlur: removeEmptyLines, -}, -{ - name: 'upstream_mode', - type: 'radio', - value: DNS_REQUEST_OPTIONS.LOAD_BALANCING, - component: renderRadioField, - subtitle: 'load_balancing_desc', - placeholder: 'load_balancing', -}, -{ - name: 'upstream_mode', - type: 'radio', - value: DNS_REQUEST_OPTIONS.PARALLEL, - component: renderRadioField, - subtitle: 'upstream_parallel', - placeholder: 'parallel_requests', -}, -{ - name: 'upstream_mode', - type: 'radio', - value: DNS_REQUEST_OPTIONS.FASTEST_ADDR, - component: renderRadioField, - subtitle: 'fastest_addr_desc', - placeholder: 'fastest_addr', -}]; +const Title = () => ; + +const getInputFields = (upstream_dns_file) => [ + { + getTitle: Title, + name: 'upstream_dns', + type: 'text', + value: 'test', + component: renderTextareaField, + className: 'form-control form-control--textarea font-monospace', + placeholder: 'upstream_dns', + normalizeOnBlur: removeEmptyLines, + disabled: !!upstream_dns_file, + }, + { + name: 'upstream_mode', + type: 'radio', + value: DNS_REQUEST_OPTIONS.LOAD_BALANCING, + component: renderRadioField, + subtitle: 'load_balancing_desc', + placeholder: 'load_balancing', + }, + { + name: 'upstream_mode', + type: 'radio', + value: DNS_REQUEST_OPTIONS.PARALLEL, + component: renderRadioField, + subtitle: 'upstream_parallel', + placeholder: 'parallel_requests', + }, + { + name: 'upstream_mode', + type: 'radio', + value: DNS_REQUEST_OPTIONS.FASTEST_ADDR, + component: renderRadioField, + subtitle: 'fastest_addr_desc', + placeholder: 'fastest_addr', + }, +]; const Form = ({ - submitting, invalid, processingSetConfig, processingTestUpstream, handleSubmit, + submitting, invalid, handleSubmit, }) => { const dispatch = useDispatch(); const { t } = useTranslation(); @@ -57,6 +64,9 @@ const Form = ({ const bootstrap_dns = useSelector( (store) => store.form[FORM_NAME.UPSTREAM].values.bootstrap_dns, ); + const upstream_dns_file = useSelector((state) => state.dnsConfig.upstream_dns_file); + const processingTestUpstream = useSelector((state) => state.settings.processingTestUpstream); + const processingSetConfig = useSelector((state) => state.dnsConfig.processingSetConfig); const handleUpstreamTest = () => dispatch(testUpstream({ upstream_dns, @@ -67,7 +77,7 @@ const Form = ({ 'btn-loading': processingTestUpstream, }); - const INPUT_FIELDS = getInputFields(); + const INPUT_FIELDS = getInputFields(upstream_dns_file); return