diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json index bad60842..aa95a923 100644 --- a/client/src/__locales/en.json +++ b/client/src/__locales/en.json @@ -34,6 +34,8 @@ "dhcp_table_expires": "Expires", "dhcp_warning": "If you want to enable DHCP server anyway, make sure that there is no other active DHCP server in your network. Otherwise, it can break the Internet for connected devices!", "dhcp_error": "We could not determine whether there is another DHCP server in the network.", + "dhcp_static_ip_error": "In order to use DHCP server a static IP address must be set. We failed to determine if this network interface is configured using static IP address. Please set a static IP address manually.", + "dhcp_dynamic_ip_found": "Your system uses dynamic IP address configuration for interface <0>{{interfaceName}}. In order to use DHCP server a static IP address must be set. Your current IP address is <0>{{ipAddress}}. We will automatically set this IP address as static if you press Enable DHCP button.", "error_details": "Error details", "back": "Back", "dashboard": "Dashboard", diff --git a/client/src/components/Settings/Dhcp/index.js b/client/src/components/Settings/Dhcp/index.js index 1de64f14..c152b7f0 100644 --- a/client/src/components/Settings/Dhcp/index.js +++ b/client/src/components/Settings/Dhcp/index.js @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'; import classnames from 'classnames'; import { Trans, withNamespaces } from 'react-i18next'; +import { RESPONSE_STATUS } from '../../../helpers/constants'; import Form from './Form'; import Leases from './Leases'; import Interface from './Interface'; @@ -20,9 +21,10 @@ class Dhcp extends Component { getToggleDhcpButton = () => { const { - config, active, processingDhcp, processingConfig, + config, check, processingDhcp, processingConfig, } = this.props.dhcp; - const activeDhcpFound = active && active.found; + const otherDhcpFound = + check && check.otherServer && check.otherServer.found === RESPONSE_STATUS.YES; const filledConfig = Object.keys(config).every((key) => { if (key === 'enabled' || key === 'icmp_timeout_msec') { return true; @@ -51,8 +53,8 @@ class Dhcp extends Component { onClick={() => this.handleToggle(config)} disabled={ !filledConfig - || !active - || activeDhcpFound + || !check + || otherDhcpFound || processingDhcp || processingConfig } @@ -62,41 +64,39 @@ class Dhcp extends Component { ); } - getActiveDhcpMessage = (t, active) => { - if (active) { - if (active.error) { - return ( -
- dhcp_error -
- - {active.error} - -
-
- ); - } + getActiveDhcpMessage = (t, check) => { + const { found } = check.otherServer; + if (found === RESPONSE_STATUS.ERROR) { return ( -
- {active.found ? ( -
- dhcp_found -
- ) : ( -
- dhcp_not_found -
- )} +
+ dhcp_error +
+ + {check.otherServer.error} + +
); } - return ''; + return ( +
+ {found === RESPONSE_STATUS.YES ? ( +
+ dhcp_found +
+ ) : ( +
+ dhcp_not_found +
+ )} +
+ ); } - getDhcpWarning = (active) => { - if (!active || (active && active.found === false)) { + getDhcpWarning = (check) => { + if (check.otherServer.found === RESPONSE_STATUS.NO) { return ''; } @@ -107,6 +107,49 @@ class Dhcp extends Component { ); } + getStaticIpWarning = (t, check, interfaceName) => { + if (check.staticIP.static === RESPONSE_STATUS.ERROR) { + return ( + +
+ dhcp_static_ip_error +
+ + {check.staticIP.error} + +
+
+
+ + ); + } else if ( + check.staticIP.static === RESPONSE_STATUS.YES + && check.staticIP.ip + && interfaceName + ) { + return ( + +
+ example, + ]} + values={{ + interfaceName, + ipAddress: check.staticIP.ip, + }} + > + dhcp_dynamic_ip_found + +
+
+ + ); + } + + return ''; + } + render() { const { t, dhcp } = this.props; const statusButtonClass = classnames({ @@ -156,10 +199,11 @@ class Dhcp extends Component { check_dhcp_servers
- {!enabled && + {!enabled && dhcp.check && - {this.getActiveDhcpMessage(t, dhcp.active)} - {this.getDhcpWarning(dhcp.active)} + {this.getStaticIpWarning(t, dhcp.check, interface_name)} + {this.getActiveDhcpMessage(t, dhcp.check)} + {this.getDhcpWarning(dhcp.check)} } diff --git a/client/src/helpers/constants.js b/client/src/helpers/constants.js index 79deabdb..bbe5a5fc 100644 --- a/client/src/helpers/constants.js +++ b/client/src/helpers/constants.js @@ -157,3 +157,9 @@ export const UNSAFE_PORTS = [ ]; export const ALL_INTERFACES_IP = '0.0.0.0'; + +export const RESPONSE_STATUS = { + YES: 'yes', + NO: 'no', + ERROR: 'error', +}; diff --git a/client/src/reducers/index.js b/client/src/reducers/index.js index 0b415702..25156688 100644 --- a/client/src/reducers/index.js +++ b/client/src/reducers/index.js @@ -292,11 +292,22 @@ const dhcp = handleActions({ [actions.findActiveDhcpRequest]: state => ({ ...state, processingStatus: true }), [actions.findActiveDhcpFailure]: state => ({ ...state, processingStatus: false }), - [actions.findActiveDhcpSuccess]: (state, { payload }) => ({ - ...state, - active: payload, - 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 }), @@ -304,7 +315,7 @@ const dhcp = handleActions({ const { config } = state; const newConfig = { ...config, enabled: !config.enabled }; const newState = { - ...state, config: newConfig, active: null, processingDhcp: false, + ...state, config: newConfig, check: null, processingDhcp: false, }; return newState; }, @@ -326,7 +337,7 @@ const dhcp = handleActions({ config: { enabled: false, }, - active: null, + check: null, leases: [], });