From ec6e0bea07cb387494397a10f8a9e875ea27e102 Mon Sep 17 00:00:00 2001 From: Simon Zolin Date: Thu, 18 Jun 2020 13:49:52 +0300 Subject: [PATCH 1/3] * openapi: describe top_* array entries in /stats Squashed commit of the following: commit d0b640cb36985c82f1020de99fba2201a1c54738 Author: Simon Zolin Date: Thu Jun 18 11:53:16 2020 +0300 * openapi: describe top_* array entries in /stats --- openapi/openapi.yaml | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/openapi/openapi.yaml b/openapi/openapi.yaml index b30ccc2e..15e2963b 100644 --- a/openapi/openapi.yaml +++ b/openapi/openapi.yaml @@ -1213,15 +1213,15 @@ components: top_queried_domains: type: array items: - type: object + $ref: "#/components/schemas/TopArrayEntry" top_clients: type: array items: - type: object + $ref: "#/components/schemas/TopArrayEntry" top_blocked_domains: type: array items: - type: object + $ref: "#/components/schemas/TopArrayEntry" dns_queries: type: array items: @@ -1238,6 +1238,12 @@ components: type: array items: type: integer + TopArrayEntry: + type: object + description: Represent the number of hits per key (domain or client IP) + properties: + domain_or_ip: + type: integer StatsConfig: type: object description: Statistics configuration From aa7b3c33d5f268298f8d2d0367b5ea6550dd2af7 Mon Sep 17 00:00:00 2001 From: Andrey Meshkov Date: Thu, 18 Jun 2020 22:53:02 +0300 Subject: [PATCH 2/3] Fix #1810 - client: Fix query log bugs Squashed commit of the following: commit 188bbad32a2af8a1867fc3ef91d81cda6aa94853 Merge: 15db9e9c ec6e0bea Author: Andrey Meshkov Date: Thu Jun 18 22:43:11 2020 +0300 Merge branch 'master' into fix/1810 commit 15db9e9c1daec31d5d6f1d6d77a59bc125fb00d5 Author: ArtemBaskal Date: Thu Jun 18 19:01:10 2020 +0300 Open tooltip on hover, show scroll on overflow y commit 19c013378ddac69126475147ca4f0dc9f9ba0428 Author: ArtemBaskal Date: Thu Jun 18 17:17:46 2020 +0300 Replace tooltip component commit 7e7103dc08cd7e062d6ec6ebd4aaec1ee044f3d2 Author: ArtemBaskal Date: Thu Jun 18 14:21:54 2020 +0300 -client: Fix query log bugs --- client/package-lock.json | 98 ++++++++++--------- client/package.json | 2 +- client/src/components/Dashboard/Clients.js | 6 +- .../ReactTooltip.css => Cells/Tooltip.css} | 33 ++----- .../components/Logs/Cells/getClientCell.js | 3 +- .../components/Logs/Cells/getDomainCell.js | 7 +- .../components/Logs/Cells/getHintElement.js | 83 +++++++--------- .../components/Logs/Cells/getResponseCell.js | 12 ++- client/src/components/Logs/Logs.css | 17 ---- .../components/Logs/Tooltip/CustomTooltip.js | 44 --------- client/src/components/Logs/Tooltip/index.js | 48 --------- client/src/helpers/constants.js | 3 +- client/src/helpers/formatClientCell.js | 15 ++- 13 files changed, 122 insertions(+), 249 deletions(-) rename client/src/components/Logs/{Tooltip/ReactTooltip.css => Cells/Tooltip.css} (80%) delete mode 100644 client/src/components/Logs/Tooltip/CustomTooltip.js delete mode 100644 client/src/components/Logs/Tooltip/index.js diff --git a/client/package-lock.json b/client/package-lock.json index a7055f32..91b1f414 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -4498,6 +4498,15 @@ "sha.js": "^2.4.8" } }, + "create-react-context": { + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.3.0.tgz", + "integrity": "sha512-dNldIoSuNSvlTJ7slIKC/ZFGKexBMBrrcc+TTe1NdmROnaASuLPvqpwj9v4XS4uXZ8+YPu0sNmShX2rXI5LNsw==", + "requires": { + "gud": "^1.0.0", + "warning": "^4.0.3" + } + }, "cross-env": { "version": "7.0.2", "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.2.tgz", @@ -4800,7 +4809,6 @@ "version": "1.1.1", "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.1.1.tgz", "integrity": "sha512-yd9c5AdiqVcR+JjcwUQb9DkhJc8ngNr0MahEBGvDiJw8puWab2yZlh+nkasOnZP+EGTAP6rRp2JzJhJZzvNF8g==", - "dev": true, "requires": { "is-arguments": "^1.0.4", "is-date-object": "^1.0.1", @@ -4836,7 +4844,6 @@ "version": "1.1.3", "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.3.tgz", "integrity": "sha512-3MqfYKj2lLzdMSf8ZIZE/V+Zuy+BgD6f164e8K2w7dgnpKArBDerGYpM46IYYcjnkdPNMjPk9A6VFB8+3SKlXQ==", - "dev": true, "requires": { "object-keys": "^1.0.12" } @@ -5264,7 +5271,6 @@ "version": "1.17.5", "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.17.5.tgz", "integrity": "sha512-BR9auzDbySxOcfog0tLECW8l28eRGpDpU3Dm3Hp4q/N+VtLTmyj4EUN088XZWQDW/hzj6sYRDXeOFsaAODKvpg==", - "dev": true, "requires": { "es-to-primitive": "^1.2.1", "function-bind": "^1.1.1", @@ -5283,7 +5289,6 @@ "version": "1.2.1", "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz", "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==", - "dev": true, "requires": { "is-callable": "^1.1.4", "is-date-object": "^1.0.1", @@ -6706,8 +6711,7 @@ "function-bind": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", - "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==", - "dev": true + "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==" }, "functional-red-black-tree": { "version": "1.0.1", @@ -6989,6 +6993,11 @@ "dev": true, "optional": true }, + "gud": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz", + "integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw==" + }, "handle-thing": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-2.0.1.tgz", @@ -7021,7 +7030,6 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", - "dev": true, "requires": { "function-bind": "^1.1.1" } @@ -7034,8 +7042,7 @@ "has-symbols": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.1.tgz", - "integrity": "sha512-PLcsoqu++dmEIZB+6totNFKq/7Do+Z0u4oT0zKOJNl3lYK6vGwwu2hjHs+68OEZbTjiUE9bgOABXbP/GvrS0Kg==", - "dev": true + "integrity": "sha512-PLcsoqu++dmEIZB+6totNFKq/7Do+Z0u4oT0zKOJNl3lYK6vGwwu2hjHs+68OEZbTjiUE9bgOABXbP/GvrS0Kg==" }, "has-value": { "version": "1.0.0", @@ -7759,8 +7766,7 @@ "is-arguments": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.0.4.tgz", - "integrity": "sha512-xPh0Rmt8NE65sNzvyUmWgI1tz3mKq74lGA0mL8LYZcoIzKOzDh6HmrYm3d18k60nHerC8A9Km8kYu87zfSFnLA==", - "dev": true + "integrity": "sha512-xPh0Rmt8NE65sNzvyUmWgI1tz3mKq74lGA0mL8LYZcoIzKOzDh6HmrYm3d18k60nHerC8A9Km8kYu87zfSFnLA==" }, "is-arrayish": { "version": "0.2.1", @@ -7785,8 +7791,7 @@ "is-callable": { "version": "1.1.5", "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.5.tgz", - "integrity": "sha512-ESKv5sMCJB2jnHTWZ3O5itG+O128Hsus4K4Qh1h2/cgn2vbgnLSVqfV46AeJA9D5EeeLa9w81KUXMtn34zhX+Q==", - "dev": true + "integrity": "sha512-ESKv5sMCJB2jnHTWZ3O5itG+O128Hsus4K4Qh1h2/cgn2vbgnLSVqfV46AeJA9D5EeeLa9w81KUXMtn34zhX+Q==" }, "is-ci": { "version": "2.0.0", @@ -7820,8 +7825,7 @@ "is-date-object": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.2.tgz", - "integrity": "sha512-USlDT524woQ08aoZFzh3/Z6ch9Y/EWXEHQ/AaRN0SkKq4t2Jw2R2339tSXmwuVoY7LLlBCbOIlx2myP/L5zk0g==", - "dev": true + "integrity": "sha512-USlDT524woQ08aoZFzh3/Z6ch9Y/EWXEHQ/AaRN0SkKq4t2Jw2R2339tSXmwuVoY7LLlBCbOIlx2myP/L5zk0g==" }, "is-decimal": { "version": "1.0.4", @@ -7974,7 +7978,6 @@ "version": "1.0.5", "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.5.tgz", "integrity": "sha512-vlKW17SNq44owv5AQR3Cq0bQPEb8+kF3UKZ2fiZNOWtztYE5i0CzCZxFDwO58qAOWtxdBRVO/V5Qin1wjCqFYQ==", - "dev": true, "requires": { "has": "^1.0.3" } @@ -8000,7 +8003,6 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.3.tgz", "integrity": "sha512-OwijhaRSgqvhm/0ZdAcXNZt9lYdKFpcRDT5ULUuYXPoT794UNOdU+gpT6Rzo7b4V2HUl/op6GqY894AZwv9faQ==", - "dev": true, "requires": { "has-symbols": "^1.0.1" } @@ -11117,14 +11119,12 @@ "object-inspect": { "version": "1.7.0", "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.7.0.tgz", - "integrity": "sha512-a7pEHdh1xKIAgTySUGgLMx/xwDZskN1Ud6egYYN3EdRW4ZMPNEDUTF+hwy2LUC+Bl+SyLXANnwz/jyh/qutKUw==", - "dev": true + "integrity": "sha512-a7pEHdh1xKIAgTySUGgLMx/xwDZskN1Ud6egYYN3EdRW4ZMPNEDUTF+hwy2LUC+Bl+SyLXANnwz/jyh/qutKUw==" }, "object-is": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.2.tgz", "integrity": "sha512-5lHCz+0uufF6wZ7CRFWJN3hp8Jqblpgve06U5CMQ3f//6iDjPr2PEo9MWCjEssDsa+UZEL4PkFpr+BMop6aKzQ==", - "dev": true, "requires": { "define-properties": "^1.1.3", "es-abstract": "^1.17.5" @@ -11133,8 +11133,7 @@ "object-keys": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz", - "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==", - "dev": true + "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==" }, "object-visit": { "version": "1.0.1", @@ -11149,7 +11148,6 @@ "version": "4.1.0", "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.0.tgz", "integrity": "sha512-exHJeq6kBKj58mqGyTQ9DFvrZC/eR6OwxzoM9YRoGBqrXYonaFyGiFMuc9VZrXf7DarreEwMpurG3dd+CNyW5w==", - "dev": true, "requires": { "define-properties": "^1.1.2", "function-bind": "^1.1.1", @@ -11630,6 +11628,11 @@ "find-up": "^2.1.0" } }, + "popper.js": { + "version": "1.16.1", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", + "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==" + }, "portfinder": { "version": "1.0.26", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.26.tgz", @@ -12300,6 +12303,29 @@ "raf": "^3.1.0" } }, + "react-popper": { + "version": "1.3.7", + "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-1.3.7.tgz", + "integrity": "sha512-nmqYTx7QVjCm3WUZLeuOomna138R1luC4EqkW3hxJUrAe+3eNz3oFCLYdnPwILfn0mX1Ew2c3wctrjlUMYYUww==", + "requires": { + "@babel/runtime": "^7.1.2", + "create-react-context": "^0.3.0", + "deep-equal": "^1.1.1", + "popper.js": "^1.14.4", + "prop-types": "^15.6.1", + "typed-styles": "^0.0.7", + "warning": "^4.0.2" + } + }, + "react-popper-tooltip": { + "version": "2.11.1", + "resolved": "https://registry.npmjs.org/react-popper-tooltip/-/react-popper-tooltip-2.11.1.tgz", + "integrity": "sha512-04A2f24GhyyMicKvg/koIOQ5BzlrRbKiAgP6L+Pdj1MVX3yJ1NeZ8+EidndQsbejFT55oW1b++wg2Z8KlAyhfQ==", + "requires": { + "@babel/runtime": "^7.9.2", + "react-popper": "^1.3.7" + } + }, "react-redux": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.0.tgz", @@ -12427,22 +12453,6 @@ "react-is": "^16.8.1" } }, - "react-tooltip": { - "version": "4.2.6", - "resolved": "https://registry.npmjs.org/react-tooltip/-/react-tooltip-4.2.6.tgz", - "integrity": "sha512-KX/zCsPFCI8RuulzBX86U+Ur7FvgGNRBdb7dUu0ndo8Urinn48nANq9wfq4ABlehweQjPzLl7XdNAtLKza+I3w==", - "requires": { - "prop-types": "^15.7.2", - "uuid": "^7.0.3" - }, - "dependencies": { - "uuid": { - "version": "7.0.3", - "resolved": "https://registry.npmjs.org/uuid/-/uuid-7.0.3.tgz", - "integrity": "sha512-DPSke0pXhTZgoF/d+WSt2QaKMCFSfx7QegxEWT+JOuHF5aWrKEn0G+ztjuJg/gG8/ItK+rbPCD/yNv8yyih6Cg==" - } - } - }, "react-transition-group": { "version": "4.4.1", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.1.tgz", @@ -12632,7 +12642,6 @@ "version": "1.3.0", "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.3.0.tgz", "integrity": "sha512-2+Q0C5g951OlYlJz6yu5/M33IcsESLlLfsyIaLJaG4FA2r4yP8MvVMJUUP/fVBkSpbbbZlS5gynbEWLipiiXiQ==", - "dev": true, "requires": { "define-properties": "^1.1.3", "es-abstract": "^1.17.0-next.1" @@ -13892,7 +13901,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.1.tgz", "integrity": "sha512-LRPxFUaTtpqYsTeNKaFOw3R4bxIzWOnbQ837QfBylo8jIxtcbK/A/sMV7Q+OAV/vWo+7s25pOE10KYSjaSO06g==", - "dev": true, "requires": { "define-properties": "^1.1.3", "es-abstract": "^1.17.5" @@ -13902,7 +13910,6 @@ "version": "2.1.2", "resolved": "https://registry.npmjs.org/string.prototype.trimleft/-/string.prototype.trimleft-2.1.2.tgz", "integrity": "sha512-gCA0tza1JBvqr3bfAIFJGqfdRTyPae82+KTnm3coDXkZN9wnuW3HjGgN386D7hfv5CHQYCI022/rJPVlqXyHSw==", - "dev": true, "requires": { "define-properties": "^1.1.3", "es-abstract": "^1.17.5", @@ -13913,7 +13920,6 @@ "version": "2.1.2", "resolved": "https://registry.npmjs.org/string.prototype.trimright/-/string.prototype.trimright-2.1.2.tgz", "integrity": "sha512-ZNRQ7sY3KroTaYjRS6EbNiiHrOkjihL9aQE/8gfQ4DtAC/aEBRHFJa44OmoWxGGqXuJlfKkZW4WcXErGr+9ZFg==", - "dev": true, "requires": { "define-properties": "^1.1.3", "es-abstract": "^1.17.5", @@ -13924,7 +13930,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.1.tgz", "integrity": "sha512-XxZn+QpvrBI1FOcg6dIpxUPgWCPuNXvMD72aaRaUQv1eD4e/Qy8i/hFTe0BUmD60p/QA6bh1avmuPTfNjqVWRw==", - "dev": true, "requires": { "define-properties": "^1.1.3", "es-abstract": "^1.17.5" @@ -14924,6 +14929,11 @@ "mime-types": "~2.1.24" } }, + "typed-styles": { + "version": "0.0.7", + "resolved": "https://registry.npmjs.org/typed-styles/-/typed-styles-0.0.7.tgz", + "integrity": "sha512-pzP0PWoZUhsECYjABgCGQlRGL1n7tOHsgwYv3oIiEpJwGhFTuty/YNeduxQYzXXa3Ge5BdT6sHYIQYpl4uJ+5Q==" + }, "typedarray": { "version": "0.0.6", "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz", diff --git a/client/package.json b/client/package.json index 9ff53f0f..7f154d4d 100644 --- a/client/package.json +++ b/client/package.json @@ -27,13 +27,13 @@ "react-dom": "^16.13.1", "react-i18next": "^11.4.0", "react-modal": "^3.11.2", + "react-popper-tooltip": "^2.11.1", "react-redux": "^7.2.0", "react-redux-loading-bar": "^4.6.0", "react-router-dom": "^5.2.0", "react-router-hash-link": "^1.2.2", "react-select": "^3.1.0", "react-table": "^6.11.4", - "react-tooltip": "^4.2.6", "react-transition-group": "^4.4.1", "redux": "^4.0.5", "redux-actions": "^2.6.5", diff --git a/client/src/components/Dashboard/Clients.js b/client/src/components/Dashboard/Clients.js index acb46a57..8cd30234 100644 --- a/client/src/components/Dashboard/Clients.js +++ b/client/src/components/Dashboard/Clients.js @@ -1,4 +1,4 @@ -import React, { Fragment } from 'react'; +import React from 'react'; import ReactTable from 'react-table'; import PropTypes from 'prop-types'; import { Trans, withTranslation } from 'react-i18next'; @@ -60,13 +60,13 @@ const clientCell = (t, toggleClientStatus, processing, disallowedClients) => fun const ipMatchListStatus = getIpMatchListStatus(value, disallowedClients); return ( - + <>
{formatClientCell(row, t)}
{ipMatchListStatus !== IP_MATCH_LIST_STATUS.CIDR && renderBlockingButton(ipMatchListStatus, value, toggleClientStatus, processing)} - + ); }; diff --git a/client/src/components/Logs/Tooltip/ReactTooltip.css b/client/src/components/Logs/Cells/Tooltip.css similarity index 80% rename from client/src/components/Logs/Tooltip/ReactTooltip.css rename to client/src/components/Logs/Cells/Tooltip.css index bc8de6c5..30e5cded 100644 --- a/client/src/components/Logs/Tooltip/ReactTooltip.css +++ b/client/src/components/Logs/Cells/Tooltip.css @@ -1,29 +1,22 @@ -.custom-tooltip { +.tooltip__container { padding: 1rem 1.5rem 1.25rem 1.5rem; font-size: 16px !important; box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.2); border-radius: 4px !important; pointer-events: auto !important; -} - -/*crutch, may cause problems https://github.com/wwayne/react-tooltip/issues/204*/ -@media (hover: none) { - .custom-tooltip { - position: absolute !important; - top: 4rem !important; - } + background-color: var(--white); + z-index: 102; + overflow-y: scroll; + max-height: 100%; } .white-space--nowrap { white-space: nowrap !important; } -.white-space--normal { +.overflow-break { white-space: normal !important; -} - -.word-break--break-all { - word-break: break-all !important; + overflow-wrap: break-word; } .grid { @@ -74,10 +67,6 @@ .grid .key-colon, .grid .title--border { font-weight: bold; } - - .custom-tooltip { - overflow-y: scroll; - } } .grid .key-colon:nth-child(odd)::after { @@ -92,14 +81,6 @@ grid-auto-flow: column; } -.custom-tooltip.show { - opacity: 1 !important; -} - -.custom-tooltip:hover { - opacity: 1 !important; -} - .grid-content > * { justify-content: space-between !important; width: 100% !important; diff --git a/client/src/components/Logs/Cells/getClientCell.js b/client/src/components/Logs/Cells/getClientCell.js index 188ce94c..b842e0e6 100644 --- a/client/src/components/Logs/Cells/getClientCell.js +++ b/client/src/components/Logs/Cells/getClientCell.js @@ -75,12 +75,11 @@ const getClientCell = ({ className: hintClass, columnClass: 'grid grid--limited', tooltipClass: 'px-5 pb-5 pt-4 mw-75', - dataTip: true, xlinkHref: 'question', contentItemClass: 'text-truncate key-colon', title: 'client_details', content: processedData, - place: 'bottom', + placement: 'bottom', })}
diff --git a/client/src/components/Logs/Cells/getDomainCell.js b/client/src/components/Logs/Cells/getDomainCell.js index 423211b5..d0a44cff 100644 --- a/client/src/components/Logs/Cells/getDomainCell.js +++ b/client/src/components/Logs/Cells/getDomainCell.js @@ -37,11 +37,11 @@ const getDomainCell = (props) => { const dnssecHint = getHintElement({ className: lockIconClass, tooltipClass: 'py-4 px-5 pb-45', - dataTip: answer_dnssec, + canShowTooltip: answer_dnssec, xlinkHref: 'lock', columnClass: 'w-100', content: 'validated_with_dnssec', - place: 'bottom', + placement: 'bottom', }); const protocol = t(SCHEME_TO_PROTOCOL_MAP[client_proto]) || ''; @@ -64,7 +64,7 @@ const getDomainCell = (props) => { const renderGrid = (content, idx) => { const preparedContent = typeof content === 'string' ? t(content) : content; const className = classNames('text-truncate key-colon o-hidden', { - 'word-break--break-all white-space--normal': preparedContent.length > 100, + 'overflow-break': preparedContent.length > 100, }); return
{preparedContent}
; }; @@ -81,7 +81,6 @@ const getDomainCell = (props) => { const trackerHint = getHintElement({ className: privacyIconClass, tooltipClass: 'pt-4 pb-5 px-5 mw-75', - dataTip: true, xlinkHref: 'privacy', contentItemClass: 'key-colon', renderContent, diff --git a/client/src/components/Logs/Cells/getHintElement.js b/client/src/components/Logs/Cells/getHintElement.js index ad38fe2d..dcb5fed1 100644 --- a/client/src/components/Logs/Cells/getHintElement.js +++ b/client/src/components/Logs/Cells/getHintElement.js @@ -1,55 +1,50 @@ -import React, { useState } from 'react'; +import React from 'react'; import PropTypes from 'prop-types'; -import CustomTooltip from '../Tooltip/CustomTooltip'; +import TooltipTrigger from 'react-popper-tooltip'; +import { Trans } from 'react-i18next'; +import classNames from 'classnames'; +import './Tooltip.css'; +import 'react-popper-tooltip/dist/styles.css'; +import { HIDE_TOOLTIP_DELAY } from '../../../helpers/constants'; const getHintElement = ({ className, contentItemClass, columnClass, - dataTip, + canShowTooltip = true, xlinkHref, - content, title, - place, + placement, tooltipClass, - trigger, - overridePosition, - scrollHide, - renderContent, -}) => { - const id = 'id'; - - const [isHovered, hover] = useState(false); - - const openTooltip = () => hover(true); - const closeTooltip = () => hover(false); - - return
-
+ {item || '—'} +
, + ), +}) =>
+ {title &&
+ {title} +
} +
{renderContent}
+
+ }>{({ + getTriggerProps, triggerRef, + }) => {xlinkHref && } -
- {isHovered && dataTip - && } -
; -}; + } + ; getHintElement.propTypes = { className: PropTypes.string, @@ -57,15 +52,9 @@ getHintElement.propTypes = { columnClass: PropTypes.string, tooltipClass: PropTypes.string, title: PropTypes.string, - place: PropTypes.string, - dataTip: PropTypes.string, + placement: PropTypes.string, + canShowTooltip: PropTypes.string, xlinkHref: PropTypes.string, - overridePosition: PropTypes.func, - scrollHide: PropTypes.bool, - trigger: PropTypes.oneOfType([ - PropTypes.string, - PropTypes.arrayOf(PropTypes.string), - ]), content: PropTypes.oneOfType([ PropTypes.string, PropTypes.array, diff --git a/client/src/components/Logs/Cells/getResponseCell.js b/client/src/components/Logs/Cells/getResponseCell.js index f7fec2cf..cbfbb639 100644 --- a/client/src/components/Logs/Cells/getResponseCell.js +++ b/client/src/components/Logs/Cells/getResponseCell.js @@ -48,7 +48,7 @@ const getResponseCell = (row, filtering, t, isDetailed) => { return
{responseArr.map((response) => { const className = classNames('white-space--nowrap', { - 'white-space--normal': response.length > 100, + 'overflow-break': response.length > 100, }); return
{`${response}\n`}
; @@ -71,6 +71,13 @@ const getResponseCell = (row, filtering, t, isDetailed) => { rule_label: rule, 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, @@ -102,11 +109,10 @@ const getResponseCell = (row, filtering, t, isDetailed) => { columnClass: 'grid grid--limited', tooltipClass: 'px-5 pb-5 pt-4 mw-75 custom-tooltip__response-details', contentItemClass: 'text-truncate key-colon o-hidden', - dataTip: true, xlinkHref: 'question', title: 'response_details', content: fields, - place: 'bottom', + placement: 'bottom', })}
{statusLabel}
diff --git a/client/src/components/Logs/Logs.css b/client/src/components/Logs/Logs.css index 35bdd0b0..abdf9611 100644 --- a/client/src/components/Logs/Logs.css +++ b/client/src/components/Logs/Logs.css @@ -557,20 +557,3 @@ .loading__text { transform: translateY(3rem); } - -/*reset position to make absolute position of tooltip on tablets, may cause problems https://github.com/wwayne/react-tooltip/issues/204*/ -@media (hover: none) { - .logs__action { - top: 1rem !important; - right: 1rem; - } - - .logs__table .rt-td, - .clients__table .rt-td { - position: initial; - } - - .logs__row { - position: initial; - } -} diff --git a/client/src/components/Logs/Tooltip/CustomTooltip.js b/client/src/components/Logs/Tooltip/CustomTooltip.js deleted file mode 100644 index 1a0cf64f..00000000 --- a/client/src/components/Logs/Tooltip/CustomTooltip.js +++ /dev/null @@ -1,44 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { Trans } from 'react-i18next'; -import classNames from 'classnames'; -import Tooltip from './index'; - -const CustomTooltip = ({ - id, title, className, contentItemClass, place = 'right', columnClass = '', content, trigger, overridePosition, scrollHide, - renderContent = React.Children.map( - content, - (item, idx) =>
- {item || '—'} -
, - ), -}) => - {title - &&
{title}
} -
{renderContent}
- ; - -CustomTooltip.propTypes = { - id: PropTypes.string.isRequired, - title: PropTypes.string, - place: PropTypes.string, - className: PropTypes.string, - columnClass: PropTypes.string, - contentItemClass: PropTypes.string, - overridePosition: PropTypes.func, - scrollHide: PropTypes.bool, - content: PropTypes.oneOfType([ - PropTypes.string, - PropTypes.array, - ]), - trigger: PropTypes.oneOfType([ - PropTypes.string, - PropTypes.arrayOf(PropTypes.string), - ]), - renderContent: PropTypes.arrayOf(PropTypes.element), -}; - -export default CustomTooltip; diff --git a/client/src/components/Logs/Tooltip/index.js b/client/src/components/Logs/Tooltip/index.js deleted file mode 100644 index 6844249a..00000000 --- a/client/src/components/Logs/Tooltip/index.js +++ /dev/null @@ -1,48 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import ReactTooltip from 'react-tooltip'; -import classNames from 'classnames'; -import './ReactTooltip.css'; -import { touchMediaQuery } from '../../../helpers/constants'; - -const Tooltip = ({ - id, children, className = '', place = 'right', trigger = 'hover', overridePosition, scrollHide = true, -}) => { - const tooltipClassName = classNames('custom-tooltip', className); - - return ( - - {children} - - ); -}; - -Tooltip.propTypes = { - id: PropTypes.string.isRequired, - children: PropTypes.node.isRequired, - className: PropTypes.string, - place: PropTypes.string, - overridePosition: PropTypes.func, - scrollHide: PropTypes.bool, - trigger: PropTypes.oneOfType([ - PropTypes.string, - PropTypes.arrayOf(PropTypes.string), - ]), -}; - -export default Tooltip; diff --git a/client/src/helpers/constants.js b/client/src/helpers/constants.js index 4778b085..a58d7529 100644 --- a/client/src/helpers/constants.js +++ b/client/src/helpers/constants.js @@ -57,6 +57,7 @@ export const DEBOUNCE_FILTER_TIMEOUT = 500; export const CHECK_TIMEOUT = 1000; export const SUCCESS_TOAST_TIMEOUT = 5000; export const FAILURE_TOAST_TIMEOUT = 30000; +export const HIDE_TOOLTIP_DELAY = 300; export const UNSAFE_PORTS = [ 1, @@ -503,5 +504,3 @@ export const FORM_NAME = { }; export const smallScreenSize = 767; - -export const touchMediaQuery = '(hover: none)'; diff --git a/client/src/helpers/formatClientCell.js b/client/src/helpers/formatClientCell.js index 2c2d4b5a..22dbd26d 100644 --- a/client/src/helpers/formatClientCell.js +++ b/client/src/helpers/formatClientCell.js @@ -25,19 +25,18 @@ const getFormattedWhois = (whois, t) => { }; export const formatClientCell = (row, t, isDetailed = false) => { - const { info, client } = row.original; + const { value, original: { info } } = row; let whoisContainer = ''; - let nameContainer = client; + let nameContainer = value; if (info) { const { name, whois_info } = info; if (name) { - nameContainer = isDetailed ? {client} - :
- {name} - {`(${client})`} + nameContainer = isDetailed + ? {value} + :
+ {name}{`(${value})`}
; } @@ -51,7 +50,7 @@ export const formatClientCell = (row, t, isDetailed = false) => { } return ( -
+
<> {nameContainer} {whoisContainer} From 2c47053cfe127e2a2b98160e1528dfcc0f8db445 Mon Sep 17 00:00:00 2001 From: Simon Zolin Date: Fri, 19 Jun 2020 14:27:23 +0300 Subject: [PATCH 3/3] - autohosts: fix crash on startup if filesystem watcher couldn't be initialized Close #1814 Squashed commit of the following: commit ba17a5b3c61a8a5282beb0cca470e2302e83c0d6 Author: Simon Zolin Date: Fri Jun 19 10:08:44 2020 +0300 - autohosts: fix crash on startup if filesystem watcher couldn't be initialized --- util/auto_hosts.go | 24 ++++++++++++++---------- 1 file changed, 14 insertions(+), 10 deletions(-) diff --git a/util/auto_hosts.go b/util/auto_hosts.go index f36ee1e7..34a979da 100644 --- a/util/auto_hosts.go +++ b/util/auto_hosts.go @@ -76,17 +76,19 @@ func (a *AutoHosts) Start() { go a.updateLoop() a.updateChan <- true - go a.watcherLoop() + if a.watcher != nil { + go a.watcherLoop() - err := a.watcher.Add(a.hostsFn) - if err != nil { - log.Error("Error while initializing watcher for a file %s: %s", a.hostsFn, err) - } - - for _, dir := range a.hostsDirs { - err = a.watcher.Add(dir) + err := a.watcher.Add(a.hostsFn) if err != nil { - log.Error("Error while initializing watcher for a directory %s: %s", dir, err) + log.Error("Error while initializing watcher for a file %s: %s", a.hostsFn, err) + } + + for _, dir := range a.hostsDirs { + err = a.watcher.Add(dir) + if err != nil { + log.Error("Error while initializing watcher for a directory %s: %s", dir, err) + } } } } @@ -95,7 +97,9 @@ func (a *AutoHosts) Start() { func (a *AutoHosts) Close() { a.updateChan <- false close(a.updateChan) - _ = a.watcher.Close() + if a.watcher != nil { + _ = a.watcher.Close() + } } // update table