+ 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
This commit is contained in:
Artem Baskal 2020-05-22 17:06:05 +03:00
parent 8b25a4886e
commit 6f3cd4e7eb
131 changed files with 7454 additions and 8907 deletions

16
client/.babelrc vendored Normal file
View File

@ -0,0 +1,16 @@
{
"presets": [
[
"@babel/preset-env",
{
"modules": false
}
],
"@babel/preset-react"
],
"plugins": [
"@babel/plugin-proposal-class-properties",
"@babel/plugin-transform-runtime",
"@babel/plugin-proposal-object-rest-spread"
]
}

1
client/.gitattributes vendored Normal file
View File

@ -0,0 +1 @@
*.js text eol=lf

14355
client/package-lock.json generated vendored

File diff suppressed because it is too large Load Diff

166
client/package.json vendored
View File

@ -1,81 +1,89 @@
{
"name": "dashboard",
"version": "0.1.0",
"private": true,
"scripts": {
"build-dev": "cross-env NODE_ENV=development webpack --config webpack.dev.js",
"watch": "cross-env NODE_ENV=development webpack --config webpack.dev.js --watch",
"build-prod": "cross-env NODE_ENV=production webpack --config webpack.prod.js",
"lint": "eslint client/"
},
"dependencies": {
"@nivo/line": "^0.49.1",
"axios": "^0.19.0",
"classnames": "^2.2.6",
"date-fns": "^1.29.0",
"i18next": "^12.0.0",
"i18next-browser-languagedetector": "^2.2.3",
"lodash": "^4.17.15",
"nanoid": "^1.2.3",
"prop-types": "^15.7.2",
"react": "^16.4.0",
"react-click-outside": "^3.0.1",
"react-dom": "^16.4.0",
"react-i18next": "^8.2.0",
"react-modal": "^3.4.5",
"react-redux": "^5.0.7",
"react-redux-loading-bar": "^4.0.7",
"react-router-dom": "^4.2.2",
"react-router-hash-link": "^1.2.2",
"react-select": "^3.0.8",
"react-table": "^6.10.3",
"react-transition-group": "^2.4.0",
"redux": "^4.0.0",
"redux-actions": "^2.4.0",
"redux-form": "^7.4.2",
"redux-thunk": "^2.3.0",
"url-polyfill": "^1.1.7"
},
"devDependencies": {
"autoprefixer": "^8.6.3",
"babel-core": "6.26.0",
"babel-eslint": "^8.2.3",
"babel-loader": "7.1.2",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-2": "^6.24.1",
"babel-runtime": "6.26.0",
"clean-webpack-plugin": "^0.1.19",
"compression-webpack-plugin": "^1.1.11",
"copy-webpack-plugin": "^4.6.0",
"cross-env": "^7.0.2",
"css-loader": "^2.1.1",
"eslint": "^4.19.1",
"eslint-config-airbnb-base": "^12.1.0",
"eslint-config-react-app": "^2.1.0",
"eslint-import-resolver-webpack": "^0.12.1",
"eslint-loader": "1.9.0",
"eslint-plugin-import": "^2.12.0",
"eslint-plugin-jsx-a11y": "5.1.1",
"eslint-plugin-react": "^7.9.1",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "1.1.5",
"html-webpack-plugin": "^3.2.0",
"postcss-flexbugs-fixes": "3.2.0",
"postcss-import": "^11.1.0",
"postcss-loader": "^2.1.5",
"postcss-mixins": "^6.2.0",
"postcss-preset-env": "^5.1.0",
"postcss-svg": "^2.4.0",
"style-loader": "^0.21.0",
"stylelint": "^9.10.1",
"stylelint-webpack-plugin": "0.10.4",
"svg-url-loader": "^2.3.2",
"uglifyjs-webpack-plugin": "^1.2.7",
"url-loader": "^1.0.1",
"webpack": "3.8.1",
"webpack-dev-server": "^3.1.14",
"webpack-merge": "^4.1.3"
}
"name": "dashboard",
"version": "0.1.0",
"private": true,
"scripts": {
"build-dev": "cross-env BUILD_ENV=dev webpack --config webpack.dev.js",
"watch": "cross-env BUILD_ENV=dev webpack --config webpack.dev.js --watch",
"build-prod": "cross-env BUILD_ENV=prod webpack --config webpack.prod.js",
"lint": "eslint src"
},
"dependencies": {
"@nivo/line": "^0.49.1",
"axios": "^0.19.2",
"classnames": "^2.2.6",
"date-fns": "^1.29.0",
"i18next": "^19.4.4",
"i18next-browser-languagedetector": "^4.2.0",
"lodash": "^4.17.15",
"nanoid": "^3.1.9",
"prop-types": "^15.7.2",
"react": "^16.13.1",
"react-click-outside": "^3.0.1",
"react-dom": "^16.13.1",
"react-i18next": "^11.4.0",
"react-modal": "^3.11.2",
"react-redux": "^7.2.0",
"react-redux-loading-bar": "^4.6.0",
"react-router-dom": "^5.2.0",
"react-router-hash-link": "^1.2.2",
"react-select": "^3.1.0",
"react-table": "^6.11.4",
"react-transition-group": "^4.4.1",
"redux": "^4.0.5",
"redux-actions": "^2.6.5",
"redux-form": "^8.3.5",
"redux-thunk": "^2.3.0",
"url-polyfill": "^1.1.9"
},
"devDependencies": {
"@babel/core": "^7.9.6",
"@babel/plugin-proposal-class-properties": "^7.8.3",
"@babel/plugin-proposal-object-rest-spread": "^7.9.6",
"@babel/plugin-transform-runtime": "^7.9.6",
"@babel/preset-env": "^7.9.6",
"@babel/preset-react": "^7.9.4",
"autoprefixer": "^9.8.0",
"babel-eslint": "^10.1.0",
"babel-loader": "^8.1.0",
"clean-webpack-plugin": "^3.0.0",
"copy-webpack-plugin": "^6.0.1",
"cross-env": "^7.0.2",
"css-loader": "^3.5.3",
"eslint": "^6.8.0",
"eslint-config-airbnb": "^18.1.0",
"eslint-import-resolver-webpack": "^0.12.1",
"eslint-loader": "^4.0.2",
"eslint-plugin-import": "^2.20.2",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.20.0",
"eslint-plugin-react-hooks": "^2.5.0",
"file-loader": "6.0.0",
"html-webpack-plugin": "^4.3.0",
"mini-css-extract-plugin": "^0.9.0",
"path": "^0.12.7",
"postcss-flexbugs-fixes": "4.2.1",
"postcss-loader": "^3.0.0",
"style-loader": "^1.2.1",
"stylelint": "^13.5.0",
"stylelint-webpack-plugin": "2.0.0",
"url-loader": "^4.1.0",
"webpack": "^4.43.0",
"webpack-cli": "^3.3.11",
"webpack-dev-server": "^3.11.0",
"webpack-merge": "^4.2.2"
},
"browserslist": {
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
],
"production": [
">1%",
"last 4 versions",
"Firefox ESR",
"not ie < 9"
]
}
}

View File

