diff --git a/client/babel.config.js b/client/babel.config.js index 55609d5e..c6fdd790 100644 --- a/client/babel.config.js +++ b/client/babel.config.js @@ -9,6 +9,8 @@ module.exports = (api) => { '@babel/plugin-proposal-class-properties', '@babel/plugin-transform-runtime', '@babel/plugin-proposal-object-rest-spread', + '@babel/plugin-proposal-nullish-coalescing-operator', + '@babel/plugin-proposal-optional-chaining', ], }; }; diff --git a/client/package-lock.json b/client/package-lock.json index 91b1f414..faaa5598 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -472,13 +472,21 @@ } }, "@babel/plugin-proposal-nullish-coalescing-operator": { - "version": "7.8.3", - "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-nullish-coalescing-operator/-/plugin-proposal-nullish-coalescing-operator-7.8.3.tgz", - "integrity": "sha512-TS9MlfzXpXKt6YYomudb/KU7nQI6/xnapG6in1uZxoxDghuSMZsPb6D2fyUwNYSAp4l1iR7QtFOjkqcRYcUsfw==", + "version": "7.10.4", + "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-nullish-coalescing-operator/-/plugin-proposal-nullish-coalescing-operator-7.10.4.tgz", + "integrity": "sha512-wq5n1M3ZUlHl9sqT2ok1T2/MTt6AXE0e1Lz4WzWBr95LsAZ5qDXe4KnFuauYyEyLiohvXFMdbsOTMyLZs91Zlw==", "dev": true, "requires": { - "@babel/helper-plugin-utils": "^7.8.3", + "@babel/helper-plugin-utils": "^7.10.4", "@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.0" + }, + "dependencies": { + "@babel/helper-plugin-utils": { + "version": "7.10.4", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.4.tgz", + "integrity": "sha512-O4KCvQA6lLiMU9l2eawBPMf1xPP8xPfB3iEQw150hOVTqj/rfXz0ThTb4HEzqQfs2Bmo5Ay8BzxfzVtBrr9dVg==", + "dev": true + } } }, "@babel/plugin-proposal-numeric-separator": { @@ -513,13 +521,21 @@ } }, "@babel/plugin-proposal-optional-chaining": { - "version": "7.9.0", - "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.9.0.tgz", - "integrity": "sha512-NDn5tu3tcv4W30jNhmc2hyD5c56G6cXx4TesJubhxrJeCvuuMpttxr0OnNCqbZGhFjLrg+NIhxxC+BK5F6yS3w==", + "version": "7.10.4", + "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.10.4.tgz", + "integrity": "sha512-ZIhQIEeavTgouyMSdZRap4VPPHqJJ3NEs2cuHs5p0erH+iz6khB0qfgU8g7UuJkG88+fBMy23ZiU+nuHvekJeQ==", "dev": true, "requires": { - "@babel/helper-plugin-utils": "^7.8.3", + "@babel/helper-plugin-utils": "^7.10.4", "@babel/plugin-syntax-optional-chaining": "^7.8.0" + }, + "dependencies": { + "@babel/helper-plugin-utils": { + "version": "7.10.4", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.4.tgz", + "integrity": "sha512-O4KCvQA6lLiMU9l2eawBPMf1xPP8xPfB3iEQw150hOVTqj/rfXz0ThTb4HEzqQfs2Bmo5Ay8BzxfzVtBrr9dVg==", + "dev": true + } } }, "@babel/plugin-proposal-unicode-property-regex": { diff --git a/client/package.json b/client/package.json index 7f154d4d..edf5e424 100644 --- a/client/package.json +++ b/client/package.json @@ -44,7 +44,9 @@ "devDependencies": { "@babel/core": "^7.9.6", "@babel/plugin-proposal-class-properties": "^7.8.3", + "@babel/plugin-proposal-nullish-coalescing-operator": "^7.10.4", "@babel/plugin-proposal-object-rest-spread": "^7.9.6", + "@babel/plugin-proposal-optional-chaining": "^7.10.4", "@babel/plugin-transform-runtime": "^7.9.6", "@babel/preset-env": "^7.9.6", "@babel/preset-react": "^7.9.4", diff --git a/client/src/actions/index.js b/client/src/actions/index.js index 478a3021..2cef57e6 100644 --- a/client/src/actions/index.js +++ b/client/src/actions/index.js @@ -149,7 +149,7 @@ const checkStatus = async (handleRequestSuccess, handleRequestError, attempts = try { const response = await axios.get('control/status'); rmTimeout(timeout); - if (response && response.status === 200) { + if (response?.status === 200) { handleRequestSuccess(response); if (response.data.running === false) { timeout = setTimeout( @@ -183,7 +183,7 @@ export const getUpdate = () => async (dispatch, getState) => { }; const handleRequestSuccess = (response) => { - const responseVersion = response.data && response.data.version; + const responseVersion = response.data?.version; if (dnsVersion !== responseVersion) { dispatch(getUpdateSuccess()); diff --git a/client/src/components/Filters/Services/index.js b/client/src/components/Filters/Services/index.js index 1830be38..e1c9d840 100644 --- a/client/src/components/Filters/Services/index.js +++ b/client/src/components/Filters/Services/index.js @@ -17,7 +17,7 @@ const getInitialDataForServices = (initial) => (initial ? initial.reduce( const Services = () => { const [t] = useTranslation(); const dispatch = useDispatch(); - const services = useSelector((store) => store && store.services); + const services = useSelector((store) => store?.services); useEffect(() => { dispatch(getBlockedServices()); diff --git a/client/src/components/Logs/Cells/getClientCell.js b/client/src/components/Logs/Cells/getClientCell.js index b842e0e6..147dd3af 100644 --- a/client/src/components/Logs/Cells/getClientCell.js +++ b/client/src/components/Logs/Cells/getClientCell.js @@ -11,23 +11,20 @@ const getClientCell = ({ row, t, isDetailed, toggleBlocking, autoClients, processingRules, }) => { const { - reason, client, domain, info: { name }, + reason, client, domain, info: { name, whois_info }, } = row.original; const autoClient = autoClients.find((autoClient) => autoClient.name === client); - const country = autoClient && autoClient.whois_info && autoClient.whois_info.country; - const city = autoClient && autoClient.whois_info && autoClient.whois_info.city; - const network = autoClient && autoClient.whois_info && autoClient.whois_info.orgname; - const source = autoClient && autoClient.source; + const source = autoClient?.source; const id = nanoid(); const data = { address: client, name, - country, - city, - network, + country: whois_info?.country, + city: whois_info?.city, + network: whois_info?.orgname, source_label: source, }; diff --git a/client/src/components/Logs/Cells/getDomainCell.js b/client/src/components/Logs/Cells/getDomainCell.js index 0d460190..bff36c37 100644 --- a/client/src/components/Logs/Cells/getDomainCell.js +++ b/client/src/components/Logs/Cells/getDomainCell.js @@ -57,8 +57,8 @@ const getDomainCell = (props) => { const sourceData = getSourceData(tracker); const knownTrackerDataObj = { - name_table_header: tracker && tracker.name, - category_label: tracker && captitalizeWords(tracker.category), + name_table_header: tracker?.name, + category_label: hasTracker && captitalizeWords(tracker.category), source_label: sourceData && {sourceData.name}, diff --git a/client/src/components/Logs/Cells/getResponseCell.js b/client/src/components/Logs/Cells/getResponseCell.js index f0b390c3..73cd1d2b 100644 --- a/client/src/components/Logs/Cells/getResponseCell.js +++ b/client/src/components/Logs/Cells/getResponseCell.js @@ -36,8 +36,7 @@ const getResponseCell = (row, filtering, t, isDetailed) => { const { filters, whitelistFilters } = filtering; const formattedElapsedMs = formatElapsedMs(elapsedMs, t); - const statusLabel = t((FILTERED_STATUS_TO_META_MAP[reason] - && FILTERED_STATUS_TO_META_MAP[reason].label) || reason); + const statusLabel = t(FILTERED_STATUS_TO_META_MAP[reason]?.label || reason); const boldStatusLabel = {statusLabel}; const filter = getFilterName(filters, whitelistFilters, filterId, t); diff --git a/client/src/components/Logs/Filters/Form.js b/client/src/components/Logs/Filters/Form.js index df0bc483..21e64322 100644 --- a/client/src/components/Logs/Filters/Form.js +++ b/client/src/components/Logs/Filters/Form.js @@ -1,10 +1,18 @@ -import React from 'react'; +import React, { useEffect } from 'react'; import PropTypes from 'prop-types'; import { Field, reduxForm } from 'redux-form'; import { useTranslation } from 'react-i18next'; import debounce from 'lodash/debounce'; -import { DEBOUNCE_FILTER_TIMEOUT, FORM_NAME, RESPONSE_FILTER } from '../../../helpers/constants'; +import { useDispatch } from 'react-redux'; +import classNames from 'classnames'; +import { + DEBOUNCE_FILTER_TIMEOUT, + DEFAULT_LOGS_FILTER, + FORM_NAME, + RESPONSE_FILTER, +} from '../../../helpers/constants'; import Tooltip from '../../ui/Tooltip'; +import { setLogsFilter } from '../../../actions/queryLogs'; const renderFilterField = ({ input, @@ -16,8 +24,9 @@ const renderFilterField = ({ autoComplete, tooltip, meta: { touched, error }, + onClearInputClick, }) => <> -