diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json index bbfe2336..465a4006 100644 --- a/client/src/__locales/en.json +++ b/client/src/__locales/en.json @@ -15,6 +15,7 @@ "dhcp_not_found": "It is safe to enable the built-in DHCP server - we didn't find any active DHCP servers on the network. However, we encourage you to re-check it manually as our automatic test currently doesn't give 100% guarantee.", "dhcp_found": "An active DHCP server is found on the network. It is not safe to enable the built-in DHCP server.", "dhcp_leases": "DHCP leases", + "dhcp_static_leases": "DHCP static leases", "dhcp_leases_not_found": "No DHCP leases found", "dhcp_config_saved": "Saved DHCP server config", "form_error_required": "Required field", diff --git a/client/src/components/Settings/Dhcp/StaticLeases.js b/client/src/components/Settings/Dhcp/StaticLeases.js new file mode 100644 index 00000000..6bcf596c --- /dev/null +++ b/client/src/components/Settings/Dhcp/StaticLeases.js @@ -0,0 +1,49 @@ +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import ReactTable from 'react-table'; +import { Trans, withNamespaces } from 'react-i18next'; + +class StaticLeases extends Component { + cellWrap = ({ value }) => ( +
+ + {value} + +
+ ); + + render() { + const { staticLeases, t } = this.props; + return ( + dhcp_table_hostname, + accessor: 'hostname', + Cell: this.cellWrap, + }, + ]} + showPagination={false} + noDataText={t('dhcp_leases_not_found')} + minRows={6} + className="-striped -highlight card-table-overflow" + /> + ); + } +} + +StaticLeases.propTypes = { + staticLeases: PropTypes.array, + t: PropTypes.func, +}; + +export default withNamespaces()(StaticLeases); diff --git a/client/src/components/Settings/Dhcp/index.js b/client/src/components/Settings/Dhcp/index.js index 437f9265..b7b5ff53 100644 --- a/client/src/components/Settings/Dhcp/index.js +++ b/client/src/components/Settings/Dhcp/index.js @@ -6,6 +6,7 @@ import { Trans, withNamespaces } from 'react-i18next'; import { DHCP_STATUS_RESPONSE } from '../../../helpers/constants'; import Form from './Form'; import Leases from './Leases'; +import StaticLeases from './StaticLeases'; import Interface from './Interface'; import Card from '../../ui/Card'; import Accordion from '../../ui/Accordion'; @@ -211,13 +212,22 @@ class Dhcp extends Component { {!dhcp.processing && dhcp.config.enabled && - -
-
- + + +
+
+ +
-
- + + +
+
+ +
+
+
+ } ); diff --git a/client/src/reducers/index.js b/client/src/reducers/index.js index 0a3b8171..d8767116 100644 --- a/client/src/reducers/index.js +++ b/client/src/reducers/index.js @@ -287,11 +287,18 @@ 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, - ...payload, + staticLeases, processing: false, + ...values, }; + return newState; }, @@ -355,6 +362,7 @@ const dhcp = handleActions({ }, check: null, leases: [], + staticLeases: [], }); export default combineReducers({