diff --git a/client/src/components/Dashboard/Clients.js b/client/src/components/Dashboard/Clients.js index ccac7bafb8f..095fc73053f 100644 --- a/client/src/components/Dashboard/Clients.js +++ b/client/src/components/Dashboard/Clients.js @@ -90,13 +90,14 @@ const Clients = ({ const { t } = useTranslation(); const topClients = useSelector((state) => state.stats.topClients, shallowEqual); - return - + ({ @@ -107,7 +108,7 @@ const Clients = ({ }))} columns={[ { - Header: 'IP', + Header: client_table_header, accessor: 'ip', sortMethod: sortIp, Cell: ClientCell, @@ -134,8 +135,9 @@ const Clients = ({ return disallowed ? { className: 'logs__row--red' } : {}; }} - /> - ; + /> + + ); }; Clients.propTypes = { diff --git a/client/src/helpers/constants.js b/client/src/helpers/constants.js index 59933620fce..e05ee9dc157 100644 --- a/client/src/helpers/constants.js +++ b/client/src/helpers/constants.js @@ -579,6 +579,7 @@ export const TOAST_TIMEOUTS = { export const ADDRESS_TYPES = { IP: 'IP', CIDR: 'CIDR', + CLIENT_ID: 'CLIENT_ID', UNKNOWN: 'UNKNOWN', }; diff --git a/client/src/helpers/helpers.js b/client/src/helpers/helpers.js index 073534d6a24..48fb048f35a 100644 --- a/client/src/helpers/helpers.js +++ b/client/src/helpers/helpers.js @@ -22,6 +22,7 @@ import { DHCP_VALUES_PLACEHOLDERS, FILTERED, FILTERED_STATUS, + R_CLIENT_ID, SERVICES_ID_NAME_MAP, STANDARD_DNS_PORT, STANDARD_HTTPS_PORT, @@ -536,7 +537,7 @@ export const isIpInCidr = (ip, cidr) => { /** * * @param ipOrCidr - * @returns {'IP' | 'CIDR' | 'UNKNOWN'} + * @returns {'IP' | 'CIDR' | 'CLIENT_ID' | 'UNKNOWN'} * */ export const findAddressType = (address) => { @@ -549,6 +550,9 @@ export const findAddressType = (address) => { if (cidrMaybe && ipaddr.parseCIDR(address)) { return ADDRESS_TYPES.CIDR; } + if (R_CLIENT_ID.test(address)) { + return ADDRESS_TYPES.CLIENT_ID; + } return ADDRESS_TYPES.UNKNOWN; } catch (e) { @@ -569,17 +573,25 @@ export const separateIpsAndCidrs = (ids) => ids.reduce((acc, curr) => { if (addressType === ADDRESS_TYPES.CIDR) { acc.cidrs.push(curr); } + if (addressType === ADDRESS_TYPES.CLIENT_ID) { + acc.clientIds.push(curr); + } return acc; -}, { ips: [], cidrs: [] }); +}, { ips: [], cidrs: [], clientIds: [] }); export const countClientsStatistics = (ids, autoClients) => { - const { ips, cidrs } = separateIpsAndCidrs(ids); + const { ips, cidrs, clientIds } = separateIpsAndCidrs(ids); const ipsCount = ips.reduce((acc, curr) => { const count = autoClients[curr] || 0; return acc + count; }, 0); + const clientIdsCount = clientIds.reduce((acc, curr) => { + const count = autoClients[curr] || 0; + return acc + count; + }, 0); + const cidrsCount = Object.entries(autoClients) .reduce((acc, curr) => { const [id, count] = curr; @@ -590,7 +602,7 @@ export const countClientsStatistics = (ids, autoClients) => { return acc; }, 0); - return ipsCount + cidrsCount; + return ipsCount + cidrsCount + clientIdsCount; }; /**