diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json
index 2afa38bd..ee0345d7 100644
--- a/client/src/__locales/en.json
+++ b/client/src/__locales/en.json
@@ -642,5 +642,6 @@
"anonymizer_notification": "<0>Note:0> IP anonymization is enabled. You can disable it in <1>General settings1>.",
"confirm_dns_cache_clear": "Are you sure you want to clear DNS cache?",
"cache_cleared": "DNS cache successfully cleared",
- "clear_cache": "Clear cache"
+ "clear_cache": "Clear cache",
+ "make_static": "Make static"
}
diff --git a/client/src/components/Settings/Dhcp/Leases.js b/client/src/components/Settings/Dhcp/Leases.js
index 2973d1b5..96ca8852 100644
--- a/client/src/components/Settings/Dhcp/Leases.js
+++ b/client/src/components/Settings/Dhcp/Leases.js
@@ -1,9 +1,11 @@
import React, { Component } from 'react';
+import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import ReactTable from 'react-table';
import { Trans, withTranslation } from 'react-i18next';
import { LEASES_TABLE_DEFAULT_PAGE_SIZE } from '../../../helpers/constants';
import { sortIp } from '../../../helpers/helpers';
+import { toggleLeaseModal } from '../../../actions';
class Leases extends Component {
cellWrap = ({ value }) => (
@@ -14,6 +16,30 @@ class Leases extends Component {
);
+ convertToStatic = (data) => () => {
+ const { dispatch } = this.props;
+ dispatch(toggleLeaseModal(data));
+ }
+
+ makeStatic = ({ row }) => {
+ const { t, disabledLeasesButton } = this.props;
+ return (
+
+
+
+ );
+ }
+
render() {
const { leases, t } = this.props;
return (
@@ -23,7 +49,7 @@ class Leases extends Component {
{
Header: 'MAC',
accessor: 'mac',
- minWidth: 160,
+ minWidth: 180,
Cell: this.cellWrap,
}, {
Header: 'IP',
@@ -39,8 +65,11 @@ class Leases extends Component {
}, {
Header: dhcp_table_expires,
accessor: 'expires',
- minWidth: 130,
+ minWidth: 220,
Cell: this.cellWrap,
+ }, {
+ Header: actions_table_header,
+ Cell: this.makeStatic,
},
]}
pageSize={LEASES_TABLE_DEFAULT_PAGE_SIZE}
@@ -57,6 +86,8 @@ class Leases extends Component {
Leases.propTypes = {
leases: PropTypes.array,
t: PropTypes.func,
+ dispatch: PropTypes.func,
+ disabledLeasesButton: PropTypes.bool,
};
-export default withTranslation()(Leases);
+export default withTranslation()(connect(() => ({}), (dispatch) => ({ dispatch }))(Leases));
diff --git a/client/src/components/Settings/Dhcp/StaticLeases/Form.js b/client/src/components/Settings/Dhcp/StaticLeases/Form.js
index 0525f6a3..e26b4da5 100644
--- a/client/src/components/Settings/Dhcp/StaticLeases/Form.js
+++ b/client/src/components/Settings/Dhcp/StaticLeases/Form.js
@@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, useTranslation } from 'react-i18next';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector, shallowEqual } from 'react-redux';
import { renderInputField, normalizeMac } from '../../../../helpers/form';
import {
@@ -25,6 +25,7 @@ const Form = ({
}) => {
const { t } = useTranslation();
const dispatch = useDispatch();
+ const dynamicLease = useSelector((store) => store.dhcp.leaseModalConfig, shallowEqual);
const onClick = () => {
reset();
@@ -87,7 +88,7 @@ const Form = ({
diff --git a/client/src/components/Settings/Dhcp/StaticLeases/Modal.js b/client/src/components/Settings/Dhcp/StaticLeases/Modal.js
index 0baf487e..7a11cfce 100644
--- a/client/src/components/Settings/Dhcp/StaticLeases/Modal.js
+++ b/client/src/components/Settings/Dhcp/StaticLeases/Modal.js
@@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { Trans, withTranslation } from 'react-i18next';
import ReactModal from 'react-modal';
-import { useDispatch } from 'react-redux';
+import { shallowEqual, useDispatch, useSelector } from 'react-redux';
import Form from './Form';
import { toggleLeaseModal } from '../../../../actions';
@@ -18,6 +18,9 @@ const Modal = ({
const dispatch = useDispatch();
const toggleModal = () => dispatch(toggleLeaseModal());
+ const leaseInitialData = useSelector(
+ (state) => state.dhcp.leaseModalConfig, shallowEqual,
+ ) || {};
return (