Merge branch 'fix/596' of ssh://bit.adguard.com:7999/dns/adguard-dns into fix/596

client/src/__locales/en.json

@@ -79,7 +79,7 @@
     "no_settings": "No settings",
     "general_settings": "General settings",
     "upstream_dns": "Upstream DNS servers",
-    "upstream_dns_hint": "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.",
+    "upstream_dns_hint": "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.",
     "test_upstream_btn": "Test upstreams",
     "apply_btn": "Apply",
     "disabled_filtering_toast": "Disabled filtering",
@@ -248,6 +248,6 @@
     "reset_settings": "Reset settings",
     "update_announcement": "AdGuard Home {{version}} is now available! <0>Click here</0> for more info.",
     "upstream_parallel": "Use parallel queries to speed up resolving by simultaneously querying all upstream servers",
-    "bootstrap_dns": "Bootstrap DNS",
+    "bootstrap_dns": "Bootstrap DNS servers",
-    "bootstrap_dns_desc": "Bootstrap DNS for DNS-over-HTTPS and DNS-over-TLS servers"
+    "bootstrap_dns_desc": "Bootstrap DNS servers are used to resolve the IP address of the DOH/DOT resolvers you specify as upstreams."
 }

client/src/actions/index.js

@@ -456,8 +456,12 @@ export const setUpstream = config => async (dispatch) => {
     dispatch(setUpstreamRequest());
     try {
         const values = { ...config };
-        values.bootstrap_dns = (values.bootstrap_dns && normalizeTextarea(values.bootstrap_dns)) || '';
+        values.bootstrap_dns = (
-        values.upstream_dns = (values.upstream_dns && normalizeTextarea(values.upstream_dns)) || '';
+            values.bootstrap_dns && normalizeTextarea(values.bootstrap_dns)
+        ) || [];
+        values.upstream_dns = (
+            values.upstream_dns && normalizeTextarea(values.upstream_dns)
+        ) || [];
 
         await apiClient.setUpstream(values);
         dispatch(addSuccessToast('updated_upstream_dns_toast'));
@@ -472,12 +476,19 @@ export const testUpstreamRequest = createAction('TEST_UPSTREAM_REQUEST');
 export const testUpstreamFailure = createAction('TEST_UPSTREAM_FAILURE');
 export const testUpstreamSuccess = createAction('TEST_UPSTREAM_SUCCESS');
 
-export const testUpstream = values => async (dispatch) => {
+export const testUpstream = config => async (dispatch) => {
     dispatch(testUpstreamRequest());
     try {
-        const servers = normalizeTextarea(values);
+        const values = { ...config };
-        const upstreamResponse = await apiClient.testUpstream(servers);
+        values.bootstrap_dns = (
+            values.bootstrap_dns && normalizeTextarea(values.bootstrap_dns)
+        ) || [];
+        values.upstream_dns = (
+            values.upstream_dns && normalizeTextarea(values.upstream_dns)
+        ) || [];
+        console.log(values);
 
+        const upstreamResponse = await apiClient.testUpstream(values);
         const testMessages = Object.keys(upstreamResponse).map((key) => {
             const message = upstreamResponse[key];
             if (message !== 'OK') {

client/src/components/Settings/Upstream/Form.js

@@ -14,6 +14,8 @@ let Form = (props) => {
         handleSubmit,
         testUpstream,
         upstreamDns,
+        bootstrapDns,
+        allServers,
         submitting,
         invalid,
         processingSetUpstream,
@@ -30,7 +32,9 @@ let Form = (props) => {
             <div className="row">
                 <div className="col-12">
                     <div className="form__group form__group--settings">
-                        <label>{t('upstream_dns')}</label>
+                        <label className="form__label" htmlFor="upstream_dns">
+                            <Trans>upstream_dns</Trans>
+                        </label>
                         <Field
                             id="upstream_dns"
                             name="upstream_dns"
@@ -53,14 +57,19 @@ let Form = (props) => {
                 </div>
                 <div className="col-12">
                     <div className="form__group">
-                        <label>{t('bootstrap_dns')}</label>
+                        <label className="form__label" htmlFor="bootstrap_dns">
+                            <Trans>bootstrap_dns</Trans>
+                        </label>
+                        <div className="form__desc form__desc--top">
+                            <Trans>bootstrap_dns_desc</Trans>
+                        </div>
                         <Field
                             id="bootstrap_dns"
                             name="bootstrap_dns"
                             component="textarea"
                             type="text"
                             className="form-control"
-                            placeholder={t('bootstrap_dns_desc')}
+                            placeholder={t('bootstrap_dns')}
                         />
                     </div>
                 </div>
@@ -70,7 +79,11 @@ let Form = (props) => {
                     <button
                         type="button"
                         className={testButtonClass}
-                        onClick={() => testUpstream(upstreamDns)}
+                        onClick={() => testUpstream({
+                            upstream_dns: upstreamDns,
+                            bootstrap_dns: bootstrapDns,
+                            all_servers: allServers,
+                        })}
                         disabled={!upstreamDns || processingTestUpstream}
                     >
                         <Trans>test_upstream_btn</Trans>
@@ -100,6 +113,8 @@ Form.propTypes = {
     invalid: PropTypes.bool,
     initialValues: PropTypes.object,
     upstreamDns: PropTypes.string,
+    bootstrapDns: PropTypes.string,
+    allServers: PropTypes.bool,
     processingTestUpstream: PropTypes.bool,
     processingSetUpstream: PropTypes.bool,
     t: PropTypes.func,
@@ -109,8 +124,12 @@ const selector = formValueSelector('upstreamForm');
 
 Form = connect((state) => {
     const upstreamDns = selector(state, 'upstream_dns');
+    const bootstrapDns = selector(state, 'bootstrap_dns');
+    const allServers = selector(state, 'all_servers');
     return {
         upstreamDns,
+        bootstrapDns,
+        allServers,
     };
 })(Form);
 

client/src/components/Settings/index.js

@@ -75,7 +75,7 @@ class Settings extends Component {
                                 </Card>
                                 <Upstream
                                     upstreamDns={dashboard.upstreamDns}
-                                    boostrapDns={dashboard.boostrapDns}
+                                    bootstrapDns={dashboard.bootstrapDns}
                                     allServers={dashboard.allServers}
                                     setUpstream={this.props.setUpstream}
                                     testUpstream={this.props.testUpstream}
@@ -110,7 +110,6 @@ Settings.propTypes = {
     toggleSetting: PropTypes.func,
     handleUpstreamChange: PropTypes.func,
     setUpstream: PropTypes.func,
-    upstream: PropTypes.string,
     t: PropTypes.func,
 };