+ client: Update packages - Merge pull request #613 in DNS/adguard-home from fix/1597 to master

Close #1597 Squashed commit of the following: commit 1eb89586dd71260e561420fe669abc8b56a506a1 Author: ArtemBaskal <a.baskal@adguard.com> Date: Wed May 20 14:54:10 2020 +0300 Fix translation in install options commit 1ebdc9ebfe12a609f978e47db6505c7095b10f7e Author: ArtemBaskal <a.baskal@adguard.com> Date: Wed May 20 13:11:34 2020 +0300 Remove commented code commit 2a8302c65a2a3cf7b6b1596115d1153dac32a794 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue May 19 19:02:49 2020 +0300 Update i18n packages, add development browserlist, downgrade eslint to match peerDepencancies version commit 3fcf73fb14cd9da508522d1a300b66af24da95e5 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue May 19 17:30:37 2020 +0300 Remove all unused dependencies commit e761810e3e54e188ada41245bdce7414cd0f03e8 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue May 19 16:35:24 2020 +0300 Remove unused dependencies commit d89d27da6befcaabcdc12bf5e7e94cbb24140010 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue May 19 16:14:09 2020 +0300 Update regular dependencies commit d2dfd01233d059870d5173ffd748cf61a477936f Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue May 19 15:34:10 2020 +0300 Update all dev dependancies commit 02b6fb480e9d310039fbe9b7aae062a41128f070 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue May 19 14:14:44 2020 +0300 Update all postcss packages commit 5e1fa5f99ad75f77e5e429b28ee1ca0b5e65a9a0 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue May 19 12:45:02 2020 +0300 Prevent git from converting linebreaks in .js files commit 0b9b3b0dccd47cfa50c9531fb61729e6b5a04523 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue May 19 12:43:01 2020 +0300 Prevent git from converting linebreaks in .js files commit 18b7495e9ef7130b1ac4dbba84c54127d16c6350 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue May 19 12:24:47 2020 +0300 Remove linebreak-style eslint rule commit df893dec53adebb1d662fe805fab508fd4ed5e06 Author: ArtemBaskal <a.baskal@adguard.com> Date: Mon May 18 20:55:47 2020 +0300 Add prop types commit 36178ecfc5c7fa11a6ee08d7705ca8560941af40 Author: ArtemBaskal <a.baskal@adguard.com> Date: Mon May 18 18:52:07 2020 +0300 Update eslint and babel, fix eslint warnings commit f045b4a2e6b9b78f7e88e3b5d1419c29966a8230 Author: ArtemBaskal <a.baskal@adguard.com> Date: Mon May 18 16:45:49 2020 +0300 Update css loading webpack rules commit 247fa1ed548ef0706a03fdada8309c1454d191f8 Author: ArtemBaskal <a.baskal@adguard.com> Date: Sat May 16 16:13:49 2020 +0300 Suppress linebreak-style eslint error for Windows commit d6499aac507100d6918c849c06d739d80f2229f0 Author: ArtemBaskal <a.baskal@adguard.com> Date: Sat May 16 14:55:07 2020 +0300 Suppress eslint exit code commit ae2d6c614ea23a90d515168f8752e959298894ef Author: ArtemBaskal <a.baskal@adguard.com> Date: Sat May 16 14:05:18 2020 +0300 Edit css file warnings commit 60675050f2a5baebc679fc05da7e033e5c740d90 Author: ArtemBaskal <a.baskal@adguard.com> Date: Sat May 16 13:10:26 2020 +0300 Remove uglifyjs plugin commit a27806434dd8672e71a26c7a2e810d77e5e229fa Author: ArtemBaskal <a.baskal@adguard.com> Date: Sat May 16 01:29:17 2020 +0300 Fix DefinePlugin value commit 8f2966ca59195c2f70bca5072d20515d536f42a6 Author: ArtemBaskal <a.baskal@adguard.com> Date: Sat May 16 01:05:03 2020 +0300 Update webpack
2020-05-22 17:06:05 +03:00
parent 8b25a4886e
commit 6f3cd4e7eb
131 changed files with 7454 additions and 8907 deletions
--- a/client/src/components/Settings/Clients/AutoClients.js
+++ b/client/src/components/Settings/Clients/AutoClients.js
@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import { withNamespaces } from 'react-i18next';
+import { withTranslation } from 'react-i18next';
 import ReactTable from 'react-table';

 import Card from '../../ui/Card';
