- {processing &&
+ {updateAvailable && <>
+ ;
};
renderRoute.propTypes = {
diff --git a/client/src/components/Dashboard/index.js b/client/src/components/Dashboard/index.js
index 71a1366b..1aa426f8 100644
--- a/client/src/components/Dashboard/index.js
+++ b/client/src/components/Dashboard/index.js
@@ -1,6 +1,6 @@
-import React, { Component, Fragment } from 'react';
+import React, { useEffect } from 'react';
import PropTypes from 'prop-types';
-import { Trans, withTranslation } from 'react-i18next';
+import { Trans, useTranslation } from 'react-i18next';
import Statistics from './Statistics';
import Counters from './Counters';
@@ -13,144 +13,141 @@ import Loading from '../ui/Loading';
import { BLOCK_ACTIONS } from '../../helpers/constants';
import './Dashboard.css';
-class Dashboard extends Component {
- componentDidMount() {
- this.getAllStats();
- }
+const Dashboard = ({
+ getAccessList,
+ getStats,
+ getStatsConfig,
+ dashboard,
+ toggleProtection,
+ toggleClientBlock,
+ stats,
+ access,
+}) => {
+ const { t } = useTranslation();
- getAllStats = () => {
- this.props.getAccessList();
- this.props.getStats();
- this.props.getStatsConfig();
+ const getAllStats = () => {
+ getAccessList();
+ getStats();
+ getStatsConfig();
};
- getToggleFilteringButton = () => {
- const { protectionEnabled, processingProtection } = this.props.dashboard;
+ useEffect(() => {
+ getAllStats();
+ }, []);
+
+ const getToggleFilteringButton = () => {
+ const { protectionEnabled, processingProtection } = dashboard;
const buttonText = protectionEnabled ? 'disable_protection' : 'enable_protection';
const buttonClass = protectionEnabled ? 'btn-gray' : 'btn-success';
- return (
-
- );
+ >
+ {buttonText}
+ ;
};
- toggleClientStatus = (type, ip) => {
+ const toggleClientStatus = (type, ip) => {
const confirmMessage = type === BLOCK_ACTIONS.BLOCK ? 'client_confirm_block' : 'client_confirm_unblock';
- if (window.confirm(this.props.t(confirmMessage, { ip }))) {
- this.props.toggleClientBlock(type, ip);
+ if (window.confirm(t(confirmMessage, { ip }))) {
+ toggleClientBlock(type, ip);
}
};
- render() {
- const {
- dashboard, stats, access, t,
- } = this.props;
- const statsProcessing = stats.processingStats
+ const refreshButton = ;
+
+ const subtitle = stats.interval === 1
+ ? t('for_last_24_hours')
+ : t('for_last_days', { count: stats.interval });
+
+ const refreshFullButton = ;
+
+ const statsProcessing = stats.processingStats
|| stats.processingGetConfig
|| access.processing;
- const subtitle = stats.interval === 1
- ? t('for_last_24_hours')
- : t('for_last_days', { count: stats.interval });
+ return <>
+
+
+ {statsProcessing && {
>
{t('cancel_btn')}
-
+ }
;
};
diff --git a/client/src/components/Header/index.js b/client/src/components/Header/index.js
index 1a126b02..071f950f 100644
--- a/client/src/components/Header/index.js
+++ b/client/src/components/Header/index.js
@@ -1,7 +1,7 @@
import React, { useState } from 'react';
import { Link, useLocation } from 'react-router-dom';
import { shallowEqual, useSelector } from 'react-redux';
-import { Trans } from 'react-i18next';
+import { useTranslation } from 'react-i18next';
import classnames from 'classnames';
import Menu from './Menu';
import logo from '../ui/svg/logo.svg';
@@ -9,6 +9,7 @@ import './Header.css';
const Header = () => {
const [isMenuOpen, setIsMenuOpen] = useState(false);
+ const { t } = useTranslation();
const {
protectionEnabled,
@@ -33,45 +34,42 @@ const Header = () => {
'badge-danger': !protectionEnabled,
});
- return (
-
-
- )}
- {!processing && isCoreRunning && ROUTES.map(renderRoute)}
+ return
-
-
+ {processing &&
+
+
+
}
+ {!processing && isCoreRunning && ROUTES.map(renderRoute)}
+
+
-
-
+ {getToggleFilteringButton()}
+ {refreshFullButton}
+
+
+
}
+ ;
+};
Dashboard.propTypes = {
dashboard: PropTypes.object.isRequired,
@@ -160,9 +157,8 @@ Dashboard.propTypes = {
getStatsConfig: PropTypes.func.isRequired,
toggleProtection: PropTypes.func.isRequired,
getClients: PropTypes.func.isRequired,
- t: PropTypes.func.isRequired,
toggleClientBlock: PropTypes.func.isRequired,
getAccessList: PropTypes.func.isRequired,
};
-export default withTranslation()(Dashboard);
+export default Dashboard;
diff --git a/client/src/components/Filters/Form.js b/client/src/components/Filters/Form.js
index ac8cc190..a994c1ec 100644
--- a/client/src/components/Filters/Form.js
+++ b/client/src/components/Filters/Form.js
@@ -5,7 +5,7 @@ import { withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import classNames from 'classnames';
import { validatePath, validateRequiredValue } from '../../helpers/validators';
-import { renderInputField, renderSelectField } from '../../helpers/form';
+import { renderCheckboxField, renderInputField } from '../../helpers/form';
import { MODAL_OPEN_TIMEOUT, MODAL_TYPE, FORM_NAME } from '../../helpers/constants';
const getIconsData = (homepage, source) => ([
@@ -60,7 +60,7 @@ const renderFilters = ({ categories, filters }, selectedSources, t) => Object.ke
+
+
+ this.getAllStats()}
- >
- refresh_statics
-
- );
-
- const refreshButton = (
-
- );
-
- return (
-
-
-
- {statsProcessing &&
- );
- }
-}
+ refreshButton={refreshButton}
+ />
+
+
- {this.getToggleFilteringButton()}
- {refreshFullButton}
-
-
-
- )}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
-
-
-
-
+ return link]}>
diff --git a/client/src/install/Setup/Setup.css b/client/src/install/Setup/Setup.css
index aac7ea0e..9a404222 100644
--- a/client/src/install/Setup/Setup.css
+++ b/client/src/install/Setup/Setup.css
@@ -107,7 +107,7 @@
}
.form__message--error {
- color: #cd201f;
+ color: var(--red);
}
.setup__button {
diff --git a/client/src/login/Login/Login.css b/client/src/login/Login/Login.css
index 628ff62b..c38f27bf 100644
--- a/client/src/login/Login/Login.css
+++ b/client/src/login/Login/Login.css
@@ -43,5 +43,5 @@
}
.form__message--error {
- color: #cd201f;
+ color: var(--red);
}
diff --git a/client/src/reducers/dashboard.js b/client/src/reducers/dashboard.js
new file mode 100644
index 00000000..3709f10a
--- /dev/null
+++ b/client/src/reducers/dashboard.js
@@ -0,0 +1,175 @@
+import { handleActions } from 'redux-actions';
+import * as actions from '../actions';
+import { areEqualVersions } from '../helpers/version';
+import { STANDARD_DNS_PORT, STANDARD_WEB_PORT } from '../helpers/constants';
+
+const dashboard = handleActions(
+ {
+ [actions.setDnsRunningStatus]: (state, { payload }) => (
+ {
+ ...state,
+ isCoreRunning: payload,
+ }
+ ),
+ [actions.dnsStatusRequest]: (state) => ({
+ ...state,
+ processing: true,
+ }),
+ [actions.dnsStatusFailure]: (state) => ({
+ ...state,
+ processing: false,
+ }),
+ [actions.dnsStatusSuccess]: (state, { payload }) => {
+ const {
+ version,
+ dns_port: dnsPort,
+ dns_addresses: dnsAddresses,
+ protection_enabled: protectionEnabled,
+ http_port: httpPort,
+ language,
+ } = payload;
+ const newState = {
+ ...state,
+ isCoreRunning: true,
+ processing: false,
+ dnsVersion: version,
+ dnsPort,
+ dnsAddresses,
+ protectionEnabled,
+ language,
+ httpPort,
+ };
+ return newState;
+ },
+
+ [actions.getVersionRequest]: (state) => ({
+ ...state,
+ processingVersion: true,
+ }),
+ [actions.getVersionFailure]: (state) => ({
+ ...state,
+ processingVersion: false,
+ }),
+ [actions.getVersionSuccess]: (state, { payload }) => {
+ const currentVersion = state.dnsVersion === 'undefined' ? 0 : state.dnsVersion;
+
+ if (!payload.disabled && !areEqualVersions(currentVersion, payload.new_version)) {
+ const {
+ announcement_url: announcementUrl,
+ new_version: newVersion,
+ can_autoupdate: canAutoUpdate,
+ } = payload;
+
+ const newState = {
+ ...state,
+ announcementUrl,
+ newVersion,
+ canAutoUpdate,
+ isUpdateAvailable: true,
+ processingVersion: false,
+ checkUpdateFlag: !payload.disabled,
+ };
+ return newState;
+ }
+
+ return {
+ ...state,
+ processingVersion: false,
+ checkUpdateFlag: !payload.disabled,
+ };
+ },
+
+ [actions.getUpdateRequest]: (state) => ({
+ ...state,
+ processingUpdate: true,
+ }),
+ [actions.getUpdateFailure]: (state) => ({
+ ...state,
+ processingUpdate: false,
+ }),
+ [actions.getUpdateSuccess]: (state) => {
+ const newState = {
+ ...state,
+ processingUpdate: false,
+ };
+ return newState;
+ },
+
+ [actions.toggleProtectionRequest]: (state) => ({
+ ...state,
+ processingProtection: true,
+ }),
+ [actions.toggleProtectionFailure]: (state) => ({
+ ...state,
+ processingProtection: false,
+ }),
+ [actions.toggleProtectionSuccess]: (state) => {
+ const newState = {
+ ...state,
+ protectionEnabled: !state.protectionEnabled,
+ processingProtection: false,
+ };
+ return newState;
+ },
+
+ [actions.getLanguageSuccess]: (state, { payload }) => {
+ const newState = {
+ ...state,
+ language: payload,
+ };
+ return newState;
+ },
+
+ [actions.getClientsRequest]: (state) => ({
+ ...state,
+ processingClients: true,
+ }),
+ [actions.getClientsFailure]: (state) => ({
+ ...state,
+ processingClients: false,
+ }),
+ [actions.getClientsSuccess]: (state, { payload }) => {
+ const newState = {
+ ...state,
+ ...payload,
+ processingClients: false,
+ };
+ return newState;
+ },
+
+ [actions.getProfileRequest]: (state) => ({
+ ...state,
+ processingProfile: true,
+ }),
+ [actions.getProfileFailure]: (state) => ({
+ ...state,
+ processingProfile: false,
+ }),
+ [actions.getProfileSuccess]: (state, { payload }) => ({
+ ...state,
+ name: payload.name,
+ processingProfile: false,
+ }),
+ },
+ {
+ processing: true,
+ isCoreRunning: true,
+ processingVersion: true,
+ processingClients: true,
+ processingUpdate: false,
+ processingProfile: true,
+ protectionEnabled: false,
+ processingProtection: false,
+ httpPort: STANDARD_WEB_PORT,
+ dnsPort: STANDARD_DNS_PORT,
+ dnsAddresses: [],
+ dnsVersion: '',
+ clients: [],
+ autoClients: [],
+ supportedTags: [],
+ name: '',
+ checkUpdateFlag: false,
+ },
+);
+
+export default dashboard;
diff --git a/client/src/reducers/dhcp.js b/client/src/reducers/dhcp.js
new file mode 100644
index 00000000..5f9f0f58
--- /dev/null
+++ b/client/src/reducers/dhcp.js
@@ -0,0 +1,203 @@
+import { handleActions } from 'redux-actions';
+import * as actions from '../actions';
+import { enrichWithConcatenatedIpAddresses } from '../helpers/helpers';
+
+// todo: figure out if we cat get rid of redux-form state duplication
+const dhcp = handleActions(
+ {
+ [actions.getDhcpStatusRequest]: (state) => ({
+ ...state,
+ processing: true,
+ }),
+ [actions.getDhcpStatusFailure]: (state) => ({
+ ...state,
+ processing: false,
+ }),
+ [actions.getDhcpStatusSuccess]: (state, { payload }) => {
+ const { static_leases: staticLeases, ...values } = payload;
+
+ const newState = {
+ ...state,
+ staticLeases,
+ processing: false,
+ ...values,
+ };
+
+ return newState;
+ },
+
+ [actions.getDhcpInterfacesRequest]: (state) => ({
+ ...state,
+ processingInterfaces: true,
+ }),
+ [actions.getDhcpInterfacesFailure]: (state) => ({
+ ...state,
+ processingInterfaces: false,
+ }),
+ [actions.getDhcpInterfacesSuccess]: (state, { payload }) => {
+ const newState = {
+ ...state,
+ interfaces: enrichWithConcatenatedIpAddresses(payload),
+ processingInterfaces: false,
+ };
+ return newState;
+ },
+
+ [actions.findActiveDhcpRequest]: (state) => ({
+ ...state,
+ processingStatus: true,
+ }),
+ [actions.findActiveDhcpFailure]: (state) => ({
+ ...state,
+ processingStatus: false,
+ }),
+ [actions.findActiveDhcpSuccess]: (state, { payload }) => {
+ const newState = {
+ ...state,
+ check: payload,
+ processingStatus: false,
+ };
+ return newState;
+ },
+
+ [actions.toggleDhcpRequest]: (state) => ({
+ ...state,
+ processingDhcp: true,
+ }),
+ [actions.toggleDhcpFailure]: (state) => ({
+ ...state,
+ processingDhcp: false,
+ }),
+ [actions.toggleDhcpSuccess]: (state) => {
+ const { enabled } = state;
+ const newState = {
+ ...state,
+ enabled: !enabled,
+ check: null,
+ processingDhcp: false,
+ };
+ return newState;
+ },
+
+ [actions.setDhcpConfigRequest]: (state) => ({
+ ...state,
+ processingConfig: true,
+ }),
+ [actions.setDhcpConfigFailure]: (state) => ({
+ ...state,
+ processingConfig: false,
+ }),
+ [actions.setDhcpConfigSuccess]: (state, { payload }) => {
+ const { v4, v6 } = state;
+ const newConfigV4 = { ...v4, ...payload.v4 };
+ const newConfigV6 = { ...v6, ...payload.v6 };
+
+ const newState = {
+ ...state,
+ v4: newConfigV4,
+ v6: newConfigV6,
+ interface_name: payload.interface_name,
+ processingConfig: false,
+ };
+
+ return newState;
+ },
+
+ [actions.resetDhcpRequest]: (state) => ({
+ ...state,
+ processingReset: true,
+ }),
+ [actions.resetDhcpFailure]: (state) => ({
+ ...state,
+ processingReset: false,
+ }),
+ [actions.resetDhcpSuccess]: (state) => ({
+ ...state,
+ processingReset: false,
+ enabled: false,
+ v4: {},
+ v6: {},
+ interface_name: '',
+ }),
+
+ [actions.toggleLeaseModal]: (state) => {
+ const newState = {
+ ...state,
+ isModalOpen: !state.isModalOpen,
+ };
+ return newState;
+ },
+
+ [actions.addStaticLeaseRequest]: (state) => ({
+ ...state,
+ processingAdding: true,
+ }),
+ [actions.addStaticLeaseFailure]: (state) => ({
+ ...state,
+ processingAdding: false,
+ }),
+ [actions.addStaticLeaseSuccess]: (state, { payload }) => {
+ const { ip, mac, hostname } = payload;
+ const newLease = {
+ ip,
+ mac,
+ hostname: hostname || '',
+ };
+ const leases = [...state.staticLeases, newLease];
+ const newState = {
+ ...state,
+ staticLeases: leases,
+ processingAdding: false,
+ };
+ return newState;
+ },
+
+ [actions.removeStaticLeaseRequest]: (state) => ({
+ ...state,
+ processingDeleting: true,
+ }),
+ [actions.removeStaticLeaseFailure]: (state) => ({
+ ...state,
+ processingDeleting: false,
+ }),
+ [actions.removeStaticLeaseSuccess]: (state, { payload }) => {
+ const leaseToRemove = payload.ip;
+ const leases = state.staticLeases.filter((item) => item.ip !== leaseToRemove);
+ const newState = {
+ ...state,
+ staticLeases: leases,
+ processingDeleting: false,
+ };
+ return newState;
+ },
+ },
+ {
+ processing: true,
+ processingStatus: false,
+ processingInterfaces: false,
+ processingDhcp: false,
+ processingConfig: false,
+ processingAdding: false,
+ processingDeleting: false,
+ enabled: false,
+ interface_name: '',
+ check: null,
+ v4: {
+ gateway_ip: '',
+ subnet_mask: '',
+ range_start: '',
+ range_end: '',
+ lease_duration: 0,
+ },
+ v6: {
+ range_start: '',
+ lease_duration: 0,
+ },
+ leases: [],
+ staticLeases: [],
+ isModalOpen: false,
+ dhcp_available: false,
+ },
+);
+
+export default dhcp;
diff --git a/client/src/reducers/dnsConfig.js b/client/src/reducers/dnsConfig.js
index b3978217..91e95818 100644
--- a/client/src/reducers/dnsConfig.js
+++ b/client/src/reducers/dnsConfig.js
@@ -1,9 +1,9 @@
import { handleActions } from 'redux-actions';
import * as actions from '../actions/dnsConfig';
-import { BLOCKING_MODES } from '../helpers/constants';
+import { ALL_INTERFACES_IP, BLOCKING_MODES } from '../helpers/constants';
-const DEFAULT_BLOCKING_IPV4 = '0.0.0.0';
+const DEFAULT_BLOCKING_IPV4 = ALL_INTERFACES_IP;
const DEFAULT_BLOCKING_IPV6 = '::';
const dnsConfig = handleActions(
diff --git a/client/src/reducers/index.js b/client/src/reducers/index.js
index 56d26fb7..80665cf7 100644
--- a/client/src/reducers/index.js
+++ b/client/src/reducers/index.js
@@ -1,9 +1,6 @@
import { combineReducers } from 'redux';
-import { handleActions } from 'redux-actions';
import { loadingBarReducer } from 'react-redux-loading-bar';
import { reducer as formReducer } from 'redux-form';
-
-import * as actions from '../actions';
import toasts from './toasts';
import encryption from './encryption';
import clients from './clients';
@@ -14,296 +11,9 @@ import stats from './stats';
import queryLogs from './queryLogs';
import dnsConfig from './dnsConfig';
import filtering from './filtering';
-import { areEqualVersions } from '../helpers/version';
-
-const settings = handleActions(
- {
- [actions.initSettingsRequest]: (state) => ({ ...state, processing: true }),
- [actions.initSettingsFailure]: (state) => ({ ...state, processing: false }),
- [actions.initSettingsSuccess]: (state, { payload }) => {
- const { settingsList } = payload;
- const newState = { ...state, settingsList, processing: false };
- return newState;
- },
- [actions.toggleSettingStatus]: (state, { payload }) => {
- const { settingsList } = state;
- const { settingKey } = payload;
-
- const setting = settingsList[settingKey];
-
- const newSetting = { ...setting, enabled: !setting.enabled };
- const newSettingsList = { ...settingsList, [settingKey]: newSetting };
- return { ...state, settingsList: newSettingsList };
- },
- [actions.testUpstreamRequest]: (state) => ({ ...state, processingTestUpstream: true }),
- [actions.testUpstreamFailure]: (state) => ({ ...state, processingTestUpstream: false }),
- [actions.testUpstreamSuccess]: (state) => ({ ...state, processingTestUpstream: false }),
- },
- {
- processing: true,
- processingTestUpstream: false,
- processingDhcpStatus: false,
- settingsList: {},
- },
-);
-
-const dashboard = handleActions(
- {
- [actions.setDnsRunningStatus]: (state, { payload }) => (
- { ...state, isCoreRunning: payload }
- ),
- [actions.dnsStatusRequest]: (state) => ({ ...state, processing: true }),
- [actions.dnsStatusFailure]: (state) => ({ ...state, processing: false }),
- [actions.dnsStatusSuccess]: (state, { payload }) => {
- const {
- version,
- dns_port: dnsPort,
- dns_addresses: dnsAddresses,
- protection_enabled: protectionEnabled,
- http_port: httpPort,
- language,
- } = payload;
- const newState = {
- ...state,
- isCoreRunning: true,
- processing: false,
- dnsVersion: version,
- dnsPort,
- dnsAddresses,
- protectionEnabled,
- language,
- httpPort,
- };
- return newState;
- },
-
- [actions.getVersionRequest]: (state) => ({ ...state, processingVersion: true }),
- [actions.getVersionFailure]: (state) => ({ ...state, processingVersion: false }),
- [actions.getVersionSuccess]: (state, { payload }) => {
- const currentVersion = state.dnsVersion === 'undefined' ? 0 : state.dnsVersion;
-
- if (!payload.disabled && !areEqualVersions(currentVersion, payload.new_version)) {
- const {
- announcement_url: announcementUrl,
- new_version: newVersion,
- can_autoupdate: canAutoUpdate,
- } = payload;
-
- const newState = {
- ...state,
- announcementUrl,
- newVersion,
- canAutoUpdate,
- isUpdateAvailable: true,
- processingVersion: false,
- checkUpdateFlag: !payload.disabled,
- };
- return newState;
- }
-
- return {
- ...state,
- processingVersion: false,
- checkUpdateFlag: !payload.disabled,
- };
- },
-
- [actions.getUpdateRequest]: (state) => ({ ...state, processingUpdate: true }),
- [actions.getUpdateFailure]: (state) => ({ ...state, processingUpdate: false }),
- [actions.getUpdateSuccess]: (state) => {
- const newState = { ...state, processingUpdate: false };
- return newState;
- },
-
- [actions.toggleProtectionRequest]: (state) => ({ ...state, processingProtection: true }),
- [actions.toggleProtectionFailure]: (state) => ({ ...state, processingProtection: false }),
- [actions.toggleProtectionSuccess]: (state) => {
- const newState = {
- ...state,
- protectionEnabled: !state.protectionEnabled,
- processingProtection: false,
- };
- return newState;
- },
-
- [actions.getLanguageSuccess]: (state, { payload }) => {
- const newState = { ...state, language: payload };
- return newState;
- },
-
- [actions.getClientsRequest]: (state) => ({ ...state, processingClients: true }),
- [actions.getClientsFailure]: (state) => ({ ...state, processingClients: false }),
- [actions.getClientsSuccess]: (state, { payload }) => {
- const newState = {
- ...state,
- ...payload,
- processingClients: false,
- };
- return newState;
- },
-
- [actions.getProfileRequest]: (state) => ({ ...state, processingProfile: true }),
- [actions.getProfileFailure]: (state) => ({ ...state, processingProfile: false }),
- [actions.getProfileSuccess]: (state, { payload }) => ({
- ...state,
- name: payload.name,
- processingProfile: false,
- }),
- },
- {
- processing: true,
- isCoreRunning: true,
- processingVersion: true,
- processingClients: true,
- processingUpdate: false,
- processingProfile: true,
- protectionEnabled: false,
- processingProtection: false,
- httpPort: 80,
- dnsPort: 53,
- dnsAddresses: [],
- dnsVersion: '',
- clients: [],
- autoClients: [],
- supportedTags: [],
- name: '',
- checkUpdateFlag: false,
- },
-);
-
-const dhcp = handleActions(
- {
- [actions.getDhcpStatusRequest]: (state) => ({ ...state, processing: true }),
- [actions.getDhcpStatusFailure]: (state) => ({ ...state, processing: false }),
- [actions.getDhcpStatusSuccess]: (state, { payload }) => {
- const { static_leases: staticLeases, ...values } = payload;
-
- const newState = {
- ...state,
- staticLeases,
- processing: false,
- ...values,
- };
-
- return newState;
- },
-
- [actions.getDhcpInterfacesRequest]: (state) => ({ ...state, processingInterfaces: true }),
- [actions.getDhcpInterfacesFailure]: (state) => ({ ...state, processingInterfaces: false }),
- [actions.getDhcpInterfacesSuccess]: (state, { payload }) => {
- const newState = {
- ...state,
- interfaces: payload,
- processingInterfaces: false,
- };
- return newState;
- },
-
- [actions.findActiveDhcpRequest]: (state) => ({ ...state, processingStatus: true }),
- [actions.findActiveDhcpFailure]: (state) => ({ ...state, processingStatus: false }),
- [actions.findActiveDhcpSuccess]: (state, { payload }) => {
- const { other_server: otherServer, static_ip: staticIP } = payload;
-
- const newState = {
- ...state,
- check: {
- otherServer,
- staticIP,
- },
- processingStatus: false,
- };
- return newState;
- },
-
- [actions.toggleDhcpRequest]: (state) => ({ ...state, processingDhcp: true }),
- [actions.toggleDhcpFailure]: (state) => ({ ...state, processingDhcp: false }),
- [actions.toggleDhcpSuccess]: (state) => {
- const { config } = state;
- const newConfig = { ...config, enabled: !config.enabled };
- const newState = {
- ...state,
- config: newConfig,
- check: null,
- processingDhcp: false,
- };
- return newState;
- },
-
- [actions.setDhcpConfigRequest]: (state) => ({ ...state, processingConfig: true }),
- [actions.setDhcpConfigFailure]: (state) => ({ ...state, processingConfig: false }),
- [actions.setDhcpConfigSuccess]: (state, { payload }) => {
- const { config } = state;
- const newConfig = { ...config, ...payload };
- const newState = { ...state, config: newConfig, processingConfig: false };
- return newState;
- },
-
- [actions.resetDhcpRequest]: (state) => ({ ...state, processingReset: true }),
- [actions.resetDhcpFailure]: (state) => ({ ...state, processingReset: false }),
- [actions.resetDhcpSuccess]: (state) => ({
- ...state,
- processingReset: false,
- config: {
- enabled: false,
- },
- }),
-
- [actions.toggleLeaseModal]: (state) => {
- const newState = {
- ...state,
- isModalOpen: !state.isModalOpen,
- };
- return newState;
- },
-
- [actions.addStaticLeaseRequest]: (state) => ({ ...state, processingAdding: true }),
- [actions.addStaticLeaseFailure]: (state) => ({ ...state, processingAdding: false }),
- [actions.addStaticLeaseSuccess]: (state, { payload }) => {
- const { ip, mac, hostname } = payload;
- const newLease = {
- ip,
- mac,
- hostname: hostname || '',
- };
- const leases = [...state.staticLeases, newLease];
- const newState = {
- ...state,
- staticLeases: leases,
- processingAdding: false,
- };
- return newState;
- },
-
- [actions.removeStaticLeaseRequest]: (state) => ({ ...state, processingDeleting: true }),
- [actions.removeStaticLeaseFailure]: (state) => ({ ...state, processingDeleting: false }),
- [actions.removeStaticLeaseSuccess]: (state, { payload }) => {
- const leaseToRemove = payload.ip;
- const leases = state.staticLeases.filter((item) => item.ip !== leaseToRemove);
- const newState = {
- ...state,
- staticLeases: leases,
- processingDeleting: false,
- };
- return newState;
- },
- },
- {
- processing: true,
- processingStatus: false,
- processingInterfaces: false,
- processingDhcp: false,
- processingConfig: false,
- processingAdding: false,
- processingDeleting: false,
- config: {
- enabled: false,
- },
- check: null,
- leases: [],
- staticLeases: [],
- isModalOpen: false,
- },
-);
+import settings from './settings';
+import dashboard from './dashboard';
+import dhcp from './dhcp';
export default combineReducers({
settings,
diff --git a/client/src/reducers/install.js b/client/src/reducers/install.js
index 5ffee899..03af34c2 100644
--- a/client/src/reducers/install.js
+++ b/client/src/reducers/install.js
@@ -4,7 +4,9 @@ import { reducer as formReducer } from 'redux-form';
import * as actions from '../actions/install';
import toasts from './toasts';
-import { INSTALL_FIRST_STEP } from '../helpers/constants';
+import {
+ ALL_INTERFACES_IP, INSTALL_FIRST_STEP, STANDARD_DNS_PORT, STANDARD_WEB_PORT,
+} from '../helpers/constants';
const install = handleActions({
[actions.getDefaultAddressesRequest]: (state) => ({ ...state, processingDefault: true }),
@@ -45,14 +47,14 @@ const install = handleActions({
processingSubmit: false,
processingCheck: false,
web: {
- ip: '0.0.0.0',
- port: 80,
+ ip: ALL_INTERFACES_IP,
+ port: STANDARD_WEB_PORT,
status: '',
can_autofix: false,
},
dns: {
- ip: '0.0.0.0',
- port: 53,
+ ip: ALL_INTERFACES_IP,
+ port: STANDARD_DNS_PORT,
status: '',
can_autofix: false,
},
diff --git a/client/src/reducers/settings.js b/client/src/reducers/settings.js
new file mode 100644
index 00000000..f5c2a30c
--- /dev/null
+++ b/client/src/reducers/settings.js
@@ -0,0 +1,63 @@
+import { handleActions } from 'redux-actions';
+import * as actions from '../actions';
+
+const settings = handleActions(
+ {
+ [actions.initSettingsRequest]: (state) => ({
+ ...state,
+ processing: true,
+ }),
+ [actions.initSettingsFailure]: (state) => ({
+ ...state,
+ processing: false,
+ }),
+ [actions.initSettingsSuccess]: (state, { payload }) => {
+ const { settingsList } = payload;
+ const newState = {
+ ...state,
+ settingsList,
+ processing: false,
+ };
+ return newState;
+ },
+ [actions.toggleSettingStatus]: (state, { payload }) => {
+ const { settingsList } = state;
+ const { settingKey } = payload;
+
+ const setting = settingsList[settingKey];
+
+ const newSetting = {
+ ...setting,
+ enabled: !setting.enabled,
+ };
+ const newSettingsList = {
+ ...settingsList,
+ [settingKey]: newSetting,
+ };
+ return {
+ ...state,
+ settingsList: newSettingsList,
+ };
+ },
+ [actions.testUpstreamRequest]: (state) => ({
+ ...state,
+ processingTestUpstream: true,
+ }),
+ [actions.testUpstreamFailure]: (state) => ({
+ ...state,
+ processingTestUpstream: false,
+ }),
+ [actions.testUpstreamSuccess]: (state) => ({
+ ...state,
+ processingTestUpstream: false,
+ }),
+ },
+ {
+ processing: true,
+ processingTestUpstream: false,
+ processingDhcpStatus: false,
+ settingsList: {},
+ },
+);
+
+export default settings;
diff --git a/client/src/reducers/toasts.js b/client/src/reducers/toasts.js
index 8da15547..7a48c72d 100644
--- a/client/src/reducers/toasts.js
+++ b/client/src/reducers/toasts.js
@@ -8,9 +8,12 @@ import { removeToast } from '../actions';
const toasts = handleActions({
[addErrorToast]: (state, { payload }) => {
+ const message = payload.error.toString();
+ console.error(message);
+
const errorToast = {
id: nanoid(),
- message: payload.error.toString(),
+ message,
type: 'error',
};
diff --git a/home/i18n.go b/home/i18n.go
index 4b46f7ce..6d6f3f84 100644
--- a/home/i18n.go
+++ b/home/i18n.go
@@ -39,9 +39,11 @@ var allowedLanguages = map[string]bool{
"tr": true,
"sr-cs": true,
"hr": true,
+ "hu": true,
"fa": true,
"th": true,
"ro": true,
+ "si-lk": true,
}
func isLanguageAllowed(language string) bool {
+ (
- Object.keys(interfaces).map((item) => {
- const option = interfaces[item];
- const { name } = option;
- const onlyIPv6 = option.ip_addresses.every((ip) => ip.includes(':'));
- let interfaceIP = option.ip_addresses[0];
-
- if (!onlyIPv6) {
- option.ip_addresses.forEach((ip) => {
- if (!ip.includes(':')) {
- interfaceIP = ip;
- }
- });
- }
-
- return (
-
- );
- })
-));
-
-const renderInterfaceValues = ((interfaceValues) => (
-
diff --git a/client/src/install/Setup/Settings.js b/client/src/install/Setup/Settings.js
index 443b8036..b98f8d1f 100644
--- a/client/src/install/Setup/Settings.js
+++ b/client/src/install/Setup/Settings.js
@@ -10,51 +10,36 @@ import AddressList from './AddressList';
import { getInterfaceIp } from '../../helpers/helpers';
import {
- ALL_INTERFACES_IP, FORM_NAME, ADDRESS_IN_USE_TEXT, PORT_53_FAQ_LINK, UBUNTU_SYSTEM_PORT,
+ ALL_INTERFACES_IP,
+ FORM_NAME,
+ ADDRESS_IN_USE_TEXT,
+ PORT_53_FAQ_LINK,
+ STATUS_RESPONSE,
+ STANDARD_DNS_PORT,
+ STANDARD_WEB_PORT,
} from '../../helpers/constants';
import { renderInputField, toNumber } from '../../helpers/form';
import { validateRequiredValue, validateInstallPort } from '../../helpers/validators';
-const STATIC_STATUS = {
- ENABLED: 'yes',
- DISABLED: 'no',
- ERROR: 'error',
-};
+const renderInterfaces = (interfaces) => Object.values(interfaces)
+ .map((option) => {
+ const {
+ name,
+ ip_addresses,
+ flags,
+ } = option;
-const renderInterfaces = ((interfaces) => (
- Object.keys(interfaces)
- .map((item) => {
- const option = interfaces[item];
- const {
- name,
- ip_addresses,
- flags,
- } = option;
+ if (option && ip_addresses?.length > 0) {
+ const ip = getInterfaceIp(option);
+ const isDown = flags?.includes('down');
- if (option && ip_addresses?.length > 0) {
- const ip = getInterfaceIp(option);
- const isDown = flags?.includes('down');
+ return ;
+ }
- if (isDown) {
- return (
-
- );
- }
-
- return (
-
- );
- }
-
- return false;
- })
-));
+ return null;
+ });
class Settings extends Component {
componentDidMount() {
@@ -77,42 +62,36 @@ class Settings extends Component {
getStaticIpMessage = (staticIp) => {
const { static: status, ip } = staticIp;
- if (!status) {
- return '';
- }
-
- return (
- <>
- {status === STATIC_STATUS.DISABLED && (
- <>
-
+
;
};
export default Header;
diff --git a/client/src/components/Logs/Filters/index.js b/client/src/components/Logs/Filters/index.js
index 89901001..fae8b06c 100644
--- a/client/src/components/Logs/Filters/index.js
+++ b/client/src/components/Logs/Filters/index.js
@@ -1,29 +1,31 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { Trans } from 'react-i18next';
+import { useTranslation } from 'react-i18next';
import Form from './Form';
-const Filters = ({ filter, refreshLogs, setIsLoading }) => (
-
+
- );
+
+
+
+
+
+
+ 
+
+ {!processing && isCoreRunning
+ && {t(protectionEnabled ? 'on' : 'off')}
+ }
-
-
-
-
-
-
-
- {!processing && isCoreRunning && (
-
- {protectionEnabled ? 'on' : 'off'}
-
- )}
-
-
-
+
+
- {!processingProfile && name
- &&
- sign_out
- }
-
+
+
+ {!processingProfile && name
+ &&
+ {t('sign_out')}
+ }
-
-
;
+};
Filters.propTypes = {
filter: PropTypes.object.isRequired,
diff --git a/client/src/components/Settings/Clients/Form.js b/client/src/components/Settings/Clients/Form.js
index cb5458dd..2142b1a5 100644
--- a/client/src/components/Settings/Clients/Form.js
+++ b/client/src/components/Settings/Clients/Form.js
@@ -15,7 +15,7 @@ import { toggleAllServices } from '../../../helpers/helpers';
import {
renderInputField,
renderGroupField,
- renderSelectField,
+ renderCheckboxField,
renderServiceField,
} from '../../../helpers/form';
import { validateClientId, validateRequiredValue } from '../../../helpers/validators';
@@ -151,7 +151,7 @@ let Form = (props) => {
- query_log
-
-
-
- - MTU: - {interfaceValues.mtu} - -
-
-
dhcp_hardware_address : - {interfaceValues.hardware_address} -
- -
-
dhcp_ip_addresses : - { - interfaceValues.ip_addresses - .map((ip) => {ip}) - } -
-
+
;
+
+const Interfaces = () => {
+ const { t } = useTranslation();
+
+ const {
+ processingInterfaces,
+ interfaces,
+ enabled,
+ } = useSelector((store) => store.dhcp, shallowEqual);
+
+ const interface_name = useSelector(
+ (store) => store.form[FORM_NAME.DHCP_INTERFACES]?.values?.interface_name,
+ );
+
+ const interfaceValue = interface_name && interfaces[interface_name];
+
+ return !processingInterfaces
+ && interfaces
+ && <>
+ -
+ {getInterfaceValues({
+ gateway_ip,
+ hardware_address,
+ ip_addresses,
+ }).map(({ name, value, render }) => value &&
-
+
{name} : + {render?.(value) || value} + )}
+
+
+ ;
+};
+
+renderInterfaceValues.propTypes = {
+ gateway_ip: propTypes.string.isRequired,
+ hardware_address: propTypes.string.isRequired,
+ ip_addresses: propTypes.arrayOf(propTypes.string).isRequired,
+};
+
+export default reduxForm({
+ form: FORM_NAME.DHCP_INTERFACES,
+})(Interfaces);
diff --git a/client/src/components/Settings/Dhcp/StaticLeases/Form.js b/client/src/components/Settings/Dhcp/StaticLeases/Form.js
index 40854f6e..57db976d 100644
--- a/client/src/components/Settings/Dhcp/StaticLeases/Form.js
+++ b/client/src/components/Settings/Dhcp/StaticLeases/Form.js
@@ -1,22 +1,27 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
-import { Trans, withTranslation } from 'react-i18next';
-import flow from 'lodash/flow';
+import { Trans, useTranslation } from 'react-i18next';
+import { useDispatch } from 'react-redux';
import { renderInputField } from '../../../../helpers/form';
import { validateIpv4, validateMac, validateRequiredValue } from '../../../../helpers/validators';
import { FORM_NAME } from '../../../../helpers/constants';
+import { toggleLeaseModal } from '../../../../actions';
-const Form = (props) => {
- const {
- t,
- handleSubmit,
- reset,
- pristine,
- submitting,
- toggleLeaseModal,
- processingAdding,
- } = props;
+const Form = ({
+ handleSubmit,
+ reset,
+ pristine,
+ submitting,
+ processingAdding,
+}) => {
+ const { t } = useTranslation();
+ const dispatch = useDispatch();
+
+ const onClick = () => {
+ reset();
+ dispatch(toggleLeaseModal());
+ };
return (
+
+
+ {renderInterfaces(interfaces)}
+
+
+ {interfaceValue
+ && renderInterfaceValues(interfaceValue)}
+
- text]}>
- install_static_configure
-
-
-
-
- )}
- {status === STATIC_STATUS.ERROR && (
-
- install_static_error
-
- )}
- {status === STATIC_STATUS.ENABLED && (
-
-
- install_static_ok
+ switch (status) {
+ case STATUS_RESPONSE.NO: {
+ return <>
+
}
}
- {dnsPort === UBUNTU_SYSTEM_PORT && !isDnsFixAvailable
+ {dnsPort === STANDARD_DNS_PORT && !isDnsFixAvailable
&& dnsStatus.includes(ADDRESS_IN_USE_TEXT)
&&
+ text]}>
+ install_static_configure
- )}
-
- );
+
+ ;
+ }
+ case STATUS_RESPONSE.ERROR: {
+ return
+ install_static_error
+
;
+ }
+ case STATUS_RESPONSE.YES: {
+ return
+ install_static_ok
+
;
+ }
+ default:
+ return null;
+ }
};
handleAutofix = (type) => {
@@ -229,7 +208,7 @@ class Settings extends Component {
component={renderInputField}
type="number"
className="form-control"
- placeholder="80"
+ placeholder={STANDARD_WEB_PORT.toString()}
validate={[validateInstallPort, validateRequiredValue]}
normalize={toNumber}
onChange={handleChange}
@@ -297,7 +276,7 @@ class Settings extends Component {
component={renderInputField}
type="number"
className="form-control"
- placeholder="80"
+ placeholder={STANDARD_WEB_PORT.toString()}
validate={[validateInstallPort, validateRequiredValue]}
normalize={toNumber}
onChange={handleChange}
@@ -332,7 +311,7 @@ class Settings extends Component {