events: rework metrics (#4407)

* rework metrics

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* change graphs to be over last week

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* fix  Apps with most usage card

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
Jens L
2023-01-11 12:21:07 +01:00
committed by GitHub
parent a35b8f5862
commit 67a6fa6399
14 changed files with 143 additions and 107 deletions

View File

@ -1,6 +1,6 @@
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
import { AKChart } from "@goauthentik/elements/charts/Chart";
import { ChartData } from "chart.js";
import { ChartData, Tick } from "chart.js";
import { t } from "@lingui/macro";
@ -19,6 +19,13 @@ export class UserChart extends AKChart<UserMetrics> {
});
}
timeTickCallback(tickValue: string | number, index: number, ticks: Tick[]): string {
const valueStamp = ticks[index];
const delta = Date.now() - valueStamp.value;
const ago = Math.round(delta / 1000 / 3600 / 24);
return t`${ago} days ago`;
}
getChartData(data: UserMetrics): ChartData {
return {
datasets: [
@ -27,7 +34,7 @@ export class UserChart extends AKChart<UserMetrics> {
backgroundColor: "rgba(201, 25, 11, .5)",
spanGaps: true,
data:
data.loginsFailedPer1h?.map((cord) => {
data.loginsFailed?.map((cord) => {
return {
x: cord.xCord || 0,
y: cord.yCord || 0,
@ -39,7 +46,7 @@ export class UserChart extends AKChart<UserMetrics> {
backgroundColor: "rgba(189, 229, 184, .5)",
spanGaps: true,
data:
data.loginsPer1h?.map((cord) => {
data.logins?.map((cord) => {
return {
x: cord.xCord || 0,
y: cord.yCord || 0,
@ -51,7 +58,7 @@ export class UserChart extends AKChart<UserMetrics> {
backgroundColor: "rgba(43, 154, 243, .5)",
spanGaps: true,
data:
data.authorizationsPer1h?.map((cord) => {
data.authorizations?.map((cord) => {
return {
x: cord.xCord || 0,
y: cord.yCord || 0,

View File

@ -276,7 +276,9 @@ export class UserViewPage extends AKElement {
<div
class="pf-c-card pf-l-grid__item pf-m-12-col pf-m-9-col-on-xl pf-m-9-col-on-2xl"
>
<div class="pf-c-card__title">${t`Actions over the last 24 hours`}</div>
<div class="pf-c-card__title">
${t`Actions over the last week (per 8 hours)`}
</div>
<div class="pf-c-card__body">
<ak-charts-user userId=${this.user.pk || 0}> </ak-charts-user>
</div>