Pull request: 1163 safesearch http api vol.3

Merge in DNS/adguard-home from 1163-safesearch-1-3 to master Squashed commit of the following: commit f26c5fb4f7a27dc61b10c28d6672d5307796784c Merge: e7a1b885 143616ca Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Thu Mar 23 18:45:25 2023 +0700 Merge remote-tracking branch 'origin/master' into 1163-safesearch-1-3 # Conflicts: # CHANGELOG.md commit e7a1b885d67628c187ce08327338cf3138012f03 Merge: 01b73d76 eb5d8a49 Author: Vladislav Abdulmyanov <v.abdulmyanov@adguard.com> Date: Wed Mar 22 13:55:23 2023 +0200 Merge branch '1163-safesearch-1-3' of ssh://bit.adguard.com:7999/dns/adguard-home into 1163-safesearch-1-3 commit 01b73d763c6ee76de995093cc7107f113c7785ce Author: Vladislav Abdulmyanov <v.abdulmyanov@adguard.com> Date: Wed Mar 22 13:52:02 2023 +0200 client: add safe search extended settings to clients commit eb5d8a499ac1036e5077d2b4aa84479381577e10 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Wed Mar 22 18:50:23 2023 +0700 all: docs commit 2043a8fba7f664ef365ccc5abac14a85035eb4b7 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Wed Mar 22 09:42:50 2023 +0700 all: docs commit bb1d2f6c0252891ccac3d3727eb23288a24d4bda Merge: 95f9fd3d c3edab43 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Wed Mar 22 09:42:00 2023 +0700 Merge remote-tracking branch 'origin/master' into 1163-safesearch-1-3 commit 95f9fd3dd1e8abcdf1a156e81aff8e52f320f4c3 Author: Vladislav Abdulmyanov <v.abdulmyanov@adguard.com> Date: Tue Mar 21 15:25:39 2023 +0200 client: move to new safe search api commit ac823a911f0d6ab6f1813d11a0ca082d54cc9131 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Mon Mar 20 22:40:29 2023 +0700 all: docs commit aaa287b125c7c7a775b821e0dd272199229a7538 Merge: 16fa7031 48431f8b Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Mon Mar 20 22:39:14 2023 +0700 Merge remote-tracking branch 'origin/master' into 1163-safesearch-1-3 commit 16fa7031ab2aec31139ace54ffa0155cde8e9135 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Mon Mar 20 22:39:03 2023 +0700 all: docs commit 498f7d3cbb842eda218b0fd06fc3bb3601b81f80 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Mon Mar 20 18:59:47 2023 +0700 filtering: imp code commit aab7b70e2355ba86577e5156c1d5569b21b4b358 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Mon Mar 20 18:40:18 2023 +0700 filtering: imp code commit d2870a18ffdb1d293993487073912168d6b75a38 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Fri Mar 17 21:57:58 2023 +0700 filtering: imp code commit 868f5d1ed29c3af702114079e7ffe46e136eb901 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Fri Mar 17 19:06:36 2023 +0700 all: imp docs commit f6d70b06ed873684501ce17f647ccf07a85dd50b Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Fri Mar 17 19:05:40 2023 +0700 filtering: imp code commit 7cd9a37dde6262a8cf4f0f13f9946e011cc0e2cf Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Thu Mar 16 14:56:51 2023 +0700 home: imp code commit 84d8817512e47a517ed2880ffa9dde5ffda1d288 Author: Dimitry Kolyshev <dkolyshev@adguard.com> Date: Thu Mar 16 09:39:41 2023 +0700 all: safesearch http api
2023-03-23 15:25:58 +03:00
parent 143616ca6e
commit df61741f60
15 changed files with 315 additions and 83 deletions
--- a/client/src/components/Settings/Clients/ClientsTable/ClientsTable.js
+++ b/client/src/components/Settings/Clients/ClientsTable/ClientsTable.js
@@ -7,6 +7,7 @@ import { useDispatch, useSelector } from 'react-redux';
 import ReactTable from 'react-table';

 import { getAllBlockedServices } from '../../../../actions/services';
