+ client: Move the client access check to the server-side
Squashed commit of the following: commit 1aab0f62e94ce665a1b996552fac41dc4e769b4d Merge: cdf5eb6ec1f5fdaeAuthor: ArtemBaskal <a.baskal@adguard.com> Date: Thu Sep 24 15:36:05 2020 +0300 Merge branch '1920-client-find' into feature/1925 commit cdf5eb6ea67a665d21a3155d8cf89bba9a5a9948 Merge: b6c20b1c10f67bd3Author: ArtemBaskal <a.baskal@adguard.com> Date: Wed Sep 23 20:28:51 2020 +0300 Merge branch 'master' into feature/1925 commit b6c20b1c7359a0e5902405b0551712f936848a80 Merge: 97d388ef96512433Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue Sep 15 10:44:25 2020 +0300 Merge branch 'master' into feature/1925 commit 97d388ef6571d590f21da00f86d889e881ca0c3d Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue Sep 15 10:30:50 2020 +0300 Extract buttons commit ca45fde11fc2b2812ff2b84dbd67aff0b5341be1 Author: ArtemBaskal <a.baskal@adguard.com> Date: Thu Sep 10 12:46:09 2020 +0300 Handle errors in updateLogs commit f15e03c2e5a7115db984f70f72b0ddd870ece73d Author: ArtemBaskal <a.baskal@adguard.com> Date: Thu Sep 10 12:39:34 2020 +0300 Update mobile block status on click commit 033b28db3b324f6d529ac1a0ef657886cdbe02bd Author: ArtemBaskal <a.baskal@adguard.com> Date: Wed Sep 9 20:53:42 2020 +0300 Fix mobile block buttons, auto open page on web serve start commit 2730937b23309167a066b9154728ac53ffe81a49 Author: ArtemBaskal <a.baskal@adguard.com> Date: Wed Sep 9 13:58:37 2020 +0300 Disable allow this client button when isNotInAllowedList is true commit 818cf869d63654c184762ad2701c4429a3e3011e Author: ArtemBaskal <a.baskal@adguard.com> Date: Wed Sep 9 13:06:01 2020 +0300 Update client block state on option click commit a072b8983757f419645c0207ea78e6e867c440cb Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue Sep 8 20:17:16 2020 +0300 Adapt to api changes commit 28ab2bd8b3f14f60bc822b5a69fa1801db67d816 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue Sep 8 14:12:20 2020 +0300 Change query log block confirm messages commit 9b0b6f6f9b1ec168fa71dbedd036152da59006e3 Author: ArtemBaskal <a.baskal@adguard.com> Date: Tue Sep 8 12:00:46 2020 +0300 Refactor inner work with disallowed commit 05f76154b8f489738d032fdaa835edb371ce70c7 Author: ArtemBaskal <a.baskal@adguard.com> Date: Mon Sep 7 16:11:37 2020 +0300 + client: Move the client access check to the server-side
This commit is contained in:
Artem Baskal
parent
c1f5fdaee4
commit
c72cd58f69
@ -582,5 +582,6 @@
|
||||
"click_to_view_queries": "Click to view queries",
|
||||
"port_53_faq_link": "Port 53 is often occupied by \"DNSStubListener\" or \"systemd-resolved\" services. Please read <0>this instruction</0> on how to resolve this.",
|
||||
"adg_will_drop_dns_queries": "AdGuard Home will be dropping all DNS queries from this client.",
|
||||
"client_not_in_allowed_clients": "The client is not allowed because it is not in the \"Allowed clients\" list.",
|
||||
"experimental": "Experimental"
|
||||
}
|
||||
|
||||
@ -1,136 +1,5 @@
|
||||
import {
|
||||
countClientsStatistics, findAddressType, getIpMatchListStatus, sortIp,
|
||||
} from '../helpers/helpers';
|
||||
import { ADDRESS_TYPES, IP_MATCH_LIST_STATUS } from '../helpers/constants';
|
||||
|
||||
describe('getIpMatchListStatus', () => {
|
||||
describe('IPv4', () => {
|
||||
test('should return EXACT on find the exact ip match', () => {
|
||||
const list = `127.0.0.2
|
||||
2001:db8:11a3:9d7:0:0:0:0
|
||||
192.168.0.1/8
|
||||
127.0.0.1
|
||||
127.0.0.3`;
|
||||
expect(getIpMatchListStatus('127.0.0.1', list))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.EXACT);
|
||||
});
|
||||
|
||||
test('should return CIDR on find the cidr match', () => {
|
||||
const list = `127.0.0.2
|
||||
2001:db8:11a3:9d7:0:0:0:0
|
||||
192.168.0.1/8
|
||||
127.0.0.0/24
|
||||
127.0.0.3`;
|
||||
expect(getIpMatchListStatus('127.0.0.1', list))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.CIDR);
|
||||
});
|
||||
|
||||
test('should return NOT_FOUND if the ip is not in the list', () => {
|
||||
const list = `127.0.0.1
|
||||
2001:db8:11a3:9d7:0:0:0:0
|
||||
192.168.0.1/8
|
||||
127.0.0.2
|
||||
127.0.0.3`;
|
||||
expect(getIpMatchListStatus('127.0.0.4', list))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.NOT_FOUND);
|
||||
});
|
||||
|
||||
test('should return the first EXACT or CIDR match in the list', () => {
|
||||
const list1 = `2001:db8:11a3:9d7:0:0:0:0
|
||||
127.0.0.1
|
||||
127.0.0.8/24
|
||||
127.0.0.3`;
|
||||
expect(getIpMatchListStatus('127.0.0.1', list1))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.EXACT);
|
||||
|
||||
const list2 = `2001:db8:11a3:9d7:ffff:ffff:ffff:ffff
|
||||
2001:0db8:11a3:09d7:0000:0000:0000:0000/64
|
||||
127.0.0.0/24
|
||||
127.0.0.1
|
||||
127.0.0.8/24
|
||||
127.0.0.3`;
|
||||
expect(getIpMatchListStatus('127.0.0.1', list2))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.CIDR);
|
||||
});
|
||||
});
|
||||
|
||||
describe('IPv6', () => {
|
||||
test('should return EXACT on find the exact ip match', () => {
|
||||
const list = `127.0.0.0
|
||||
2001:db8:11a3:9d7:0:0:0:0
|
||||
2001:db8:11a3:9d7:ffff:ffff:ffff:ffff
|
||||
127.0.0.1`;
|
||||
expect(getIpMatchListStatus('2001:db8:11a3:9d7:0:0:0:0', list))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.EXACT);
|
||||
});
|
||||
|
||||
test('should return EXACT on find the exact ip match of short and long notation', () => {
|
||||
const list = `127.0.0.0
|
||||
192.168.0.1/8
|
||||
2001:db8::
|
||||
127.0.0.2`;
|
||||
expect(getIpMatchListStatus('2001:db8:0:0:0:0:0:0', list))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.EXACT);
|
||||
});
|
||||
|
||||
test('should return CIDR on find the cidr match', () => {
|
||||
const list1 = `2001:0db8:11a3:09d7:0000:0000:0000:0000/64
|
||||
127.0.0.1
|
||||
127.0.0.2`;
|
||||
expect(getIpMatchListStatus('2001:db8:11a3:9d7:0:0:0:0', list1))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.CIDR);
|
||||
|
||||
const list2 = `2001:0db8::/16
|
||||
127.0.0.0
|
||||
2001:db8:11a3:9d7:0:0:0:0
|
||||
2001:db8::
|
||||
2001:db8:11a3:9d7:ffff:ffff:ffff:ffff
|
||||
127.0.0.1`;
|
||||
expect(getIpMatchListStatus('2001:db1::', list2))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.CIDR);
|
||||
});
|
||||
|
||||
test('should return NOT_FOUND if the ip is not in the list', () => {
|
||||
const list = `2001:db8:11a3:9d7:0:0:0:0
|
||||
2001:0db8:11a3:09d7:0000:0000:0000:0000/64
|
||||
127.0.0.1
|
||||
127.0.0.2`;
|
||||
expect(getIpMatchListStatus('::', list))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.NOT_FOUND);
|
||||
});
|
||||
|
||||
test('should return the first EXACT or CIDR match in the list', () => {
|
||||
const list1 = `2001:db8:11a3:9d7:0:0:0:0
|
||||
2001:0db8:11a3:09d7:0000:0000:0000:0000/64
|
||||
127.0.0.3`;
|
||||
expect(getIpMatchListStatus('2001:db8:11a3:9d7:0:0:0:0', list1))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.EXACT);
|
||||
|
||||
const list2 = `2001:0db8:11a3:09d7:0000:0000:0000:0000/64
|
||||
2001:db8:11a3:9d7:0:0:0:0
|
||||
127.0.0.3`;
|
||||
expect(getIpMatchListStatus('2001:db8:11a3:9d7:0:0:0:0', list2))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.CIDR);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Empty list or IP', () => {
|
||||
test('should return NOT_FOUND on empty ip', () => {
|
||||
const list = `127.0.0.0
|
||||
2001:db8:11a3:9d7:0:0:0:0
|
||||
2001:db8:11a3:9d7:ffff:ffff:ffff:ffff
|
||||
127.0.0.1`;
|
||||
expect(getIpMatchListStatus('', list))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.NOT_FOUND);
|
||||
});
|
||||
|
||||
test('should return NOT_FOUND on empty list', () => {
|
||||
const list = '';
|
||||
expect(getIpMatchListStatus('127.0.0.1', list))
|
||||
.toEqual(IP_MATCH_LIST_STATUS.NOT_FOUND);
|
||||
});
|
||||
});
|
||||
});
|
||||
import { sortIp, countClientsStatistics, findAddressType } from '../helpers/helpers';
|
||||
import { ADDRESS_TYPES } from '../helpers/constants';
|
||||
|
||||
describe('sortIp', () => {
|
||||
describe('ipv4', () => {
|
||||
|
||||
@ -3,7 +3,6 @@ import i18next from 'i18next';
|
||||
|
||||
import apiClient from '../api/Api';
|
||||
import { addErrorToast, addSuccessToast } from './toasts';
|
||||
import { BLOCK_ACTIONS } from '../helpers/constants';
|
||||
import { splitByNewLine } from '../helpers/helpers';
|
||||
|
||||
export const getAccessListRequest = createAction('GET_ACCESS_LIST_REQUEST');
|
||||
@ -49,19 +48,16 @@ export const toggleClientBlockRequest = createAction('TOGGLE_CLIENT_BLOCK_REQUES
|
||||
export const toggleClientBlockFailure = createAction('TOGGLE_CLIENT_BLOCK_FAILURE');
|
||||
export const toggleClientBlockSuccess = createAction('TOGGLE_CLIENT_BLOCK_SUCCESS');
|
||||
|
||||
export const toggleClientBlock = (type, ip) => async (dispatch) => {
|
||||
export const toggleClientBlock = (ip, disallowed, disallowed_rule) => async (dispatch) => {
|
||||
dispatch(toggleClientBlockRequest());
|
||||
try {
|
||||
const {
|
||||
allowed_clients, disallowed_clients, blocked_hosts,
|
||||
allowed_clients, blocked_hosts, disallowed_clients = [],
|
||||
} = await apiClient.getAccessList();
|
||||
let updatedDisallowedClients = disallowed_clients || [];
|
||||
|
||||
if (type === BLOCK_ACTIONS.UNBLOCK && updatedDisallowedClients.includes(ip)) {
|
||||
updatedDisallowedClients = updatedDisallowedClients.filter((client) => client !== ip);
|
||||
} else if (type === BLOCK_ACTIONS.BLOCK && !updatedDisallowedClients.includes(ip)) {
|
||||
updatedDisallowedClients.push(ip);
|
||||
}
|
||||
const updatedDisallowedClients = disallowed
|
||||
? disallowed_clients.filter((client) => client !== disallowed_rule)
|
||||
: disallowed_clients.concat(ip);
|
||||
|
||||
const values = {
|
||||
allowed_clients,
|
||||
@ -72,9 +68,9 @@ export const toggleClientBlock = (type, ip) => async (dispatch) => {
|
||||
await apiClient.setAccessList(values);
|
||||
dispatch(toggleClientBlockSuccess(values));
|
||||
|
||||
if (type === BLOCK_ACTIONS.UNBLOCK) {
|
||||
dispatch(addSuccessToast(i18next.t('client_unblocked', { ip })));
|
||||
} else if (type === BLOCK_ACTIONS.BLOCK) {
|
||||
if (disallowed) {
|
||||
dispatch(addSuccessToast(i18next.t('client_unblocked', { ip: disallowed_rule })));
|
||||
} else {
|
||||
dispatch(addSuccessToast(i18next.t('client_blocked', { ip })));
|
||||
}
|
||||
} catch (error) {
|
||||
|
||||
@ -7,6 +7,17 @@ import {
|
||||
} from '../helpers/constants';
|
||||
import { addErrorToast, addSuccessToast } from './toasts';
|
||||
|
||||
const enrichWithClientInfo = async (logs) => {
|
||||
const clientsParams = getParamsForClientsSearch(logs, 'client');
|
||||
|
||||
if (Object.keys(clientsParams).length > 0) {
|
||||
const clients = await apiClient.findClients(clientsParams);
|
||||
return addClientInfo(logs, clients, 'client');
|
||||
}
|
||||
|
||||
return logs;
|
||||
};
|
||||
|
||||
const getLogsWithParams = async (config) => {
|
||||
const { older_than, filter, ...values } = config;
|
||||
const rawLogs = await apiClient.getQueryLog({
|
||||
@ -14,13 +25,8 @@ const getLogsWithParams = async (config) => {
|
||||
older_than,
|
||||
});
|
||||
const { data, oldest } = rawLogs;
|
||||
let logs = normalizeLogs(data);
|
||||
const clientsParams = getParamsForClientsSearch(logs, 'client');
|
||||
|
||||
if (Object.keys(clientsParams).length > 0) {
|
||||
const clients = await apiClient.findClients(clientsParams);
|
||||
logs = addClientInfo(logs, clients, 'client');
|
||||
}
|
||||
const normalizedLogs = normalizeLogs(data);
|
||||
const logs = await enrichWithClientInfo(normalizedLogs);
|
||||
|
||||
return {
|
||||
logs,
|
||||
@ -82,6 +88,23 @@ export const getLogsRequest = createAction('GET_LOGS_REQUEST');
|
||||
export const getLogsFailure = createAction('GET_LOGS_FAILURE');
|
||||
export const getLogsSuccess = createAction('GET_LOGS_SUCCESS');
|
||||
|
||||
export const updateLogs = () => async (dispatch, getState) => {
|
||||
try {
|
||||
const { logs, oldest, older_than } = getState().queryLogs;
|
||||
|
||||
const enrichedLogs = await enrichWithClientInfo(logs);
|
||||
|
||||
dispatch(getLogsSuccess({
|
||||
logs: enrichedLogs,
|
||||
oldest,
|
||||
older_than,
|
||||
}));
|
||||
} catch (error) {
|
||||
dispatch(addErrorToast({ error }));
|
||||
dispatch(getLogsFailure(error));
|
||||
}
|
||||
};
|
||||
|
||||
export const getLogs = () => async (dispatch, getState) => {
|
||||
dispatch(getLogsRequest());
|
||||
try {
|
||||
|
||||
@ -8,10 +8,11 @@ import classNames from 'classnames';
|
||||
import Card from '../ui/Card';
|
||||
import Cell from '../ui/Cell';
|
||||
|
||||
import { getPercent, getIpMatchListStatus, sortIp } from '../../helpers/helpers';
|
||||
import { BLOCK_ACTIONS, IP_MATCH_LIST_STATUS, STATUS_COLORS } from '../../helpers/constants';
|
||||
import { getPercent, sortIp } from '../../helpers/helpers';
|
||||
import { BLOCK_ACTIONS, STATUS_COLORS } from '../../helpers/constants';
|
||||
import { toggleClientBlock } from '../../actions/access';
|
||||
import { renderFormattedClientCell } from '../../helpers/renderFormattedClientCell';
|
||||
import { getStats } from '../../actions/stats';
|
||||
|
||||
const getClientsPercentColor = (percent) => {
|
||||
if (percent > 50) {
|
||||
@ -33,59 +34,51 @@ const CountCell = (row) => {
|
||||
return <Cell value={value} percent={percent} color={percentColor} search={ip} />;
|
||||
};
|
||||
|
||||
const renderBlockingButton = (ip) => {
|
||||
const renderBlockingButton = (ip, disallowed, disallowed_rule) => {
|
||||
const dispatch = useDispatch();
|
||||
const { t } = useTranslation();
|
||||
const processingSet = useSelector((state) => state.access.processingSet);
|
||||
const disallowed_clients = useSelector(
|
||||
(state) => state.access.disallowed_clients, shallowEqual,
|
||||
);
|
||||
|
||||
const ipMatchListStatus = getIpMatchListStatus(ip, disallowed_clients);
|
||||
|
||||
if (ipMatchListStatus === IP_MATCH_LIST_STATUS.CIDR) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const isNotFound = ipMatchListStatus === IP_MATCH_LIST_STATUS.NOT_FOUND;
|
||||
const type = isNotFound ? BLOCK_ACTIONS.BLOCK : BLOCK_ACTIONS.UNBLOCK;
|
||||
const text = type;
|
||||
|
||||
const buttonClass = classNames('button-action button-action--main', {
|
||||
'button-action--unblock': !isNotFound,
|
||||
'button-action--unblock': disallowed,
|
||||
});
|
||||
|
||||
const toggleClientStatus = (type, ip) => {
|
||||
const confirmMessage = type === BLOCK_ACTIONS.BLOCK
|
||||
? `${t('adg_will_drop_dns_queries')} ${t('client_confirm_block', { ip })}`
|
||||
: t('client_confirm_unblock', { ip });
|
||||
const toggleClientStatus = async (ip, disallowed, disallowed_rule) => {
|
||||
const confirmMessage = disallowed
|
||||
? t('client_confirm_unblock', { ip: disallowed_rule })
|
||||
: `${t('adg_will_drop_dns_queries')} ${t('client_confirm_block', { ip })}`;
|
||||
|
||||
if (window.confirm(confirmMessage)) {
|
||||
dispatch(toggleClientBlock(type, ip));
|
||||
await dispatch(toggleClientBlock(ip, disallowed, disallowed_rule));
|
||||
await dispatch(getStats());
|
||||
}
|
||||
};
|
||||
|
||||
const onClick = () => toggleClientStatus(type, ip);
|
||||
const onClick = () => toggleClientStatus(ip, disallowed, disallowed_rule);
|
||||
|
||||
const text = disallowed ? BLOCK_ACTIONS.UNBLOCK : BLOCK_ACTIONS.BLOCK;
|
||||
|
||||
const isNotInAllowedList = disallowed && disallowed_rule === '';
|
||||
return <div className="table__action pl-4">
|
||||
<button
|
||||
type="button"
|
||||
className={buttonClass}
|
||||
onClick={onClick}
|
||||
disabled={processingSet}
|
||||
>
|
||||
<Trans>{text}</Trans>
|
||||
</button>
|
||||
</div>;
|
||||
<button
|
||||
type="button"
|
||||
className={buttonClass}
|
||||
onClick={isNotInAllowedList ? undefined : onClick}
|
||||
disabled={isNotInAllowedList || processingSet}
|
||||
title={t(isNotInAllowedList ? 'client_not_in_allowed_clients' : text)}
|
||||
>
|
||||
<Trans>{text}</Trans>
|
||||
</button>
|
||||
</div>;
|
||||
};
|
||||
|
||||
const ClientCell = (row) => {
|
||||
const { value, original: { info } } = row;
|
||||
const { value, original: { info, info: { disallowed, disallowed_rule } } } = row;
|
||||
|
||||
return <>
|
||||
<div className="logs__row logs__row--overflow logs__row--column d-flex align-items-center">
|
||||
{renderFormattedClientCell(value, info, true)}
|
||||
{renderBlockingButton(value)}
|
||||
{renderBlockingButton(value, disallowed, disallowed_rule)}
|
||||
</div>
|
||||
</>;
|
||||
};
|
||||
@ -96,7 +89,6 @@ const Clients = ({
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
const topClients = useSelector((state) => state.stats.topClients, shallowEqual);
|
||||
const disallowedClients = useSelector((state) => state.access.disallowed_clients, shallowEqual);
|
||||
|
||||
return <Card
|
||||
title={t('top_clients')}
|
||||
@ -138,9 +130,9 @@ const Clients = ({
|
||||
return {};
|
||||
}
|
||||
|
||||
const { ip } = rowInfo.original;
|
||||
const { info: { disallowed } } = rowInfo.original;
|
||||
|
||||
return getIpMatchListStatus(ip, disallowedClients) === IP_MATCH_LIST_STATUS.NOT_FOUND ? {} : { className: 'logs__row--red' };
|
||||
return disallowed ? { className: 'logs__row--red' } : {};
|
||||
}}
|
||||
/>
|
||||
</Card>;
|
||||
|
||||
@ -11,12 +11,16 @@ import IconTooltip from './IconTooltip';
|
||||
import { renderFormattedClientCell } from '../../../helpers/renderFormattedClientCell';
|
||||
import { toggleClientBlock } from '../../../actions/access';
|
||||
import { getBlockClientInfo } from './helpers';
|
||||
import { getStats } from '../../../actions/stats';
|
||||
import { updateLogs } from '../../../actions/queryLogs';
|
||||
|
||||
const ClientCell = ({
|
||||
client,
|
||||
domain,
|
||||
info,
|
||||
info: { name, whois_info },
|
||||
info: {
|
||||
name, whois_info, disallowed, disallowed_rule,
|
||||
},
|
||||
reason,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
@ -26,11 +30,6 @@ const ClientCell = ({
|
||||
const isDetailed = useSelector((state) => state.queryLogs.isDetailed);
|
||||
const [isOptionsOpened, setOptionsOpened] = useState(false);
|
||||
|
||||
const disallowed_clients = useSelector(
|
||||
(state) => state.access.disallowed_clients,
|
||||
shallowEqual,
|
||||
);
|
||||
|
||||
const autoClient = autoClients.find((autoClient) => autoClient.name === client);
|
||||
const source = autoClient?.source;
|
||||
const whoisAvailable = whois_info && Object.keys(whois_info).length > 0;
|
||||
@ -66,43 +65,50 @@ const ClientCell = ({
|
||||
const {
|
||||
confirmMessage,
|
||||
buttonKey: blockingClientKey,
|
||||
type,
|
||||
} = getBlockClientInfo(client, disallowed_clients);
|
||||
isNotInAllowedList,
|
||||
} = getBlockClientInfo(client, disallowed, disallowed_rule);
|
||||
|
||||
const blockingForClientKey = isFiltered ? 'unblock_for_this_client_only' : 'block_for_this_client_only';
|
||||
const clientNameBlockingFor = getBlockingClientName(clients, client);
|
||||
|
||||
const BUTTON_OPTIONS_TO_ACTION_MAP = {
|
||||
[blockingForClientKey]: () => {
|
||||
dispatch(toggleBlockingForClient(buttonType, domain, clientNameBlockingFor));
|
||||
const BUTTON_OPTIONS = [
|
||||
{
|
||||
name: blockingForClientKey,
|
||||
onClick: () => {
|
||||
dispatch(toggleBlockingForClient(buttonType, domain, clientNameBlockingFor));
|
||||
},
|
||||
},
|
||||
[blockingClientKey]: () => {
|
||||
const message = `${type === BLOCK_ACTIONS.BLOCK ? t('adg_will_drop_dns_queries') : ''} ${t(confirmMessage, { ip: client })}`;
|
||||
if (window.confirm(message)) {
|
||||
dispatch(toggleClientBlock(type, client));
|
||||
}
|
||||
{
|
||||
name: blockingClientKey,
|
||||
onClick: async () => {
|
||||
if (window.confirm(confirmMessage)) {
|
||||
await dispatch(toggleClientBlock(client, disallowed, disallowed_rule));
|
||||
await dispatch(updateLogs());
|
||||
}
|
||||
},
|
||||
disabled: isNotInAllowedList,
|
||||
},
|
||||
};
|
||||
];
|
||||
|
||||
const onClick = async () => {
|
||||
await dispatch(toggleBlocking(buttonType, domain));
|
||||
await dispatch(getStats());
|
||||
};
|
||||
|
||||
const getOptions = (optionToActionMap) => {
|
||||
const options = Object.entries(optionToActionMap);
|
||||
const getOptions = (options) => {
|
||||
if (options.length === 0) {
|
||||
return null;
|
||||
}
|
||||
return <>{options
|
||||
.map(([name, onClick]) => <div
|
||||
return <>{options.map(({ name, onClick, disabled }) => <button
|
||||
key={name}
|
||||
className="button-action--arrow-option px-4 py-2"
|
||||
onClick={onClick}
|
||||
disabled={disabled}
|
||||
>{t(name)}
|
||||
</div>)}</>;
|
||||
</button>)}</>;
|
||||
};
|
||||
|
||||
const content = getOptions(BUTTON_OPTIONS_TO_ACTION_MAP);
|
||||
const content = getOptions(BUTTON_OPTIONS);
|
||||
|
||||
const buttonClass = classNames('button-action button-action--main', {
|
||||
'button-action--unblock': isFiltered,
|
||||
@ -168,6 +174,8 @@ ClientCell.propTypes = {
|
||||
city: propTypes.string,
|
||||
orgname: propTypes.string,
|
||||
}),
|
||||
disallowed: propTypes.bool.isRequired,
|
||||
disallowed_rule: propTypes.string.isRequired,
|
||||
}),
|
||||
]),
|
||||
reason: propTypes.string.isRequired,
|
||||
|
||||
@ -1,19 +1,18 @@
|
||||
import { getIpMatchListStatus } from '../../../../helpers/helpers';
|
||||
import { BLOCK_ACTIONS, IP_MATCH_LIST_STATUS } from '../../../../helpers/constants';
|
||||
import i18next from 'i18next';
|
||||
|
||||
export const BUTTON_PREFIX = 'btn_';
|
||||
|
||||
export const getBlockClientInfo = (client, disallowed_clients) => {
|
||||
const ipMatchListStatus = getIpMatchListStatus(client, disallowed_clients);
|
||||
export const getBlockClientInfo = (ip, disallowed, disallowed_rule) => {
|
||||
const confirmMessage = disallowed
|
||||
? i18next.t('client_confirm_unblock', { ip: disallowed_rule })
|
||||
: `${i18next.t('adg_will_drop_dns_queries')} ${i18next.t('client_confirm_block', { ip })}`;
|
||||
|
||||
const isNotFound = ipMatchListStatus === IP_MATCH_LIST_STATUS.NOT_FOUND;
|
||||
const type = isNotFound ? BLOCK_ACTIONS.BLOCK : BLOCK_ACTIONS.UNBLOCK;
|
||||
const buttonKey = i18next.t(disallowed ? 'allow_this_client' : 'disallow_this_client');
|
||||
const isNotInAllowedList = disallowed && disallowed_rule === '';
|
||||
|
||||
const confirmMessage = isNotFound ? 'client_confirm_block' : 'client_confirm_unblock';
|
||||
const buttonKey = isNotFound ? 'disallow_this_client' : 'allow_this_client';
|
||||
return {
|
||||
confirmMessage,
|
||||
buttonKey,
|
||||
type,
|
||||
isNotInAllowedList,
|
||||
};
|
||||
};
|
||||
|
||||
@ -32,6 +32,7 @@ import ClientCell from './ClientCell';
|
||||
import '../Logs.css';
|
||||
import { toggleClientBlock } from '../../../actions/access';
|
||||
import { getBlockClientInfo, BUTTON_PREFIX } from './helpers';
|
||||
import { updateLogs } from '../../../actions/queryLogs';
|
||||
|
||||
const Row = memo(({
|
||||
style,
|
||||
@ -49,21 +50,19 @@ const Row = memo(({
|
||||
const whitelistFilters = useSelector((state) => state.filtering.whitelistFilters, shallowEqual);
|
||||
const autoClients = useSelector((state) => state.dashboard.autoClients, shallowEqual);
|
||||
|
||||
const disallowed_clients = useSelector(
|
||||
(state) => state.access.disallowed_clients,
|
||||
shallowEqual,
|
||||
);
|
||||
|
||||
const clients = useSelector((state) => state.dashboard.clients);
|
||||
|
||||
const onClick = () => {
|
||||
if (!isSmallScreen) { return; }
|
||||
if (!isSmallScreen) {
|
||||
return;
|
||||
}
|
||||
const {
|
||||
answer_dnssec,
|
||||
client,
|
||||
domain,
|
||||
elapsedMs,
|
||||
info,
|
||||
info: { disallowed, disallowed_rule },
|
||||
reason,
|
||||
response,
|
||||
time,
|
||||
@ -94,7 +93,7 @@ const Row = memo(({
|
||||
const isFiltered = checkFiltered(reason);
|
||||
|
||||
const isBlocked = reason === FILTERED_STATUS.FILTERED_BLACK_LIST
|
||||
|| reason === FILTERED_STATUS.FILTERED_BLOCKED_SERVICE;
|
||||
|| reason === FILTERED_STATUS.FILTERED_BLOCKED_SERVICE;
|
||||
|
||||
const buttonType = isFiltered ? BLOCK_ACTIONS.UNBLOCK : BLOCK_ACTIONS.BLOCK;
|
||||
const onToggleBlock = () => {
|
||||
@ -113,8 +112,8 @@ const Row = memo(({
|
||||
const {
|
||||
confirmMessage,
|
||||
buttonKey: blockingClientKey,
|
||||
type: blockType,
|
||||
} = getBlockClientInfo(client, disallowed_clients);
|
||||
isNotInAllowedList,
|
||||
} = getBlockClientInfo(client, disallowed, disallowed_rule);
|
||||
|
||||
const blockingForClientKey = isFiltered ? 'unblock_for_this_client_only' : 'block_for_this_client_only';
|
||||
const clientNameBlockingFor = getBlockingClientName(clients, client);
|
||||
@ -123,13 +122,33 @@ const Row = memo(({
|
||||
dispatch(toggleBlockingForClient(buttonType, domain, clientNameBlockingFor));
|
||||
};
|
||||
|
||||
const onBlockingClientClick = () => {
|
||||
const message = `${blockType === BLOCK_ACTIONS.BLOCK ? t('adg_will_drop_dns_queries') : ''} ${t(confirmMessage, { ip: client })}`;
|
||||
if (window.confirm(message)) {
|
||||
dispatch(toggleClientBlock(blockType, client));
|
||||
const onBlockingClientClick = async () => {
|
||||
if (window.confirm(confirmMessage)) {
|
||||
await dispatch(toggleClientBlock(client, disallowed, disallowed_rule));
|
||||
await dispatch(updateLogs());
|
||||
setModalOpened(false);
|
||||
}
|
||||
};
|
||||
|
||||
const blockButton = <button
|
||||
className={classNames('title--border text-center button-action--arrow-option', { 'bg--danger': !isBlocked })}
|
||||
onClick={onToggleBlock}>
|
||||
{t(buttonType)}
|
||||
</button>;
|
||||
|
||||
const blockForClientButton = <button
|
||||
className='text-center font-weight-bold py-2 button-action--arrow-option'
|
||||
onClick={onBlockingForClientClick}>
|
||||
{t(blockingForClientKey)}
|
||||
</button>;
|
||||
|
||||
const blockClientButton = <button
|
||||
className='text-center font-weight-bold py-2 button-action--arrow-option'
|
||||
onClick={onBlockingClientClick}
|
||||
disabled={isNotInAllowedList}>
|
||||
{t(blockingClientKey)}
|
||||
</button>;
|
||||
|
||||
const detailedData = {
|
||||
time_table_header: formatTime(time, LONG_TIME_FORMAT),
|
||||
date: formatDateTime(time, DEFAULT_SHORT_DATE_FORMAT_OPTIONS),
|
||||
@ -144,12 +163,12 @@ const Row = memo(({
|
||||
table_name: tracker?.name,
|
||||
category_label: hasTracker && captitalizeWords(tracker.category),
|
||||
tracker_source: hasTracker && sourceData
|
||||
&& <a
|
||||
href={sourceData.url}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="link--green">{sourceData.name}
|
||||
</a>,
|
||||
&& <a
|
||||
href={sourceData.url}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="link--green">{sourceData.name}
|
||||
</a>,
|
||||
response_details: 'title',
|
||||
install_settings_dns: upstream,
|
||||
elapsed: formattedElapsedMs,
|
||||
@ -166,12 +185,9 @@ const Row = memo(({
|
||||
source_label: source,
|
||||
validated_with_dnssec: dnssec_enabled ? Boolean(answer_dnssec) : false,
|
||||
original_response: originalResponse?.join('\n'),
|
||||
[BUTTON_PREFIX + buttonType]: <div onClick={onToggleBlock}
|
||||
className={classNames('title--border text-center', {
|
||||
'bg--danger': isBlocked,
|
||||
})}>{t(buttonType)}</div>,
|
||||
[BUTTON_PREFIX + blockingForClientKey]: <div onClick={onBlockingForClientClick} className='text-center font-weight-bold py-2'>{t(blockingForClientKey)}</div>,
|
||||
[BUTTON_PREFIX + blockingClientKey]: <div onClick={onBlockingClientClick} className='text-center font-weight-bold py-2'>{t(blockingClientKey)}</div>,
|
||||
[BUTTON_PREFIX + buttonType]: blockButton,
|
||||
[BUTTON_PREFIX + blockingForClientKey]: blockForClientButton,
|
||||
[BUTTON_PREFIX + blockingClientKey]: blockClientButton,
|
||||
};
|
||||
|
||||
setDetailedDataCurrent(processContent(detailedData));
|
||||
|
||||
@ -96,7 +96,7 @@
|
||||
}
|
||||
|
||||
.bg--danger {
|
||||
color: var(--danger);
|
||||
color: var(--danger) !important;
|
||||
}
|
||||
|
||||
.form-control--search {
|
||||
@ -293,7 +293,20 @@
|
||||
background: var(--btn-unblock-disabled);
|
||||
}
|
||||
|
||||
.button-action--arrow-option:hover {
|
||||
.button-action--arrow-option {
|
||||
background: transparent;
|
||||
border: 0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.button-action--arrow-option:disabled {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tooltip-custom__container .button-action--arrow-option:not(:disabled):hover {
|
||||
cursor: pointer;
|
||||
background: var(--gray-f3);
|
||||
overflow: hidden;
|
||||
@ -327,7 +340,7 @@
|
||||
}
|
||||
|
||||
.logs__row--red {
|
||||
background-color: var(--red);
|
||||
background-color: var(--red) !important;
|
||||
}
|
||||
|
||||
.logs__row--white {
|
||||
|
||||
@ -479,12 +479,6 @@ export const DNS_REQUEST_OPTIONS = {
|
||||
LOAD_BALANCING: '',
|
||||
};
|
||||
|
||||
export const IP_MATCH_LIST_STATUS = {
|
||||
NOT_FOUND: 'NOT_FOUND', // not found in the list
|
||||
EXACT: 'EXACT', // found exact match (including the match of short and long forms)
|
||||
CIDR: 'CIDR', // the ip is in the specified CIDR range
|
||||
};
|
||||
|
||||
export const DHCP_FORM_NAMES = {
|
||||
DHCPv4: 'dhcpv4',
|
||||
DHCPv6: 'dhcpv6',
|
||||
|
||||
@ -25,7 +25,6 @@ import {
|
||||
DHCP_VALUES_PLACEHOLDERS,
|
||||
FILTERED,
|
||||
FILTERED_STATUS,
|
||||
IP_MATCH_LIST_STATUS,
|
||||
SERVICES_ID_NAME_MAP,
|
||||
STANDARD_DNS_PORT,
|
||||
STANDARD_HTTPS_PORT,
|
||||
@ -133,16 +132,14 @@ export const normalizeTopStats = (stats) => (
|
||||
}))
|
||||
);
|
||||
|
||||
export const addClientInfo = (data, clients, param) => (
|
||||
data.map((row) => {
|
||||
const clientIp = row[param];
|
||||
const info = clients.find((item) => item[clientIp]) || '';
|
||||
return {
|
||||
...row,
|
||||
info: info?.[clientIp] ?? '',
|
||||
};
|
||||
})
|
||||
);
|
||||
export const addClientInfo = (data, clients, param) => data.map((row) => {
|
||||
const clientIp = row[param];
|
||||
const info = clients.find((item) => item[clientIp]) || '';
|
||||
return {
|
||||
...row,
|
||||
info: info?.[clientIp] ?? '',
|
||||
};
|
||||
});
|
||||
|
||||
export const normalizeFilters = (filters) => (
|
||||
filters ? filters.map((filter) => {
|
||||
@ -530,75 +527,6 @@ export const isIpInCidr = (ip, cidr) => {
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* The purpose of this method is to quickly check
|
||||
* if this IP can possibly be in the specified CIDR range.
|
||||
*
|
||||
* @param ip {string}
|
||||
* @param listItem {string}
|
||||
* @returns {boolean}
|
||||
*/
|
||||
const isIpQuickMatchCIDR = (ip, listItem) => {
|
||||
const ipv6 = ip.indexOf(':') !== -1;
|
||||
const cidrIpv6 = listItem.indexOf(':') !== -1;
|
||||
if (ipv6 !== cidrIpv6) {
|
||||
// CIDR is for a different IP type
|
||||
return false;
|
||||
}
|
||||
|
||||
if (cidrIpv6) {
|
||||
// We don't do quick check for IPv6 addresses
|
||||
return true;
|
||||
}
|
||||
|
||||
const idx = listItem.indexOf('/');
|
||||
if (idx === -1) {
|
||||
// Not a CIDR, return false immediately
|
||||
return false;
|
||||
}
|
||||
|
||||
const cidrIp = listItem.substring(0, idx);
|
||||
const cidrRange = parseInt(listItem.substring(idx + 1), 10);
|
||||
if (Number.isNaN(cidrRange)) {
|
||||
// Not a valid CIDR
|
||||
return false;
|
||||
}
|
||||
|
||||
const parts = cidrIp.split('.');
|
||||
if (parts.length !== 4) {
|
||||
// Invalid IP, return immediately
|
||||
return false;
|
||||
}
|
||||
|
||||
// Now depending on the range we check if the IP can possibly be in that range
|
||||
if (cidrRange < 8) {
|
||||
// Use the slow approach
|
||||
return true;
|
||||
}
|
||||
|
||||
if (cidrRange < 16) {
|
||||
// Check the first part
|
||||
// Example: 0.0.0.0/8 matches 0.*.*.*
|
||||
return ip.indexOf(`${parts[0]}.`) === 0;
|
||||
}
|
||||
|
||||
if (cidrRange < 24) {
|
||||
// Check the first two parts
|
||||
// Example: 0.0.0.0/16 matches 0.0.*.*
|
||||
return ip.indexOf(`${parts[0]}.${parts[1]}.`) === 0;
|
||||
}
|
||||
|
||||
if (cidrRange <= 32) {
|
||||
// Check the first two parts
|
||||
// Example: 0.0.0.0/16 matches 0.0.*.*
|
||||
return ip.indexOf(`${parts[0]}.${parts[1]}.${parts[2]}.`) === 0;
|
||||
}
|
||||
|
||||
// range for IPv4 CIDR cannot be more than 32
|
||||
// no need to check further, this CIDR is invalid
|
||||
return false;
|
||||
};
|
||||
|
||||
/**
|
||||
*
|
||||
* @param ipOrCidr
|
||||
@ -622,50 +550,6 @@ export const findAddressType = (address) => {
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @param ip {string}
|
||||
* @param list {string}
|
||||
* @returns {'EXACT' | 'CIDR' | 'NOT_FOND'}
|
||||
*/
|
||||
export const getIpMatchListStatus = (ip, list) => {
|
||||
if (!ip || !list) {
|
||||
return IP_MATCH_LIST_STATUS.NOT_FOUND;
|
||||
}
|
||||
|
||||
const listArr = list.trim()
|
||||
.split('\n');
|
||||
|
||||
try {
|
||||
for (let i = 0; i < listArr.length; i += 1) {
|
||||
const listItem = listArr[i];
|
||||
|
||||
if (ip === listItem.trim()) {
|
||||
return IP_MATCH_LIST_STATUS.EXACT;
|
||||
}
|
||||
|
||||
// Using ipaddr.js is quite slow so we first do a quick check
|
||||
// to see if it's possible that this IP may be in the specified CIDR range
|
||||
if (isIpQuickMatchCIDR(ip, listItem)) {
|
||||
const parsedIp = ipaddr.parse(ip);
|
||||
const isItemAnIp = ipaddr.isValid(listItem);
|
||||
const parsedItem = isItemAnIp ? ipaddr.parse(listItem) : ipaddr.parseCIDR(listItem);
|
||||
|
||||
if (isItemAnIp && parsedIp.toString() === parsedItem.toString()) {
|
||||
return IP_MATCH_LIST_STATUS.EXACT;
|
||||
}
|
||||
|
||||
if (!isItemAnIp && isIpMatchCidr(parsedIp, parsedItem)) {
|
||||
return IP_MATCH_LIST_STATUS.CIDR;
|
||||
}
|
||||
}
|
||||
}
|
||||
return IP_MATCH_LIST_STATUS.NOT_FOUND;
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
return IP_MATCH_LIST_STATUS.NOT_FOUND;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @param ids {string[]}
|
||||
* @returns {Object}
|
||||
|
||||
@ -2,7 +2,6 @@ import { handleActions } from 'redux-actions';
|
||||
import * as actions from '../actions';
|
||||
import { enrichWithConcatenatedIpAddresses } from '../helpers/helpers';
|
||||
|
||||
// todo: figure out if we cat get rid of redux-form state duplication
|
||||
const dhcp = handleActions(
|
||||
{
|
||||
[actions.getDhcpStatusRequest]: (state) => ({
|
||||
|
||||
1
client/webpack.dev.js
vendored
1
client/webpack.dev.js
vendored
@ -44,6 +44,7 @@ const getDevServerConfig = (proxyUrl = BASE_URL) => {
|
||||
proxy: {
|
||||
[proxyUrl]: `http://${devServerHost}:${port}`,
|
||||
},
|
||||
open: true,
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user