mirror of
https://github.com/hashicorp/vault.git
synced 2025-08-16 11:37:04 +02:00
f2779179af
* Add http request volume table (#6765) * init http metrics page * remove flex-table-column * add http requests table * calculate percent change between each counter * start percent change tests * style request table * show percent more/less glyph * add percent more less tests * add inline alert about recorded metrics * make arrows diagonal * remove conditional inside countersWithChange * add better error msg * use tagName and wrapping element a la glimmer components * extend ClusterRouteBase so auth and seal checks happen * make table accessible * remove curlies * add HttpRequestsTable to storybook * make table accessible * use qunit dom for better assertions * remove EmptyState since we will never have 0 requests * ensure counters is set in test context * Http request volume/add barchart (#6814) * Add http request volume table (#6765) * init http metrics page * remove flex-table-column * add http requests table * calculate percent change between each counter * start percent change tests * style request table * show percent more/less glyph * add percent more less tests * add inline alert about recorded metrics * make arrows diagonal * remove conditional inside countersWithChange * add better error msg * use tagName and wrapping element a la glimmer components * extend ClusterRouteBase so auth and seal checks happen * make table accessible * remove curlies * add HttpRequestsTable to storybook * make table accessible * use qunit dom for better assertions * remove EmptyState since we will never have 0 requests * ensure counters is set in test context * add http-requests-bar-chart * add HttpRequestsBarChart tests * add HttpRequestsBarChart to Storybook * format total number of requests according to locale * do not show extra minus sign when percent change is negative * add link to request metrics in status bar menu * only show bar chart if we have data for more than 1 month * make ticks lighter * ensure charts show data for correct month * make example counters response look like the adapter response instead of the raw api response * ensure ui shows the same utc date as the api response * add format-utc tests * downgrade to d3 v4 to support ie11 * add gridlines * move dasharray to css * use scheduleOnce instead of debounce to prevent multiple re-renders * add key function to bars * add exit case when data is no longer in parsedCounters * fix timestamp in table test * fix timestamps * use utcParse and fallback to isoParse for non-UTC dates * fix bar chart tests
52 lines
1.6 KiB
JavaScript
52 lines
1.6 KiB
JavaScript
import Component from '@ember/component';
|
|
import { computed } from '@ember/object';
|
|
import { assign } from '@ember/polyfills';
|
|
|
|
/**
|
|
* @module HttpRequestsTable
|
|
* `HttpRequestsTable` components render a table with the total number of HTTP Requests to a Vault server per month.
|
|
*
|
|
* @example
|
|
* ```js
|
|
* <HttpRequestsTable @counters={{counters}} />
|
|
* ```
|
|
*
|
|
* @param counters=null {Array} - A list of objects containing the total number of HTTP Requests for each month. `counters` should be the response from the `/internal/counters/requests` endpoint which looks like:
|
|
* COUNTERS = [
|
|
* {
|
|
* "start_time": "2019-05-01T00:00:00Z",
|
|
* "total": 50
|
|
* }
|
|
* ]
|
|
*/
|
|
|
|
export default Component.extend({
|
|
tagName: '',
|
|
counters: null,
|
|
countersWithChange: computed('counters', function() {
|
|
let counters = this.counters || [];
|
|
let countersWithPercentChange = [];
|
|
let previousMonthVal;
|
|
|
|
counters.forEach(month => {
|
|
if (previousMonthVal) {
|
|
let percentChange = (((month.total - previousMonthVal) / month.total) * 100).toFixed(1);
|
|
let glyph;
|
|
if (percentChange > 0) {
|
|
glyph = 'arrow-up';
|
|
} else if (percentChange < 0) {
|
|
glyph = 'arrow-down';
|
|
}
|
|
percentChange = Math.abs(percentChange);
|
|
const newCounter = assign({ percentChange, glyph }, month);
|
|
countersWithPercentChange.push(newCounter);
|
|
} else {
|
|
// we're looking at the first counter in the list, so there is no % change value.
|
|
countersWithPercentChange.push(month);
|
|
previousMonthVal = month.total;
|
|
}
|
|
});
|
|
return countersWithPercentChange;
|
|
}),
|
|
});
|