+import { initSettings } from '../../../../actions';
 import {
    splitByNewLine,
    countClientsStatistics,
@@ -38,9 +39,13 @@ const ClientsTable = ({
    const [t] = useTranslation();
    const dispatch = useDispatch();
    const services = useSelector((store) => store?.services);
+    const globalSettings = useSelector((store) => store?.settings.settingsList) || {};
+
+    const { safesearch } = globalSettings;

    useEffect(() => {
        dispatch(getAllBlockedServices());
+        dispatch(initSettings());
    }, []);

    const handleFormAdd = (values) => {
@@ -107,6 +112,7 @@ const ClientsTable = ({
            tags: [],
            use_global_settings: true,
            use_global_blocked_services: true,
+            safe_search: { ...(safesearch || {}) },
        };
    };

--- a/client/src/components/Settings/Clients/Form.js
+++ b/client/src/components/Settings/Clients/Form.js
@@ -11,7 +11,7 @@ import Select from 'react-select';
 import i18n from '../../../i18n';
 import Tabs from '../../ui/Tabs';
 import Examples from '../Dns/Upstream/Examples';
-import { toggleAllServices, trimLinesAndRemoveEmpty } from '../../../helpers/helpers';
+import { toggleAllServices, trimLinesAndRemoveEmpty, captitalizeWords } from '../../../helpers/helpers';
 import {
    renderInputField,
    renderGroupField,
@@ -40,10 +40,6 @@ const settingsCheckboxes = [
        name: 'parental_enabled',
        placeholder: 'use_adguard_parental',
    },
-    {
-        name: 'safesearch_enabled',
-        placeholder: 'enforce_safe_search',
-    },
 ];
 const validate = (values) => {
    const errors = {};
@@ -139,8 +135,12 @@ let Form = (props) => {
        processingUpdating,
        invalid,
        tagsOptions,
+        initialValues,
    } = props;
    const services = useSelector((store) => store?.services);
+    const { safe_search } = initialValues;
+    const safeSearchServices = { ...safe_search };
+    delete safeSearchServices.enabled;

    const [activeTabLabel, setActiveTabLabel] = useState('settings');

@@ -163,6 +163,28 @@ let Form = (props) => {
                        />
                    </div>
                ))}
+                <div className="form__group">
+                    <Field
+                        name="safe_search.enabled"
+                        type="checkbox"
+                        component={CheckboxField}
+                        placeholder={t('enforce_safe_search')}
+                        disabled={useGlobalSettings}
+                    />
+                </div>
+                <div className='form__group--inner'>
+                    {Object.keys(safeSearchServices).map((searchKey) => (
+                        <div key={searchKey}>
+                            <Field
+                                name={`safe_search.${searchKey}`}
+                                type="checkbox"
+                                component={CheckboxField}
+                                placeholder={captitalizeWords(searchKey)}
+                                disabled={useGlobalSettings}
+                            />
+                        </div>
+                    ))}
+                </div>
            </div>,
        },
        block_services: {
@@ -358,6 +380,7 @@ Form.propTypes = {
    processingUpdating: PropTypes.bool.isRequired,
    invalid: PropTypes.bool.isRequired,
    tagsOptions: PropTypes.array.isRequired,
+    initialValues: PropTypes.object,
 };

 const selector = formValueSelector(FORM_NAME.CLIENT);
--- a/client/src/components/Settings/index.js
+++ b/client/src/components/Settings/index.js
@@ -10,7 +10,7 @@ import Checkbox from '../ui/Checkbox';
 import Loading from '../ui/Loading';
 import PageTitle from '../ui/PageTitle';
 import Card from '../ui/Card';
-import { getObjectKeysSorted } from '../../helpers/helpers';
+import { getObjectKeysSorted, captitalizeWords } from '../../helpers/helpers';
 import './Settings.css';

 const ORDER_KEY = 'order';
@@ -28,12 +28,6 @@ const SETTINGS = {
        subtitle: 'use_adguard_parental_hint',
        [ORDER_KEY]: 1,
    },
-    safesearch: {
-        enabled: false,
-        title: 'enforce_safe_search',
-        subtitle: 'enforce_save_search_hint',
-        [ORDER_KEY]: 2,
-    },
 };

 class Settings extends Component {
@@ -44,7 +38,7 @@ class Settings extends Component {
        this.props.getFilteringStatus();
    }

-    renderSettings = (settings) => getObjectKeysSorted(settings, ORDER_KEY)
+    renderSettings = (settings) => getObjectKeysSorted(SETTINGS, ORDER_KEY)
        .map((key) => {
            const setting = settings[key];
            const { enabled } = setting;
@@ -55,6 +49,35 @@ class Settings extends Component {
            />;
        });

+    renderSafeSearch = () => {
+        const { settings: { settingsList: { safesearch } } } = this.props;
+        const { enabled } = safesearch || {};
+        const searches = { ...(safesearch || {}) };
+        delete searches.enabled;
+        return (
+            <>
+                <Checkbox
+                    enabled={enabled}
+                    title='enforce_safe_search'
+                    subtitle='enforce_save_search_hint'
+                    handleChange={({ target: { checked: enabled } }) => this.props.toggleSetting('safesearch', { ...safesearch, enabled })}
+                />
+                <div className='form__group--inner'>
+                    {Object.keys(searches).map((searchKey) => (
+                        <Checkbox
+                            key={searchKey}
+                            enabled={searches[searchKey]}
+                            title={captitalizeWords(searchKey)}
+                            subtitle=''
+                            disabled={!safesearch.enabled}
+                            handleChange={({ target: { checked } }) => this.props.toggleSetting('safesearch', { ...safesearch, [searchKey]: checked })}
+                        />
+                    ))}
+                </div>
+            </>
+        );
+    };
+
    render() {
        const {
            settings,
@@ -92,6 +115,7 @@ class Settings extends Component {
                                            setFiltersConfig={setFiltersConfig}
                                        />
                                        {this.renderSettings(settings.settingsList)}
+                                        {this.renderSafeSearch()}
                                    </div>
                                </Card>
                            </div>
--- a/client/src/components/ui/Checkbox.js
+++ b/client/src/components/ui/Checkbox.js
@@ -11,13 +11,14 @@ class Checkbox extends Component {
            subtitle,
            enabled,
            handleChange,
+            disabled,
            t,
        } = this.props;
        return (
            <div className="form__group form__group--checkbox">
                <label className="checkbox checkbox--settings">
                <span className="checkbox__marker"/>
-                <input type="checkbox" className="checkbox__input" onChange={handleChange} checked={enabled}/>
+                <input type="checkbox" className="checkbox__input" onChange={handleChange} checked={enabled} disabled={disabled}/>
                <span className="checkbox__label">
                    <span className="checkbox__label-text">
                    <span className="checkbox__label-title">{ t(title) }</span>
@@ -35,6 +36,7 @@ Checkbox.propTypes = {
    subtitle: PropTypes.string.isRequired,
    enabled: PropTypes.bool.isRequired,
    handleChange: PropTypes.func.isRequired,
+    disabled: PropTypes.bool,
    t: PropTypes.func,
 };