@@ -38,7 +38,7 @@ class AutoClients extends Component {
        },
        {
            Header: this.props.t('requests_count'),
-            accessor: row => this.props.normalizedTopClients.auto[row.ip] || 0,
+            accessor: (row) => this.props.normalizedTopClients.auto[row.ip] || 0,
            sortMethod: (a, b) => b - a,
            id: 'statistics',
            minWidth: COLUMN_MIN_WIDTH,
@@ -101,4 +101,4 @@ AutoClients.propTypes = {
    normalizedTopClients: PropTypes.object.isRequired,
 };

-export default withNamespaces()(AutoClients);
+export default withTranslation()(AutoClients);
--- a/client/src/components/Settings/Clients/ClientsTable.js
+++ b/client/src/components/Settings/Clients/ClientsTable.js
@@ -1,6 +1,6 @@
 import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
-import { Trans, withNamespaces } from 'react-i18next';
+import { Trans, withTranslation } from 'react-i18next';
 import ReactTable from 'react-table';

 import { MODAL_TYPE } from '../../../helpers/constants';
@@ -25,7 +25,7 @@ class ClientsTable extends Component {
            if (values.blocked_services) {
                config.blocked_services = Object
                    .keys(values.blocked_services)
-                    .filter(service => values.blocked_services[service]);
+                    .filter((service) => values.blocked_services[service]);
            }

            if (values.upstreams && typeof values.upstreams === 'string') {
@@ -35,7 +35,7 @@ class ClientsTable extends Component {
            }

            if (values.tags) {
-                config.tags = values.tags.map(tag => tag.value);
+                config.tags = values.tags.map((tag) => tag.value);
            } else {
                config.tags = [];
            }
@@ -48,12 +48,12 @@ class ClientsTable extends Component {
        }
    };

-    getOptionsWithLabels = options => (
-        options.map(option => ({ value: option, label: option }))
+    getOptionsWithLabels = (options) => (
+        options.map((option) => ({ value: option, label: option }))
    );

    getClient = (name, clients) => {
-        const client = clients.find(item => name === item.name);
+        const client = clients.find((item) => name === item.name);

        if (client) {
            const {
@@ -93,7 +93,7 @@ class ClientsTable extends Component {
                return (
                    <div className="logs__row logs__row--overflow">
                        <span className="logs__text">
-                            {value.map(address => (
+                            {value.map((address) => (
                                <div key={address} title={address}>
                                    {address}
                                </div>
@@ -141,7 +141,7 @@ class ClientsTable extends Component {
                return (
                    <div className="logs__row logs__row--icons">
                        {value && value.length > 0
-                            ? value.map(service => (
+                            ? value.map((service) => (
                                <svg
                                    className="service__icon service__icon--table"
                                    title={service}
@@ -187,7 +187,7 @@ class ClientsTable extends Component {
                return (
                    <div className="logs__row logs__row--overflow">
                        <span className="logs__text">
-                            {value.map(tag => (
+                            {value.map((tag) => (
                                <div key={tag} title={tag} className="small">
                                    {tag}
                                </div>
@@ -200,7 +200,7 @@ class ClientsTable extends Component {
        {
            Header: this.props.t('requests_count'),
            id: 'statistics',
-            accessor: row => this.props.normalizedTopClients.configured[row.name] || 0,
+            accessor: (row) => this.props.normalizedTopClients.configured[row.name] || 0,
            sortMethod: (a, b) => b - a,
            minWidth: 120,
            Cell: CellWrap,
@@ -220,11 +220,10 @@ class ClientsTable extends Component {
                        <button
                            type="button"
                            className="btn btn-icon btn-outline-primary btn-sm mr-2"
-                            onClick={() =>
-                                toggleClientModal({
-                                    type: MODAL_TYPE.EDIT,
-                                    name: clientName,
-                                })
+                            onClick={() => toggleClientModal({
+                                type: MODAL_TYPE.EDIT,
+                                name: clientName,
+                            })
                            }
                            disabled={processingUpdating}
                            title={t('edit_table_action')}
@@ -337,4 +336,4 @@ ClientsTable.propTypes = {
    supportedTags: PropTypes.array.isRequired,
 };

-export default withNamespaces()(ClientsTable);
+export default withTranslation()(ClientsTable);
--- a/client/src/components/Settings/Clients/Form.js
+++ b/client/src/components/Settings/Clients/Form.js
@@ -1,8 +1,10 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import PropTypes from 'prop-types';
-import { Field, FieldArray, reduxForm, formValueSelector } from 'redux-form';
-import { Trans, withNamespaces } from 'react-i18next';
+import {
+    Field, FieldArray, reduxForm, formValueSelector,
+} from 'redux-form';
+import { Trans, withTranslation } from 'react-i18next';
 import flow from 'lodash/flow';
 import Select from 'react-select';

@@ -62,40 +64,39 @@ const validate = (values) => {
 };


-const renderFieldsWrapper = (placeholder, buttonTitle) =>
-    function cell(row) {
-        const {
-            fields,
-        } = row;
-        return (
-            <div className="form__group">
-                {fields.map((ip, index) => (
-                    <div key={index} className="mb-1">
-                        <Field
-                            name={ip}
-                            component={renderGroupField}
-                            type="text"
-                            className="form-control"
-                            placeholder={placeholder}
-                            isActionAvailable={index !== 0}
-                            removeField={() => fields.remove(index)}
-                            normalizeOnBlur={data => data.trim()}
-                        />
-                    </div>
-                ))}
-                <button
-                    type="button"
-                    className="btn btn-link btn-block btn-sm"
-                    onClick={() => fields.push()}
-                    title={buttonTitle}
-                >
-                    <svg className="icon icon--close">
-                        <use xlinkHref="#plus" />
-                    </svg>
-                </button>
-            </div>
-        );
-    };
+const renderFieldsWrapper = (placeholder, buttonTitle) => function cell(row) {
+    const {
+        fields,
+    } = row;
+    return (
+        <div className="form__group">
+            {fields.map((ip, index) => (
+                <div key={index} className="mb-1">
+                    <Field
+                        name={ip}
+                        component={renderGroupField}
+                        type="text"
+                        className="form-control"
+                        placeholder={placeholder}
+                        isActionAvailable={index !== 0}
+                        removeField={() => fields.remove(index)}
+                        normalizeOnBlur={(data) => data.trim()}
+                    />
+                </div>
+            ))}
+            <button
+                type="button"
+                className="btn btn-link btn-block btn-sm"
+                onClick={() => fields.push()}
+                title={buttonTitle}
+            >
+                <svg className="icon icon--close">
+                    <use xlinkHref="#plus" />
+                </svg>
+            </button>
+        </div>
+    );
+};

 // Should create function outside of component to prevent component re-renders
 const renderFields = renderFieldsWrapper(i18n.t('form_enter_id'), i18n.t('form_add_id'));
@@ -109,7 +110,7 @@ const renderMultiselect = (props) => {
            options={options}
            className="basic-multi-select"
            classNamePrefix="select"
-            onChange={value => input.onChange(value)}
+            onChange={(value) => input.onChange(value)}
            onBlur={() => input.onBlur(input.value)}
            placeholder={placeholder}
            blurInputOnSelect={false}
@@ -118,6 +119,12 @@ const renderMultiselect = (props) => {
    );
 };

+renderMultiselect.propTypes = {
+    input: PropTypes.object.isRequired,
+    placeholder: PropTypes.string,
+    options: PropTypes.object,
+};
+
 let Form = (props) => {
    const {
        t,
@@ -147,7 +154,7 @@ let Form = (props) => {
                            type="text"
                            className="form-control"
                            placeholder={t('form_client_name')}
-                            normalizeOnBlur={data => data.trim()}
+                            normalizeOnBlur={(data) => data.trim()}
                        />
                    </div>

@@ -159,7 +166,8 @@ let Form = (props) => {
                        </div>
                        <div className="form__desc mt-0 mb-2">
                            <Trans components={[
-                                <a href="https://github.com/AdguardTeam/AdGuardHome/wiki/Hosts-Blocklists#ctag" key="0">link</a>,
+                                <a href="https://github.com/AdguardTeam/AdGuardHome/wiki/Hosts-Blocklists#ctag"
+                                   key="0">link</a>,
                            ]}>
                                tags_desc
                            </Trans>
@@ -201,7 +209,7 @@ let Form = (props) => {

                <Tabs controlClass="form">
                    <div label="settings" title={props.t('main_settings')}>
-                        {settingsCheckboxes.map(setting => (
+                        {settingsCheckboxes.map((setting) => (
                            <div className="form__group" key={setting.name}>
                                <Field
                                    name={setting.name}
@@ -249,7 +257,7 @@ let Form = (props) => {
                                </div>
                            </div>
                            <div className="services">
-                                {SERVICES.map(service => (
+                                {SERVICES.map((service) => (
                                    <Field
                                        key={service.id}
                                        icon={`service_${service.id}`}
@@ -299,11 +307,11 @@ let Form = (props) => {
                        type="submit"
                        className="btn btn-success btn-standard"
                        disabled={
-                            submitting ||
-                            invalid ||
-                            pristine ||
-                            processingAdding ||
-                            processingUpdating
+                            submitting
+                            || invalid
+                            || pristine
+                            || processingAdding
+                            || processingUpdating
                        }
                    >
                        <Trans>save_btn</Trans>
@@ -342,7 +350,7 @@ Form = connect((state) => {
 })(Form);

 export default flow([
-    withNamespaces(),
+    withTranslation(),
    reduxForm({
        form: 'clientForm',
        enableReinitialize: true,
--- a/client/src/components/Settings/Clients/Modal.js
+++ b/client/src/components/Settings/Clients/Modal.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Trans, withNamespaces } from 'react-i18next';
+import { Trans, withTranslation } from 'react-i18next';
 import ReactModal from 'react-modal';

 import { MODAL_TYPE } from '../../../helpers/constants';
@@ -81,4 +81,4 @@ Modal.propTypes = {
    tagsOptions: PropTypes.array.isRequired,
 };

-export default withNamespaces()(Modal);
+export default withTranslation()(Modal);
--- a/client/src/components/Settings/Clients/index.js
+++ b/client/src/components/Settings/Clients/index.js
@@ -1,5 +1,5 @@
 import React, { Component, Fragment } from 'react';
-import { withNamespaces } from 'react-i18next';
+import { withTranslation } from 'react-i18next';
 import PropTypes from 'prop-types';

 import ClientsTable from './ClientsTable';
@@ -72,4 +72,4 @@ Clients.propTypes = {
    getStats: PropTypes.func.isRequired,
 };

-export default withNamespaces()(Clients);
+export default withTranslation()(Clients);
--- a/client/src/components/Settings/Clients/whoisCell.js
+++ b/client/src/components/Settings/Clients/whoisCell.js
@@ -29,15 +29,14 @@ const getFormattedWhois = (value, t) => {
    return '–';
 };

-const whoisCell = t =>
-    function cell(row) {
-        const { value } = row;
+const whoisCell = (t) => function cell(row) {
+    const { value } = row;

-        return (
+    return (
            <div className="logs__row logs__row--overflow">
                <span className="logs__text logs__text--wrap">{getFormattedWhois(value, t)}</span>
            </div>
-        );
-    };
+    );
+};

 export default whoisCell;