@ -1,10 +1,10 @@
import { createAction } from 'redux-actions';
import { t } from 'i18next';
import i18next from 'i18next';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast } from './index';
import { normalizeTextarea } from '../helpers/helpers';
import { ACTION } from '../helpers/constants';
import { addErrorToast, addSuccessToast } from './toasts';
export const getAccessListRequest = createAction('GET_ACCESS_LIST_REQUEST');
export const getAccessListFailure = createAction('GET_ACCESS_LIST_FAILURE');
@ -25,7 +25,7 @@ export const setAccessListRequest = createAction('SET_ACCESS_LIST_REQUEST');
export const setAccessListFailure = createAction('SET_ACCESS_LIST_FAILURE');
export const setAccessListSuccess = createAction('SET_ACCESS_LIST_SUCCESS');
export const setAccessList = config => async (dispatch) => {
export const setAccessList = (config) => async (dispatch) => {
dispatch(setAccessListRequest());
try {
const { allowed_clients, disallowed_clients, blocked_hosts } = config;
@ -58,7 +58,7 @@ export const toggleClientBlock = (type, ip) => async (dispatch) => {
let updatedDisallowedClients = disallowed_clients || [];
if (type === ACTION.unblock && updatedDisallowedClients.includes(ip)) {
updatedDisallowedClients = updatedDisallowedClients.filter(client => client !== ip);
updatedDisallowedClients = updatedDisallowedClients.filter((client) => client !== ip);
} else if (type === ACTION.block && !updatedDisallowedClients.includes(ip)) {
updatedDisallowedClients.push(ip);
}
@ -73,9 +73,9 @@ export const toggleClientBlock = (type, ip) => async (dispatch) => {
dispatch(toggleClientBlockSuccess(values));
if (type === ACTION.unblock) {
dispatch(addSuccessToast(t('client_unblocked', { ip })));
dispatch(addSuccessToast(i18next.t('client_unblocked', { ip })));
} else if (type === ACTION.block) {
dispatch(addSuccessToast(t('client_blocked', { ip })));
dispatch(addSuccessToast(i18next.t('client_blocked', { ip })));
}
} catch (error) {
dispatch(addErrorToast({ error }));

View File

@ -1,7 +1,8 @@
import { createAction } from 'redux-actions';
import { t } from 'i18next';
import i18next from 'i18next';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast, getClients } from './index';
import { getClients } from './index';
import { addErrorToast, addSuccessToast } from './toasts';
export const toggleClientModal = createAction('TOGGLE_CLIENT_MODAL');
@ -9,13 +10,13 @@ export const addClientRequest = createAction('ADD_CLIENT_REQUEST');
export const addClientFailure = createAction('ADD_CLIENT_FAILURE');
export const addClientSuccess = createAction('ADD_CLIENT_SUCCESS');
export const addClient = config => async (dispatch) => {
export const addClient = (config) => async (dispatch) => {
dispatch(addClientRequest());
try {
await apiClient.addClient(config);
dispatch(addClientSuccess());
dispatch(toggleClientModal());
dispatch(addSuccessToast(t('client_added', { key: config.name })));
dispatch(addSuccessToast(i18next.t('client_added', { key: config.name })));
dispatch(getClients());
} catch (error) {
dispatch(addErrorToast({ error }));
@ -27,12 +28,12 @@ export const deleteClientRequest = createAction('DELETE_CLIENT_REQUEST');
export const deleteClientFailure = createAction('DELETE_CLIENT_FAILURE');
export const deleteClientSuccess = createAction('DELETE_CLIENT_SUCCESS');
export const deleteClient = config => async (dispatch) => {
export const deleteClient = (config) => async (dispatch) => {
dispatch(deleteClientRequest());
try {
await apiClient.deleteClient(config);
dispatch(deleteClientSuccess());
dispatch(addSuccessToast(t('client_deleted', { key: config.name })));
dispatch(addSuccessToast(i18next.t('client_deleted', { key: config.name })));
dispatch(getClients());
} catch (error) {
dispatch(addErrorToast({ error }));
@ -52,7 +53,7 @@ export const updateClient = (config, name) => async (dispatch) => {
await apiClient.updateClient(data);
dispatch(updateClientSuccess());
dispatch(toggleClientModal());
dispatch(addSuccessToast(t('client_updated', { key: name })));
dispatch(addSuccessToast(i18next.t('client_updated', { key: name })));
dispatch(getClients());
} catch (error) {
dispatch(addErrorToast({ error }));

View File

@ -1,8 +1,8 @@
import { createAction } from 'redux-actions';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast } from './index';
import { normalizeTextarea } from '../helpers/helpers';
import { addErrorToast, addSuccessToast } from './toasts';
export const getDnsConfigRequest = createAction('GET_DNS_CONFIG_REQUEST');
export const getDnsConfigFailure = createAction('GET_DNS_CONFIG_FAILURE');
@ -23,7 +23,7 @@ export const setDnsConfigRequest = createAction('SET_DNS_CONFIG_REQUEST');
export const setDnsConfigFailure = createAction('SET_DNS_CONFIG_FAILURE');
export const setDnsConfigSuccess = createAction('SET_DNS_CONFIG_SUCCESS');
export const setDnsConfig = config => async (dispatch) => {
export const setDnsConfig = (config) => async (dispatch) => {
dispatch(setDnsConfigRequest());
try {
const data = { ...config };

View File

@ -1,7 +1,7 @@
import { createAction } from 'redux-actions';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast } from './index';
import { redirectToCurrentProtocol } from '../helpers/helpers';
import { addErrorToast, addSuccessToast } from './toasts';
export const getTlsStatusRequest = createAction('GET_TLS_STATUS_REQUEST');
export const getTlsStatusFailure = createAction('GET_TLS_STATUS_FAILURE');
@ -25,7 +25,7 @@ export const setTlsConfigRequest = createAction('SET_TLS_CONFIG_REQUEST');
export const setTlsConfigFailure = createAction('SET_TLS_CONFIG_FAILURE');
export const setTlsConfigSuccess = createAction('SET_TLS_CONFIG_SUCCESS');
export const setTlsConfig = config => async (dispatch, getState) => {
export const setTlsConfig = (config) => async (dispatch, getState) => {
dispatch(setTlsConfigRequest());
try {
const { httpPort } = getState().dashboard;
@ -51,7 +51,7 @@ export const validateTlsConfigRequest = createAction('VALIDATE_TLS_CONFIG_REQUES
export const validateTlsConfigFailure = createAction('VALIDATE_TLS_CONFIG_FAILURE');
export const validateTlsConfigSuccess = createAction('VALIDATE_TLS_CONFIG_SUCCESS');
export const validateTlsConfig = config => async (dispatch) => {
export const validateTlsConfig = (config) => async (dispatch) => {
dispatch(validateTlsConfigRequest());
try {
const values = { ...config };

View File

@ -1,10 +1,10 @@
import { createAction } from 'redux-actions';
import { showLoading, hideLoading } from 'react-redux-loading-bar';
import { t } from 'i18next';
import i18next from 'i18next';
import { normalizeFilteringStatus, normalizeRulesTextarea } from '../helpers/helpers';
import { addErrorToast, addSuccessToast } from './index';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast } from './toasts';
export const toggleFilteringModal = createAction('FILTERING_MODAL_TOGGLE');
export const handleRulesChange = createAction('HANDLE_RULES_CHANGE');
@ -28,7 +28,7 @@ export const setRulesRequest = createAction('SET_RULES_REQUEST');
export const setRulesFailure = createAction('SET_RULES_FAILURE');
export const setRulesSuccess = createAction('SET_RULES_SUCCESS');
export const setRules = rules => async (dispatch) => {
export const setRules = (rules) => async (dispatch) => {
dispatch(setRulesRequest());
try {
const normalizedRules = normalizeRulesTextarea(rules);
@ -113,7 +113,7 @@ export const refreshFiltersRequest = createAction('FILTERING_REFRESH_REQUEST');
export const refreshFiltersFailure = createAction('FILTERING_REFRESH_FAILURE');
export const refreshFiltersSuccess = createAction('FILTERING_REFRESH_SUCCESS');
export const refreshFilters = config => async (dispatch) => {
export const refreshFilters = (config) => async (dispatch) => {
dispatch(refreshFiltersRequest());
dispatch(showLoading());
try {
@ -122,7 +122,7 @@ export const refreshFilters = config => async (dispatch) => {
dispatch(refreshFiltersSuccess());
if (updated > 0) {
dispatch(addSuccessToast(t('list_updated', { count: updated })));
dispatch(addSuccessToast(i18next.t('list_updated', { count: updated })));
} else {
dispatch(addSuccessToast('all_lists_up_to_date_toast'));
}
@ -140,7 +140,7 @@ export const setFiltersConfigRequest = createAction('SET_FILTERS_CONFIG_REQUEST'
export const setFiltersConfigFailure = createAction('SET_FILTERS_CONFIG_FAILURE');
export const setFiltersConfigSuccess = createAction('SET_FILTERS_CONFIG_SUCCESS');
export const setFiltersConfig = config => async (dispatch, getState) => {
export const setFiltersConfig = (config) => async (dispatch, getState) => {
dispatch(setFiltersConfigRequest());
try {
const { enabled } = config;
@ -170,7 +170,7 @@ export const checkHostSuccess = createAction('CHECK_HOST_SUCCESS');
* @param {string} host.name
* @returns {undefined}
*/
export const checkHost = host => async (dispatch) => {
export const checkHost = (host) => async (dispatch) => {
dispatch(checkHostRequest());
try {
const data = await apiClient.checkHost(host);

View File

@ -1,16 +1,12 @@
import { createAction } from 'redux-actions';
import { t } from 'i18next';
import i18next from 'i18next';
import axios from 'axios';
import { normalizeTextarea, sortClients, isVersionGreater } from '../helpers/helpers';
import { SETTINGS_NAMES, CHECK_TIMEOUT } from '../helpers/constants';
import { isVersionGreater, normalizeTextarea, sortClients } from '../helpers/helpers';
import { CHECK_TIMEOUT, SETTINGS_NAMES } from '../helpers/constants';
import { getTlsStatus } from './encryption';
import apiClient from '../api/Api';
export const addErrorToast = createAction('ADD_ERROR_TOAST');
export const addSuccessToast = createAction('ADD_SUCCESS_TOAST');
export const addNoticeToast = createAction('ADD_NOTICE_TOAST');
export const removeToast = createAction('REMOVE_TOAST');
import { addErrorToast, addNoticeToast, addSuccessToast } from './toasts';
export const toggleSettingStatus = createAction('SETTING_STATUS_TOGGLE');
export const showSettingsFailure = createAction('SETTINGS_FAILURE_SHOW');
@ -62,7 +58,7 @@ export const initSettingsRequest = createAction('SETTINGS_INIT_REQUEST');
export const initSettingsFailure = createAction('SETTINGS_INIT_FAILURE');
export const initSettingsSuccess = createAction('SETTINGS_INIT_SUCCESS');
export const initSettings = settingsList => async (dispatch) => {
export const initSettings = (settingsList) => async (dispatch) => {
dispatch(initSettingsRequest());
try {
const safebrowsingStatus = await apiClient.getSafebrowsingStatus();
@ -89,7 +85,7 @@ export const toggleProtectionRequest = createAction('TOGGLE_PROTECTION_REQUEST')
export const toggleProtectionFailure = createAction('TOGGLE_PROTECTION_FAILURE');
export const toggleProtectionSuccess = createAction('TOGGLE_PROTECTION_SUCCESS');
export const toggleProtection = status => async (dispatch) => {
export const toggleProtection = (status) => async (dispatch) => {
dispatch(toggleProtectionRequest());
try {
const successMessage = status ? 'disabled_protection' : 'enabled_protection';
@ -139,7 +135,7 @@ const checkStatus = async (handleRequestSuccess, handleRequestError, attempts =
handleRequestError();
}
const rmTimeout = t => t && clearTimeout(t);
const rmTimeout = (t) => t && clearTimeout(t);
try {
const response = await axios.get('control/status');
@ -270,7 +266,7 @@ export const testUpstreamRequest = createAction('TEST_UPSTREAM_REQUEST');
export const testUpstreamFailure = createAction('TEST_UPSTREAM_FAILURE');
export const testUpstreamSuccess = createAction('TEST_UPSTREAM_SUCCESS');
export const testUpstream = config => async (dispatch) => {
export const testUpstream = (config) => async (dispatch) => {
dispatch(testUpstreamRequest());
try {
const values = { ...config };
@ -281,12 +277,12 @@ export const testUpstream = config => async (dispatch) => {
const testMessages = Object.keys(upstreamResponse).map((key) => {
const message = upstreamResponse[key];
if (message !== 'OK') {
dispatch(addErrorToast({ error: t('dns_test_not_ok_toast', { key }) }));
dispatch(addErrorToast({ error: i18next.t('dns_test_not_ok_toast', { key }) }));
}
return message;
});
if (testMessages.every(message => message === 'OK')) {
if (testMessages.every((message) => message === 'OK')) {
dispatch(addSuccessToast('dns_test_ok_toast'));
}
@ -301,7 +297,7 @@ export const changeLanguageRequest = createAction('CHANGE_LANGUAGE_REQUEST');
export const changeLanguageFailure = createAction('CHANGE_LANGUAGE_FAILURE');
export const changeLanguageSuccess = createAction('CHANGE_LANGUAGE_SUCCESS');
export const changeLanguage = lang => async (dispatch) => {
export const changeLanguage = (lang) => async (dispatch) => {
dispatch(changeLanguageRequest());
try {
await apiClient.changeLanguage(lang);
@ -361,7 +357,7 @@ export const findActiveDhcpRequest = createAction('FIND_ACTIVE_DHCP_REQUEST');
export const findActiveDhcpSuccess = createAction('FIND_ACTIVE_DHCP_SUCCESS');
export const findActiveDhcpFailure = createAction('FIND_ACTIVE_DHCP_FAILURE');
export const findActiveDhcp = name => async (dispatch) => {
export const findActiveDhcp = (name) => async (dispatch) => {
dispatch(findActiveDhcpRequest());
try {
const activeDhcp = await apiClient.findActiveDhcp(name);
@ -376,7 +372,7 @@ export const setDhcpConfigRequest = createAction('SET_DHCP_CONFIG_REQUEST');
export const setDhcpConfigSuccess = createAction('SET_DHCP_CONFIG_SUCCESS');
export const setDhcpConfigFailure = createAction('SET_DHCP_CONFIG_FAILURE');
export const setDhcpConfig = values => async (dispatch, getState) => {
export const setDhcpConfig = (values) => async (dispatch, getState) => {
const { config } = getState().dhcp;
const updatedConfig = { ...config, ...values };
dispatch(setDhcpConfigRequest());
@ -395,7 +391,7 @@ export const toggleDhcpRequest = createAction('TOGGLE_DHCP_REQUEST');
export const toggleDhcpFailure = createAction('TOGGLE_DHCP_FAILURE');
export const toggleDhcpSuccess = createAction('TOGGLE_DHCP_SUCCESS');
export const toggleDhcp = values => async (dispatch) => {
export const toggleDhcp = (values) => async (dispatch) => {
dispatch(toggleDhcpRequest());
let config = { ...values, enabled: false };
let successMessage = 'disabled_dhcp';
@ -438,13 +434,13 @@ export const addStaticLeaseRequest = createAction('ADD_STATIC_LEASE_REQUEST');
export const addStaticLeaseFailure = createAction('ADD_STATIC_LEASE_FAILURE');
export const addStaticLeaseSuccess = createAction('ADD_STATIC_LEASE_SUCCESS');
export const addStaticLease = config => async (dispatch) => {
export const addStaticLease = (config) => async (dispatch) => {
dispatch(addStaticLeaseRequest());
try {
const name = config.hostname || config.ip;
await apiClient.addStaticLease(config);
dispatch(addStaticLeaseSuccess(config));
dispatch(addSuccessToast(t('dhcp_lease_added', { key: name })));
dispatch(addSuccessToast(i18next.t('dhcp_lease_added', { key: name })));
dispatch(toggleLeaseModal());
} catch (error) {
dispatch(addErrorToast({ error }));
@ -456,15 +452,17 @@ export const removeStaticLeaseRequest = createAction('REMOVE_STATIC_LEASE_REQUES
export const removeStaticLeaseFailure = createAction('REMOVE_STATIC_LEASE_FAILURE');
export const removeStaticLeaseSuccess = createAction('REMOVE_STATIC_LEASE_SUCCESS');
export const removeStaticLease = config => async (dispatch) => {
export const removeStaticLease = (config) => async (dispatch) => {
dispatch(removeStaticLeaseRequest());
try {
const name = config.hostname || config.ip;
await apiClient.removeStaticLease(config);
dispatch(removeStaticLeaseSuccess(config));
dispatch(addSuccessToast(t('dhcp_lease_deleted', { key: name })));
dispatch(addSuccessToast(i18next.t('dhcp_lease_deleted', { key: name })));
} catch (error) {
dispatch(addErrorToast({ error }));
dispatch(removeStaticLeaseFailure());
}
};
export const removeToast = createAction('REMOVE_TOAST');

View File

@ -1,6 +1,6 @@
import { createAction } from 'redux-actions';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast } from './index';
import { addErrorToast, addSuccessToast } from './toasts';
export const nextStep = createAction('NEXT_STEP');
export const prevStep = createAction('PREV_STEP');
@ -24,7 +24,7 @@ export const setAllSettingsRequest = createAction('SET_ALL_SETTINGS_REQUEST');
export const setAllSettingsFailure = createAction('SET_ALL_SETTINGS_FAILURE');
export const setAllSettingsSuccess = createAction('SET_ALL_SETTINGS_SUCCESS');
export const setAllSettings = values => async (dispatch) => {
export const setAllSettings = (values) => async (dispatch) => {
dispatch(setAllSettingsRequest());
try {
const {
@ -47,7 +47,7 @@ export const checkConfigRequest = createAction('CHECK_CONFIG_REQUEST');
export const checkConfigFailure = createAction('CHECK_CONFIG_FAILURE');
export const checkConfigSuccess = createAction('CHECK_CONFIG_SUCCESS');
export const checkConfig = values => async (dispatch) => {
export const checkConfig = (values) => async (dispatch) => {
dispatch(checkConfigRequest());
try {
const check = await apiClient.checkConfig(values);

View File

@ -1,13 +1,13 @@
import { createAction } from 'redux-actions';
import { addErrorToast } from './index';
import apiClient from '../api/Api';
import { addErrorToast } from './toasts';
export const processLoginRequest = createAction('PROCESS_LOGIN_REQUEST');
export const processLoginFailure = createAction('PROCESS_LOGIN_FAILURE');
export const processLoginSuccess = createAction('PROCESS_LOGIN_SUCCESS');
export const processLogin = values => async (dispatch) => {
export const processLogin = (values) => async (dispatch) => {
dispatch(processLoginRequest());
try {
await apiClient.login(values);

View File

@ -1,9 +1,9 @@
import { createAction } from 'redux-actions';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast } from './index';
import { normalizeLogs, getParamsForClientsSearch, addClientInfo } from '../helpers/helpers';
import { TABLE_DEFAULT_PAGE_SIZE } from '../helpers/constants';
import { addErrorToast, addSuccessToast } from './toasts';
const getLogsWithParams = async (config) => {
const { older_than, filter, ...values } = config;
@ -27,9 +27,9 @@ const checkFilteredLogs = async (data, filter, dispatch, total) => {
const { logs, oldest } = data;
const totalData = total || { logs };
const needToGetAdditionalLogs = (logs.length < TABLE_DEFAULT_PAGE_SIZE ||
totalData.logs.length < TABLE_DEFAULT_PAGE_SIZE) &&
oldest !== '';
const needToGetAdditionalLogs = (logs.length < TABLE_DEFAULT_PAGE_SIZE
|| totalData.logs.length < TABLE_DEFAULT_PAGE_SIZE)
&& oldest !== '';
if (needToGetAdditionalLogs) {
dispatch(getAdditionalLogsRequest());
@ -61,7 +61,7 @@ export const getLogsRequest = createAction('GET_LOGS_REQUEST');
export const getLogsFailure = createAction('GET_LOGS_FAILURE');
export const getLogsSuccess = createAction('GET_LOGS_SUCCESS');
export const getLogs = config => async (dispatch, getState) => {
export const getLogs = (config) => async (dispatch, getState) => {
dispatch(getLogsRequest());
try {
const { isFiltered, filter, page } = getState().queryLogs;
@ -85,7 +85,7 @@ export const setLogsFilterRequest = createAction('SET_LOGS_FILTER_REQUEST');
export const setLogsFilterFailure = createAction('SET_LOGS_FILTER_FAILURE');
export const setLogsFilterSuccess = createAction('SET_LOGS_FILTER_SUCCESS');
export const setLogsFilter = filter => async (dispatch) => {
export const setLogsFilter = (filter) => async (dispatch) => {
dispatch(setLogsFilterRequest());
try {
const data = await getLogsWithParams({ older_than: '', filter });
@ -135,7 +135,7 @@ export const setLogsConfigRequest = createAction('SET_LOGS_CONFIG_REQUEST');
export const setLogsConfigFailure = createAction('SET_LOGS_CONFIG_FAILURE');
export const setLogsConfigSuccess = createAction('SET_LOGS_CONFIG_SUCCESS');
export const setLogsConfig = config => async (dispatch) => {
export const setLogsConfig = (config) => async (dispatch) => {
dispatch(setLogsConfigRequest());
try {
await apiClient.setQueryLogConfig(config);

View File

@ -1,7 +1,7 @@
import { createAction } from 'redux-actions';
import { t } from 'i18next';
import i18next from 'i18next';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast } from './index';
import { addErrorToast, addSuccessToast } from './toasts';
export const toggleRewritesModal = createAction('TOGGLE_REWRITES_MODAL');
@ -24,14 +24,14 @@ export const addRewriteRequest = createAction('ADD_REWRITE_REQUEST');
export const addRewriteFailure = createAction('ADD_REWRITE_FAILURE');
export const addRewriteSuccess = createAction('ADD_REWRITE_SUCCESS');
export const addRewrite = config => async (dispatch) => {
export const addRewrite = (config) => async (dispatch) => {
dispatch(addRewriteRequest());
try {
await apiClient.addRewrite(config);
dispatch(addRewriteSuccess(config));
dispatch(toggleRewritesModal());
dispatch(getRewritesList());
dispatch(addSuccessToast(t('rewrite_added', { key: config.domain })));
dispatch(addSuccessToast(i18next.t('rewrite_added', { key: config.domain })));
} catch (error) {
dispatch(addErrorToast({ error }));
dispatch(addRewriteFailure());
@ -42,13 +42,13 @@ export const deleteRewriteRequest = createAction('DELETE_REWRITE_REQUEST');
export const deleteRewriteFailure = createAction('DELETE_REWRITE_FAILURE');
export const deleteRewriteSuccess = createAction('DELETE_REWRITE_SUCCESS');
export const deleteRewrite = config => async (dispatch) => {
export const deleteRewrite = (config) => async (dispatch) => {
dispatch(deleteRewriteRequest());
try {
await apiClient.deleteRewrite(config);
dispatch(deleteRewriteSuccess());
dispatch(getRewritesList());
dispatch(addSuccessToast(t('rewrite_deleted', { key: config.domain })));
dispatch(addSuccessToast(i18next.t('rewrite_deleted', { key: config.domain })));
} catch (error) {
dispatch(addErrorToast({ error }));
dispatch(deleteRewriteFailure());

View File

@ -1,6 +1,6 @@
import { createAction } from 'redux-actions';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast } from './index';
import { addErrorToast, addSuccessToast } from './toasts';
export const getBlockedServicesRequest = createAction('GET_BLOCKED_SERVICES_REQUEST');
export const getBlockedServicesFailure = createAction('GET_BLOCKED_SERVICES_FAILURE');
@ -21,7 +21,7 @@ export const setBlockedServicesRequest = createAction('SET_BLOCKED_SERVICES_REQU
export const setBlockedServicesFailure = createAction('SET_BLOCKED_SERVICES_FAILURE');
export const setBlockedServicesSuccess = createAction('SET_BLOCKED_SERVICES_SUCCESS');
export const setBlockedServices = values => async (dispatch) => {
export const setBlockedServices = (values) => async (dispatch) => {
dispatch(setBlockedServicesRequest());
try {
await apiClient.setBlockedServices(values);

View File

@ -1,8 +1,10 @@
import { createAction } from 'redux-actions';
import apiClient from '../api/Api';
import { addErrorToast, addSuccessToast } from './index';
import { normalizeTopStats, secondsToMilliseconds, getParamsForClientsSearch, addClientInfo } from '../helpers/helpers';
import {
normalizeTopStats, secondsToMilliseconds, getParamsForClientsSearch, addClientInfo,
} from '../helpers/helpers';
import { addErrorToast, addSuccessToast } from './toasts';
export const getStatsConfigRequest = createAction('GET_STATS_CONFIG_REQUEST');
export const getStatsConfigFailure = createAction('GET_STATS_CONFIG_FAILURE');
@ -23,7 +25,7 @@ export const setStatsConfigRequest = createAction('SET_STATS_CONFIG_REQUEST');
export const setStatsConfigFailure = createAction('SET_STATS_CONFIG_FAILURE');
export const setStatsConfigSuccess = createAction('SET_STATS_CONFIG_SUCCESS');
export const setStatsConfig = config => async (dispatch) => {
export const setStatsConfig = (config) => async (dispatch) => {
dispatch(setStatsConfigRequest());
try {
await apiClient.setStatsConfig(config);

View File

@ -0,0 +1,5 @@
import { createAction } from 'redux-actions';
export const addErrorToast = createAction('ADD_ERROR_TOAST');
export const addSuccessToast = createAction('ADD_SUCCESS_TOAST');
export const addNoticeToast = createAction('ADD_NOTICE_TOAST');

View File

@ -32,8 +32,11 @@ class Api {
// Global methods
GLOBAL_STATUS = { path: 'status', method: 'GET' };
GLOBAL_TEST_UPSTREAM_DNS = { path: 'test_upstream_dns', method: 'POST' };
GLOBAL_VERSION = { path: 'version.json', method: 'POST' };
GLOBAL_UPDATE = { path: 'update', method: 'POST' };
getGlobalStatus() {
@ -66,12 +69,19 @@ class Api {
// Filtering
FILTERING_STATUS = { path: 'filtering/status', method: 'GET' };
FILTERING_ADD_FILTER = { path: 'filtering/add_url', method: 'POST' };
FILTERING_REMOVE_FILTER = { path: 'filtering/remove_url', method: 'POST' };
FILTERING_SET_RULES = { path: 'filtering/set_rules', method: 'POST' };
FILTERING_REFRESH = { path: 'filtering/refresh', method: 'POST' };
FILTERING_SET_URL = { path: 'filtering/set_url', method: 'POST' };
FILTERING_CONFIG = { path: 'filtering/config', method: 'POST' };
FILTERING_CHECK_HOST = { path: 'filtering/check_host', method: 'GET' };
getFilteringStatus() {
@ -144,7 +154,9 @@ class Api {
// Parental
PARENTAL_STATUS = { path: 'parental/status', method: 'GET' };
PARENTAL_ENABLE = { path: 'parental/enable', method: 'POST' };
PARENTAL_DISABLE = { path: 'parental/disable', method: 'POST' };
getParentalStatus() {
@ -169,7 +181,9 @@ class Api {
// Safebrowsing
SAFEBROWSING_STATUS = { path: 'safebrowsing/status', method: 'GET' };
SAFEBROWSING_ENABLE = { path: 'safebrowsing/enable', method: 'POST' };
SAFEBROWSING_DISABLE = { path: 'safebrowsing/disable', method: 'POST' };
getSafebrowsingStatus() {
@ -189,7 +203,9 @@ class Api {
// Safesearch
SAFESEARCH_STATUS = { path: 'safesearch/status', method: 'GET' };
SAFESEARCH_ENABLE = { path: 'safesearch/enable', method: 'POST' };
SAFESEARCH_DISABLE = { path: 'safesearch/disable', method: 'POST' };
getSafesearchStatus() {
@ -209,6 +225,7 @@ class Api {
// Language
CURRENT_LANGUAGE = { path: 'i18n/current_language', method: 'GET' };
CHANGE_LANGUAGE = { path: 'i18n/change_language', method: 'POST' };
getCurrentLanguage() {
@ -227,11 +244,17 @@ class Api {
// DHCP
DHCP_STATUS = { path: 'dhcp/status', method: 'GET' };
DHCP_SET_CONFIG = { path: 'dhcp/set_config', method: 'POST' };
DHCP_FIND_ACTIVE = { path: 'dhcp/find_active_dhcp', method: 'POST' };
DHCP_INTERFACES = { path: 'dhcp/interfaces', method: 'GET' };
DHCP_ADD_STATIC_LEASE = { path: 'dhcp/add_static_lease', method: 'POST' };
DHCP_REMOVE_STATIC_LEASE = { path: 'dhcp/remove_static_lease', method: 'POST' };
DHCP_RESET = { path: 'dhcp/reset', method: 'POST' };
getDhcpStatus() {
@ -287,7 +310,9 @@ class Api {
// Installation
INSTALL_GET_ADDRESSES = { path: 'install/get_addresses', method: 'GET' };
INSTALL_CONFIGURE = { path: 'install/configure', method: 'POST' };
INSTALL_CHECK_CONFIG = { path: 'install/check_config', method: 'POST' };
getDefaultAddresses() {
@ -315,7 +340,9 @@ class Api {
// DNS-over-HTTPS and DNS-over-TLS
TLS_STATUS = { path: 'tls/status', method: 'GET' };
TLS_CONFIG = { path: 'tls/configure', method: 'POST' };
TLS_VALIDATE = { path: 'tls/validate', method: 'POST' };
getTlsStatus() {
@ -343,9 +370,13 @@ class Api {
// Per-client settings
GET_CLIENTS = { path: 'clients', method: 'GET' };
FIND_CLIENTS = { path: 'clients/find', method: 'GET' };
ADD_CLIENT = { path: 'clients/add', method: 'POST' };
DELETE_CLIENT = { path: 'clients/delete', method: 'POST' };
UPDATE_CLIENT = { path: 'clients/update', method: 'POST' };
getClients() {
@ -388,6 +419,7 @@ class Api {
// DNS access settings
ACCESS_LIST = { path: 'access/list', method: 'GET' };
ACCESS_SET = { path: 'access/set', method: 'POST' };
getAccessList() {
@ -406,7 +438,9 @@ class Api {
// DNS rewrites
REWRITES_LIST = { path: 'rewrite/list', method: 'GET' };
REWRITE_ADD = { path: 'rewrite/add', method: 'POST' };
REWRITE_DELETE = { path: 'rewrite/delete', method: 'POST' };
getRewritesList() {
@ -434,6 +468,7 @@ class Api {
// Blocked services
BLOCKED_SERVICES_LIST = { path: 'blocked_services/list', method: 'GET' };
BLOCKED_SERVICES_SET = { path: 'blocked_services/set', method: 'POST' };
getBlockedServices() {
@ -452,8 +487,11 @@ class Api {
// Settings for statistics
GET_STATS = { path: 'stats', method: 'GET' };
STATS_INFO = { path: 'stats_info', method: 'GET' };
STATS_CONFIG = { path: 'stats_config', method: 'POST' };
STATS_RESET = { path: 'stats_reset', method: 'POST' };
getStats() {
@ -482,8 +520,11 @@ class Api {
// Query log
GET_QUERY_LOG = { path: 'querylog', method: 'GET' };
QUERY_LOG_CONFIG = { path: 'querylog_config', method: 'POST' };
QUERY_LOG_INFO = { path: 'querylog_info', method: 'GET' };
QUERY_LOG_CLEAR = { path: 'querylog_clear', method: 'POST' };
getQueryLog(params) {
@ -533,6 +574,7 @@ class Api {
// DNS config
GET_DNS_CONFIG = { path: 'dns_info', method: 'GET' };
SET_DNS_CONFIG = { path: 'dns_config', method: 'POST' };
getDnsConfig() {

View File

@ -1,5 +1,5 @@
:root {
font-family-monospace: Monaco, Menlo, "Ubuntu Mono", Consolas, source-code-pro, monospace;
--font-family-monospace: Monaco, Menlo, "Ubuntu Mono", Consolas, source-code-pro, monospace;
}
body {
@ -37,4 +37,4 @@ body {
.font-monospace {
font-family: var(--font-family-monospace);
}
}

View File

@ -1,7 +1,7 @@
import React, { Component, Fragment } from 'react';
import { HashRouter, Route } from 'react-router-dom';
import PropTypes from 'prop-types';
import { withNamespaces } from 'react-i18next';
import { withTranslation } from 'react-i18next';
import LoadingBar from 'react-redux-loading-bar';
import 'react-table/react-table.css';
@ -147,4 +147,4 @@ App.propTypes = {
getVersion: PropTypes.func,
};
export default withNamespaces()(App);
export default withTranslation()(App);

View File

@ -1,7 +1,7 @@
import React from 'react';
import ReactTable from 'react-table';
import PropTypes from 'prop-types';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation, Trans } from 'react-i18next';
import Card from '../ui/Card';
import Cell from '../ui/Cell';
@ -10,13 +10,12 @@ import DomainCell from './DomainCell';
import { getPercent } from '../../helpers/helpers';
import { STATUS_COLORS } from '../../helpers/constants';
const CountCell = totalBlocked =>
function cell(row) {
const { value } = row;
const percent = getPercent(totalBlocked, value);
const CountCell = (totalBlocked) => function cell(row) {
const { value } = row;
const percent = getPercent(totalBlocked, value);
return <Cell value={value} percent={percent} color={STATUS_COLORS.red} />;
};
return <Cell value={value} percent={percent} color={STATUS_COLORS.red} />;
};
const BlockedDomains = ({
t,
@ -74,4 +73,4 @@ BlockedDomains.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(BlockedDomains);
export default withTranslation()(BlockedDomains);

View File

@ -1,7 +1,7 @@
import React, { Fragment } from 'react';
import ReactTable from 'react-table';
import PropTypes from 'prop-types';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import Card from '../ui/Card';
import Cell from '../ui/Cell';
@ -13,20 +13,19 @@ import { formatClientCell } from '../../helpers/formatClientCell';
const getClientsPercentColor = (percent) => {
if (percent > 50) {
return STATUS_COLORS.green;
} else if (percent > 10) {
} if (percent > 10) {
return STATUS_COLORS.yellow;
}
return STATUS_COLORS.red;
};
const countCell = dnsQueries =>
function cell(row) {
const { value } = row;
const percent = getPercent(dnsQueries, value);
const percentColor = getClientsPercentColor(percent);
const countCell = (dnsQueries) => function cell(row) {
const { value } = row;
const percent = getPercent(dnsQueries, value);
const percentColor = getClientsPercentColor(percent);
return <Cell value={value} percent={percent} color={percentColor} />;
};
return <Cell value={value} percent={percent} color={percentColor} />;
};
const renderBlockingButton = (blocked, ip, handleClick, processing) => {
let buttonProps = {
@ -59,20 +58,19 @@ const renderBlockingButton = (blocked, ip, handleClick, processing) => {
const isBlockedClient = (clients, ip) => !!(clients && clients.includes(ip));
const clientCell = (t, toggleClientStatus, processing, disallowedClients) =>
function cell(row) {
const { value } = row;
const blocked = isBlockedClient(disallowedClients, value);
const clientCell = (t, toggleClientStatus, processing, disallowedClients) => function cell(row) {
const { value } = row;
const blocked = isBlockedClient(disallowedClients, value);
return (
return (
<Fragment>
<div className="logs__row logs__row--overflow logs__row--column">
{formatClientCell(row, t)}
</div>
{renderBlockingButton(blocked, value, toggleClientStatus, processing)}
</Fragment>
);
};
);
};
const Clients = ({
t,
@ -103,8 +101,7 @@ const Clients = ({
{
Header: 'IP',
accessor: 'ip',
sortMethod: (a, b) =>
parseInt(a.replace(/\./g, ''), 10) - parseInt(b.replace(/\./g, ''), 10),
sortMethod: (a, b) => parseInt(a.replace(/\./g, ''), 10) - parseInt(b.replace(/\./g, ''), 10),
Cell: clientCell(t, toggleClientStatus, processingAccessSet, disallowedClients),
},
{
@ -154,4 +151,4 @@ Clients.propTypes = {
disallowedClients: PropTypes.string.isRequired,
};
export default withNamespaces()(Clients);
export default withTranslation()(Clients);

View File

@ -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 round from 'lodash/round';
import Card from '../ui/Card';
@ -23,10 +23,9 @@ const Counters = (props) => {
avgProcessingTime,
} = props;
const tooltipTitle =
interval === 1
? t('number_of_dns_query_24_hours')
: t('number_of_dns_query_days', { count: interval });
const tooltipTitle = interval === 1
? t('number_of_dns_query_24_hours')
: t('number_of_dns_query_days', { count: interval });
return (
<Card
@ -136,4 +135,4 @@ Counters.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Counters);
export default withTranslation()(Counters);

View File

@ -1,7 +1,7 @@
import React from 'react';
import ReactTable from 'react-table';
import PropTypes from 'prop-types';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation, Trans } from 'react-i18next';
import Card from '../ui/Card';
import Cell from '../ui/Cell';
@ -13,20 +13,19 @@ import { getPercent } from '../../helpers/helpers';
const getQueriedPercentColor = (percent) => {
if (percent > 10) {
return STATUS_COLORS.red;
} else if (percent > 5) {
} if (percent > 5) {
return STATUS_COLORS.yellow;
}
return STATUS_COLORS.green;
};
const countCell = dnsQueries =>
function cell(row) {
const { value } = row;
const percent = getPercent(dnsQueries, value);
const percentColor = getQueriedPercentColor(percent);
const countCell = (dnsQueries) => function cell(row) {
const { value } = row;
const percent = getPercent(dnsQueries, value);
const percentColor = getQueriedPercentColor(percent);
return <Cell value={value} percent={percent} color={percentColor} />;
};
return <Cell value={value} percent={percent} color={percentColor} />;
};
const QueriedDomains = ({
t, refreshButton, topQueriedDomains, subtitle, dnsQueries,
@ -72,4 +71,4 @@ QueriedDomains.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(QueriedDomains);
export default withTranslation()(QueriedDomains);

View File

@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation, Trans } from 'react-i18next';
import StatsCard from './StatsCard';
import { getPercent, normalizeHistory } from '../../helpers/helpers';
@ -76,4 +76,4 @@ Statistics.propTypes = {
refreshButton: PropTypes.node.isRequired,
};
export default withNamespaces()(Statistics);
export default withTranslation()(Statistics);

View File

@ -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 Statistics from './Statistics';
import Counters from './Counters';
@ -57,10 +57,9 @@ class Dashboard extends Component {
|| stats.processingGetConfig
|| access.processing;
const subtitle =
stats.interval === 1
? t('for_last_24_hours')
: t('for_last_days', { count: stats.interval });
const subtitle = stats.interval === 1
? t('for_last_24_hours')
: t('for_last_days', { count: stats.interval });
const refreshFullButton = (
<button
@ -173,4 +172,4 @@ Dashboard.propTypes = {
getAccessList: PropTypes.func.isRequired,
};
export default withNamespaces()(Dashboard);
export default withTranslation()(Dashboard);

View File

@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation, Trans } from 'react-i18next';
const Actions = ({
handleAdd, handleRefresh, processingRefreshFilters, whitelist,
@ -35,5 +35,4 @@ Actions.propTypes = {
whitelist: PropTypes.bool,
};
export default withNamespaces()(Actions);
export default withTranslation()(Actions);

View File

@ -1,6 +1,6 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { withNamespaces } from 'react-i18next';
import { withTranslation } from 'react-i18next';
import {
checkFiltered,
@ -20,8 +20,8 @@ const getFilterName = (id, filters, whitelistFilters, t) => {
return t('filtered_custom_rules');
}
const filter = filters.find(filter => filter.id === id)
|| whitelistFilters.find(filter => filter.id === id);
const filter = filters.find((filter) => filter.id === id)
|| whitelistFilters.find((filter) => filter.id === id);
if (filter && filter.name) {
return t('query_log_filtered', { filter: filter.name });
@ -80,9 +80,9 @@ const getTitle = (reason, filterName, t, onlyFiltered) => {
const getColor = (reason) => {
if (checkFiltered(reason)) {
return 'red';
} else if (checkRewrite(reason) || checkRewriteHosts(reason)) {
} if (checkRewrite(reason) || checkRewriteHosts(reason)) {
return 'blue';
} else if (checkWhiteList(reason)) {
} if (checkWhiteList(reason)) {
return 'green';
}
@ -162,4 +162,4 @@ Info.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Info);
export default withTranslation()(Info);

View File

@ -1,6 +1,6 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import { Field, reduxForm } from 'redux-form';
import flow from 'lodash/flow';
import Card from '../../ui/Card';
@ -51,7 +51,7 @@ const Check = (props) => {
<button
className="btn btn-success btn-standard btn-large"
type="submit"
onClick={this.handleSubmit}
onClick={handleSubmit}
disabled={pristine || invalid || processing}
>
<Trans>check</Trans>
@ -93,6 +93,6 @@ Check.propTypes = {
};
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({ form: 'domainCheckForm' }),
])(Check);

View File

@ -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 Card from '../ui/Card';
import PageTitle from '../ui/PageTitle';
@ -92,4 +92,4 @@ CustomRules.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(CustomRules);
export default withTranslation()(CustomRules);

View File

@ -1,6 +1,6 @@
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import { withNamespaces } from 'react-i18next';
import { withTranslation } from 'react-i18next';
import PageTitle from '../ui/PageTitle';
import Card from '../ui/Card';
@ -131,4 +131,4 @@ DnsAllowlist.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(DnsAllowlist);
export default withTranslation()(DnsAllowlist);

View File

@ -1,6 +1,6 @@
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import { withNamespaces } from 'react-i18next';
import { withTranslation } from 'react-i18next';
import PageTitle from '../ui/PageTitle';
import Card from '../ui/Card';
@ -122,4 +122,4 @@ DnsBlocklist.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(DnsBlocklist);
export default withTranslation()(DnsBlocklist);

View File

@ -1,5 +1,5 @@
import React, { Fragment } from 'react';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation, Trans } from 'react-i18next';
const Examples = () => (
<Fragment>
@ -51,4 +51,4 @@ const Examples = () => (
</Fragment>
);
export default withNamespaces()(Examples);
export default withTranslation()(Examples);

View File

@ -1,7 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderInputField, required, isValidPath } from '../../helpers/form';
@ -28,7 +28,7 @@ const Form = (props) => {
className="form-control"
placeholder={t('enter_name_hint')}
validate={[required]}
normalizeOnBlur={data => data.trim()}
normalizeOnBlur={(data) => data.trim()}
/>
</div>
<div className="form__group">
@ -40,15 +40,12 @@ const Form = (props) => {
className="form-control"
placeholder={t('enter_url_or_path_hint')}
validate={[required, isValidPath]}
normalizeOnBlur={data => data.trim()}
normalizeOnBlur={(data) => data.trim()}
/>
</div>
<div className="form__description">
{whitelist ? (
<Trans>enter_valid_allowlist</Trans>
) : (
<Trans>enter_valid_blocklist</Trans>
)}
{whitelist ? <Trans>enter_valid_allowlist</Trans>
: <Trans>enter_valid_blocklist</Trans>}
</div>
</div>
<div className="modal-footer">
@ -81,7 +78,7 @@ Form.propTypes = {
};
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'filterForm',
}),

View File

@ -1,7 +1,7 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ReactModal from 'react-modal';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import { MODAL_TYPE } from '../../helpers/constants';
import Form from './Form';
@ -85,4 +85,4 @@ Modal.propTypes = {
whitelist: PropTypes.bool,
};
export default withNamespaces()(Modal);
export default withTranslation()(Modal);

View File

@ -1,10 +1,12 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderInputField, required, domain, answer } from '../../../helpers/form';
import {
renderInputField, required, domain, answer,
} from '../../../helpers/form';
const Form = (props) => {
const {
@ -100,7 +102,7 @@ Form.propTypes = {
};
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'rewritesForm',
enableReinitialize: true,

View File

@ -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 Form from './Form';
@ -49,4 +49,4 @@ Modal.propTypes = {
processingDelete: PropTypes.bool.isRequired,
};
export default withNamespaces()(Modal);
export default withTranslation()(Modal);

View File

@ -1,7 +1,7 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ReactTable from 'react-table';
import { withNamespaces } from 'react-i18next';
import { withTranslation } from 'react-i18next';
class Table extends Component {
cellWrap = ({ value }) => (
@ -27,16 +27,15 @@ class Table extends Component {
Header: this.props.t('actions_table_header'),
accessor: 'actions',
maxWidth: 100,
Cell: value => (
Cell: (value) => (
<div className="logs__row logs__row--center">
<button
type="button"
className="btn btn-icon btn-outline-secondary btn-sm"
onClick={() =>
this.props.handleDelete({
answer: value.row.answer,
domain: value.row.domain,
})
onClick={() => this.props.handleDelete({
answer: value.row.answer,
domain: value.row.domain,
})
}
title={this.props.t('delete_table_action')}
>
@ -84,4 +83,4 @@ Table.propTypes = {
handleDelete: PropTypes.func.isRequired,
};
export default withNamespaces()(Table);
export default withTranslation()(Table);

View File

@ -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 Table from './Table';
import Modal from './Modal';
@ -89,4 +89,4 @@ Rewrites.propTypes = {
rewrites: PropTypes.object.isRequired,
};
export default withNamespaces()(Rewrites);
export default withTranslation()(Rewrites);

View File

@ -1,14 +1,14 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ReactTable from 'react-table';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation, Trans } from 'react-i18next';
import CellWrap from '../ui/CellWrap';
import { MODAL_TYPE } from '../../helpers/constants';
import { formatDetailedDateTime } from '../../helpers/helpers';
import { isValidAbsolutePath } from '../../helpers/form';
class Table extends Component {
getDateCell = row => CellWrap(row, formatDetailedDateTime);
getDateCell = (row) => CellWrap(row, formatDetailedDateTime);
renderCheckbox = ({ original }) => {
const { processingConfigFilter, toggleFilter } = this.props;
@ -49,8 +49,8 @@ class Table extends Component {
minWidth: 200,
Cell: ({ value }) => (
<div className="logs__row logs__row--overflow">
{isValidAbsolutePath(value) ? value :
<a
{isValidAbsolutePath(value) ? value
: <a
href={value}
target="_blank"
rel="noopener noreferrer"
@ -66,7 +66,7 @@ class Table extends Component {
accessor: 'rulesCount',
className: 'text-center',
minWidth: 100,
Cell: props => props.value.toLocaleString(),
Cell: (props) => props.value.toLocaleString(),
},
{
Header: <Trans>last_time_updated_table_header</Trans>,
@ -91,11 +91,10 @@ class Table extends Component {
type="button"
className="btn btn-icon btn-outline-primary btn-sm mr-2"
title={t('edit_table_action')}
onClick={() =>
toggleFilteringModal({
type: MODAL_TYPE.EDIT,
url: value,
})
onClick={() => toggleFilteringModal({
type: MODAL_TYPE.EDIT,
url: value,
})
}
>
<svg className="icons">
@ -154,4 +153,4 @@ Table.propTypes = {
whitelist: PropTypes.bool,
};
export default withNamespaces()(Table);
export default withTranslation()(Table);

View File

@ -3,7 +3,7 @@ import { NavLink } from 'react-router-dom';
import PropTypes from 'prop-types';
import enhanceWithClickOutside from 'react-click-outside';
import classnames from 'classnames';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import { SETTINGS_URLS, FILTERS_URLS, MENU_URLS } from '../../helpers/constants';
import Dropdown from '../ui/Dropdown';
@ -51,7 +51,7 @@ class Menu extends Component {
getActiveClassForDropdown = (URLS) => {
const { pathname } = this.props.location;
const isActivePage = Object.values(URLS).some(item => item === pathname);
const isActivePage = Object.values(URLS).some((item) => item === pathname);
return isActivePage ? 'active' : '';
};
@ -77,21 +77,20 @@ class Menu extends Component {
getDropdown = ({
label, order, URLS, icon, ITEMS,
}) =>
(
}) => (
<Dropdown
label={this.props.t(label)}
baseClassName={`dropdown nav-item order-${order}`}
controlClassName={`nav-link ${this.getActiveClassForDropdown(URLS)}`}
icon={icon}>
{ITEMS.map(item => (
{ITEMS.map((item) => (
this.getNavLink({
...item,
order,
className: 'dropdown-item',
})))}
</Dropdown>
);
);
render() {
const menuClass = classnames({
@ -102,7 +101,7 @@ class Menu extends Component {
<Fragment>
<div className={menuClass}>
<ul className="nav nav-tabs border-0 flex-column flex-lg-row flex-nowrap">
{MENU_ITEMS.map(item => (
{MENU_ITEMS.map((item) => (
<li
className={`nav-item order-${item.order}`}
key={item.text}
@ -139,4 +138,4 @@ Menu.propTypes = {
t: PropTypes.func,
};
export default withNamespaces()(enhanceWithClickOutside(Menu));
export default withTranslation()(enhanceWithClickOutside(Menu));

View File

@ -2,7 +2,7 @@ import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import Menu from './Menu';
import logo from '../ui/svg/logo.svg';
@ -14,7 +14,7 @@ class Header extends Component {
};
toggleMenuOpen = () => {
this.setState(prevState => ({ isMenuOpen: !prevState.isMenuOpen }));
this.setState((prevState) => ({ isMenuOpen: !prevState.isMenuOpen }));
};
closeMenu = () => {
@ -59,8 +59,8 @@ class Header extends Component {
/>
<div className="header__column">
<div className="header__right">
{!dashboard.processingProfile && dashboard.name &&
<a href="control/logout" className="btn btn-sm btn-outline-secondary">
{!dashboard.processingProfile && dashboard.name
&& <a href="control/logout" className="btn btn-sm btn-outline-secondary">
<Trans>sign_out</Trans>
</a>
}
@ -80,4 +80,4 @@ Header.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Header);
export default withTranslation()(Header);

View File

@ -1,7 +1,7 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderInputField } from '../../../helpers/form';
@ -18,27 +18,40 @@ const renderFilterField = ({
autoComplete,
tooltip,
meta: { touched, error },
}) => (
<Fragment>
<div className="logs__input-wrap">
<input
{...input}
id={id}
placeholder={placeholder}
type={type}
className={className}
disabled={disabled}
autoComplete={autoComplete}
/>
<span className="logs__notice">
}) => <Fragment>
<div className="logs__input-wrap">
<input
{...input}
id={id}
placeholder={placeholder}
type={type}
className={className}
disabled={disabled}
autoComplete={autoComplete}
/>
<span className="logs__notice">
<Tooltip text={tooltip} type='tooltip-custom--logs' />
</span>
{!disabled &&
touched &&
(error && <span className="form__message form__message--error">{error}</span>)}
</div>
</Fragment>
);
{!disabled
&& touched
&& (error && <span className="form__message form__message--error">{error}</span>)}
</div>
</Fragment>;
renderFilterField.propTypes = {
input: PropTypes.object.isRequired,
id: PropTypes.string.isRequired,
className: PropTypes.string,
placeholder: PropTypes.string,
type: PropTypes.string,
disabled: PropTypes.string,
autoComplete: PropTypes.string,
tooltip: PropTypes.string,
meta: PropTypes.shape({
touched: PropTypes.bool,
error: PropTypes.object,
}).isRequired,
};
const Form = (props) => {
const {
@ -79,10 +92,10 @@ const Form = (props) => {
className="form-control custom-select"
>
<option value={RESPONSE_FILTER.ALL}>
<Trans>show_all_filter_type</Trans>
{t('show_all_filter_type')}
</option>
<option value={RESPONSE_FILTER.FILTERED}>
<Trans>show_filtered_type</Trans>
{t('show_filtered_type')}
</option>
</Field>
</div>
@ -109,7 +122,7 @@ Form.propTypes = {
};
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'logsFilterForm',
}),

View File

@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import ReactTable from 'react-table';
import escapeRegExp from 'lodash/escapeRegExp';
import endsWith from 'lodash/endsWith';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import { HashLink as Link } from 'react-router-hash-link';
import {
@ -17,7 +17,9 @@ import {
checkBlackList,
checkBlockedService,
} from '../../helpers/helpers';
import { SERVICES, TABLE_DEFAULT_PAGE_SIZE, CUSTOM_FILTERING_RULES_ID, FILTERED } from '../../helpers/constants';
import {
SERVICES, TABLE_DEFAULT_PAGE_SIZE, CUSTOM_FILTERING_RULES_ID, FILTERED,
} from '../../helpers/constants';
import { getTrackerData } from '../../helpers/trackers/trackers';
import { formatClientCell } from '../../helpers/formatClientCell';
@ -54,8 +56,8 @@ class Logs extends Component {
window.location.reload();
};
renderTooltip = (isFiltered, rule, filter, service) =>
isFiltered && <PopoverFiltered rule={rule} filter={filter} service={service} />;
renderTooltip = (isFiltered, rule, filter, service) => isFiltered
&& <PopoverFiltered rule={rule} filter={filter} service={service} />;
renderResponseList = (response, status) => {
if (response.length > 0) {
@ -116,7 +118,7 @@ class Logs extends Component {
);
}
getDateCell = row => CellWrap(
getDateCell = (row) => CellWrap(
row,
(isToday(row.value) ? formatTime : formatDateTime),
formatDateTime,
@ -134,7 +136,7 @@ class Logs extends Component {
);
};
normalizeResponse = response => (
normalizeResponse = (response) => (
response.map((response) => {
const { value, type, ttl } = response;
return `${type}: ${value} (ttl=${ttl})`;
@ -146,8 +148,8 @@ class Logs extends Component {
return t('custom_filter_rules');
}
const filter = filters.find(filter => filter.id === filterId)
|| whitelistFilters.find(filter => filter.id === filterId);
const filter = filters.find((filter) => filter.id === filterId)
|| whitelistFilters.find((filter) => filter.id === filterId);
let filterName = '';
if (filter) {
@ -178,7 +180,7 @@ class Logs extends Component {
const filterKey = reason.replace(FILTERED, '');
const parsedFilteredReason = t('query_log_filtered', { filter: filterKey });
const currentService = SERVICES.find(service => service.id === original.serviceName);
const currentService = SERVICES.find((service) => service.id === original.serviceName);
const serviceName = currentService && currentService.name;
const filterName = this.getFilterName(filters, whitelistFilters, filterId, t);
@ -378,11 +380,11 @@ class Logs extends Component {
return {
className: 'red',
};
} else if (checkWhiteList(reason)) {
} if (checkWhiteList(reason)) {
return {
className: 'green',
};
} else if (checkRewrite(reason) || checkRewriteHosts(reason)) {
} if (checkRewrite(reason) || checkRewriteHosts(reason)) {
return {
className: 'blue',
};
@ -467,4 +469,4 @@ Logs.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Logs);
export default withTranslation()(Logs);

View File

@ -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);

View File

@ -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);

View File

@ -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,

View File

@ -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);

View File

@ -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);

View File

@ -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;

View File

@ -2,16 +2,18 @@ import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { Field, reduxForm, formValueSelector } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderInputField, required, ipv4, isPositive, toNumber } from '../../../helpers/form';
import {
renderInputField, required, ipv4, isPositive, toNumber,
} from '../../../helpers/form';
const renderInterfaces = (interfaces => (
const renderInterfaces = ((interfaces) => (
Object.keys(interfaces).map((item) => {
const option = interfaces[item];
const { name } = option;
const onlyIPv6 = option.ip_addresses.every(ip => ip.includes(':'));
const onlyIPv6 = option.ip_addresses.every((ip) => ip.includes(':'));
let interfaceIP = option.ip_addresses[0];
if (!onlyIPv6) {
@ -30,7 +32,7 @@ const renderInterfaces = (interfaces => (
})
));
const renderInterfaceValues = (interfaceValues => (
const renderInterfaceValues = ((interfaceValues) => (
<ul className="list-unstyled mt-1 mb-0">
<li>
<span className="interface__title">MTU: </span>
@ -44,7 +46,7 @@ const renderInterfaceValues = (interfaceValues => (
<span className="interface__title"><Trans>dhcp_ip_addresses</Trans>: </span>
{
interfaceValues.ip_addresses
.map(ip => <span key={ip} className="interface__ip">{ip}</span>)
.map((ip) => <span key={ip} className="interface__ip">{ip}</span>)
}
</li>
</ul>
@ -62,7 +64,7 @@ const clearFields = (change, resetDhcp, t) => {
// eslint-disable-next-line no-alert
if (window.confirm(t('dhcp_reset'))) {
Object.keys(fields).forEach(field => change(field, fields[field]));
Object.keys(fields).forEach((field) => change(field, fields[field]));
resetDhcp();
}
};
@ -84,8 +86,8 @@ let Form = (props) => {
return (
<form onSubmit={handleSubmit}>
{!processingInterfaces && interfaces &&
<div className="row">
{!processingInterfaces && interfaces
&& <div className="row">
<div className="col-sm-12 col-md-6">
<div className="form__group form__group--settings">
<label>{t('dhcp_interface_select')}</label>
@ -102,10 +104,10 @@ let Form = (props) => {
</Field>
</div>
</div>
{interfaceValue &&
<div className="col-sm-12 col-md-6">
{interfaces[interfaceValue] &&
renderInterfaceValues(interfaces[interfaceValue])}
{interfaceValue
&& <div className="col-sm-12 col-md-6">
{interfaces[interfaceValue]
&& renderInterfaceValues(interfaces[interfaceValue])}
</div>
}
</div>
@ -229,6 +231,6 @@ Form = connect((state) => {
})(Form);
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({ form: 'dhcpForm' }),
])(Form);

View File

@ -1,7 +1,7 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ReactTable from 'react-table';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import { SMALL_TABLE_DEFAULT_PAGE_SIZE } from '../../../helpers/constants';
class Leases extends Component {
@ -53,4 +53,4 @@ Leases.propTypes = {
t: PropTypes.func,
};
export default withNamespaces()(Leases);
export default withTranslation()(Leases);

View File

@ -1,10 +1,12 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderInputField, ipv4, mac, required } from '../../../../helpers/form';
import {
renderInputField, ipv4, mac, required,
} from '../../../../helpers/form';
const Form = (props) => {
const {
@ -91,6 +93,6 @@ Form.propTypes = {
};
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({ form: 'leaseForm' }),
])(Form);

View File

@ -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 Form from './Form';
@ -46,4 +46,4 @@ Modal.propTypes = {
processingAdding: PropTypes.bool.isRequired,
};
export default withNamespaces()(Modal);
export default withTranslation()(Modal);

View File

@ -1,7 +1,7 @@
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import ReactTable from 'react-table';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import { SMALL_TABLE_DEFAULT_PAGE_SIZE } from '../../../../helpers/constants';
import Modal from './Modal';
@ -70,8 +70,7 @@ class StaticLeases extends Component {
className="btn btn-icon btn-outline-secondary btn-sm"
title={t('delete_table_action')}
disabled={processingDeleting}
onClick={() =>
this.handleDelete(ip, mac, hostname)
onClick={() => this.handleDelete(ip, mac, hostname)
}
>
<svg className="icons">
@ -112,4 +111,4 @@ StaticLeases.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(StaticLeases);
export default withTranslation()(StaticLeases);

View File

@ -1,7 +1,7 @@
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import { DHCP_STATUS_RESPONSE } from '../../../helpers/constants';
import Form from './Form';
@ -32,8 +32,8 @@ class Dhcp extends Component {
const {
config, check, processingDhcp, processingConfig,
} = this.props.dhcp;
const otherDhcpFound =
check && check.otherServer && check.otherServer.found === DHCP_STATUS_RESPONSE.YES;
const otherDhcpFound = check && check.otherServer
&& check.otherServer.found === DHCP_STATUS_RESPONSE.YES;
const filledConfig = Object.keys(config).every((key) => {
if (key === 'enabled' || key === 'icmp_timeout_msec') {
return true;
@ -127,10 +127,10 @@ class Dhcp extends Component {
<hr className="mt-4 mb-4" />
</Fragment>
);
} else if (
check.staticIP.static === DHCP_STATUS_RESPONSE.NO &&
check.staticIP.ip &&
interfaceName
} if (
check.staticIP.static === DHCP_STATUS_RESPONSE.NO
&& check.staticIP.ip
&& interfaceName
) {
return (
<Fragment>
@ -278,4 +278,4 @@ Dhcp.propTypes = {
resetDhcp: PropTypes.func.isRequired,
};
export default withNamespaces()(Dhcp);
export default withTranslation()(Dhcp);

View File

@ -1,7 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderTextareaField } from '../../../../helpers/form';
@ -82,4 +82,4 @@ Form.propTypes = {
textarea: PropTypes.bool,
};
export default flow([withNamespaces(), reduxForm({ form: 'accessForm' })])(Form);
export default flow([withTranslation(), reduxForm({ form: 'accessForm' })])(Form);

View File

@ -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 Form from './Form';
import Card from '../../../ui/Card';
@ -37,4 +37,4 @@ Access.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Access);
export default withTranslation()(Access);

View File

@ -2,7 +2,7 @@ import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Field, reduxForm, formValueSelector } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import {
@ -45,7 +45,7 @@ const customIps = [{
}];
const getFields = (processing, t) => Object.values(BLOCKING_MODES)
.map(mode => (
.map((mode) => (
<Field
key={mode}
name="blocking_mode"
@ -59,8 +59,7 @@ const getFields = (processing, t) => Object.values(BLOCKING_MODES)
let Form = ({
handleSubmit, submitting, invalid, processing, blockingMode, t,
}) =>
<form onSubmit={handleSubmit}>
}) => <form onSubmit={handleSubmit}>
<div className="row">
<div className="col-12 col-sm-6">
<div className="form__group form__group--settings">
@ -82,8 +81,7 @@ let Form = ({
/>
</div>
</div>
{checkboxes.map(({ name, placeholder, subtitle }) =>
<div className="col-12" key={name}>
{checkboxes.map(({ name, placeholder, subtitle }) => <div className="col-12" key={name}>
<div className="form__group form__group--settings">
<Field
name={name}
@ -102,7 +100,7 @@ let Form = ({
</label>
<div className="form__desc form__desc--top">
{Object.values(BLOCKING_MODES)
.map(mode => (
.map((mode) => (
<li key={mode}>
<Trans>{`blocking_mode_${mode}`}</Trans>
</li>
@ -167,7 +165,7 @@ Form = connect((state) => {
})(Form);
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'blockingModeForm',
}),

View File

@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import { withNamespaces } from 'react-i18next';
import { withTranslation } from 'react-i18next';
import Card from '../../../ui/Card';
import Form from './Form';
@ -52,4 +52,4 @@ Config.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Config);
export default withTranslation()(Config);

View File

@ -1,8 +1,8 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
const Examples = props => (
const Examples = (props) => (
<div className="list leading-loose">
<p>
<Trans
@ -128,4 +128,4 @@ Examples.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Examples);
export default withTranslation()(Examples);

View File

@ -2,7 +2,7 @@ import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { Field, reduxForm, formValueSelector } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import classnames from 'classnames';
@ -107,11 +107,10 @@ let Form = (props) => {
<button
type="button"
className={testButtonClass}
onClick={() =>
testUpstream({
upstream_dns,
bootstrap_dns,
})
onClick={() => testUpstream({
upstream_dns,
bootstrap_dns,
})
}
disabled={!upstream_dns || processingTestUpstream}
>
@ -164,7 +163,7 @@ Form = connect((state) => {
})(Form);
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'upstreamForm',
}),

View File

@ -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 Form from './Form';
import Card from '../../../ui/Card';
@ -62,4 +62,4 @@ Upstream.propTypes = {
setDnsConfig: PropTypes.func.isRequired,
};
export default withNamespaces()(Upstream);
export default withTranslation()(Upstream);

View File

@ -1,6 +1,6 @@
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import { withNamespaces } from 'react-i18next';
import { withTranslation } from 'react-i18next';
import Upstream from './Upstream';
import Access from './Access';
@ -30,9 +30,9 @@ class Dns extends Component {
return (
<Fragment>
<PageTitle title={t('dns_settings')} />
{isDataLoading ?
<Loading /> :
<Fragment>
{isDataLoading
? <Loading />
: <Fragment>
<Upstream
processingTestUpstream={settings.processingTestUpstream}
testUpstream={testUpstream}
@ -62,4 +62,4 @@ Dns.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Dns);
export default withTranslation()(Dns);

View File

@ -1,6 +1,6 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation, Trans } from 'react-i18next';
import format from 'date-fns/format';
import { EMPTY_DATE } from '../../../helpers/constants';
@ -68,4 +68,4 @@ CertificateStatus.propTypes = {
dnsNames: PropTypes.string,
};
export default withNamespaces()(CertificateStatus);
export default withTranslation()(CertificateStatus);

View File

@ -2,7 +2,7 @@ import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { Field, reduxForm, formValueSelector } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import {
@ -45,7 +45,7 @@ const clearFields = (change, setTlsConfig, t) => {
};
// eslint-disable-next-line no-alert
if (window.confirm(t('encryption_reset'))) {
Object.keys(fields).forEach(field => change(field, fields[field]));
Object.keys(fields).forEach((field) => change(field, fields[field]));
setTlsConfig(fields);
}
};
@ -80,14 +80,13 @@ let Form = (props) => {
privateKeySource,
} = props;
const isSavingDisabled =
invalid ||
submitting ||
processingConfig ||
processingValidate ||
!valid_key ||
!valid_cert ||
!valid_pair;
const isSavingDisabled = invalid
|| submitting
|| processingConfig
|| processingValidate
|| !valid_key
|| !valid_cert
|| !valid_pair;
return (
<form onSubmit={handleSubmit}>
@ -417,7 +416,7 @@ Form = connect((state) => {
})(Form);
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'encryptionForm',
validate,

View File

@ -1,6 +1,6 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation, Trans } from 'react-i18next';
const KeyStatus = ({ validKey, keyType }) => (
<Fragment>
@ -28,4 +28,4 @@ KeyStatus.propTypes = {
keyType: PropTypes.string.isRequired,
};
export default withNamespaces()(KeyStatus);
export default withTranslation()(KeyStatus);

View File

@ -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 debounce from 'lodash/debounce';
import { DEBOUNCE_TIMEOUT, ENCRYPTION_SOURCE } from '../../../helpers/constants';
@ -115,4 +115,4 @@ Encryption.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Encryption);
export default withTranslation()(Encryption);

View File

@ -1,7 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderSelectField, toNumber } from '../../../helpers/form';
@ -10,7 +10,7 @@ import { FILTERS_INTERVALS_HOURS } from '../../../helpers/constants';
const getTitleForInterval = (interval, t) => {
if (interval === 0) {
return t('disabled');
} else if (interval === 72 || interval === 168) {
} if (interval === 72 || interval === 168) {
return t('interval_days', { count: interval / 24 });
}
@ -26,7 +26,7 @@ const getIntervalSelect = (processing, t, handleChange, toNumber) => (
normalize={toNumber}
disabled={processing}
>
{FILTERS_INTERVALS_HOURS.map(interval => (
{FILTERS_INTERVALS_HOURS.map((interval) => (
<option value={interval} key={interval}>
{getTitleForInterval(interval, t)}
</option>
@ -81,7 +81,7 @@ Form.propTypes = {
};
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'filterConfigForm',
}),

View File

@ -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 debounce from 'lodash/debounce';
import { DEBOUNCE_TIMEOUT } from '../../../helpers/constants';
@ -33,4 +33,4 @@ FiltersConfig.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(FiltersConfig);
export default withTranslation()(FiltersConfig);

View File

@ -1,18 +1,16 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderSelectField, renderRadioField, toNumber } from '../../../helpers/form';
import { QUERY_LOG_INTERVALS_DAYS } from '../../../helpers/constants';
const getIntervalFields = (processing, t, toNumber) =>
QUERY_LOG_INTERVALS_DAYS.map((interval) => {
const title =
interval === 1 ? t('interval_24_hour') : t('interval_days', { count: interval });
const getIntervalFields = (processing, t, toNumber) => QUERY_LOG_INTERVALS_DAYS.map((interval) => {
const title = interval === 1 ? t('interval_24_hour') : t('interval_days', { count: interval });
return (
return (
<Field
key={interval}
name="interval"
@ -23,8 +21,8 @@ const getIntervalFields = (processing, t, toNumber) =>
normalize={toNumber}
disabled={processing}
/>
);
});
);
});
const Form = (props) => {
const {
@ -92,7 +90,7 @@ Form.propTypes = {
};
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'logConfigForm',
}),

View File

@ -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 Card from '../../ui/Card';
import Form from './Form';
@ -68,4 +68,4 @@ LogsConfig.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(LogsConfig);
export default withTranslation()(LogsConfig);

View File

@ -1,7 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { toggleAllServices } from '../../../helpers/helpers';
@ -44,7 +44,7 @@ const Form = (props) => {
</div>
</div>
<div className="services">
{SERVICES.map(service => (
{SERVICES.map((service) => (
<Field
key={service.id}
icon={`service_${service.id}`}
@ -82,7 +82,7 @@ Form.propTypes = {
};
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'servicesForm',
enableReinitialize: true,

View File

@ -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 Form from './Form';
import Card from '../../ui/Card';
@ -12,7 +12,7 @@ class Services extends Component {
if (values && values.blocked_services) {
const blocked_services = Object
.keys(values.blocked_services)
.filter(service => values.blocked_services[service]);
.filter((service) => values.blocked_services[service]);
config = blocked_services;
}
@ -66,4 +66,4 @@ Services.propTypes = {
setBlockedServices: PropTypes.func.isRequired,
};
export default withNamespaces()(Services);
export default withTranslation()(Services);

View File

@ -1,18 +1,16 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderRadioField, toNumber } from '../../../helpers/form';
import { STATS_INTERVALS_DAYS } from '../../../helpers/constants';
const getIntervalFields = (processing, t, toNumber) =>
STATS_INTERVALS_DAYS.map((interval) => {
const title =
interval === 1 ? t('interval_24_hour') : t('interval_days', { count: interval });
const getIntervalFields = (processing, t, toNumber) => STATS_INTERVALS_DAYS.map((interval) => {
const title = interval === 1 ? t('interval_24_hour') : t('interval_days', { count: interval });
return (
return (
<Field
key={interval}
name="interval"
@ -23,8 +21,8 @@ const getIntervalFields = (processing, t, toNumber) =>
normalize={toNumber}
disabled={processing}
/>
);
});
);
});
const Form = (props) => {
const {
@ -77,7 +75,7 @@ Form.propTypes = {
};
export default flow([
withNamespaces(),
withTranslation(),
reduxForm({
form: 'statsConfigForm',
}),

View File

@ -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 Card from '../../ui/Card';
import Form from './Form';
@ -52,4 +52,4 @@ StatsConfig.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(StatsConfig);
export default withTranslation()(StatsConfig);

View File

@ -1,6 +1,6 @@
import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import { withNamespaces } from 'react-i18next';
import { withTranslation } from 'react-i18next';
import Services from './Services';
import StatsConfig from './StatsConfig';
@ -76,11 +76,10 @@ class Settings extends Component {
t,
} = this.props;
const isDataReady =
!settings.processing &&
!services.processing &&
!stats.processingGetConfig &&
!queryLogs.processingGetConfig;
const isDataReady = !settings.processing
&& !services.processing
&& !stats.processingGetConfig
&& !queryLogs.processingGetConfig;
return (
<Fragment>
@ -146,6 +145,33 @@ Settings.propTypes = {
setFiltersConfig: PropTypes.func.isRequired,
getFilteringStatus: PropTypes.func.isRequired,
t: PropTypes.func.isRequired,
getBlockedServices: PropTypes.func,
getLogsConfig: PropTypes.func,
setBlockedServices: PropTypes.func,
setLogsConfig: PropTypes.func,
clearLogs: PropTypes.func,
services: PropTypes.shape({
processing: PropTypes.bool,
}),
stats: PropTypes.shape({
processingGetConfig: PropTypes.bool,
interval: PropTypes.number,
processingSetConfig: PropTypes.bool,
processingReset: PropTypes.bool,
}),
queryLogs: PropTypes.shape({
enabled: PropTypes.bool,
interval: PropTypes.number,
anonymize_client_ip: PropTypes.bool,
processingSetConfig: PropTypes.bool,
processingClear: PropTypes.bool,
processingGetConfig: PropTypes.bool,
}),
filtering: PropTypes.shape({
interval: PropTypes.number,
enabled: PropTypes.bool,
processingSetConfig: PropTypes.bool,
}),
};
export default withNamespaces()(Settings);
export default withTranslation()(Settings);

View File

@ -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 Guide from '../ui/Guide';
import Card from '../ui/Card';
@ -25,7 +25,7 @@ const SetupGuide = ({
<Trans>install_devices_address</Trans>:
</div>
<div className="mt-2 font-weight-bold">
{dnsAddresses.map(ip => <li key={ip}>{ip}</li>)}
{dnsAddresses.map((ip) => <li key={ip}>{ip}</li>)}
</div>
</div>
<Guide dnsAddresses={dnsAddresses} />
@ -38,4 +38,4 @@ SetupGuide.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(SetupGuide);
export default withTranslation()(SetupGuide);

View File

@ -1,6 +1,6 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
class Toast extends Component {
componentDidMount() {
@ -49,4 +49,4 @@ Toast.propTypes = {
removeToast: PropTypes.func.isRequired,
};
export default withNamespaces()(Toast);
export default withTranslation()(Toast);

View File

@ -7,21 +7,21 @@ import Toast from './Toast';
import './Toast.css';
const Toasts = props => (
<TransitionGroup className="toasts">
{props.toasts.notices && props.toasts.notices.map((toast) => {
const { id } = toast;
return (
<CSSTransition
key={id}
timeout={500}
classNames="toast"
>
<Toast removeToast={props.removeToast} {...toast} />
</CSSTransition>
);
})}
</TransitionGroup>
const Toasts = (props) => (
<TransitionGroup className="toasts">
{props.toasts.notices && props.toasts.notices.map((toast) => {
const { id } = toast;
return (
<CSSTransition
key={id}
timeout={500}
classNames="toast"
>
<Toast removeToast={props.removeToast} {...toast} />
</CSSTransition>
);
})}
</TransitionGroup>
);
Toasts.propTypes = {
@ -39,4 +39,3 @@ export default connect(
mapStateToProps,
actionCreators,
)(Toasts);

View File

@ -6,10 +6,10 @@ import './Accordion.css';
class Accordion extends Component {
state = {
isOpen: false,
}
};
handleClick = () => {
this.setState(prevState => ({ isOpen: !prevState.isOpen }));
this.setState((prevState) => ({ isOpen: !prevState.isOpen }));
};
render() {

View File

@ -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 './Checkbox.css';
@ -38,4 +38,4 @@ Checkbox.propTypes = {
t: PropTypes.func,
};
export default withNamespaces()(Checkbox);
export default withTranslation()(Checkbox);

View File

@ -1,7 +1,7 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { withNamespaces } from 'react-i18next';
import { withTranslation } from 'react-i18next';
import enhanceWithClickOutside from 'react-click-outside';
import './Dropdown.css';
@ -12,7 +12,7 @@ class Dropdown extends Component {
};
toggleDropdown = () => {
this.setState(prevState => ({ isOpen: !prevState.isOpen }));
this.setState((prevState) => ({ isOpen: !prevState.isOpen }));
};
hideDropdown = () => {
@ -86,4 +86,4 @@ Dropdown.propTypes = {
icon: PropTypes.string,
};
export default withNamespaces()(enhanceWithClickOutside(Dropdown));
export default withTranslation()(enhanceWithClickOutside(Dropdown));

View File

@ -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 isAfter from 'date-fns/is_after';
import addDays from 'date-fns/add_days';
@ -23,7 +23,7 @@ const EncryptionTopline = (props) => {
</Trans>
</Topline>
);
} else if (isAboutExpire) {
} if (isAboutExpire) {
return (
<Topline type="warning">
<Trans components={[<a href="#encryption" key="0">link</a>]}>
@ -40,4 +40,4 @@ EncryptionTopline.propTypes = {
notAfter: PropTypes.string.isRequired,
};
export default withNamespaces()(EncryptionTopline);
export default withTranslation()(EncryptionTopline);

View File

@ -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 { REPOSITORY, PRIVACY_POLICY_LINK } from '../../helpers/constants';
import { LANGUAGES } from '../../helpers/twosky';
@ -70,7 +70,7 @@ class Footer extends Component {
value={i18n.language}
onChange={this.changeLanguage}
>
{Object.keys(LANGUAGES).map(lang => (
{Object.keys(LANGUAGES).map((lang) => (
<option key={lang} value={lang}>
{LANGUAGES[lang]}
</option>
@ -112,4 +112,4 @@ Footer.propTypes = {
getVersion: PropTypes.func,
};
export default withNamespaces()(Footer);
export default withTranslation()(Footer);

View File

@ -1,15 +1,14 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import Tabs from '../ui/Tabs';
import Icons from '../ui/Icons';
import Tabs from './Tabs';
import Icons from './Icons';
const Guide = (props) => {
const { dnsAddresses } = props;
const tlsAddress = (dnsAddresses && dnsAddresses.filter(item => item.includes('tls://'))) || '';
const httpsAddress =
(dnsAddresses && dnsAddresses.filter(item => item.includes('https://'))) || '';
const tlsAddress = (dnsAddresses && dnsAddresses.filter((item) => item.includes('tls://'))) || '';
const httpsAddress = (dnsAddresses && dnsAddresses.filter((item) => item.includes('https://'))) || '';
const showDnsPrivacyNotice = httpsAddress.length < 1 && tlsAddress.length < 1;
return (
@ -373,4 +372,4 @@ Guide.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Guide);
export default withTranslation()(Guide);

View File

@ -4,51 +4,49 @@ import { ResponsiveLine } from '@nivo/line';
import './Line.css';
const Line = ({ data, color }) => (
data &&
<ResponsiveLine
data={data}
margin={{
top: 15,
right: 0,
bottom: 1,
left: 20,
}}
minY="auto"
stacked={false}
curve='linear'
axisBottom={null}
axisLeft={null}
enableGridX={false}
enableGridY={false}
enableDots={false}
enableArea={true}
animate={false}
colorBy={() => (color)}
tooltip={slice => (
<div>
{slice.data.map(d => (
<div key={d.serie.id} className="line__tooltip">
const Line = ({ data, color }) => data
&& <ResponsiveLine
data={data}
margin={{
top: 15,
right: 0,
bottom: 1,
left: 20,
}}
minY="auto"
stacked={false}
curve='linear'
axisBottom={null}
axisLeft={null}
enableGridX={false}
enableGridY={false}
enableDots={false}
enableArea={true}
animate={false}
colorBy={() => (color)}
tooltip={(slice) => (
<div>
{slice.data.map((d) => (
<div key={d.serie.id} className="line__tooltip">
<span className="line__tooltip-text">
<strong>{d.data.y}</strong>
<br/>
<br />
<small>{d.data.x}</small>
</span>
</div>
))}
</div>
)}
theme={{
tooltip: {
container: {
padding: '0',
background: '#333',
borderRadius: '4px',
},
</div>
))}
</div>
)}
theme={{
tooltip: {
container: {
padding: '0',
background: '#333',
borderRadius: '4px',
},
}}
/>
);
},
}}
/>;
Line.propTypes = {
data: PropTypes.array.isRequired,

View File

@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import './PageTitle.css';
const PageTitle = props => (
const PageTitle = (props) => (
<div className="page-header">
<h1 className="page-title">
{props.title}

View File

@ -1,6 +1,6 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import { getSourceData } from '../../helpers/trackers/trackers';
import { captitalizeWords } from '../../helpers/helpers';
@ -53,4 +53,4 @@ Popover.propTypes = {
data: PropTypes.object.isRequired,
};
export default withNamespaces()(Popover);
export default withTranslation()(Popover);

View File

@ -1,6 +1,6 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import './Popover.css';
@ -49,4 +49,4 @@ PopoverFilter.propTypes = {
service: PropTypes.string,
};
export default withNamespaces()(PopoverFilter);
export default withTranslation()(PopoverFilter);

View File

@ -1,8 +1,8 @@
import React from 'react';
import PropTypes from 'prop-types';
import { withNamespaces, Trans } from 'react-i18next';
import { withTranslation, Trans } from 'react-i18next';
import Card from '../ui/Card';
import Card from './Card';
const Status = ({ message, buttonMessage, reloadPage }) => (
<div className="status">
@ -10,8 +10,8 @@ const Status = ({ message, buttonMessage, reloadPage }) => (
<div className="h4 font-weight-light mb-4">
<Trans>{message}</Trans>
</div>
{buttonMessage &&
<button className="btn btn-success" onClick={reloadPage}>
{buttonMessage
&& <button className="btn btn-success" onClick={reloadPage}>
<Trans>{buttonMessage}</Trans>
</button>}
</Card>
@ -24,4 +24,4 @@ Status.propTypes = {
reloadPage: PropTypes.func,
};
export default withNamespaces()(Status);
export default withTranslation()(Status);

View File

@ -187,7 +187,7 @@ a {
color: #467fcf;
text-decoration: none;
background-color: transparent;
-webkit-text-decoration-skip: objects;
-webkittext-decoration-skip-ink: objects
}
a:hover {
@ -9863,8 +9863,8 @@ body *:hover::-webkit-scrollbar-thumb {
}
a {
-webkit-text-decoration-skip: ink;
text-decoration-skip: ink;
-webkit-text-decoration-skip: auto;
text-decoration-skip-ink: auto
}
h1 a,
@ -16243,4 +16243,4 @@ svg {
.fe-trash-2:before {
background-image: url('./svg/trash-2.svg');
}
/* stylelint-enable */
/* stylelint-enable */

View File

@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import './Tooltip.css';
const Tooltip = props => (
const Tooltip = (props) => (
<div data-tooltip={props.text} className={`tooltip-custom ${props.type || ''}`}></div>
);

View File

@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import './Topline.css';
const Topline = props => (
const Topline = (props) => (
<div className={`alert alert-${props.type} topline`}>
<div className="container">
{props.children}

View File

@ -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 classnames from 'classnames';
import './Overlay.css';
@ -23,4 +23,4 @@ UpdateOverlay.propTypes = {
processingUpdate: PropTypes.bool,
};
export default withNamespaces()(UpdateOverlay);
export default withTranslation()(UpdateOverlay);

View File

@ -1,10 +1,10 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { Trans, withNamespaces } from 'react-i18next';
import { Trans, withTranslation } from 'react-i18next';
import Topline from './Topline';
const UpdateTopline = props => (
const UpdateTopline = (props) => (
<Topline type="info">
<Fragment>
<Trans
@ -17,8 +17,8 @@ const UpdateTopline = props => (
>
update_announcement
</Trans>
{props.canAutoUpdate &&
<button
{props.canAutoUpdate
&& <button
type="button"
className="btn btn-sm btn-primary ml-3"
onClick={props.getUpdate}
@ -39,4 +39,4 @@ UpdateTopline.propTypes = {
processingUpdate: PropTypes.bool,
};
export default withNamespaces()(UpdateTopline);
export default withTranslation()(UpdateTopline);

View File

@ -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 './Version.css';
@ -36,4 +36,4 @@ Version.propTypes = {
t: PropTypes.func.isRequired,
};
export default withNamespaces()(Version);
export default withTranslation()(Version);

View File

@ -9,7 +9,7 @@ export default function configureStore(reducer, initialState) {
/* eslint-disable no-underscore-dangle */
const store = createStore(reducer, initialState, compose(
applyMiddleware(...middlewares),
window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__() : f => f,
window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__() : (f) => f,
));
/* eslint-enable */
return store;

View File

@ -1,7 +1,9 @@
import { connect } from 'react-redux';
import { getClients } from '../actions';
import { getStats } from '../actions/stats';
import { addClient, updateClient, deleteClient, toggleClientModal } from '../actions/clients';
import {
addClient, updateClient, deleteClient, toggleClientModal,
} from '../actions/clients';
import Clients from '../components/Settings/Clients';
const mapStateToProps = (state) => {

Some files were not shown because too many files have changed in this diff Show More