- client: Fix query logs UI issues

Close #1828

Squashed commit of the following:

commit bf96b9f2cc99a94a1289c47b04cde136cf0c9f37
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Jul 15 20:44:22 2020 +0300

    Remove field domain from response tooltip

commit bba35fdbed6d1e2e532c8effaf2da69de3f2c078
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Jul 15 20:29:24 2020 +0300

    Unify mobile modal

commit 5ee2da41594497fd64eadf0fd64c24afdad94e44
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Jul 15 19:02:47 2020 +0300

    Delete unnecessary comment

commit ac3a3f13009ad508ddd7eb31aadf7e590a5c2829
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Jul 15 18:59:44 2020 +0300

    minor

commit 4b1969a53ce2fcfc859c228b27816459bd8bd1d0
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Jul 15 18:56:51 2020 +0300

    Fix safari mediaQuery change listener issue

commit d85de5c4e90d2460632e593cffe3ceea3137e92c
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Jul 15 18:10:30 2020 +0300

    Fix logs input search markup (for different locales)

commit 6d704399c5379dfda663503b3a5b1d12a92732b2
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Jul 15 16:05:35 2020 +0300

    Fix whois_info markup, fix domain name overflow

commit 4c900f60a9c6b71b427d968177252eb168c424c0
Merge: a3955c98 38366ba8
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Jul 15 13:42:43 2020 +0300

    Merge branch 'master' into fix/1828

commit a3955c989a939866c6772b147547344b3f8769c4
Merge: c91c41cb 2759d81a
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Mon Jul 13 15:14:47 2020 +0300

    Merge branch 'master' into fix/1828

commit c91c41cbc5f616e0af1092424e42b909d2f43f7c
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Mon Jul 13 13:48:54 2020 +0300

    Fix cell overflow

commit 19e1d31a40f2e1bb1189a85b72507bcc364d4e0c
Merge: af31f48c a33164bf
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Mon Jul 13 12:36:44 2020 +0300

    Merge branch 'master' into fix/1828

commit af31f48c4d2699ebfbd2034711c51499b42e40f5
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Mon Jul 13 10:45:57 2020 +0300

    minor

commit d9507c5f3f5758e587766ae0fa45f1b9ad703ccf
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Fri Jul 10 18:34:22 2020 +0300

    - client: Fix query logs UI issues
This commit is contained in:
Artem Baskal
2020-07-15 20:55:13 +03:00
parent 38366ba801
commit e46db985e8
10 changed files with 98 additions and 119 deletions

View File

@@ -33,7 +33,7 @@ const getClientCell = ({
const isFiltered = checkFiltered(reason);
const nameClass = classNames('w-90 o-hidden d-flex flex-column', {
'mt-2': isDetailed && !name,
'mt-2': isDetailed && !name && !whois_info,
'white-space--nowrap': isDetailed,
});
@@ -80,9 +80,9 @@ const getClientCell = ({
})}
<div
className={nameClass}>
<div data-tip={true} data-for={id}>{formatClientCell(row, t, isDetailed)}</div>
<div data-tip={true} data-for={id}>{formatClientCell(row, isDetailed)}</div>
{isDetailed && name
&& <div className="detailed-info d-none d-sm-block logs__text"
&& !whois_info && <div className="detailed-info d-none d-sm-block logs__text"
title={name}>{name}</div>}
</div>
{renderBlockingButton(isFiltered, domain)}

View File

@@ -9,8 +9,7 @@ import getHintElement from './getHintElement';
const getResponseCell = (row, filtering, t, isDetailed, getFilterName) => {
const {
reason, filterId, rule, status, upstream, elapsedMs,
domain, response, originalResponse,
reason, filterId, rule, status, upstream, elapsedMs, response, originalResponse,
} = row.original;
const { filters, whitelistFilters } = filtering;
@@ -41,7 +40,6 @@ const getResponseCell = (row, filtering, t, isDetailed, getFilterName) => {
const FILTERED_STATUS_TO_FIELDS_MAP = {
[FILTERED_STATUS.NOT_FILTERED_NOT_FOUND]: {
domain,
encryption_status: boldStatusLabel,
install_settings_dns: upstream,
elapsed: formattedElapsedMs,
@@ -49,7 +47,6 @@ const getResponseCell = (row, filtering, t, isDetailed, getFilterName) => {
response_table_header: renderResponses(response),
},
[FILTERED_STATUS.FILTERED_BLOCKED_SERVICE]: {
domain,
encryption_status: boldStatusLabel,
install_settings_dns: upstream,
elapsed: formattedElapsedMs,
@@ -59,7 +56,6 @@ const getResponseCell = (row, filtering, t, isDetailed, getFilterName) => {
original_response: renderResponses(originalResponse),
},
[FILTERED_STATUS.NOT_FILTERED_WHITE_LIST]: {
domain,
encryption_status: boldStatusLabel,
install_settings_dns: upstream,
elapsed: formattedElapsedMs,
@@ -68,21 +64,19 @@ const getResponseCell = (row, filtering, t, isDetailed, getFilterName) => {
response_code: status,
},
[FILTERED_STATUS.NOT_FILTERED_WHITE_LIST]: {
domain,
encryption_status: boldStatusLabel,
filter,
rule_label: rule,
response_code: status,
},
[FILTERED_STATUS.FILTERED_SAFE_SEARCH]: {
domain,
encryption_status: boldStatusLabel,
install_settings_dns: upstream,
elapsed: formattedElapsedMs,
response_code: status,
response_table_header: renderResponses(response),
},
[FILTERED_STATUS.FILTERED_BLACK_LIST]: {
domain,
encryption_status: boldStatusLabel,
filter,
rule_label: rule,
@@ -93,7 +87,7 @@ const getResponseCell = (row, filtering, t, isDetailed, getFilterName) => {
},
};
const fields = FILTERED_STATUS_TO_FIELDS_MAP[reason]
const content = FILTERED_STATUS_TO_FIELDS_MAP[reason]
? Object.entries(FILTERED_STATUS_TO_FIELDS_MAP[reason])
: Object.entries(FILTERED_STATUS_TO_FIELDS_MAP.NotFilteredNotFound);
@@ -108,7 +102,7 @@ const getResponseCell = (row, filtering, t, isDetailed, getFilterName) => {
contentItemClass: 'text-truncate key-colon o-hidden',
xlinkHref: 'question',
title: 'response_details',
content: fields,
content,
placement: 'bottom',
})}
<div className="text-truncate">