diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json index 6cce0d91..674332d7 100644 --- a/client/src/__locales/en.json +++ b/client/src/__locales/en.json @@ -574,5 +574,7 @@ "original_response": "Original response", "click_to_view_queries": "Click to view queries", "port_53_faq_link": "Port 53 is often occupied by \"DNSStubListener\" or \"systemd-resolved\" services. Please read <0>this instruction on how to resolve this.", - "adg_will_drop_dns_queries": "AdGuard Home will be dropping all DNS queries from this client." + "adg_will_drop_dns_queries": "AdGuard Home will be dropping all DNS queries from this client.", + "configured_in": "Configured in {{path}}", + "please_read_wiki": "Please read the wiki" } diff --git a/client/src/components/Settings/Dns/Upstream/Form.js b/client/src/components/Settings/Dns/Upstream/Form.js index 2678edac..65a41c9f 100644 --- a/client/src/components/Settings/Dns/Upstream/Form.js +++ b/client/src/components/Settings/Dns/Upstream/Form.js @@ -5,51 +5,61 @@ import { Field, reduxForm } from 'redux-form'; import { Trans, useTranslation } from 'react-i18next'; import classnames from 'classnames'; +import i18next from 'i18next'; 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 +67,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 +80,7 @@ const Form = ({ 'btn-loading': processingTestUpstream, }); - const INPUT_FIELDS = getInputFields(); + const INPUT_FIELDS = getInputFields(upstream_dns_file); return
@@ -146,8 +159,6 @@ Form.propTypes = { initialValues: PropTypes.object, upstream_dns: PropTypes.string, bootstrap_dns: PropTypes.string, - processingTestUpstream: PropTypes.bool, - processingSetConfig: PropTypes.bool, }; export default reduxForm({ form: FORM_NAME.UPSTREAM })(Form); diff --git a/client/src/components/Settings/Dns/Upstream/index.js b/client/src/components/Settings/Dns/Upstream/index.js index a0a26c00..4092638c 100644 --- a/client/src/components/Settings/Dns/Upstream/index.js +++ b/client/src/components/Settings/Dns/Upstream/index.js @@ -12,15 +12,28 @@ const Upstream = () => { upstream_dns, bootstrap_dns, upstream_mode, - processingSetConfig, } = useSelector((state) => state.dnsConfig, shallowEqual); - const { processingTestUpstream } = useSelector((state) => state.settings, shallowEqual); + const upstream_dns_file = useSelector((state) => state.dnsConfig.upstream_dns_file); const handleSubmit = (values) => { - dispatch(setDnsConfig(values)); + const { + bootstrap_dns, + upstream_dns, + upstream_mode, + } = values; + + const dnsConfig = { + bootstrap_dns, + upstream_mode, + ...(upstream_dns_file ? null : { upstream_dns }), + }; + + dispatch(setDnsConfig(dnsConfig)); }; + const upstreamDns = upstream_dns_file ? t('configured_in', { path: upstream_dns_file }) : upstream_dns; + return {
diff --git a/client/src/helpers/constants.js b/client/src/helpers/constants.js index e0075a25..7f63d324 100644 --- a/client/src/helpers/constants.js +++ b/client/src/helpers/constants.js @@ -52,6 +52,7 @@ export const REPOSITORY = { export const PRIVACY_POLICY_LINK = 'https://adguard.com/privacy/home.html'; export const PORT_53_FAQ_LINK = 'https://github.com/AdguardTeam/AdGuardHome/wiki/FAQ#bindinuse'; +export const UPSTREAM_CONFIGURATION_WIKI_LINK = 'https://github.com/AdguardTeam/AdGuardHome/wiki/Configuration#upstreams'; export const ADDRESS_IN_USE_TEXT = 'address already in use'; diff --git a/client/src/reducers/dnsConfig.js b/client/src/reducers/dnsConfig.js index 91e95818..bbe4ad2f 100644 --- a/client/src/reducers/dnsConfig.js +++ b/client/src/reducers/dnsConfig.js @@ -48,6 +48,7 @@ const dnsConfig = handleActions( edns_cs_enabled: false, disable_ipv6: false, dnssec_enabled: false, + upstream_dns_file: '', }, );