From 1c9d3acaa8864bca3e17dc3a313630dbc9ebea60 Mon Sep 17 00:00:00 2001 From: Ildar Kamalov Date: Fri, 24 Jul 2020 17:17:11 +0300 Subject: [PATCH] - client: fix whois wrap and vertical alignment --- .../components/Logs/Cells/getClientCell.js | 22 +++++++++++++------ client/src/components/Logs/Logs.css | 4 ++-- client/src/helpers/constants.js | 2 +- client/src/helpers/formatClientCell.js | 5 +++-- 4 files changed, 21 insertions(+), 12 deletions(-) diff --git a/client/src/components/Logs/Cells/getClientCell.js b/client/src/components/Logs/Cells/getClientCell.js index 2891f9b8..6dbc9367 100644 --- a/client/src/components/Logs/Cells/getClientCell.js +++ b/client/src/components/Logs/Cells/getClientCell.js @@ -16,6 +16,7 @@ const getClientCell = ({ const autoClient = autoClients.find((autoClient) => autoClient.name === client); const source = autoClient?.source; + const whoisAvailable = whois_info && Object.keys(whois_info).length > 0; const id = nanoid(); @@ -33,7 +34,7 @@ const getClientCell = ({ const isFiltered = checkFiltered(reason); const nameClass = classNames('w-90 o-hidden d-flex flex-column', { - 'mt-2': isDetailed && !name && !whois_info, + 'mt-2': isDetailed && !name && !whoisAvailable, 'white-space--nowrap': isDetailed, }); @@ -78,12 +79,19 @@ const getClientCell = ({ content: processedData, placement: 'bottom', })} -
-
{formatClientCell(row, isDetailed)}
- {isDetailed && name - && !whois_info &&
{name}
} +
+
+ {formatClientCell(row, isDetailed)} +
+ + {isDetailed && name && !whoisAvailable && ( +
+ {name} +
+ )}
{renderBlockingButton(isFiltered, domain)}
diff --git a/client/src/components/Logs/Logs.css b/client/src/components/Logs/Logs.css index 82d8a1c9..6623f626 100644 --- a/client/src/components/Logs/Logs.css +++ b/client/src/components/Logs/Logs.css @@ -58,8 +58,7 @@ width: 100%; } -.logs__text--wrap, -.logs__text--whois { +.logs__text--wrap { line-height: 1.4; white-space: normal; } @@ -71,6 +70,7 @@ .logs__text--whois { line-height: 1.2; + color: #9aa0ac; } .logs__row .tooltip-custom { diff --git a/client/src/helpers/constants.js b/client/src/helpers/constants.js index bc0f6050..8b84e558 100644 --- a/client/src/helpers/constants.js +++ b/client/src/helpers/constants.js @@ -296,7 +296,7 @@ export const DEFAULT_LOGS_FILTER = { export const DEFAULT_LANGUAGE = 'en'; -export const TABLE_DEFAULT_PAGE_SIZE = 50; +export const TABLE_DEFAULT_PAGE_SIZE = 25; export const TABLE_FIRST_PAGE = 0; diff --git a/client/src/helpers/formatClientCell.js b/client/src/helpers/formatClientCell.js index 989cc1d2..48b89665 100644 --- a/client/src/helpers/formatClientCell.js +++ b/client/src/helpers/formatClientCell.js @@ -31,10 +31,11 @@ export const formatClientCell = (row, isDetailed = false, isLogs = true) => { if (info) { const { name, whois_info } = info; + const whoisAvailable = whois_info && Object.keys(whois_info).length > 0; if (name) { if (isLogs) { - nameContainer = !whois_info && isDetailed + nameContainer = !whoisAvailable && isDetailed ? ( {value} ) : ( @@ -54,7 +55,7 @@ export const formatClientCell = (row, isDetailed = false, isLogs = true) => { } } - if (whois_info && isDetailed) { + if (whoisAvailable && isDetailed) { whoisContainer = (
{getFormattedWhois(whois_info)}