open-vault/ui/mirage/handlers/clients.js
claire bontempo 4a9610f382
UI: combine current + history client count tabs into one dashboard (#17575)
* WIP/initial routing-ish

* refactor date dropdown to reuse in modal and allowe current month selection

* swap linter disable line

* refactor date-dropdown to return object

* refactor calendar widget, add tests

* change calendar start and end args to getters

* refactor dashboard to use date objects instead of array of year, month

* remove dashboard files for easier to follow git diff

* comment out dashboard tab until route name updated

* delete current tab and route

* fix undefined banner time

* cleanup version history serializer and upgrade data

* first pass of updating tests

* add changelog

* update client count util test

* validate end time is after start time

* update comment

* add current month to calendar widget

* add comments for code changes to make following API update

* Removed a modified file from pull request

* address comments/cleanup

* update variables to const

* update test const

* rename history -> dashboard, fix tests

* fix timestamps for attribution chart

* update release note

* refactor using backend start and end time params

* add test for adapter formatting time params

* fix tests

* cleanup adapter comment and query params

* change back history file name for diff

* rename file using cli

* revert filenames

* rename files via git cli

* revert route file name

* last cli rename

* refactor mirage

* hold off on running total changes

* update params in test

* refactor to remove conditional assertions

* finish tests

* fix firefox tooltip

* remove current-when

* refactor version history

* add timezone/UTC note

* final cleanup!!!!

* fix test

* fix client count date tests

* fix date-dropdown test

* clear datedropdown completely

* update date selectors to accommodate new year (#18586)

* Revert "hold off on running total changes"

This reverts commit 8dc79a626d549df83bc47e290392a556c670f98f.

* remove assumed 0 values

* update average helper to only calculate for array of objects

* remove passing in bar chart data, map in running totals component instead

* cleanup usage stat component

* clear  ss filters for new queries

* update csv export, add explanation to modal

* update test copy

* consistently return null if no upgrade during activity (instead of empty array)

* update description, add clarifying comments

* update tes

* add more clarifying comments

* fix historic single month chart

* remove old test tag

* Update ui/app/components/clients/dashboard.js
2023-01-26 18:21:12 -08:00

170 lines
5.4 KiB
JavaScript

import {
isBefore,
startOfMonth,
endOfMonth,
addMonths,
subMonths,
differenceInCalendarMonths,
fromUnixTime,
isAfter,
formatRFC3339,
} from 'date-fns';
import { parseAPITimestamp } from 'core/utils/date-formatters';
const CURRENT_DATE = new Date();
const COUNTS_START = subMonths(CURRENT_DATE, 12); // pretend vault user started cluster 6 months ago
// for testing, we're in the middle of a license/billing period
const LICENSE_START = startOfMonth(subMonths(CURRENT_DATE, 6));
// upgrade happened 1 month after license start
const UPGRADE_DATE = addMonths(LICENSE_START, 1);
function getSum(array, key) {
return array.reduce((sum, { counts }) => sum + counts[key], 0);
}
function getTotalCounts(array) {
return {
distinct_entities: getSum(array, 'entity_clients'),
entity_clients: getSum(array, 'entity_clients'),
non_entity_tokens: getSum(array, 'non_entity_clients'),
non_entity_clients: getSum(array, 'non_entity_clients'),
clients: getSum(array, 'clients'),
};
}
function randomBetween(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
}
function arrayOfCounts(max, arrayLength) {
var result = [];
var sum = 0;
for (var i = 0; i < arrayLength - 1; i++) {
result[i] = randomBetween(1, max - (arrayLength - i - 1) - sum);
sum += result[i];
}
result[arrayLength - 1] = max - sum;
return result.sort((a, b) => b - a);
}
function generateNamespaceBlock(idx = 0, isLowerCounts = false, ns) {
const min = isLowerCounts ? 10 : 50;
const max = isLowerCounts ? 100 : 5000;
const nsBlock = {
namespace_id: ns?.namespace_id || (idx === 0 ? 'root' : Math.random().toString(36).slice(2, 7) + idx),
namespace_path: ns?.namespace_path || (idx === 0 ? '' : `ns/${idx}`),
counts: {},
};
const mounts = [];
Array.from(Array(10)).forEach((mount, index) => {
const mountClients = randomBetween(min, max);
const [nonEntity, entity] = arrayOfCounts(mountClients, 2);
mounts.push({
mount_path: `auth/authid${index}`,
counts: {
clients: mountClients,
entity_clients: entity,
non_entity_clients: nonEntity,
distinct_entities: entity,
non_entity_tokens: nonEntity,
},
});
});
mounts.sort((a, b) => b.counts.clients - a.counts.clients);
nsBlock.mounts = mounts;
nsBlock.counts = getTotalCounts(mounts);
return nsBlock;
}
function generateMonths(startDate, endDate, namespaces) {
const startDateObject = startOfMonth(parseAPITimestamp(startDate));
const endDateObject = startOfMonth(parseAPITimestamp(endDate));
const numberOfMonths = differenceInCalendarMonths(endDateObject, startDateObject) + 1;
const months = [];
if (isBefore(startDateObject, UPGRADE_DATE) && isBefore(endDateObject, UPGRADE_DATE)) {
// months block is empty if dates do not span an upgrade
return [];
}
for (let i = 0; i < numberOfMonths; i++) {
const month = addMonths(startDateObject, i);
const hasNoData = isBefore(month, UPGRADE_DATE);
if (hasNoData) {
months.push({
timestamp: formatRFC3339(month),
counts: null,
namespaces: null,
new_clients: null,
});
continue;
}
const monthNs = namespaces.map((ns, idx) => generateNamespaceBlock(idx, true, ns));
const newClients = namespaces.map((ns, idx) => generateNamespaceBlock(idx, true, ns));
months.push({
timestamp: formatRFC3339(month),
counts: getTotalCounts(monthNs),
namespaces: monthNs.sort((a, b) => b.counts.clients - a.counts.clients),
new_clients: {
counts: getTotalCounts(newClients),
namespaces: newClients.sort((a, b) => b.counts.clients - a.counts.clients),
},
});
}
return months;
}
function generateActivityResponse(namespaces, startDate, endDate) {
return {
start_time: isAfter(new Date(startDate), COUNTS_START) ? startDate : formatRFC3339(COUNTS_START),
end_time: endDate,
by_namespace: namespaces.sort((a, b) => b.counts.clients - a.counts.clients),
months: generateMonths(startDate, endDate, namespaces),
total: getTotalCounts(namespaces),
};
}
export default function (server) {
server.get('sys/license/status', function () {
return {
request_id: 'my-license-request-id',
data: {
autoloaded: {
license_id: 'my-license-id',
start_time: formatRFC3339(LICENSE_START),
expiration_time: formatRFC3339(endOfMonth(addMonths(CURRENT_DATE, 6))),
},
},
};
});
server.get('sys/internal/counters/config', function () {
return {
request_id: 'some-config-id',
data: {
default_report_months: 12,
enabled: 'default-enable',
queries_available: true,
retention_months: 24,
},
};
});
server.get('/sys/internal/counters/activity', (schema, req) => {
let { start_time, end_time } = req.queryParams;
// backend returns a timestamp if given unix time, so first convert to timestamp string here
if (!start_time.includes('T')) start_time = fromUnixTime(start_time).toISOString();
if (!end_time.includes('T')) end_time = fromUnixTime(end_time).toISOString();
const namespaces = Array.from(Array(12)).map((v, idx) => generateNamespaceBlock(idx));
return {
request_id: 'some-activity-id',
lease_id: '',
renewable: false,
lease_duration: 0,
data: generateActivityResponse(namespaces, start_time, end_time),
wrap_info: null,
warnings: null,
auth: null,
};
});
}