Pull request: 4637 fix blocked services icons and actions highlight

Updates #4637

Squashed commit of the following:

commit d69887586d15582406fab642e576a46f8984107b
Merge: 65453371 e738508d
Author: Ildar Kamalov <ik@adguard.com>
Date:   Fri Jun 10 12:07:29 2022 +0300

    Merge branch 'master' into 4637-table

commit 65453371fc7309e772a12fb9f522247e1392a64a
Author: Ildar Kamalov <ik@adguard.com>
Date:   Thu Jun 9 18:43:44 2022 +0300

    client: fix blocked services icons and actions highlight
This commit is contained in:
Ildar Kamalov 2022-06-10 12:41:20 +03:00
parent e738508d7a
commit d3f39b0aa1
5 changed files with 19 additions and 2 deletions

View File

@ -29,6 +29,8 @@ class Table extends Component {
Header: this.props.t('actions_table_header'), Header: this.props.t('actions_table_header'),
accessor: 'actions', accessor: 'actions',
maxWidth: 100, maxWidth: 100,
sortable: false,
resizable: false,
Cell: (value) => ( Cell: (value) => (
<div className="logs__row logs__row--center"> <div className="logs__row logs__row--center">
<button <button

View File

@ -36,6 +36,7 @@ class Table extends Component {
Cell: this.renderCheckbox, Cell: this.renderCheckbox,
width: 90, width: 90,
className: 'text-center', className: 'text-center',
resizable: false,
}, },
{ {
Header: <Trans>name_table_header</Trans>, Header: <Trans>name_table_header</Trans>,
@ -77,10 +78,11 @@ class Table extends Component {
}, },
{ {
Header: <Trans>actions_table_header</Trans>, Header: <Trans>actions_table_header</Trans>,
accessor: 'url', accessor: 'actions',
className: 'text-center', className: 'text-center',
width: 100, width: 100,
sortable: false, sortable: false,
resizable: false,
Cell: (row) => { Cell: (row) => {
const { value } = row; const { value } = row;
const { t, toggleFilteringModal, handleDelete } = this.props; const { t, toggleFilteringModal, handleDelete } = this.props;

View File

@ -338,10 +338,19 @@
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.logs__row--icons {
flex-wrap: wrap;
}
.logs__table .logs__row { .logs__table .logs__row {
border-bottom: 2px solid var(--gray-216); border-bottom: 2px solid var(--gray-216);
} }
.logs__tag {
text-overflow: ellipsis;
overflow: hidden;
}
/* QUERY_STATUS_COLORS */ /* QUERY_STATUS_COLORS */
.logs__row--blue { .logs__row--blue {
background-color: var(--blue); background-color: var(--blue);

View File

@ -193,7 +193,7 @@ class ClientsTable extends Component {
<div className="logs__row o-hidden"> <div className="logs__row o-hidden">
<span className="logs__text"> <span className="logs__text">
{value.map((tag) => ( {value.map((tag) => (
<div key={tag} title={tag} className="small"> <div key={tag} title={tag} className="logs__tag small">
{tag} {tag}
</div> </div>
))} ))}
@ -225,6 +225,8 @@ class ClientsTable extends Component {
Header: this.props.t('actions_table_header'), Header: this.props.t('actions_table_header'),
accessor: 'actions', accessor: 'actions',
maxWidth: 100, maxWidth: 100,
sortable: false,
resizable: false,
Cell: (row) => { Cell: (row) => {
const clientName = row.original.name; const clientName = row.original.name;
const { const {

View File

@ -70,6 +70,8 @@ const StaticLeases = ({
Header: <Trans>actions_table_header</Trans>, Header: <Trans>actions_table_header</Trans>,
accessor: 'actions', accessor: 'actions',
maxWidth: 150, maxWidth: 150,
sortable: false,
resizable: false,
// eslint-disable-next-line react/display-name // eslint-disable-next-line react/display-name
Cell: (row) => { Cell: (row) => {
const { ip, mac, hostname } = row.original; const { ip, mac, hostname } = row.original;