vault/ui/app/components/clients/running-total.ts
lane-wetmore cdbb0c49cc
UI: Vault update client count charts to show new clients only (#30506)
* increase bar width, show new clients only, add timestamp to header, update bar color

* remove extra timestamps, switch to basic bar chart

* update docs and styling

* remove unneeded timestamp args

* show new client running totatls

* initial test updates

* update test

* clean up new client total calc into util fn

* bits of clean up and todos

* update tests

* update to avoid activity call when in CE and missing either start or end time

* update todos

* update tests

* tidying

* move new client total onto payload for easier access

* update more tests to align with copy changes and new client totals

* remove addressed TODOs

* Update comment

* add changelog entry

* revert to using total, update tests and clean up

* Update ui/app/components/clients/page/counts.hbs

Co-authored-by: claire bontempo <68122737+hellobontempo@users.noreply.github.com>

* remove duplicate charts and update descriptions

* update tests after removing extra charts

* tidy

* update instances of byMonthActivityData to use byMonthNewClients and update tests

* Update ui/app/components/clients/running-total.ts

Co-authored-by: claire bontempo <68122737+hellobontempo@users.noreply.github.com>

* update chart styles

---------

Co-authored-by: claire bontempo <68122737+hellobontempo@users.noreply.github.com>
2025-05-19 15:57:32 -05:00

40 lines
1.2 KiB
TypeScript

/**
* Copyright (c) HashiCorp, Inc.
* SPDX-License-Identifier: BUSL-1.1
*/
import Component from '@glimmer/component';
import type { ByMonthNewClients, TotalClients } from 'core/utils/client-count-utils';
import type ClientsVersionHistoryModel from 'vault/vault/models/clients/version-history';
interface Args {
isSecretsSyncActivated: boolean;
byMonthNewClients: ByMonthNewClients[];
isHistoricalMonth: boolean;
isCurrentMonth: boolean;
runningTotals: TotalClients;
upgradesDuringActivity: ClientsVersionHistoryModel[];
responseTimestamp: string;
mountPath: string;
}
export default class RunningTotal extends Component<Args> {
get chartContainerText() {
const { isSecretsSyncActivated } = this.args;
return `The total clients in the specified date range, displayed per month. This includes entity, non-entity${
isSecretsSyncActivated ? ', ACME and secrets sync clients' : ' and ACME clients'
}. The total client count number is an important consideration for Vault billing.`;
}
get runningTotalData() {
return this.args.byMonthNewClients.map((monthly) => ({
...monthly,
new_clients: monthly.clients,
}));
}
get chartLegend() {
return [{ key: 'new_clients', label: 'new clients' }];
}
}