Pull request 1776: client: add transform dynamic lease to static

Updates #3459.

Squashed commit of the following:

commit 7a660c689da898c125a268f88378e38a58b457da
Author: Vladislav Abdulmyanov <v.abdulmyanov@adguard.com>
Date:   Tue Mar 21 10:40:25 2023 +0200

    consider issues

commit 066bf77ac44fa8602c66aa0ea220b52fca6d1180
Author: Vladislav Abdulmyanov <v.abdulmyanov@adguard.com>
Date:   Mon Mar 20 18:37:14 2023 +0200

    client: fix icon

commit 356b4c3895436f165697510bb3b3abf95f18894f
Author: Vladislav Abdulmyanov <v.abdulmyanov@adguard.com>
Date:   Mon Mar 20 18:32:03 2023 +0200

    client: add transform dinamic lease to static
This commit is contained in:
Vladislav Abdulmyanov
2023-03-21 14:42:54 +03:00
parent 1daabb97e5
commit f736d85e6e
7 changed files with 53 additions and 15 deletions

View File

@@ -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 {
</div>
);
convertToStatic = (data) => () => {
const { dispatch } = this.props;
dispatch(toggleLeaseModal(data));
}
makeStatic = ({ row }) => {
const { t, disabledLeasesButton } = this.props;
return (
<div className="logs__row logs__row--center">
<button
type="button"
className="btn btn-icon btn-icon--green btn-outline-secondary btn-sm"
title={t('make_static')}
onClick={this.convertToStatic(row)}
disabled={disabledLeasesButton}
>
<svg className="icons icon12">
<use xlinkHref="#plus" />
</svg>
</button>
</div>
);
}
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: <Trans>dhcp_table_expires</Trans>,
accessor: 'expires',
minWidth: 130,
minWidth: 220,
Cell: this.cellWrap,
}, {
Header: <Trans>actions_table_header</Trans>,
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));