From 789060e4d439a7d32b606625353c826c61a1db85 Mon Sep 17 00:00:00 2001
From: Ildar Kamalov <ik@adguard.com>
Date: Tue, 21 Nov 2023 16:28:03 +0300
Subject: [PATCH 1/2] client: add form fields

---
 client/src/__locales/en.json                  |  4 +-
 .../Clients/ClientsTable/ClientsTable.js      |  4 ++
 .../src/components/Settings/Clients/Form.js   | 38 ++++++++++++++++++-
 3 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json
index e75c1259..5edd09e3 100644
--- a/client/src/__locales/en.json
+++ b/client/src/__locales/en.json
@@ -734,5 +734,7 @@
     "wednesday_short": "Wed",
     "thursday_short": "Thu",
     "friday_short": "Fri",
-    "saturday_short": "Sat"
+    "saturday_short": "Sat",
+    "upstream_dns_cache_configuration": "Upstream DNS cache configuration",
+    "enable_upstream_dns_cache": "Enable upstream DNS cache"
 }
diff --git a/client/src/components/Settings/Clients/ClientsTable/ClientsTable.js b/client/src/components/Settings/Clients/ClientsTable/ClientsTable.js
index 9f65986f..f4744a5a 100644
--- a/client/src/components/Settings/Clients/ClientsTable/ClientsTable.js
+++ b/client/src/components/Settings/Clients/ClientsTable/ClientsTable.js
@@ -79,6 +79,10 @@ const ClientsTable = ({
             } else {
                 config.tags = [];
             }
+
+            if (typeof values.upstreams_cache_size === 'string') {
+                config.upstreams_cache_size = 0;
+            }
         }
 
         if (modalType === MODAL_TYPE.EDIT_FILTERS) {
diff --git a/client/src/components/Settings/Clients/Form.js b/client/src/components/Settings/Clients/Form.js
index 652957d0..bc1c9712 100644
--- a/client/src/components/Settings/Clients/Form.js
+++ b/client/src/components/Settings/Clients/Form.js
@@ -12,8 +12,13 @@ import i18n from '../../../i18n';
 import Tabs from '../../ui/Tabs';
 import Examples from '../Dns/Upstream/Examples';
 import { ScheduleForm } from '../../Filters/Services/ScheduleForm';
-import { toggleAllServices, trimLinesAndRemoveEmpty, captitalizeWords } from '../../../helpers/helpers';
 import {
+    toggleAllServices,
+    trimLinesAndRemoveEmpty,
+    captitalizeWords,
+} from '../../../helpers/helpers';
+import {
+    toNumber,
     renderInputField,
     renderGroupField,
     CheckboxField,
@@ -21,7 +26,7 @@ import {
     renderTextareaField,
 } from '../../../helpers/form';
 import { validateClientId, validateRequiredValue } from '../../../helpers/validators';
-import { CLIENT_ID_LINK, FORM_NAME } from '../../../helpers/constants';
+import { CLIENT_ID_LINK, FORM_NAME, UINT32_RANGE } from '../../../helpers/constants';
 import './Service.css';
 
 const settingsCheckboxes = [
@@ -217,6 +222,35 @@ let Form = (props) => {
                         />
                     </div>
                 ))}
+                <div className="form__label--bold form__label--top form__label--bot">
+                    {t('upstream_dns_cache_configuration')}
+                </div>
+                <div className="form__group mb-2">
+                    <Field
+                        name="upstreams_cache_enabled"
+                        type="checkbox"
+                        component={CheckboxField}
+                        placeholder={t('enable_upstream_dns_cache')}
+                    />
+                </div>
+                <div className="form__group form__group--settings">
+                    <label
+                        htmlFor="upstreams_cache_size"
+                        className="form__label"
+                    >
+                        {t('cache_size')}
+                    </label>
+                    <Field
+                        name="upstreams_cache_size"
+                        type="number"
+                        component={renderInputField}
+                        placeholder={t('enter_cache_size')}
+                        className="form-control"
+                        normalize={toNumber}
+                        min={0}
+                        max={UINT32_RANGE.MAX}
+                    />
+                </div>
             </div>,
         },
         block_services: {

From feb15745d2e867e360cd97de6763a668d6921158 Mon Sep 17 00:00:00 2001
From: Ildar Kamalov <ik@adguard.com>
Date: Tue, 21 Nov 2023 17:27:38 +0300
Subject: [PATCH 2/2] client: move cache fields to the upstream tab

---
 client/src/__locales/en.json                  |  3 +-
 .../src/components/Settings/Clients/Form.js   | 58 +++++++++----------
 2 files changed, 31 insertions(+), 30 deletions(-)

diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json
index 5edd09e3..3f6f74d7 100644
--- a/client/src/__locales/en.json
+++ b/client/src/__locales/en.json
@@ -736,5 +736,6 @@
     "friday_short": "Fri",
     "saturday_short": "Sat",
     "upstream_dns_cache_configuration": "Upstream DNS cache configuration",
-    "enable_upstream_dns_cache": "Enable upstream DNS cache"
+    "enable_upstream_dns_cache": "Enable DNS cache for this client's custom upstream configuration",
+    "dns_cache_size": "DNS cache size (in bytes)"
 }
diff --git a/client/src/components/Settings/Clients/Form.js b/client/src/components/Settings/Clients/Form.js
index bc1c9712..ba4ec4b3 100644
--- a/client/src/components/Settings/Clients/Form.js
+++ b/client/src/components/Settings/Clients/Form.js
@@ -222,35 +222,6 @@ let Form = (props) => {
                         />
                     </div>
                 ))}
-                <div className="form__label--bold form__label--top form__label--bot">
-                    {t('upstream_dns_cache_configuration')}
-                </div>
-                <div className="form__group mb-2">
-                    <Field
-                        name="upstreams_cache_enabled"
-                        type="checkbox"
-                        component={CheckboxField}
-                        placeholder={t('enable_upstream_dns_cache')}
-                    />
-                </div>
-                <div className="form__group form__group--settings">
-                    <label
-                        htmlFor="upstreams_cache_size"
-                        className="form__label"
-                    >
-                        {t('cache_size')}
-                    </label>
-                    <Field
-                        name="upstreams_cache_size"
-                        type="number"
-                        component={renderInputField}
-                        placeholder={t('enter_cache_size')}
-                        className="form-control"
-                        normalize={toNumber}
-                        min={0}
-                        max={UINT32_RANGE.MAX}
-                    />
-                </div>
             </div>,
         },
         block_services: {
@@ -341,6 +312,35 @@ let Form = (props) => {
                     normalizeOnBlur={trimLinesAndRemoveEmpty}
                 />
                 <Examples />
+                <div className="form__label--bold mt-5 mb-3">
+                    {t('upstream_dns_cache_configuration')}
+                </div>
+                <div className="form__group mb-2">
+                    <Field
+                        name="upstreams_cache_enabled"
+                        type="checkbox"
+                        component={CheckboxField}
+                        placeholder={t('enable_upstream_dns_cache')}
+                    />
+                </div>
+                <div className="form__group form__group--settings">
+                    <label
+                        htmlFor="upstreams_cache_size"
+                        className="form__label"
+                    >
+                        {t('dns_cache_size')}
+                    </label>
+                    <Field
+                        name="upstreams_cache_size"
+                        type="number"
+                        component={renderInputField}
+                        placeholder={t('enter_cache_size')}
+                        className="form-control"
+                        normalize={toNumber}
+                        min={0}
+                        max={UINT32_RANGE.MAX}
+                    />
+                </div>
             </div>,
         },
     };