@kong-ui-public/analytics-metric-provider 9.1.6 → 9.1.7-pr.2345.4e518c748.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/types/components/MetricsTestHarness.vue.d.ts +3 -1
- package/dist/types/components/MetricsTestHarness.vue.d.ts.map +1 -1
- package/dist/types/composables/useMetricFetcher.d.ts.map +1 -1
- package/dist/types/mockExploreResponse.d.ts +2 -1
- package/dist/types/mockExploreResponse.d.ts.map +1 -1
- package/dist/vitals-metric-provider.es.js +118 -116
- package/dist/vitals-metric-provider.umd.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ExploreFilterAll, QueryDatasource } from '@kong-ui-public/analytics-utilities';
|
|
1
|
+
import type { ExploreFilterAll, QueryDatasource, Timeframe } from '@kong-ui-public/analytics-utilities';
|
|
2
2
|
type __VLS_Props = {
|
|
3
3
|
render: 'global' | 'single' | 'multi' | 'latencyCard';
|
|
4
4
|
datasource?: QueryDatasource;
|
|
@@ -9,6 +9,7 @@ type __VLS_Props = {
|
|
|
9
9
|
containerTitle?: string;
|
|
10
10
|
description?: string;
|
|
11
11
|
percentileLatency?: boolean;
|
|
12
|
+
overrideTimeframe?: Timeframe;
|
|
12
13
|
};
|
|
13
14
|
declare const _default: import("vue").DefineComponent<__VLS_Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
14
15
|
refreshInterval: number;
|
|
@@ -16,6 +17,7 @@ declare const _default: import("vue").DefineComponent<__VLS_Props, void, {}, {},
|
|
|
16
17
|
datasource: QueryDatasource;
|
|
17
18
|
additionalFilter: ExploreFilterAll[];
|
|
18
19
|
queryReady: boolean;
|
|
20
|
+
overrideTimeframe: Timeframe;
|
|
19
21
|
longCardTitles: boolean;
|
|
20
22
|
containerTitle: string;
|
|
21
23
|
percentileLatency: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetricsTestHarness.vue.d.ts","sourceRoot":"","sources":["../../../src/components/MetricsTestHarness.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MetricsTestHarness.vue.d.ts","sourceRoot":"","sources":["../../../src/components/MetricsTestHarness.vue"],"names":[],"mappings":"AAmGA,OAAO,KAAK,EAAE,gBAAgB,EAA+B,eAAe,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAA;AAGpI,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAG,aAAa,CAAA;IACrD,UAAU,CAAC,EAAE,eAAe,CAAA;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,gBAAgB,CAAC,EAAE,gBAAgB,EAAE,CAAA;IACrC,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,iBAAiB,CAAC,EAAE,SAAS,CAAA;CAC9B,CAAC;;qBAPkB,MAAM;iBAIV,MAAM;gBANP,eAAe;sBAGT,gBAAgB,EAAE;gBAFxB,OAAO;uBAOA,SAAS;oBAJZ,OAAO;oBACP,MAAM;uBAEH,OAAO;;AAwM7B,wBAKG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMetricFetcher.d.ts","sourceRoot":"","sources":["../../../src/composables/useMetricFetcher.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAE9B,OAAO,KAAK,EAGV,eAAe,EAChB,MAAM,qCAAqC,CAAA;AAC5C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAA;AAKpD,eAAO,MAAM,WAAW,eAAoB,CAAA;AAC5C,MAAM,MAAM,aAAa,GAAG,MAAM,CAAC,MAAM,GAAG,OAAO,WAAW,EAAE,MAAM,CAAC,MAAM,GAAG,OAAO,WAAW,EAAE,MAAM,CAAC,CAAC,CAAA;AAM5G,MAAM,WAAW,0BAA0B;IACzC,OAAO,EAAE,aAAa,CAAA;IACtB,QAAQ,EAAE,aAAa,CAAA;CACxB;AAED,MAAM,WAAW,aAAa;IAC5B,SAAS,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACvB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACtB,GAAG,EAAE,GAAG,CAAC,eAAe,GAAG,SAAS,CAAC,CAAA;IACrC,MAAM,EAAE,GAAG,CAAC,0BAA0B,CAAC,CAAA;IACvC,UAAU,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;CACxB;AASD,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,eAAe,EAAE,SAAS,EAAE,OAAO,GAAG,0BAA0B,CAiDzG;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,IAAI,EAAE,oBAAoB,GAAG,aAAa,
|
|
1
|
+
{"version":3,"file":"useMetricFetcher.d.ts","sourceRoot":"","sources":["../../../src/composables/useMetricFetcher.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAE9B,OAAO,KAAK,EAGV,eAAe,EAChB,MAAM,qCAAqC,CAAA;AAC5C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAA;AAKpD,eAAO,MAAM,WAAW,eAAoB,CAAA;AAC5C,MAAM,MAAM,aAAa,GAAG,MAAM,CAAC,MAAM,GAAG,OAAO,WAAW,EAAE,MAAM,CAAC,MAAM,GAAG,OAAO,WAAW,EAAE,MAAM,CAAC,CAAC,CAAA;AAM5G,MAAM,WAAW,0BAA0B;IACzC,OAAO,EAAE,aAAa,CAAA;IACtB,QAAQ,EAAE,aAAa,CAAA;CACxB;AAED,MAAM,WAAW,aAAa;IAC5B,SAAS,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACvB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACtB,GAAG,EAAE,GAAG,CAAC,eAAe,GAAG,SAAS,CAAC,CAAA;IACrC,MAAM,EAAE,GAAG,CAAC,0BAA0B,CAAC,CAAA;IACvC,UAAU,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;CACxB;AASD,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,eAAe,EAAE,SAAS,EAAE,OAAO,GAAG,0BAA0B,CAiDzG;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,IAAI,EAAE,oBAAoB,GAAG,aAAa,CAuGlF"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import type { CyHttpMessages } from 'cypress/types/net-stubbing';
|
|
2
|
-
import type { ExploreQuery, ExploreResultV4 } from '@kong-ui-public/analytics-utilities';
|
|
2
|
+
import type { ExploreQuery, ExploreResultV4, Timeframe } from '@kong-ui-public/analytics-utilities';
|
|
3
3
|
export interface MockOptions {
|
|
4
4
|
dimensionNames?: string[];
|
|
5
5
|
injectErrors?: 'latency' | 'traffic' | 'all';
|
|
6
6
|
deterministic?: boolean;
|
|
7
|
+
timeFrame?: Timeframe;
|
|
7
8
|
}
|
|
8
9
|
export declare const mockExploreResponseFromCypress: (req: CyHttpMessages.IncomingHttpRequest, opts?: MockOptions) => void;
|
|
9
10
|
export declare const mockExploreResponse: (body: ExploreQuery, opts?: MockOptions) => ExploreResultV4;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mockExploreResponse.d.ts","sourceRoot":"","sources":["../../src/mockExploreResponse.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAEhE,OAAO,KAAK,EAEV,YAAY,EACZ,eAAe,
|
|
1
|
+
{"version":3,"file":"mockExploreResponse.d.ts","sourceRoot":"","sources":["../../src/mockExploreResponse.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAEhE,OAAO,KAAK,EAEV,YAAY,EACZ,eAAe,EAGf,SAAS,EACV,MAAM,qCAAqC,CAAA;AAM5C,MAAM,WAAW,WAAW;IAC1B,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,YAAY,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,KAAK,CAAA;IAC5C,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB;AAED,eAAO,MAAM,8BAA8B,GACzC,KAAK,cAAc,CAAC,mBAAmB,EACvC,OAAO,WAAW,SAQnB,CAAA;AAQD,eAAO,MAAM,mBAAmB,GAC9B,MAAM,YAAY,EAClB,OAAO,WAAW,KAsFb,eACN,CAAA"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ref as H, watchEffect as
|
|
1
|
+
import { ref as H, watchEffect as Fe, computed as g, getCurrentInstance as xe, reactive as qe, onMounted as Ue, onUnmounted as ze, watch as Ke, isReadonly as Pe, toRefs as $e, defineComponent as Q, inject as Se, toRef as X, provide as Be, renderSlot as Ie, resolveComponent as Ae, createElementBlock as S, openBlock as T, normalizeClass as K, createElementVNode as x, createCommentVNode as V, createBlock as q, unref as _, resolveDynamicComponent as re, withCtx as ye, createTextVNode as De, toDisplayString as w, createVNode as M, Fragment as he, renderList as Xe, mergeProps as Ge, normalizeProps as je, guardReactiveProps as He } from "vue";
|
|
2
2
|
import { stripUnknownFilters as Ye, TimeframeKeys as se, queryableExploreDimensions as Qe, TimePeriods as be, DeltaQueryTime as We, UnaryQueryTime as Je } from "@kong-ui-public/analytics-utilities";
|
|
3
3
|
import { createI18n as Ze, i18nTComponent as er } from "@kong-ui-public/i18n";
|
|
4
4
|
import "axios";
|
|
@@ -26,7 +26,9 @@ const cr = {
|
|
|
26
26
|
p99Latency: "P99 latency"
|
|
27
27
|
}
|
|
28
28
|
}, fr = {
|
|
29
|
-
|
|
29
|
+
custom_days: "vs previous {numDays, plural, =1 {day} other {# days}}",
|
|
30
|
+
custom_hours: "vs previous {numHours, plural, =1 {hour} other {# hours}}",
|
|
31
|
+
custom_minutes: "vs previous {numMinutes, plural, =1 {minute} other {# minutes}}",
|
|
30
32
|
"15m": "vs previous 15 minutes",
|
|
31
33
|
"1h": "vs previous hour",
|
|
32
34
|
"6h": "vs previous 6 hours",
|
|
@@ -65,7 +67,7 @@ function Rr(e = H({}), r, t, o = pr) {
|
|
|
65
67
|
"PENDING"
|
|
66
68
|
/* PENDING */
|
|
67
69
|
);
|
|
68
|
-
return
|
|
70
|
+
return Fe(() => {
|
|
69
71
|
const n = o(e.value);
|
|
70
72
|
if (e.value && n && t.value) {
|
|
71
73
|
a.value = "VALIDATING_HAS_DATA";
|
|
@@ -115,8 +117,8 @@ function Tr(e, r) {
|
|
|
115
117
|
});
|
|
116
118
|
}
|
|
117
119
|
function Er(e) {
|
|
118
|
-
e.queryReady === void 0 && (e.queryReady =
|
|
119
|
-
const { i18n: r } = N.useI18n(), t =
|
|
120
|
+
e.queryReady === void 0 && (e.queryReady = g(() => !0));
|
|
121
|
+
const { i18n: r } = N.useI18n(), t = g(() => {
|
|
120
122
|
var u, d;
|
|
121
123
|
return {
|
|
122
124
|
metrics: e.metrics.value,
|
|
@@ -128,12 +130,12 @@ function Er(e) {
|
|
|
128
130
|
...(d = e.filter.value) != null && d.length ? { filters: e.filter.value } : {},
|
|
129
131
|
time_range: e.timeframe.value.v4Query(e.tz.value)
|
|
130
132
|
};
|
|
131
|
-
}), o =
|
|
132
|
-
var d, v,
|
|
133
|
+
}), o = g(() => {
|
|
134
|
+
var d, v, h, R;
|
|
133
135
|
if (!((d = e.queryReady) != null && d.value))
|
|
134
136
|
return null;
|
|
135
137
|
const u = (v = e.filter) != null && v.value ? JSON.stringify(e.filter.value) : "";
|
|
136
|
-
return `metric-fetcher-${e.timeframe.value.cacheKey()}-${(
|
|
138
|
+
return `metric-fetcher-${e.timeframe.value.cacheKey()}-${(h = e.dimensions) == null ? void 0 : h.join("-")}-${(R = e.metrics.value) == null ? void 0 : R.join("-")}-${u}-${e.refreshCounter.value}`;
|
|
137
139
|
}), { response: a, error: n, isValidating: l } = N.useRequest(
|
|
138
140
|
() => o.value,
|
|
139
141
|
() => e.queryFn({
|
|
@@ -147,23 +149,23 @@ function Er(e) {
|
|
|
147
149
|
revalidateOnFocus: !1,
|
|
148
150
|
errorRetryCount: yr
|
|
149
151
|
}
|
|
150
|
-
), { state: c, swrvState: f } = Rr(a, n, l), i =
|
|
151
|
-
var u, d, v,
|
|
152
|
-
return !((d = (u = a.value) == null ? void 0 : u.data) != null && d.length) || !((
|
|
153
|
-
}), s =
|
|
152
|
+
), { state: c, swrvState: f } = Rr(a, n, l), i = g(() => {
|
|
153
|
+
var u, d, v, h, R, m, E;
|
|
154
|
+
return !((d = (u = a.value) == null ? void 0 : u.data) != null && d.length) || !((h = (v = a.value) == null ? void 0 : v.meta) != null && h.display) || !((E = (m = (R = a.value) == null ? void 0 : R.meta) == null ? void 0 : m.metric_names) != null && E.length) ? { current: {}, previous: {} } : Tr(a.value, e.withTrend.value);
|
|
155
|
+
}), s = g(() => {
|
|
154
156
|
var u, d;
|
|
155
157
|
if (e.timeframe.value.key === "custom") {
|
|
156
158
|
if (!((d = (u = a.value) == null ? void 0 : u.meta) != null && d.start_ms))
|
|
157
159
|
return "";
|
|
158
|
-
const { start_ms: v, end_ms:
|
|
159
|
-
let R = (
|
|
160
|
-
return e.withTrend.value && (R /= 2), r.t("trendRange.
|
|
160
|
+
const { start_ms: v, end_ms: h } = a.value.meta;
|
|
161
|
+
let R = (h - v) / (1e3 * 60 * 60 * 24), m = (h - v) / (1e3 * 60 * 60), E = (h - v) / (1e3 * 60);
|
|
162
|
+
return e.withTrend.value && (R /= 2, m /= 2, E /= 2), R >= 1 ? r.t("trendRange.custom_days", { numDays: Math.round(R) }) : m >= 1 ? r.t("trendRange.custom_hours", { numHours: Math.round(m) }) : E >= 1 ? r.t("trendRange.custom_minutes", { numMinutes: Math.round(E) }) : r.t("trendRange.custom_days", { numDays: Math.round(R) });
|
|
161
163
|
} else
|
|
162
164
|
return e.withTrend.value ? r.t(`trendRange.${e.timeframe.value.key}`) : "";
|
|
163
165
|
});
|
|
164
166
|
return {
|
|
165
|
-
isLoading:
|
|
166
|
-
hasError:
|
|
167
|
+
isLoading: g(() => f.PENDING === c.value),
|
|
168
|
+
hasError: g(() => f.ERROR === c.value),
|
|
167
169
|
raw: a,
|
|
168
170
|
mapped: i,
|
|
169
171
|
trendRange: s
|
|
@@ -173,7 +175,7 @@ const P = (e, r, t = L, o) => (o ?? [L]).reduce((n, l) => {
|
|
|
173
175
|
const c = e[r][t];
|
|
174
176
|
return c ? n + (c[l] || 0) : n;
|
|
175
177
|
}, 0);
|
|
176
|
-
function
|
|
178
|
+
function _r(e) {
|
|
177
179
|
const {
|
|
178
180
|
cardType: r,
|
|
179
181
|
title: t,
|
|
@@ -184,7 +186,7 @@ function Cr(e) {
|
|
|
184
186
|
formatValueFn: c,
|
|
185
187
|
trendRange: f
|
|
186
188
|
} = e;
|
|
187
|
-
return
|
|
189
|
+
return g(() => {
|
|
188
190
|
let i = 0, s = 0;
|
|
189
191
|
if (a != null && a.value)
|
|
190
192
|
try {
|
|
@@ -210,7 +212,7 @@ function Cr(e) {
|
|
|
210
212
|
});
|
|
211
213
|
}
|
|
212
214
|
var ne = /* @__PURE__ */ new WeakMap(), Re = 0;
|
|
213
|
-
function
|
|
215
|
+
function Cr(e) {
|
|
214
216
|
if (!e.length)
|
|
215
217
|
return "";
|
|
216
218
|
for (var r = "arg", t = 0; t < e.length; ++t) {
|
|
@@ -219,14 +221,14 @@ function Sr(e) {
|
|
|
219
221
|
}
|
|
220
222
|
return r;
|
|
221
223
|
}
|
|
222
|
-
function
|
|
224
|
+
function Sr(e) {
|
|
223
225
|
if (typeof e == "function")
|
|
224
226
|
try {
|
|
225
227
|
e = e();
|
|
226
228
|
} catch {
|
|
227
229
|
e = "";
|
|
228
230
|
}
|
|
229
|
-
return Array.isArray(e) ? e =
|
|
231
|
+
return Array.isArray(e) ? e = Cr(e) : e = String(e || ""), e;
|
|
230
232
|
}
|
|
231
233
|
var ue = (
|
|
232
234
|
/** @class */
|
|
@@ -235,7 +237,7 @@ var ue = (
|
|
|
235
237
|
r === void 0 && (r = 0), this.items = /* @__PURE__ */ new Map(), this.ttl = r;
|
|
236
238
|
}
|
|
237
239
|
return e.prototype.serializeKey = function(r) {
|
|
238
|
-
return
|
|
240
|
+
return Sr(r);
|
|
239
241
|
}, e.prototype.get = function(r) {
|
|
240
242
|
var t = this.serializeKey(r);
|
|
241
243
|
return this.items.get(t);
|
|
@@ -447,8 +449,8 @@ var Te = function(e, r, t, o) {
|
|
|
447
449
|
return d.key === e;
|
|
448
450
|
}), s.forEach(function(d, v) {
|
|
449
451
|
typeof f.data < "u" && (d.data = f.data), d.error = f.error, d.isValidating = f.isValidating, d.isLoading = f.isValidating;
|
|
450
|
-
var
|
|
451
|
-
|
|
452
|
+
var h = v === s.length - 1;
|
|
453
|
+
h || delete s[v];
|
|
452
454
|
}), s = s.filter(Boolean)), [2, f];
|
|
453
455
|
}
|
|
454
456
|
});
|
|
@@ -472,13 +474,13 @@ function Vr() {
|
|
|
472
474
|
isLoading: !0,
|
|
473
475
|
key: null
|
|
474
476
|
}));
|
|
475
|
-
var
|
|
477
|
+
var h = function(p, y) {
|
|
476
478
|
return U(e, void 0, void 0, function() {
|
|
477
|
-
var I,
|
|
479
|
+
var I, C, A, F, W, de, J, fe = this;
|
|
478
480
|
return z(this, function(Z) {
|
|
479
481
|
switch (Z.label) {
|
|
480
482
|
case 0:
|
|
481
|
-
return I = v.data === void 0,
|
|
483
|
+
return I = v.data === void 0, C = d.value, C ? (A = n.cache.get(C), F = A && A.data, v.isValidating = !0, v.isLoading = !F, F && (v.data = F.data, v.error = F.error), W = p || a, !W || !n.isDocumentVisible() && !I || (y == null ? void 0 : y.forceRevalidate) !== void 0 && !(y != null && y.forceRevalidate) ? (v.isValidating = !1, v.isLoading = !1, [
|
|
482
484
|
2
|
|
483
485
|
/*return*/
|
|
484
486
|
]) : A && (de = !!(Date.now() - A.createdAt >= n.dedupingInterval || y != null && y.forceRevalidate), !de) ? (v.isValidating = !1, v.isLoading = !1, [
|
|
@@ -490,22 +492,22 @@ function Vr() {
|
|
|
490
492
|
return z(this, function(B) {
|
|
491
493
|
switch (B.label) {
|
|
492
494
|
case 0:
|
|
493
|
-
return k = ie.get(
|
|
495
|
+
return k = ie.get(C), k ? [3, 2] : (ve = Array.isArray(C) ? C : [C], ee = W.apply(void 0, wr([], br(ve), !1)), ie.set(C, ee, n.dedupingInterval), [4, Te(C, ee, n.cache, u)]);
|
|
494
496
|
case 1:
|
|
495
497
|
return B.sent(), [3, 4];
|
|
496
498
|
case 2:
|
|
497
|
-
return [4, Te(
|
|
499
|
+
return [4, Te(C, k.data, n.cache, u)];
|
|
498
500
|
case 3:
|
|
499
501
|
B.sent(), B.label = 4;
|
|
500
502
|
case 4:
|
|
501
|
-
return v.isValidating = !1, v.isLoading = !1, ie.delete(
|
|
503
|
+
return v.isValidating = !1, v.isLoading = !1, ie.delete(C), v.error !== void 0 && (me = !l && n.shouldRetryOnError && (y ? y.shouldRetryOnError : !0), me && Lr(h, y ? y.errorRetryCount : 1, n)), [
|
|
502
504
|
2
|
|
503
505
|
/*return*/
|
|
504
506
|
];
|
|
505
507
|
}
|
|
506
508
|
});
|
|
507
509
|
});
|
|
508
|
-
},
|
|
510
|
+
}, F && n.revalidateDebounce ? (setTimeout(function() {
|
|
509
511
|
return U(fe, void 0, void 0, function() {
|
|
510
512
|
return z(this, function(k) {
|
|
511
513
|
switch (k.label) {
|
|
@@ -540,7 +542,7 @@ function Vr() {
|
|
|
540
542
|
}, R = function() {
|
|
541
543
|
return U(e, void 0, void 0, function() {
|
|
542
544
|
return z(this, function(p) {
|
|
543
|
-
return [2,
|
|
545
|
+
return [2, h(null, { shouldRetryOnError: !1 })];
|
|
544
546
|
});
|
|
545
547
|
});
|
|
546
548
|
}, m = null;
|
|
@@ -550,7 +552,7 @@ function Vr() {
|
|
|
550
552
|
return z(this, function(y) {
|
|
551
553
|
switch (y.label) {
|
|
552
554
|
case 0:
|
|
553
|
-
return !v.error && n.isOnline() ? [4,
|
|
555
|
+
return !v.error && n.isOnline() ? [4, h()] : [3, 2];
|
|
554
556
|
case 1:
|
|
555
557
|
return y.sent(), [3, 3];
|
|
556
558
|
case 2:
|
|
@@ -574,16 +576,16 @@ function Vr() {
|
|
|
574
576
|
});
|
|
575
577
|
try {
|
|
576
578
|
Ke(d, function(p) {
|
|
577
|
-
Pe(d) || (d.value = p), v.key = p, v.isValidating = !!p, Or(d.value, v, u), !s && !c && d.value &&
|
|
579
|
+
Pe(d) || (d.value = p), v.key = p, v.isValidating = !!p, Or(d.value, v, u), !s && !c && d.value && h(), c = !1;
|
|
578
580
|
}, {
|
|
579
581
|
immediate: !0
|
|
580
582
|
});
|
|
581
583
|
} catch {
|
|
582
584
|
}
|
|
583
|
-
var
|
|
584
|
-
return
|
|
585
|
+
var E = b(b({}, $e(v)), { mutate: function(p, y) {
|
|
586
|
+
return h(p, b(b({}, y), { forceRevalidate: !0 }));
|
|
585
587
|
} });
|
|
586
|
-
return
|
|
588
|
+
return E;
|
|
587
589
|
}
|
|
588
590
|
function kr(e) {
|
|
589
591
|
return e !== null && typeof e == "object" && typeof e.then == "function";
|
|
@@ -601,7 +603,7 @@ function Nr(e, r, t) {
|
|
|
601
603
|
...t
|
|
602
604
|
});
|
|
603
605
|
return {
|
|
604
|
-
data:
|
|
606
|
+
data: g(() => o.value),
|
|
605
607
|
response: o,
|
|
606
608
|
error: a,
|
|
607
609
|
isValidating: n,
|
|
@@ -610,10 +612,10 @@ function Nr(e, r, t) {
|
|
|
610
612
|
}
|
|
611
613
|
const N = {
|
|
612
614
|
useI18n: mr,
|
|
613
|
-
useMetricCardBuilder:
|
|
615
|
+
useMetricCardBuilder: _r,
|
|
614
616
|
useMetricFetcher: Er,
|
|
615
617
|
useRequest: Nr
|
|
616
|
-
}, Ne = Symbol("METRICS_PROVIDER_KEY"),
|
|
618
|
+
}, Ne = Symbol("METRICS_PROVIDER_KEY"), Mr = (e) => {
|
|
617
619
|
const {
|
|
618
620
|
datasource: r,
|
|
619
621
|
dimension: t,
|
|
@@ -630,7 +632,7 @@ const N = {
|
|
|
630
632
|
} = e;
|
|
631
633
|
if (o && !t)
|
|
632
634
|
throw new Error("Must provide a dimension if filtering by a value");
|
|
633
|
-
const v = !!(t && o),
|
|
635
|
+
const v = !!(t && o), h = !!(t && !o), R = g(() => {
|
|
634
636
|
const I = [];
|
|
635
637
|
return v && I.push({
|
|
636
638
|
field: t,
|
|
@@ -653,14 +655,14 @@ const N = {
|
|
|
653
655
|
timeframe: l,
|
|
654
656
|
tz: c,
|
|
655
657
|
// Traffic and error rate cards can't query trend if multiple entities are expected.
|
|
656
|
-
withTrend:
|
|
658
|
+
withTrend: g(() => f.value && !h),
|
|
657
659
|
refreshInterval: i,
|
|
658
660
|
queryFn: u,
|
|
659
661
|
abortController: s,
|
|
660
662
|
refreshCounter: e.refreshCounter
|
|
661
|
-
},
|
|
663
|
+
}, E = {
|
|
662
664
|
datasource: r,
|
|
663
|
-
metrics:
|
|
665
|
+
metrics: g(() => [
|
|
664
666
|
d.value ? "response_latency_average" : "response_latency_p99"
|
|
665
667
|
]),
|
|
666
668
|
// To keep single-entity queries consistent, don't bother querying the dimension for latency
|
|
@@ -671,12 +673,12 @@ const N = {
|
|
|
671
673
|
timeframe: l,
|
|
672
674
|
tz: c,
|
|
673
675
|
// Don't query latency trends in the multi-entity case: it's possible, but wasteful.
|
|
674
|
-
withTrend:
|
|
676
|
+
withTrend: g(() => f.value && !h),
|
|
675
677
|
refreshInterval: i,
|
|
676
678
|
queryFn: u,
|
|
677
679
|
abortController: s,
|
|
678
680
|
refreshCounter: e.refreshCounter
|
|
679
|
-
}, p = N.useMetricFetcher(m), y = N.useMetricFetcher(
|
|
681
|
+
}, p = N.useMetricFetcher(m), y = N.useMetricFetcher(E);
|
|
680
682
|
return {
|
|
681
683
|
trafficData: p,
|
|
682
684
|
latencyData: y
|
|
@@ -704,13 +706,13 @@ const N = {
|
|
|
704
706
|
const r = e;
|
|
705
707
|
if (r.dimension && Qe.findIndex((v) => v === r.dimension) === -1)
|
|
706
708
|
throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${r.dimension}`);
|
|
707
|
-
const t =
|
|
709
|
+
const t = Se(gr);
|
|
708
710
|
let o;
|
|
709
711
|
t ? o = t.queryFn : (console.warn("Analytics dashboards require a query bridge supplied via provide / inject."), console.warn("Please ensure your application has a query bridge provided under the key 'analytics-query-provider', as described in"), console.warn("https://github.com/Kong/public-ui-components/blob/main/packages/analytics/analytics-metric-provider/README.md#requirements"), o = () => Promise.reject(new Error("Query bridge required")));
|
|
710
|
-
const a = rr(), n =
|
|
712
|
+
const a = rr(), n = g(() => !0), l = g(() => !a.loading && r.queryReady), c = g(() => r.tz ? r.tz : new Intl.DateTimeFormat().resolvedOptions().timeZone), f = g(() => r.datasource ? r.datasource : "basic"), i = g(() => r.overrideTimeframe || be.get(se.SEVEN_DAY)), s = g(() => !r.percentileLatency), {
|
|
711
713
|
trafficData: u,
|
|
712
714
|
latencyData: d
|
|
713
|
-
} =
|
|
715
|
+
} = Mr({
|
|
714
716
|
datasource: f,
|
|
715
717
|
dimension: r.dimension,
|
|
716
718
|
dimensionFilterValue: r.filterValue,
|
|
@@ -735,24 +737,24 @@ const N = {
|
|
|
735
737
|
hasTrendAccess: n,
|
|
736
738
|
longCardTitles: r.longCardTitles,
|
|
737
739
|
averageLatencies: s
|
|
738
|
-
}), (v,
|
|
740
|
+
}), (v, h) => Ie(v.$slots, "default", {
|
|
739
741
|
hasTrendAccess: n.value,
|
|
740
742
|
timeframe: i.value
|
|
741
743
|
});
|
|
742
744
|
}
|
|
743
745
|
});
|
|
744
|
-
function
|
|
746
|
+
function Fr(e) {
|
|
745
747
|
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
|
|
746
748
|
}
|
|
747
|
-
var
|
|
749
|
+
var Me = { exports: {} };
|
|
748
750
|
(function(e) {
|
|
749
751
|
(function() {
|
|
750
752
|
function r(i, s) {
|
|
751
753
|
if (s.separator === !1 || i < 1e3)
|
|
752
754
|
return i.toString();
|
|
753
755
|
var u = typeof s.separator == "string" ? s.separator : ",", d = [], v = Math.round(i).toString().split("");
|
|
754
|
-
return v.reverse().forEach(function(
|
|
755
|
-
R && R % 3 === 0 && d.push(u), d.push(
|
|
756
|
+
return v.reverse().forEach(function(h, R) {
|
|
757
|
+
R && R % 3 === 0 && d.push(u), d.push(h);
|
|
756
758
|
}), d.reverse().join("");
|
|
757
759
|
}
|
|
758
760
|
function t(i, s, u) {
|
|
@@ -770,14 +772,14 @@ var Fe = { exports: {} };
|
|
|
770
772
|
}
|
|
771
773
|
f.addCommas = r, e.exports = f;
|
|
772
774
|
})();
|
|
773
|
-
})(
|
|
774
|
-
var xr =
|
|
775
|
-
const qr = /* @__PURE__ */
|
|
775
|
+
})(Me);
|
|
776
|
+
var xr = Me.exports;
|
|
777
|
+
const qr = /* @__PURE__ */ Fr(xr);
|
|
776
778
|
var O = /* @__PURE__ */ ((e) => (e.GENERIC_COUNT = "GenericCount", e.TRAFFIC = "Traffic", e.ERROR_RATE = "ErrorRate", e.LATENCY = "Latency", e))(O || {}), D = /* @__PURE__ */ ((e) => (e.Small = "sm", e.Medium = "md", e.Large = "lg", e.ExtraLarge = "xl", e))(D || {});
|
|
777
779
|
const le = 2, Ee = le + 2, Ur = (e, r, t = !1) => {
|
|
778
780
|
let o = !r || Number(e.toFixed(Ee)) === 0 ? 0 : Number(e.toFixed(Ee)) > 0 ? 1 : -1;
|
|
779
781
|
return t && (o *= -1), o;
|
|
780
|
-
}, zr = (e, r, t) => r ? `${Math.abs(e * 100).toFixed(le)}%` : t, Kr = (e, r) => r === 0 ? 0 : e / r - 1, Pr = (e, r = !1) => (r && (e *= -1), e > 0 ? tr : e < 0 ? nr : we), $r = "#ad000e", oe = "#6c7489",
|
|
782
|
+
}, zr = (e, r, t) => r ? `${Math.abs(e * 100).toFixed(le)}%` : t, Kr = (e, r) => r === 0 ? 0 : e / r - 1, Pr = (e, r = !1) => (r && (e *= -1), e > 0 ? tr : e < 0 ? nr : we), $r = "#ad000e", oe = "#6c7489", _e = "#52596e", Br = "#007d60", G = "16px", Xr = "20px", Gr = {
|
|
781
783
|
key: 0,
|
|
782
784
|
class: "metricscard-description"
|
|
783
785
|
}, jr = { class: "metricscard-valuetrend" }, Hr = {
|
|
@@ -870,23 +872,23 @@ const le = 2, Ee = le + 2, Ur = (e, r, t = !1) => {
|
|
|
870
872
|
const f = {
|
|
871
873
|
red: `var(--kui-color-text-danger-strong, ${$r})`,
|
|
872
874
|
green: `var(--kui-color-text-success, ${Br})`,
|
|
873
|
-
grey: `var(--kui-color-text-neutral-strong, ${
|
|
875
|
+
grey: `var(--kui-color-text-neutral-strong, ${_e})`
|
|
874
876
|
};
|
|
875
877
|
return c > 0 ? f.green : c < 0 ? f.red : f.grey;
|
|
876
878
|
}, a = (c) => c > 0 ? "positive" : c < 0 ? "negative" : "neutral", n = [D.Medium, D.Large].includes(t.cardSize), l = [D.Small].includes(t.cardSize);
|
|
877
879
|
return (c, f) => {
|
|
878
880
|
const i = Ae("KTooltip");
|
|
879
|
-
return T(),
|
|
881
|
+
return T(), S("div", {
|
|
880
882
|
class: K(["metricscard", e.cardSize])
|
|
881
883
|
}, [
|
|
882
884
|
x("div", {
|
|
883
885
|
class: K(["metricscard-title", e.cardSize])
|
|
884
886
|
}, [
|
|
885
|
-
|
|
887
|
+
_(l) ? V("", !0) : (T(), q(re(_(r).get(e.cardType)), {
|
|
886
888
|
key: 0,
|
|
887
889
|
class: "metricscard-icon",
|
|
888
|
-
color: `var(--kui-color-text-neutral, ${
|
|
889
|
-
size:
|
|
890
|
+
color: `var(--kui-color-text-neutral, ${_(oe)})`,
|
|
891
|
+
size: _(G)
|
|
890
892
|
}, null, 8, ["color", "size"])),
|
|
891
893
|
(T(), q(re(e.titleTag), null, {
|
|
892
894
|
default: ye(() => [
|
|
@@ -901,30 +903,30 @@ const le = 2, Ee = le + 2, Ur = (e, r, t = !1) => {
|
|
|
901
903
|
text: e.tooltip
|
|
902
904
|
}, {
|
|
903
905
|
default: ye(() => [
|
|
904
|
-
|
|
905
|
-
color: `var(--kui-color-text-neutral, ${
|
|
906
|
-
size:
|
|
906
|
+
M(_(ur), {
|
|
907
|
+
color: `var(--kui-color-text-neutral, ${_(oe)})`,
|
|
908
|
+
size: _(G)
|
|
907
909
|
}, null, 8, ["color", "size"])
|
|
908
910
|
]),
|
|
909
911
|
_: 1
|
|
910
912
|
}, 8, ["text"])) : V("", !0)
|
|
911
913
|
], 2),
|
|
912
|
-
e.description &&
|
|
914
|
+
e.description && _(n) ? (T(), S("div", Gr, [
|
|
913
915
|
x("span", null, w(e.description), 1)
|
|
914
916
|
])) : V("", !0),
|
|
915
917
|
x("div", jr, [
|
|
916
|
-
e.hasError ? (T(),
|
|
917
|
-
|
|
918
|
-
color: `var(--kui-color-text-neutral, ${
|
|
919
|
-
size:
|
|
918
|
+
e.hasError ? (T(), S("div", Hr, [
|
|
919
|
+
M(_(Oe), {
|
|
920
|
+
color: `var(--kui-color-text-neutral, ${_(oe)})`,
|
|
921
|
+
size: _(Xr)
|
|
920
922
|
}, null, 8, ["color", "size"]),
|
|
921
923
|
x("div", null, " " + w(e.errorMessage), 1)
|
|
922
|
-
])) : (T(),
|
|
924
|
+
])) : (T(), S("div", {
|
|
923
925
|
key: 1,
|
|
924
926
|
class: K(["metricscard-value", e.cardSize]),
|
|
925
927
|
"data-testid": "metric-value"
|
|
926
928
|
}, w(e.metricValue), 3)),
|
|
927
|
-
|
|
929
|
+
_(n) ? (T(), S("div", Yr, [
|
|
928
930
|
x("div", {
|
|
929
931
|
class: K(["metricscard-trend-change", a(e.changePolarity)]),
|
|
930
932
|
"data-testid": "metric-trend-parent"
|
|
@@ -932,15 +934,15 @@ const le = 2, Ee = le + 2, Ur = (e, r, t = !1) => {
|
|
|
932
934
|
e.changePolarity !== 0 ? (T(), q(re(e.trendIcon), {
|
|
933
935
|
key: 0,
|
|
934
936
|
color: o(e.changePolarity),
|
|
935
|
-
size:
|
|
936
|
-
}, null, 8, ["color", "size"])) : (T(), q(
|
|
937
|
+
size: _(G)
|
|
938
|
+
}, null, 8, ["color", "size"])) : (T(), q(_(lr), {
|
|
937
939
|
key: 1,
|
|
938
|
-
color: `var(--kui-color-text-neutral-strong, ${
|
|
939
|
-
size:
|
|
940
|
+
color: `var(--kui-color-text-neutral-strong, ${_(_e)})`,
|
|
941
|
+
size: _(G)
|
|
940
942
|
}, null, 8, ["color", "size"])),
|
|
941
943
|
x("div", Qr, w(e.metricChange), 1)
|
|
942
944
|
], 2),
|
|
943
|
-
e.trendRange ? (T(),
|
|
945
|
+
e.trendRange ? (T(), S("div", Wr, w(e.trendRange), 1)) : V("", !0)
|
|
944
946
|
])) : V("", !0)
|
|
945
947
|
])
|
|
946
948
|
], 2);
|
|
@@ -954,9 +956,9 @@ const le = 2, Ee = le + 2, Ur = (e, r, t = !1) => {
|
|
|
954
956
|
}, Zr = /* @__PURE__ */ ce(Jr, [["__scopeId", "data-v-b1513f6f"]]), et = {}, rt = { class: "loading-tabs" };
|
|
955
957
|
function tt(e, r) {
|
|
956
958
|
const t = Ae("KSkeletonBox");
|
|
957
|
-
return T(),
|
|
958
|
-
|
|
959
|
-
|
|
959
|
+
return T(), S("div", rt, [
|
|
960
|
+
M(t, { width: "100" }),
|
|
961
|
+
M(t, { width: "75" })
|
|
960
962
|
]);
|
|
961
963
|
}
|
|
962
964
|
const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d7"]]), at = {
|
|
@@ -1017,7 +1019,7 @@ const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d
|
|
|
1017
1019
|
}
|
|
1018
1020
|
},
|
|
1019
1021
|
setup(e) {
|
|
1020
|
-
const r = e, t =
|
|
1022
|
+
const r = e, t = g(() => r.cards.every((a) => (a == null ? void 0 : a.hasError) === !0)), o = (a) => {
|
|
1021
1023
|
const n = Kr(a.currentValue, a.previousValue) || 0, l = Ur(n, r.hasTrendAccess, a.increaseIsBad);
|
|
1022
1024
|
return {
|
|
1023
1025
|
metricValue: a.formatValueFn ? a.formatValueFn(a.currentValue) : qr(a.currentValue, { capital: !0, round: !0 }) || "0",
|
|
@@ -1028,24 +1030,24 @@ const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d
|
|
|
1028
1030
|
hasContainerTitle: !!r.containerTitle
|
|
1029
1031
|
};
|
|
1030
1032
|
};
|
|
1031
|
-
return (a, n) => (T(),
|
|
1033
|
+
return (a, n) => (T(), S("div", {
|
|
1032
1034
|
class: K(["kong-ui-public-metric-card-container", e.cardSize])
|
|
1033
1035
|
}, [
|
|
1034
|
-
r.containerTitle || r.containerDescription ? (T(),
|
|
1036
|
+
r.containerTitle || r.containerDescription ? (T(), S("div", at, [
|
|
1035
1037
|
De(w(r.containerTitle) + " ", 1),
|
|
1036
|
-
r.containerDescription ? (T(),
|
|
1038
|
+
r.containerDescription ? (T(), S("div", it, w(r.containerDescription), 1)) : V("", !0)
|
|
1037
1039
|
])) : V("", !0),
|
|
1038
|
-
t.value ? (T(),
|
|
1039
|
-
|
|
1040
|
-
e.errorMessage ? (T(),
|
|
1041
|
-
])) : (T(),
|
|
1042
|
-
(T(!0),
|
|
1043
|
-
e.loading ? (T(),
|
|
1040
|
+
t.value ? (T(), S("div", ot, [
|
|
1041
|
+
M(_(Oe), { class: "error-display-icon" }),
|
|
1042
|
+
e.errorMessage ? (T(), S("div", st, w(e.errorMessage), 1)) : V("", !0)
|
|
1043
|
+
])) : (T(), S("div", ut, [
|
|
1044
|
+
(T(!0), S(he, null, Xe(e.cards, (l, c) => (T(), S(he, null, [
|
|
1045
|
+
e.loading ? (T(), S("div", {
|
|
1044
1046
|
key: `skeleton-${c}`,
|
|
1045
1047
|
class: "loading-tab"
|
|
1046
1048
|
}, [
|
|
1047
|
-
|
|
1048
|
-
class: K(e.cardSize ===
|
|
1049
|
+
M(nt, {
|
|
1050
|
+
class: K(e.cardSize === _(D).Small ? "loading-tabs-small" : "loading-tabs-large")
|
|
1049
1051
|
}, null, 8, ["class"])
|
|
1050
1052
|
])) : (T(), q(Zr, Ge({ key: c }, { ref_for: !0 }, o(l), {
|
|
1051
1053
|
"card-size": e.cardSize,
|
|
@@ -1070,19 +1072,19 @@ const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d
|
|
|
1070
1072
|
cardToDisplay: { default: void 0 }
|
|
1071
1073
|
},
|
|
1072
1074
|
setup(e) {
|
|
1073
|
-
const r = e, t =
|
|
1075
|
+
const r = e, t = Se(Ne);
|
|
1074
1076
|
if (!t)
|
|
1075
1077
|
throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");
|
|
1076
|
-
const { traffic: o, latency: a } = t.data, { i18n: n } = N.useI18n(), l =
|
|
1078
|
+
const { traffic: o, latency: a } = t.data, { i18n: n } = N.useI18n(), l = g(() => t.containerTitle.value ? D.Medium : r.cardSize), c = N.useMetricCardBuilder({
|
|
1077
1079
|
cardType: O.TRAFFIC,
|
|
1078
|
-
title:
|
|
1080
|
+
title: g(() => t.longCardTitles ? n.t("metricCard.long.traffic") : n.t("metricCard.short.traffic")),
|
|
1079
1081
|
record: o.mapped,
|
|
1080
1082
|
hasError: o.hasError,
|
|
1081
1083
|
lookupKey: r.lookupKey,
|
|
1082
1084
|
sumGroupedValues: $,
|
|
1083
1085
|
trendRange: o.trendRange
|
|
1084
|
-
}), f = (m) => `${m.toFixed(le)}%`, i =
|
|
1085
|
-
const m = o.mapped.value,
|
|
1086
|
+
}), f = (m) => `${m.toFixed(le)}%`, i = g(() => {
|
|
1087
|
+
const m = o.mapped.value, E = P(m, "current", r.lookupKey, ge), p = P(m, "current", r.lookupKey, $), y = E / p * 100 || 0, I = P(m, "previous", r.lookupKey, ge), C = P(m, "previous", r.lookupKey, $), A = I / C * 100 || 0;
|
|
1086
1088
|
return {
|
|
1087
1089
|
cardType: O.ERROR_RATE,
|
|
1088
1090
|
hasError: o.hasError.value,
|
|
@@ -1095,8 +1097,8 @@ const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d
|
|
|
1095
1097
|
};
|
|
1096
1098
|
}), s = (m) => `${m}ms`, u = N.useMetricCardBuilder({
|
|
1097
1099
|
cardType: O.LATENCY,
|
|
1098
|
-
title:
|
|
1099
|
-
const { longCardTitles: m, averageLatencies:
|
|
1100
|
+
title: g(() => {
|
|
1101
|
+
const { longCardTitles: m, averageLatencies: E } = t, p = E.value ? "averageLatency" : "p99Latency";
|
|
1100
1102
|
return m ? n.t(`metricCard.long.${p}`) : l.value === D.Small ? n.t(`metricCard.small.${p}`) : n.t(`metricCard.short.${p}`);
|
|
1101
1103
|
}),
|
|
1102
1104
|
hasError: a.hasError,
|
|
@@ -1105,7 +1107,7 @@ const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d
|
|
|
1105
1107
|
increaseIsBad: !0,
|
|
1106
1108
|
formatValueFn: s,
|
|
1107
1109
|
trendRange: a.trendRange
|
|
1108
|
-
}), d =
|
|
1110
|
+
}), d = g(() => r.cardToDisplay === "TRAFFIC" ? [c.value] : r.cardToDisplay === "ERROR_RATE" ? [i.value] : r.cardToDisplay === "LATENCY" ? [u.value] : [c.value, i.value, u.value]), v = g(() => r.cardToDisplay === "TRAFFIC" || r.cardToDisplay === "ERROR_RATE" ? o.isLoading.value : r.cardToDisplay === "LATENCY" ? a.isLoading.value : o.isLoading.value || a.isLoading.value), h = g(() => ({
|
|
1109
1111
|
cards: d.value,
|
|
1110
1112
|
containerTitle: t.containerTitle.value,
|
|
1111
1113
|
containerDescription: t.description.value,
|
|
@@ -1114,16 +1116,16 @@ const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d
|
|
|
1114
1116
|
fallbackDisplayText: n.t("general.notAvailable"),
|
|
1115
1117
|
cardSize: l.value,
|
|
1116
1118
|
hideTitle: !0
|
|
1117
|
-
})), R =
|
|
1118
|
-
loading:
|
|
1119
|
+
})), R = g(() => ({
|
|
1120
|
+
loading: h.value.loading,
|
|
1119
1121
|
trafficCard: c.value,
|
|
1120
1122
|
errorRateCard: i.value,
|
|
1121
1123
|
latencyCard: u.value,
|
|
1122
1124
|
errorRateFormatted: f(i.value.currentValue),
|
|
1123
1125
|
latencyFormatted: s(u.value.currentValue)
|
|
1124
1126
|
}));
|
|
1125
|
-
return (m,
|
|
1126
|
-
|
|
1127
|
+
return (m, E) => Ie(m.$slots, "default", { cardValues: R.value }, () => [
|
|
1128
|
+
M(ct, je(He(h.value)), null, 16)
|
|
1127
1129
|
]);
|
|
1128
1130
|
}
|
|
1129
1131
|
}), j = (e) => new Date(e), Et = (e, r) => {
|
|
@@ -1132,17 +1134,17 @@ const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d
|
|
|
1132
1134
|
statusCode: 200,
|
|
1133
1135
|
body: dt(t, r)
|
|
1134
1136
|
});
|
|
1135
|
-
},
|
|
1136
|
-
var
|
|
1137
|
-
const t = be.get(se.ONE_DAY), o = e.granularity === "trend" ? new We(t) : new Je(t), a = o.endMs(), n = o.startMs(), l = o.granularityMs(), c = e.granularity === "trend" ? 2 : 1;
|
|
1137
|
+
}, Ce = (e) => e.reduce((r, t) => (r[t] = { name: t }, r), {}), dt = (e, r) => {
|
|
1138
|
+
var h, R;
|
|
1139
|
+
const t = (r == null ? void 0 : r.timeFrame) || be.get(se.ONE_DAY), o = e.granularity === "trend" ? new We(t) : new Je(t), a = o.endMs(), n = o.startMs(), l = o.granularityMs(), c = e.granularity === "trend" ? 2 : 1;
|
|
1138
1140
|
if ((e.dimensions ?? []).length > 2)
|
|
1139
1141
|
throw new Error(`Explore only supports 0-2 dimensions; got: ${JSON.stringify(e.dimensions)}`);
|
|
1140
1142
|
const f = (e.dimensions ?? []).find((m) => m !== "time"), i = (r == null ? void 0 : r.dimensionNames) ?? [], s = Math.max(i.length, 1), u = e.metrics || [], d = [];
|
|
1141
1143
|
for (let m = 0; m < c; m++)
|
|
1142
|
-
for (let
|
|
1143
|
-
const p = f ? { [f]: i[
|
|
1144
|
-
(
|
|
1145
|
-
const I = u.reduce((
|
|
1144
|
+
for (let E = 0; E < s; E++) {
|
|
1145
|
+
const p = f ? { [f]: i[E] } : {};
|
|
1146
|
+
(h = e.dimensions) != null && h.includes("status_code_grouped") ? $.forEach((y) => {
|
|
1147
|
+
const I = u.reduce((C, A) => ((r == null ? void 0 : r.deterministic) ?? !0 ? C[A] = (c - m) * 1e3 + 100 * E + 1 : C[A] = Math.round(Math.random() * 1e3), C), { ...p, status_code_grouped: y });
|
|
1146
1148
|
d.push({
|
|
1147
1149
|
version: "v1",
|
|
1148
1150
|
timestamp: m === 0 ? j(n).toISOString() : j(n + l).toISOString(),
|
|
@@ -1151,7 +1153,7 @@ const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d
|
|
|
1151
1153
|
}) : d.push({
|
|
1152
1154
|
version: "v1",
|
|
1153
1155
|
timestamp: m === 0 ? j(n).toISOString() : j(n + l).toISOString(),
|
|
1154
|
-
event: u.reduce((y, I) => ((r == null ? void 0 : r.deterministic) ?? !0 ? y[I] = (c - m) * 1e3 + 100 *
|
|
1156
|
+
event: u.reduce((y, I) => ((r == null ? void 0 : r.deterministic) ?? !0 ? y[I] = (c - m) * 1e3 + 100 * E + 1 : y[I] = Math.round(Math.random() * 1e3), y), { ...p })
|
|
1155
1157
|
});
|
|
1156
1158
|
}
|
|
1157
1159
|
const v = {
|
|
@@ -1161,8 +1163,8 @@ const nt = /* @__PURE__ */ ce(et, [["render", tt], ["__scopeId", "data-v-9c7113d
|
|
|
1161
1163
|
end: new Date(a).toISOString(),
|
|
1162
1164
|
granularity_ms: l,
|
|
1163
1165
|
display: f ? {
|
|
1164
|
-
[f]:
|
|
1165
|
-
...(R = e.dimensions) != null && R.includes("status_code_grouped") ? { status_code_grouped:
|
|
1166
|
+
[f]: Ce(i),
|
|
1167
|
+
...(R = e.dimensions) != null && R.includes("status_code_grouped") ? { status_code_grouped: Ce($) } : {}
|
|
1166
1168
|
} : {},
|
|
1167
1169
|
metric_names: e.metrics,
|
|
1168
1170
|
query_id: "test"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(R,r){typeof exports=="object"&&typeof module<"u"?r(exports,require("vue"),require("@kong-ui-public/analytics-utilities"),require("@kong-ui-public/i18n"),require("axios"),require("@kong-ui-public/analytics-config-store"),require("@kong/icons")):typeof define=="function"&&define.amd?define(["exports","vue","@kong-ui-public/analytics-utilities","@kong-ui-public/i18n","axios","@kong-ui-public/analytics-config-store","@kong/icons"],r):(R=typeof globalThis<"u"?globalThis:R||self,r(R["kong-ui-public-vitals-metric-provider"]={},R.Vue,R["kong-ui-public-analytics-utilities"],R["kong-ui-public-i18n"],R.axios,R["kong-ui-public-analytics-config-store"],R.KongIcons))})(this,function(R,r,D,re,Rr,Te,_){"use strict";const Ce={general:{notAvailable:"N/A"},metricCard:{small:{traffic:"Requests",errorRate:"Error rate",averageLatency:"Avg. latency",p99Latency:"P99 latency"},short:{traffic:"Requests",errorRate:"Error rate",averageLatency:"Average latency",p99Latency:"P99 latency"},long:{traffic:"Number of requests",errorRate:"Average error rate",averageLatency:"Average latency",p99Latency:"P99 latency"}},trendRange:{custom:"vs previous {numDays, plural, =1 {day} other {# days}}","15m":"vs previous 15 minutes","1h":"vs previous hour","6h":"vs previous 6 hours","12h":"vs previous 12 hours","24h":"vs previous 24 hours","7d":"vs previous 7 days","30d":"vs previous 30 days",current_week:"vs previous week",current_month:"vs previous month",current_quarter:"vs previous quarter",previous_week:"vs previous time period",previous_month:"vs previous time period",previous_quarter:"vs previous quarter"}};function Se(){const e=re.createI18n("en-us",Ce);return{i18n:e,i18nT:re.i18nTComponent(e)}}const te=2,w=["1XX","2XX","3XX","4XX","5XX"],K=["4XX","5XX"],_e=["1XX","2XX","3XX"],ne=30*1e3,ae="analytics-query-provider";var ie=(e=>(e.VALIDATING="VALIDATING",e.VALIDATING_HAS_DATA="VALIDATING_HAS_DATA",e.PENDING="PENDING",e.SUCCESS="SUCCESS",e.SUCCESS_HAS_DATA="SUCCESS_HAS_DATA",e.ERROR="ERROR",e.STALE_IF_ERROR="STALE_IF_ERROR",e))(ie||{});const Ie=e=>{var t,n,s,i,a;return e?!!((t=Object.keys(e))!=null&&t.length||(n=e.data)!=null&&n.length||(i=(s=e.data)==null?void 0:s.data)!=null&&i.length||!((a=e.data)!=null&&a.data)&&typeof e.data=="object"&&Object.keys(e==null?void 0:e.data).length):!1};function ke(e=r.ref({}),t,n,s=Ie){const i=r.ref("PENDING");return r.watchEffect(()=>{const a=s(e.value);if(e.value&&a&&n.value){i.value="VALIDATING_HAS_DATA";return}if(e.value&&n.value){i.value="VALIDATING";return}if(e.value&&t.value){i.value="STALE_IF_ERROR";return}if(e.value===void 0&&!t.value){i.value="PENDING";return}if(e.value&&!t.value&&a){i.value="SUCCESS_HAS_DATA";return}if(e.value&&!t.value){i.value="SUCCESS";return}e.value===void 0&&t&&(i.value="ERROR")}),{state:i,swrvState:ie}}const V=Symbol("default"),U="status_code_grouped",oe=(e,t,n,s,i)=>{e[t][n]||(e[t][n]={}),e[t][n][s]=i};function Ae(e,t){var d;const n=((d=e.meta.metric_names)==null?void 0:d[0])||"",s=e.meta.start_ms,i=Object.keys(e.meta.display||{}),a=!!i.find(m=>m===U),u=i.find(m=>m!==U);return i.length>2||i.length>1&&!a?(console.error("Don't know how to work with provided dimensions:",i),{previous:{[V]:{[V]:0}},current:{[V]:{[V]:0}}}):e.data.reduce((m,o)=>{const l=o.event[n],c=u?o.event[u]:V,f=a?o.event[U]:V;return new Date(o.timestamp).getTime()===s&&t?oe(m,"previous",c,f,l):oe(m,"current",c,f,l),m},{previous:{},current:{}})}function De(e){e.queryReady===void 0&&(e.queryReady=r.computed(()=>!0));const{i18n:t}=N.useI18n(),n=r.computed(()=>{var c,f;return{metrics:e.metrics.value,dimensions:[...(c=e.dimensions)!=null&&c.length?[...e.dimensions]:[],...e.withTrend.value?["time"]:[]],granularity:e.withTrend.value?"trend":void 0,...(f=e.filter.value)!=null&&f.length?{filters:e.filter.value}:{},time_range:e.timeframe.value.v4Query(e.tz.value)}}),s=r.computed(()=>{var f,y,p,E;if(!((f=e.queryReady)!=null&&f.value))return null;const c=(y=e.filter)!=null&&y.value?JSON.stringify(e.filter.value):"";return`metric-fetcher-${e.timeframe.value.cacheKey()}-${(p=e.dimensions)==null?void 0:p.join("-")}-${(E=e.metrics.value)==null?void 0:E.join("-")}-${c}-${e.refreshCounter.value}`}),{response:i,error:a,isValidating:u}=N.useRequest(()=>s.value,()=>e.queryFn({datasource:e.datasource.value,query:n.value},e.abortController??new AbortController),{refreshInterval:e.refreshInterval,revalidateOnFocus:!1,errorRetryCount:te}),{state:d,swrvState:m}=ke(i,a,u),o=r.computed(()=>{var c,f,y,p,E,g,T;return!((f=(c=i.value)==null?void 0:c.data)!=null&&f.length)||!((p=(y=i.value)==null?void 0:y.meta)!=null&&p.display)||!((T=(g=(E=i.value)==null?void 0:E.meta)==null?void 0:g.metric_names)!=null&&T.length)?{current:{},previous:{}}:Ae(i.value,e.withTrend.value)}),l=r.computed(()=>{var c,f;if(e.timeframe.value.key==="custom"){if(!((f=(c=i.value)==null?void 0:c.meta)!=null&&f.start_ms))return"";const{start_ms:y,end_ms:p}=i.value.meta;let E=(p-y)/(1e3*60*60*24);return e.withTrend.value&&(E/=2),t.t("trendRange.custom",{numDays:Math.round(E)})}else return e.withTrend.value?t.t(`trendRange.${e.timeframe.value.key}`):""});return{isLoading:r.computed(()=>m.PENDING===d.value),hasError:r.computed(()=>m.ERROR===d.value),raw:i,mapped:o,trendRange:l}}const L=(e,t,n=V,s)=>(s??[V]).reduce((a,u)=>{const d=e[t][n];return d?a+(d[u]||0):a},0);function be(e){const{cardType:t,title:n,description:s,record:i,hasError:a,increaseIsBad:u,formatValueFn:d,trendRange:m}=e;return r.computed(()=>{let o=0,l=0;if(i!=null&&i.value)try{o=L(i.value,"current",e.lookupKey,e.sumGroupedValues),l=L(i.value,"previous",e.lookupKey,e.sumGroupedValues)}catch(c){console.error("Metric card data doesn't have the expected structure:",c)}return{cardType:t,hasError:a.value,currentValue:o,previousValue:l,title:n.value,description:s,increaseIsBad:!!u,formatValueFn:d,trendRange:m==null?void 0:m.value}})}var $=new WeakMap,se=0;function Ve(e){if(!e.length)return"";for(var t="arg",n=0;n<e.length;++n){var s=void 0;e[n]===null||typeof e[n]!="object"&&typeof e[n]!="function"?typeof e[n]=="string"?s='"'+e[n]+'"':s=String(e[n]):$.has(e[n])?s=$.get(e[n]):(s=se,$.set(e[n],se++)),t+="@"+s}return t}function Ne(e){if(typeof e=="function")try{e=e()}catch{e=""}return Array.isArray(e)?e=Ve(e):e=String(e||""),e}var X=function(){function e(t){t===void 0&&(t=0),this.items=new Map,this.ttl=t}return e.prototype.serializeKey=function(t){return Ne(t)},e.prototype.get=function(t){var n=this.serializeKey(t);return this.items.get(n)},e.prototype.set=function(t,n,s){var i=this.serializeKey(t),a=s||this.ttl,u=Date.now(),d={data:n,createdAt:u,expiresAt:a?u+a:1/0};this.dispatchExpire(a,d,i),this.items.set(i,d)},e.prototype.dispatchExpire=function(t,n,s){var i=this;t&&setTimeout(function(){var a=Date.now(),u=a>=n.expiresAt;u&&i.delete(s)},t)},e.prototype.delete=function(t){this.items.delete(t)},e}();function Oe(){return typeof navigator.onLine<"u"?navigator.onLine:!0}function we(){return typeof document<"u"&&typeof document.visibilityState<"u"?document.visibilityState!=="hidden":!0}var Le=function(e){return fetch(e).then(function(t){return t.json()})};const G={isOnline:Oe,isDocumentVisible:we,fetcher:Le};var b=function(){return b=Object.assign||function(e){for(var t,n=1,s=arguments.length;n<s;n++){t=arguments[n];for(var i in t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i])}return e},b.apply(this,arguments)},B=function(e,t,n,s){function i(a){return a instanceof n?a:new n(function(u){u(a)})}return new(n||(n=Promise))(function(a,u){function d(l){try{o(s.next(l))}catch(c){u(c)}}function m(l){try{o(s.throw(l))}catch(c){u(c)}}function o(l){l.done?a(l.value):i(l.value).then(d,m)}o((s=s.apply(e,t||[])).next())})},F=function(e,t){var n={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},s,i,a,u;return u={next:d(0),throw:d(1),return:d(2)},typeof Symbol=="function"&&(u[Symbol.iterator]=function(){return this}),u;function d(o){return function(l){return m([o,l])}}function m(o){if(s)throw new TypeError("Generator is already executing.");for(;n;)try{if(s=1,i&&(a=o[0]&2?i.return:o[0]?i.throw||((a=i.return)&&a.call(i),0):i.next)&&!(a=a.call(i,o[1])).done)return a;switch(i=0,a&&(o=[o[0]&2,a.value]),o[0]){case 0:case 1:a=o;break;case 4:return n.label++,{value:o[1],done:!1};case 5:n.label++,i=o[1],o=[0];continue;case 7:o=n.ops.pop(),n.trys.pop();continue;default:if(a=n.trys,!(a=a.length>0&&a[a.length-1])&&(o[0]===6||o[0]===2)){n=0;continue}if(o[0]===3&&(!a||o[1]>a[0]&&o[1]<a[3])){n.label=o[1];break}if(o[0]===6&&n.label<a[1]){n.label=a[1],a=o;break}if(a&&n.label<a[2]){n.label=a[2],n.ops.push(o);break}a[2]&&n.ops.pop(),n.trys.pop();continue}o=t.call(e,n)}catch(l){o=[6,l],i=0}finally{s=a=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}},Be=function(e,t){var n=typeof Symbol=="function"&&e[Symbol.iterator];if(!n)return e;var s=n.call(e),i,a=[],u;try{for(;(t===void 0||t-- >0)&&!(i=s.next()).done;)a.push(i.value)}catch(d){u={error:d}}finally{try{i&&!i.done&&(n=s.return)&&n.call(s)}finally{if(u)throw u.error}}return a},Fe=function(e,t,n){if(n||arguments.length===2)for(var s=0,i=t.length,a;s<i;s++)(a||!(s in t))&&(a||(a=Array.prototype.slice.call(t,0,s)),a[s]=t[s]);return e.concat(a||Array.prototype.slice.call(t))},le=new X,q=new X,j=new X,ce={cache:le,refreshInterval:0,ttl:0,serverTTL:1e3,dedupingInterval:2e3,revalidateOnFocus:!0,revalidateDebounce:0,shouldRetryOnError:!0,errorRetryInterval:5e3,errorRetryCount:5,fetcher:G.fetcher,isOnline:G.isOnline,isDocumentVisible:G.isDocumentVisible};function Me(e,t,n){var s=q.get(e);if(s)s.data.push(t);else{var i=5e3;q.set(e,[t],n>0?n+i:n)}}function qe(e,t,n){if(n.isDocumentVisible()&&!(n.errorRetryCount!==void 0&&t>n.errorRetryCount)){var s=Math.min(t||0,n.errorRetryCount),i=s*n.errorRetryInterval;setTimeout(function(){e(null,{errorRetryCount:s+1,shouldRetryOnError:!0})},i)}}var ue=function(e,t,n,s){return n===void 0&&(n=le),s===void 0&&(s=ce.ttl),B(void 0,void 0,void 0,function(){var i,a,u,d,m,o,l;return F(this,function(c){switch(c.label){case 0:if(!ze(t))return[3,5];c.label=1;case 1:return c.trys.push([1,3,,4]),[4,t];case 2:return i=c.sent(),[3,4];case 3:return d=c.sent(),a=d,[3,4];case 4:return[3,6];case 5:i=t,c.label=6;case 6:if(u=!1,m={data:i,error:a,isValidating:u},typeof i<"u")try{n.set(e,m,s)}catch(f){console.error("swrv(mutate): failed to set cache",f)}return o=q.get(e),o&&o.data.length&&(l=o.data.filter(function(f){return f.key===e}),l.forEach(function(f,y){typeof m.data<"u"&&(f.data=m.data),f.error=m.error,f.isValidating=m.isValidating,f.isLoading=m.isValidating;var p=y===l.length-1;p||delete l[y]}),l=l.filter(Boolean)),[2,m]}})})};function xe(){for(var e=this,t=[],n=0;n<arguments.length;n++)t[n]=arguments[n];var s,i,a=b({},ce),u=!1,d=!1,m=r.getCurrentInstance(),o=(m==null?void 0:m.proxy)||m;if(!o)return console.error("Could not get current instance, check to make sure that `useSwrv` is declared in the top level of the setup function."),null;var l=(o==null?void 0:o.$isServer)||!1;t.length>=1&&(s=t[0]),t.length>=2&&(i=t[1]),t.length>2&&(a=b(b({},a),t[2]));var c=l?a.serverTTL:a.ttl,f=typeof s=="function"?s:r.ref(s);typeof i>"u"&&(i=a.fetcher);var y=null;y||(y=r.reactive({data:void 0,error:void 0,isValidating:!0,isLoading:!0,key:null}));var p=function(v,h){return B(e,void 0,void 0,function(){var S,C,A,M,W,pe,J,ve=this;return F(this,function(Z){switch(Z.label){case 0:return S=y.data===void 0,C=f.value,C?(A=a.cache.get(C),M=A&&A.data,y.isValidating=!0,y.isLoading=!M,M&&(y.data=M.data,y.error=M.error),W=v||i,!W||!a.isDocumentVisible()&&!S||(h==null?void 0:h.forceRevalidate)!==void 0&&!(h!=null&&h.forceRevalidate)?(y.isValidating=!1,y.isLoading=!1,[2]):A&&(pe=!!(Date.now()-A.createdAt>=a.dedupingInterval||h!=null&&h.forceRevalidate),!pe)?(y.isValidating=!1,y.isLoading=!1,[2]):(J=function(){return B(ve,void 0,void 0,function(){var O,Ee,ee,Re;return F(this,function(P){switch(P.label){case 0:return O=j.get(C),O?[3,2]:(Ee=Array.isArray(C)?C:[C],ee=W.apply(void 0,Fe([],Be(Ee),!1)),j.set(C,ee,a.dedupingInterval),[4,ue(C,ee,a.cache,c)]);case 1:return P.sent(),[3,4];case 2:return[4,ue(C,O.data,a.cache,c)];case 3:P.sent(),P.label=4;case 4:return y.isValidating=!1,y.isLoading=!1,j.delete(C),y.error!==void 0&&(Re=!u&&a.shouldRetryOnError&&(h?h.shouldRetryOnError:!0),Re&&qe(p,h?h.errorRetryCount:1,a)),[2]}})})},M&&a.revalidateDebounce?(setTimeout(function(){return B(ve,void 0,void 0,function(){return F(this,function(O){switch(O.label){case 0:return u?[3,2]:[4,J()];case 1:O.sent(),O.label=2;case 2:return[2]}})})},a.revalidateDebounce),[3,3]):[3,1])):[2];case 1:return[4,J()];case 2:Z.sent(),Z.label=3;case 3:return[2]}})})},E=function(){return B(e,void 0,void 0,function(){return F(this,function(v){return[2,p(null,{shouldRetryOnError:!1})]})})},g=null;r.onMounted(function(){var v=function(){return B(e,void 0,void 0,function(){return F(this,function(h){switch(h.label){case 0:return!y.error&&a.isOnline()?[4,p()]:[3,2];case 1:return h.sent(),[3,3];case 2:g&&clearTimeout(g),h.label=3;case 3:return a.refreshInterval&&!u&&(g=setTimeout(v,a.refreshInterval)),[2]}})})};a.refreshInterval&&(g=setTimeout(v,a.refreshInterval)),a.revalidateOnFocus&&(document.addEventListener("visibilitychange",E,!1),window.addEventListener("focus",E,!1))}),r.onUnmounted(function(){u=!0,g&&clearTimeout(g),a.revalidateOnFocus&&(document.removeEventListener("visibilitychange",E,!1),window.removeEventListener("focus",E,!1));var v=q.get(f.value);v&&(v.data=v.data.filter(function(h){return h!==y}))});try{r.watch(f,function(v){r.isReadonly(f)||(f.value=v),y.key=v,y.isValidating=!!v,Me(f.value,y,c),!l&&!d&&f.value&&p(),d=!1},{immediate:!0})}catch{}var T=b(b({},r.toRefs(y)),{mutate:function(v,h){return p(v,b(b({},h),{forceRevalidate:!0}))}});return T}function ze(e){return e!==null&&typeof e=="object"&&typeof e.then=="function"}function Pe(e,t,n){const{data:s,error:i,isValidating:a,mutate:u}=xe(e,t,{revalidateDebounce:500,revalidateOnFocus:!1,dedupingInterval:100,...n});return{data:r.computed(()=>s.value),response:s,error:i,isValidating:a,revalidate:u}}const N={useI18n:Se,useMetricCardBuilder:be,useMetricFetcher:De,useRequest:Pe},de=Symbol("METRICS_PROVIDER_KEY"),Ke=e=>{const{datasource:t,dimension:n,dimensionFilterValue:s,additionalFilter:i,queryReady:a,timeframe:u,tz:d,hasTrendAccess:m,refreshInterval:o,abortController:l,queryFn:c,averageLatencies:f}=e;if(s&&!n)throw new Error("Must provide a dimension if filtering by a value");const y=!!(n&&s),p=!!(n&&!s),E=r.computed(()=>{const S=[];return y&&S.push({field:n,operator:"in",value:[s]}),i.value&&S.push(...D.stripUnknownFilters(t.value,i.value)),S}),g={datasource:t,metrics:r.ref(["request_count"]),dimensions:[...n&&!y?[n]:[],"status_code_grouped"],filter:E,queryReady:a,timeframe:u,tz:d,withTrend:r.computed(()=>m.value&&!p),refreshInterval:o,queryFn:c,abortController:l,refreshCounter:e.refreshCounter},T={datasource:t,metrics:r.computed(()=>[f.value?"response_latency_average":"response_latency_p99"]),...n&&!y?{dimensions:[n]}:{},filter:E,queryReady:a,timeframe:u,tz:d,withTrend:r.computed(()=>m.value&&!p),refreshInterval:o,queryFn:c,abortController:l,refreshCounter:e.refreshCounter},v=N.useMetricFetcher(g),h=N.useMetricFetcher(T);return{trafficData:v,latencyData:h}},Ue=r.defineComponent({__name:"MetricsProvider",props:{datasource:{default:void 0},maxTimeframe:{default:D.TimeframeKeys.THIRTY_DAY},overrideTimeframe:{default:void 0},tz:{default:void 0},dimension:{default:void 0},filterValue:{default:void 0},additionalFilter:{default:void 0},queryReady:{type:Boolean,default:!0},refreshInterval:{default:ne},longCardTitles:{type:Boolean,default:!1},containerTitle:{default:void 0},description:{default:void 0},percentileLatency:{type:Boolean,default:void 0},abortController:{default:void 0},refreshCounter:{default:0}},setup(e){const t=e;if(t.dimension&&D.queryableExploreDimensions.findIndex(y=>y===t.dimension)===-1)throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${t.dimension}`);const n=r.inject(ae);let s;n?s=n.queryFn:(console.warn("Analytics dashboards require a query bridge supplied via provide / inject."),console.warn("Please ensure your application has a query bridge provided under the key 'analytics-query-provider', as described in"),console.warn("https://github.com/Kong/public-ui-components/blob/main/packages/analytics/analytics-metric-provider/README.md#requirements"),s=()=>Promise.reject(new Error("Query bridge required")));const i=Te.useAnalyticsConfigStore(),a=r.computed(()=>!0),u=r.computed(()=>!i.loading&&t.queryReady),d=r.computed(()=>t.tz?t.tz:new Intl.DateTimeFormat().resolvedOptions().timeZone),m=r.computed(()=>t.datasource?t.datasource:"basic"),o=r.computed(()=>t.overrideTimeframe||D.TimePeriods.get(D.TimeframeKeys.SEVEN_DAY)),l=r.computed(()=>!t.percentileLatency),{trafficData:c,latencyData:f}=Ke({datasource:m,dimension:t.dimension,dimensionFilterValue:t.filterValue,additionalFilter:r.toRef(t,"additionalFilter"),queryReady:u,timeframe:o,tz:d,hasTrendAccess:a,refreshInterval:t.refreshInterval,queryFn:s,averageLatencies:l,abortController:t.abortController,refreshCounter:r.toRef(t,"refreshCounter")});return r.provide(de,{data:{traffic:c,latency:f},description:r.toRef(()=>t.description),containerTitle:r.toRef(()=>t.containerTitle),hasTrendAccess:a,longCardTitles:t.longCardTitles,averageLatencies:l}),(y,p)=>r.renderSlot(y.$slots,"default",{hasTrendAccess:a.value,timeframe:o.value})}});function $e(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var fe={exports:{}};(function(e){(function(){function t(o,l){if(l.separator===!1||o<1e3)return o.toString();var c=typeof l.separator=="string"?l.separator:",",f=[],y=Math.round(o).toString().split("");return y.reverse().forEach(function(p,E){E&&E%3===0&&f.push(c),f.push(p)}),f.reverse().join("")}function n(o,l,c){var f=o/l,y=c.round?"round":"floor";return c.decimal===!1?(o=Math[y](f),o.toString()):(c.precision?o=f:o=f<10?Math[y](f*10)/10:Math[y](f),o=o.toString(),typeof c.decimal=="string"&&(o=o.replace(".",c.decimal)),o)}var s=1e3,i=1e4,a=1e6,u=1e9,d=1e12;function m(o,l){var c;l=l||{};var f=o<0;f&&(o=Math.abs(o)),l.precision&&(o=parseFloat(o.toPrecision(l.precision)));var y=l.min10k?i:s;return o<y||l.precision&&l.precision>Math.log10(o)?c=t(n(o,1,l),l):o<a?c=n(o,s,l)+"k":o<u?c=n(o,a,l)+"m":o<d?c=t(n(o,u,l),l)+"b":c=t(n(o,d,l),l)+"t",f&&(c="-"+c),l.capital&&(c=c.toUpperCase()),l.prefix&&(c=l.prefix+c),l.suffix&&(c=c+l.suffix),c}m.addCommas=t,e.exports=m})()})(fe);var Xe=fe.exports;const Ge=$e(Xe);var k=(e=>(e.GENERIC_COUNT="GenericCount",e.TRAFFIC="Traffic",e.ERROR_RATE="ErrorRate",e.LATENCY="Latency",e))(k||{}),I=(e=>(e.Small="sm",e.Medium="md",e.Large="lg",e.ExtraLarge="xl",e))(I||{});const Y=2,me=Y+2,je=(e,t,n=!1)=>{let s=!t||Number(e.toFixed(me))===0?0:Number(e.toFixed(me))>0?1:-1;return n&&(s*=-1),s},Ye=(e,t,n)=>t?`${Math.abs(e*100).toFixed(Y)}%`:n,He=(e,t)=>t===0?0:e/t-1,Qe=(e,t=!1)=>(t&&(e*=-1),e>0?_.TrendUpIcon:e<0?_.TrendDownIcon:_.IndeterminateSmallIcon),We="#ad000e",H="#6c7489",ye="#52596e",Je="#007d60",x="16px",Ze="20px",er={key:0,class:"metricscard-description"},rr={class:"metricscard-valuetrend"},tr={key:0,class:"metricscard-error"},nr={key:2,class:"metricscard-trend"},ar={"data-testid":"metric-trend-change"},ir={key:0,class:"metricscard-trend-range"},or=r.defineComponent({__name:"MetricsCard",props:{cardType:{type:String,required:!0,default:k.GENERIC_COUNT},title:{type:String,default:"0%",required:!0},description:{type:String,default:"",required:!1},tooltip:{type:String,required:!1,default:""},timeframe:{type:String,required:!1,default:""},metricValue:{type:String,default:""},metricChange:{type:String,required:!0},changePolarity:{type:Number,required:!0},trendIcon:{type:Object,default:_.IndeterminateSmallIcon},trendRange:{type:String,default:""},hasError:{type:Boolean,default:!1},errorMessage:{type:String,default:"Vitals data error"},cardSize:{type:String,required:!1,default:()=>I.Large},hasContainerTitle:{type:Boolean,required:!1,default:!1},titleTag:{type:String,default:"span"}},setup(e){const t=new Map([[k.GENERIC_COUNT,_.VitalsIcon],[k.TRAFFIC,_.CloudUploadIcon],[k.ERROR_RATE,_.WarningOutlineIcon],[k.LATENCY,_.ResponseIcon]]),n=e,s=d=>{const m={red:`var(--kui-color-text-danger-strong, ${We})`,green:`var(--kui-color-text-success, ${Je})`,grey:`var(--kui-color-text-neutral-strong, ${ye})`};return d>0?m.green:d<0?m.red:m.grey},i=d=>d>0?"positive":d<0?"negative":"neutral",a=[I.Medium,I.Large].includes(n.cardSize),u=[I.Small].includes(n.cardSize);return(d,m)=>{const o=r.resolveComponent("KTooltip");return r.openBlock(),r.createElementBlock("div",{class:r.normalizeClass(["metricscard",e.cardSize])},[r.createElementVNode("div",{class:r.normalizeClass(["metricscard-title",e.cardSize])},[r.unref(u)?r.createCommentVNode("",!0):(r.openBlock(),r.createBlock(r.resolveDynamicComponent(r.unref(t).get(e.cardType)),{key:0,class:"metricscard-icon",color:`var(--kui-color-text-neutral, ${r.unref(H)})`,size:r.unref(x)},null,8,["color","size"])),(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.titleTag),null,{default:r.withCtx(()=>[r.createTextVNode(r.toDisplayString(e.title),1)]),_:1})),e.tooltip?(r.openBlock(),r.createBlock(o,{key:1,class:"metricscard-tooltip",placement:"right",text:e.tooltip},{default:r.withCtx(()=>[r.createVNode(r.unref(_.InfoIcon),{color:`var(--kui-color-text-neutral, ${r.unref(H)})`,size:r.unref(x)},null,8,["color","size"])]),_:1},8,["text"])):r.createCommentVNode("",!0)],2),e.description&&r.unref(a)?(r.openBlock(),r.createElementBlock("div",er,[r.createElementVNode("span",null,r.toDisplayString(e.description),1)])):r.createCommentVNode("",!0),r.createElementVNode("div",rr,[e.hasError?(r.openBlock(),r.createElementBlock("div",tr,[r.createVNode(r.unref(_.WarningIcon),{color:`var(--kui-color-text-neutral, ${r.unref(H)})`,size:r.unref(Ze)},null,8,["color","size"]),r.createElementVNode("div",null," "+r.toDisplayString(e.errorMessage),1)])):(r.openBlock(),r.createElementBlock("div",{key:1,class:r.normalizeClass(["metricscard-value",e.cardSize]),"data-testid":"metric-value"},r.toDisplayString(e.metricValue),3)),r.unref(a)?(r.openBlock(),r.createElementBlock("div",nr,[r.createElementVNode("div",{class:r.normalizeClass(["metricscard-trend-change",i(e.changePolarity)]),"data-testid":"metric-trend-parent"},[e.changePolarity!==0?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.trendIcon),{key:0,color:s(e.changePolarity),size:r.unref(x)},null,8,["color","size"])):(r.openBlock(),r.createBlock(r.unref(_.EqualIcon),{key:1,color:`var(--kui-color-text-neutral-strong, ${r.unref(ye)})`,size:r.unref(x)},null,8,["color","size"])),r.createElementVNode("div",ar,r.toDisplayString(e.metricChange),1)],2),e.trendRange?(r.openBlock(),r.createElementBlock("div",ir,r.toDisplayString(e.trendRange),1)):r.createCommentVNode("",!0)])):r.createCommentVNode("",!0)])],2)}}}),Q=(e,t)=>{const n=e.__vccOpts||e;for(const[s,i]of t)n[s]=i;return n},sr=Q(or,[["__scopeId","data-v-b1513f6f"]]),lr={},cr={class:"loading-tabs"};function ur(e,t){const n=r.resolveComponent("KSkeletonBox");return r.openBlock(),r.createElementBlock("div",cr,[r.createVNode(n,{width:"100"}),r.createVNode(n,{width:"75"})])}const dr=Q(lr,[["render",ur],["__scopeId","data-v-9c7113d7"]]),fr={key:0,class:"container-title"},mr={key:0,class:"container-description"},yr={key:1,class:"error-display"},gr={key:0,class:"error-display-message"},hr={key:2,class:"cards-wrapper"},pr=Q(r.defineComponent({__name:"MetricCardContainer",props:{fallbackDisplayText:{type:String,required:!0},cards:{type:Array,required:!0},errorMessage:{type:String,required:!1,default:""},loading:{type:Boolean,required:!1,default:!1},hasTrendAccess:{type:Boolean,required:!1,default:!0},cardSize:{type:String,required:!1,default:()=>I.Large},containerTitle:{type:String,required:!1,default:""},containerDescription:{type:String,required:!1,default:""}},setup(e){const t=e,n=r.computed(()=>t.cards.every(i=>(i==null?void 0:i.hasError)===!0)),s=i=>{const a=He(i.currentValue,i.previousValue)||0,u=je(a,t.hasTrendAccess,i.increaseIsBad);return{metricValue:i.formatValueFn?i.formatValueFn(i.currentValue):Ge(i.currentValue,{capital:!0,round:!0})||"0",metricChange:i.formatChangeFn?i.formatChangeFn(a):Ye(a,t.hasTrendAccess,t.fallbackDisplayText),changePolarity:u,trendIcon:Qe(u,i.increaseIsBad),cardSize:t.cardSize,hasContainerTitle:!!t.containerTitle}};return(i,a)=>(r.openBlock(),r.createElementBlock("div",{class:r.normalizeClass(["kong-ui-public-metric-card-container",e.cardSize])},[t.containerTitle||t.containerDescription?(r.openBlock(),r.createElementBlock("div",fr,[r.createTextVNode(r.toDisplayString(t.containerTitle)+" ",1),t.containerDescription?(r.openBlock(),r.createElementBlock("div",mr,r.toDisplayString(t.containerDescription),1)):r.createCommentVNode("",!0)])):r.createCommentVNode("",!0),n.value?(r.openBlock(),r.createElementBlock("div",yr,[r.createVNode(r.unref(_.WarningIcon),{class:"error-display-icon"}),e.errorMessage?(r.openBlock(),r.createElementBlock("div",gr,r.toDisplayString(e.errorMessage),1)):r.createCommentVNode("",!0)])):(r.openBlock(),r.createElementBlock("div",hr,[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(e.cards,(u,d)=>(r.openBlock(),r.createElementBlock(r.Fragment,null,[e.loading?(r.openBlock(),r.createElementBlock("div",{key:`skeleton-${d}`,class:"loading-tab"},[r.createVNode(dr,{class:r.normalizeClass(e.cardSize===r.unref(I).Small?"loading-tabs-small":"loading-tabs-large")},null,8,["class"])])):(r.openBlock(),r.createBlock(sr,r.mergeProps({key:d},{ref_for:!0},s(u),{"card-size":e.cardSize,"card-type":u.cardType,description:u.description,"error-message":e.errorMessage,"has-error":u.hasError,title:u.title,"title-tag":u.titleTag,tooltip:u.tooltip,"trend-range":u.trendRange}),null,16,["card-size","card-type","description","error-message","has-error","title","title-tag","tooltip","trend-range"]))],64))),256))]))],2))}}),[["__scopeId","data-v-7080ba56"]]),vr=r.defineComponent({__name:"MetricsConsumer",props:{lookupKey:{default:void 0},cardSize:{default:I.Large},cardToDisplay:{default:void 0}},setup(e){const t=e,n=r.inject(de);if(!n)throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");const{traffic:s,latency:i}=n.data,{i18n:a}=N.useI18n(),u=r.computed(()=>n.containerTitle.value?I.Medium:t.cardSize),d=N.useMetricCardBuilder({cardType:k.TRAFFIC,title:r.computed(()=>n.longCardTitles?a.t("metricCard.long.traffic"):a.t("metricCard.short.traffic")),record:s.mapped,hasError:s.hasError,lookupKey:t.lookupKey,sumGroupedValues:w,trendRange:s.trendRange}),m=g=>`${g.toFixed(Y)}%`,o=r.computed(()=>{const g=s.mapped.value,T=L(g,"current",t.lookupKey,K),v=L(g,"current",t.lookupKey,w),h=T/v*100||0,S=L(g,"previous",t.lookupKey,K),C=L(g,"previous",t.lookupKey,w),A=S/C*100||0;return{cardType:k.ERROR_RATE,hasError:s.hasError.value,currentValue:h,previousValue:A,formatValueFn:m,title:n.longCardTitles?a.t("metricCard.long.errorRate"):a.t("metricCard.short.errorRate"),increaseIsBad:!0,trendRange:s.trendRange.value}}),l=g=>`${g}ms`,c=N.useMetricCardBuilder({cardType:k.LATENCY,title:r.computed(()=>{const{longCardTitles:g,averageLatencies:T}=n,v=T.value?"averageLatency":"p99Latency";return g?a.t(`metricCard.long.${v}`):u.value===I.Small?a.t(`metricCard.small.${v}`):a.t(`metricCard.short.${v}`)}),hasError:i.hasError,record:i.mapped,lookupKey:t.lookupKey,increaseIsBad:!0,formatValueFn:l,trendRange:i.trendRange}),f=r.computed(()=>t.cardToDisplay==="TRAFFIC"?[d.value]:t.cardToDisplay==="ERROR_RATE"?[o.value]:t.cardToDisplay==="LATENCY"?[c.value]:[d.value,o.value,c.value]),y=r.computed(()=>t.cardToDisplay==="TRAFFIC"||t.cardToDisplay==="ERROR_RATE"?s.isLoading.value:t.cardToDisplay==="LATENCY"?i.isLoading.value:s.isLoading.value||i.isLoading.value),p=r.computed(()=>({cards:f.value,containerTitle:n.containerTitle.value,containerDescription:n.description.value,loading:y.value,hasTrendAccess:n.hasTrendAccess.value,fallbackDisplayText:a.t("general.notAvailable"),cardSize:u.value,hideTitle:!0})),E=r.computed(()=>({loading:p.value.loading,trafficCard:d.value,errorRateCard:o.value,latencyCard:c.value,errorRateFormatted:m(o.value.currentValue),latencyFormatted:l(c.value.currentValue)}));return(g,T)=>r.renderSlot(g.$slots,"default",{cardValues:E.value},()=>[r.createVNode(pr,r.normalizeProps(r.guardReactiveProps(p.value)),null,16)])}}),z=e=>new Date(e),Er=(e,t)=>{const n=e.body;e.reply({statusCode:200,body:he(n,t)})},ge=e=>e.reduce((t,n)=>(t[n]={name:n},t),{}),he=(e,t)=>{var p,E;const n=D.TimePeriods.get(D.TimeframeKeys.ONE_DAY),s=e.granularity==="trend"?new D.DeltaQueryTime(n):new D.UnaryQueryTime(n),i=s.endMs(),a=s.startMs(),u=s.granularityMs(),d=e.granularity==="trend"?2:1;if((e.dimensions??[]).length>2)throw new Error(`Explore only supports 0-2 dimensions; got: ${JSON.stringify(e.dimensions)}`);const m=(e.dimensions??[]).find(g=>g!=="time"),o=(t==null?void 0:t.dimensionNames)??[],l=Math.max(o.length,1),c=e.metrics||[],f=[];for(let g=0;g<d;g++)for(let T=0;T<l;T++){const v=m?{[m]:o[T]}:{};(p=e.dimensions)!=null&&p.includes("status_code_grouped")?w.forEach(h=>{const S=c.reduce((C,A)=>((t==null?void 0:t.deterministic)??!0?C[A]=(d-g)*1e3+100*T+1:C[A]=Math.round(Math.random()*1e3),C),{...v,status_code_grouped:h});f.push({version:"v1",timestamp:g===0?z(a).toISOString():z(a+u).toISOString(),event:S})}):f.push({version:"v1",timestamp:g===0?z(a).toISOString():z(a+u).toISOString(),event:c.reduce((h,S)=>((t==null?void 0:t.deterministic)??!0?h[S]=(d-g)*1e3+100*T+1:h[S]=Math.round(Math.random()*1e3),h),{...v})})}const y={start_ms:a,end_ms:i,start:new Date(a).toISOString(),end:new Date(i).toISOString(),granularity_ms:u,display:m?{[m]:ge(o),...(E=e.dimensions)!=null&&E.includes("status_code_grouped")?{status_code_grouped:ge(w)}:{}}:{},metric_names:e.metrics,query_id:"test"};return{data:f,meta:y}};R.ALL_STATUS_CODE_GROUPS=w,R.DEFAULT_REFRESH_INTERVAL=ne,R.INJECT_QUERY_PROVIDER=ae,R.MAX_ANALYTICS_REQUEST_RETRIES=te,R.MetricCardSize=I,R.MetricCardType=k,R.MetricsConsumer=vr,R.MetricsProvider=Ue,R.STATUS_CODES_FAILED=K,R.STATUS_CODES_SUCCESS=_e,R.mockExploreResponse=he,R.mockExploreResponseFromCypress=Er,Object.defineProperty(R,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(R,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("@kong-ui-public/analytics-utilities"),require("@kong-ui-public/i18n"),require("axios"),require("@kong-ui-public/analytics-config-store"),require("@kong/icons")):typeof define=="function"&&define.amd?define(["exports","vue","@kong-ui-public/analytics-utilities","@kong-ui-public/i18n","axios","@kong-ui-public/analytics-config-store","@kong/icons"],t):(R=typeof globalThis<"u"?globalThis:R||self,t(R["kong-ui-public-vitals-metric-provider"]={},R.Vue,R["kong-ui-public-analytics-utilities"],R["kong-ui-public-i18n"],R.axios,R["kong-ui-public-analytics-config-store"],R.KongIcons))})(this,function(R,t,D,re,Rr,Te,_){"use strict";const Ce={general:{notAvailable:"N/A"},metricCard:{small:{traffic:"Requests",errorRate:"Error rate",averageLatency:"Avg. latency",p99Latency:"P99 latency"},short:{traffic:"Requests",errorRate:"Error rate",averageLatency:"Average latency",p99Latency:"P99 latency"},long:{traffic:"Number of requests",errorRate:"Average error rate",averageLatency:"Average latency",p99Latency:"P99 latency"}},trendRange:{custom_days:"vs previous {numDays, plural, =1 {day} other {# days}}",custom_hours:"vs previous {numHours, plural, =1 {hour} other {# hours}}",custom_minutes:"vs previous {numMinutes, plural, =1 {minute} other {# minutes}}","15m":"vs previous 15 minutes","1h":"vs previous hour","6h":"vs previous 6 hours","12h":"vs previous 12 hours","24h":"vs previous 24 hours","7d":"vs previous 7 days","30d":"vs previous 30 days",current_week:"vs previous week",current_month:"vs previous month",current_quarter:"vs previous quarter",previous_week:"vs previous time period",previous_month:"vs previous time period",previous_quarter:"vs previous quarter"}};function Se(){const e=re.createI18n("en-us",Ce);return{i18n:e,i18nT:re.i18nTComponent(e)}}const te=2,w=["1XX","2XX","3XX","4XX","5XX"],K=["4XX","5XX"],_e=["1XX","2XX","3XX"],ne=30*1e3,ae="analytics-query-provider";var ie=(e=>(e.VALIDATING="VALIDATING",e.VALIDATING_HAS_DATA="VALIDATING_HAS_DATA",e.PENDING="PENDING",e.SUCCESS="SUCCESS",e.SUCCESS_HAS_DATA="SUCCESS_HAS_DATA",e.ERROR="ERROR",e.STALE_IF_ERROR="STALE_IF_ERROR",e))(ie||{});const Ie=e=>{var r,n,s,i,a;return e?!!((r=Object.keys(e))!=null&&r.length||(n=e.data)!=null&&n.length||(i=(s=e.data)==null?void 0:s.data)!=null&&i.length||!((a=e.data)!=null&&a.data)&&typeof e.data=="object"&&Object.keys(e==null?void 0:e.data).length):!1};function ke(e=t.ref({}),r,n,s=Ie){const i=t.ref("PENDING");return t.watchEffect(()=>{const a=s(e.value);if(e.value&&a&&n.value){i.value="VALIDATING_HAS_DATA";return}if(e.value&&n.value){i.value="VALIDATING";return}if(e.value&&r.value){i.value="STALE_IF_ERROR";return}if(e.value===void 0&&!r.value){i.value="PENDING";return}if(e.value&&!r.value&&a){i.value="SUCCESS_HAS_DATA";return}if(e.value&&!r.value){i.value="SUCCESS";return}e.value===void 0&&r&&(i.value="ERROR")}),{state:i,swrvState:ie}}const V=Symbol("default"),U="status_code_grouped",oe=(e,r,n,s,i)=>{e[r][n]||(e[r][n]={}),e[r][n][s]=i};function Ae(e,r){var d;const n=((d=e.meta.metric_names)==null?void 0:d[0])||"",s=e.meta.start_ms,i=Object.keys(e.meta.display||{}),a=!!i.find(m=>m===U),u=i.find(m=>m!==U);return i.length>2||i.length>1&&!a?(console.error("Don't know how to work with provided dimensions:",i),{previous:{[V]:{[V]:0}},current:{[V]:{[V]:0}}}):e.data.reduce((m,o)=>{const l=o.event[n],c=u?o.event[u]:V,f=a?o.event[U]:V;return new Date(o.timestamp).getTime()===s&&r?oe(m,"previous",c,f,l):oe(m,"current",c,f,l),m},{previous:{},current:{}})}function De(e){e.queryReady===void 0&&(e.queryReady=t.computed(()=>!0));const{i18n:r}=N.useI18n(),n=t.computed(()=>{var c,f;return{metrics:e.metrics.value,dimensions:[...(c=e.dimensions)!=null&&c.length?[...e.dimensions]:[],...e.withTrend.value?["time"]:[]],granularity:e.withTrend.value?"trend":void 0,...(f=e.filter.value)!=null&&f.length?{filters:e.filter.value}:{},time_range:e.timeframe.value.v4Query(e.tz.value)}}),s=t.computed(()=>{var f,y,p,E;if(!((f=e.queryReady)!=null&&f.value))return null;const c=(y=e.filter)!=null&&y.value?JSON.stringify(e.filter.value):"";return`metric-fetcher-${e.timeframe.value.cacheKey()}-${(p=e.dimensions)==null?void 0:p.join("-")}-${(E=e.metrics.value)==null?void 0:E.join("-")}-${c}-${e.refreshCounter.value}`}),{response:i,error:a,isValidating:u}=N.useRequest(()=>s.value,()=>e.queryFn({datasource:e.datasource.value,query:n.value},e.abortController??new AbortController),{refreshInterval:e.refreshInterval,revalidateOnFocus:!1,errorRetryCount:te}),{state:d,swrvState:m}=ke(i,a,u),o=t.computed(()=>{var c,f,y,p,E,h,T;return!((f=(c=i.value)==null?void 0:c.data)!=null&&f.length)||!((p=(y=i.value)==null?void 0:y.meta)!=null&&p.display)||!((T=(h=(E=i.value)==null?void 0:E.meta)==null?void 0:h.metric_names)!=null&&T.length)?{current:{},previous:{}}:Ae(i.value,e.withTrend.value)}),l=t.computed(()=>{var c,f;if(e.timeframe.value.key==="custom"){if(!((f=(c=i.value)==null?void 0:c.meta)!=null&&f.start_ms))return"";const{start_ms:y,end_ms:p}=i.value.meta;let E=(p-y)/(1e3*60*60*24),h=(p-y)/(1e3*60*60),T=(p-y)/(1e3*60);return e.withTrend.value&&(E/=2,h/=2,T/=2),E>=1?r.t("trendRange.custom_days",{numDays:Math.round(E)}):h>=1?r.t("trendRange.custom_hours",{numHours:Math.round(h)}):T>=1?r.t("trendRange.custom_minutes",{numMinutes:Math.round(T)}):r.t("trendRange.custom_days",{numDays:Math.round(E)})}else return e.withTrend.value?r.t(`trendRange.${e.timeframe.value.key}`):""});return{isLoading:t.computed(()=>m.PENDING===d.value),hasError:t.computed(()=>m.ERROR===d.value),raw:i,mapped:o,trendRange:l}}const L=(e,r,n=V,s)=>(s??[V]).reduce((a,u)=>{const d=e[r][n];return d?a+(d[u]||0):a},0);function be(e){const{cardType:r,title:n,description:s,record:i,hasError:a,increaseIsBad:u,formatValueFn:d,trendRange:m}=e;return t.computed(()=>{let o=0,l=0;if(i!=null&&i.value)try{o=L(i.value,"current",e.lookupKey,e.sumGroupedValues),l=L(i.value,"previous",e.lookupKey,e.sumGroupedValues)}catch(c){console.error("Metric card data doesn't have the expected structure:",c)}return{cardType:r,hasError:a.value,currentValue:o,previousValue:l,title:n.value,description:s,increaseIsBad:!!u,formatValueFn:d,trendRange:m==null?void 0:m.value}})}var $=new WeakMap,se=0;function Ve(e){if(!e.length)return"";for(var r="arg",n=0;n<e.length;++n){var s=void 0;e[n]===null||typeof e[n]!="object"&&typeof e[n]!="function"?typeof e[n]=="string"?s='"'+e[n]+'"':s=String(e[n]):$.has(e[n])?s=$.get(e[n]):(s=se,$.set(e[n],se++)),r+="@"+s}return r}function Ne(e){if(typeof e=="function")try{e=e()}catch{e=""}return Array.isArray(e)?e=Ve(e):e=String(e||""),e}var X=function(){function e(r){r===void 0&&(r=0),this.items=new Map,this.ttl=r}return e.prototype.serializeKey=function(r){return Ne(r)},e.prototype.get=function(r){var n=this.serializeKey(r);return this.items.get(n)},e.prototype.set=function(r,n,s){var i=this.serializeKey(r),a=s||this.ttl,u=Date.now(),d={data:n,createdAt:u,expiresAt:a?u+a:1/0};this.dispatchExpire(a,d,i),this.items.set(i,d)},e.prototype.dispatchExpire=function(r,n,s){var i=this;r&&setTimeout(function(){var a=Date.now(),u=a>=n.expiresAt;u&&i.delete(s)},r)},e.prototype.delete=function(r){this.items.delete(r)},e}();function Oe(){return typeof navigator.onLine<"u"?navigator.onLine:!0}function we(){return typeof document<"u"&&typeof document.visibilityState<"u"?document.visibilityState!=="hidden":!0}var Le=function(e){return fetch(e).then(function(r){return r.json()})};const G={isOnline:Oe,isDocumentVisible:we,fetcher:Le};var b=function(){return b=Object.assign||function(e){for(var r,n=1,s=arguments.length;n<s;n++){r=arguments[n];for(var i in r)Object.prototype.hasOwnProperty.call(r,i)&&(e[i]=r[i])}return e},b.apply(this,arguments)},M=function(e,r,n,s){function i(a){return a instanceof n?a:new n(function(u){u(a)})}return new(n||(n=Promise))(function(a,u){function d(l){try{o(s.next(l))}catch(c){u(c)}}function m(l){try{o(s.throw(l))}catch(c){u(c)}}function o(l){l.done?a(l.value):i(l.value).then(d,m)}o((s=s.apply(e,r||[])).next())})},F=function(e,r){var n={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},s,i,a,u;return u={next:d(0),throw:d(1),return:d(2)},typeof Symbol=="function"&&(u[Symbol.iterator]=function(){return this}),u;function d(o){return function(l){return m([o,l])}}function m(o){if(s)throw new TypeError("Generator is already executing.");for(;n;)try{if(s=1,i&&(a=o[0]&2?i.return:o[0]?i.throw||((a=i.return)&&a.call(i),0):i.next)&&!(a=a.call(i,o[1])).done)return a;switch(i=0,a&&(o=[o[0]&2,a.value]),o[0]){case 0:case 1:a=o;break;case 4:return n.label++,{value:o[1],done:!1};case 5:n.label++,i=o[1],o=[0];continue;case 7:o=n.ops.pop(),n.trys.pop();continue;default:if(a=n.trys,!(a=a.length>0&&a[a.length-1])&&(o[0]===6||o[0]===2)){n=0;continue}if(o[0]===3&&(!a||o[1]>a[0]&&o[1]<a[3])){n.label=o[1];break}if(o[0]===6&&n.label<a[1]){n.label=a[1],a=o;break}if(a&&n.label<a[2]){n.label=a[2],n.ops.push(o);break}a[2]&&n.ops.pop(),n.trys.pop();continue}o=r.call(e,n)}catch(l){o=[6,l],i=0}finally{s=a=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}},Me=function(e,r){var n=typeof Symbol=="function"&&e[Symbol.iterator];if(!n)return e;var s=n.call(e),i,a=[],u;try{for(;(r===void 0||r-- >0)&&!(i=s.next()).done;)a.push(i.value)}catch(d){u={error:d}}finally{try{i&&!i.done&&(n=s.return)&&n.call(s)}finally{if(u)throw u.error}}return a},Fe=function(e,r,n){if(n||arguments.length===2)for(var s=0,i=r.length,a;s<i;s++)(a||!(s in r))&&(a||(a=Array.prototype.slice.call(r,0,s)),a[s]=r[s]);return e.concat(a||Array.prototype.slice.call(r))},le=new X,q=new X,j=new X,ce={cache:le,refreshInterval:0,ttl:0,serverTTL:1e3,dedupingInterval:2e3,revalidateOnFocus:!0,revalidateDebounce:0,shouldRetryOnError:!0,errorRetryInterval:5e3,errorRetryCount:5,fetcher:G.fetcher,isOnline:G.isOnline,isDocumentVisible:G.isDocumentVisible};function Be(e,r,n){var s=q.get(e);if(s)s.data.push(r);else{var i=5e3;q.set(e,[r],n>0?n+i:n)}}function qe(e,r,n){if(n.isDocumentVisible()&&!(n.errorRetryCount!==void 0&&r>n.errorRetryCount)){var s=Math.min(r||0,n.errorRetryCount),i=s*n.errorRetryInterval;setTimeout(function(){e(null,{errorRetryCount:s+1,shouldRetryOnError:!0})},i)}}var ue=function(e,r,n,s){return n===void 0&&(n=le),s===void 0&&(s=ce.ttl),M(void 0,void 0,void 0,function(){var i,a,u,d,m,o,l;return F(this,function(c){switch(c.label){case 0:if(!ze(r))return[3,5];c.label=1;case 1:return c.trys.push([1,3,,4]),[4,r];case 2:return i=c.sent(),[3,4];case 3:return d=c.sent(),a=d,[3,4];case 4:return[3,6];case 5:i=r,c.label=6;case 6:if(u=!1,m={data:i,error:a,isValidating:u},typeof i<"u")try{n.set(e,m,s)}catch(f){console.error("swrv(mutate): failed to set cache",f)}return o=q.get(e),o&&o.data.length&&(l=o.data.filter(function(f){return f.key===e}),l.forEach(function(f,y){typeof m.data<"u"&&(f.data=m.data),f.error=m.error,f.isValidating=m.isValidating,f.isLoading=m.isValidating;var p=y===l.length-1;p||delete l[y]}),l=l.filter(Boolean)),[2,m]}})})};function xe(){for(var e=this,r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];var s,i,a=b({},ce),u=!1,d=!1,m=t.getCurrentInstance(),o=(m==null?void 0:m.proxy)||m;if(!o)return console.error("Could not get current instance, check to make sure that `useSwrv` is declared in the top level of the setup function."),null;var l=(o==null?void 0:o.$isServer)||!1;r.length>=1&&(s=r[0]),r.length>=2&&(i=r[1]),r.length>2&&(a=b(b({},a),r[2]));var c=l?a.serverTTL:a.ttl,f=typeof s=="function"?s:t.ref(s);typeof i>"u"&&(i=a.fetcher);var y=null;y||(y=t.reactive({data:void 0,error:void 0,isValidating:!0,isLoading:!0,key:null}));var p=function(v,g){return M(e,void 0,void 0,function(){var S,C,A,B,W,pe,J,ve=this;return F(this,function(Z){switch(Z.label){case 0:return S=y.data===void 0,C=f.value,C?(A=a.cache.get(C),B=A&&A.data,y.isValidating=!0,y.isLoading=!B,B&&(y.data=B.data,y.error=B.error),W=v||i,!W||!a.isDocumentVisible()&&!S||(g==null?void 0:g.forceRevalidate)!==void 0&&!(g!=null&&g.forceRevalidate)?(y.isValidating=!1,y.isLoading=!1,[2]):A&&(pe=!!(Date.now()-A.createdAt>=a.dedupingInterval||g!=null&&g.forceRevalidate),!pe)?(y.isValidating=!1,y.isLoading=!1,[2]):(J=function(){return M(ve,void 0,void 0,function(){var O,Ee,ee,Re;return F(this,function(P){switch(P.label){case 0:return O=j.get(C),O?[3,2]:(Ee=Array.isArray(C)?C:[C],ee=W.apply(void 0,Fe([],Me(Ee),!1)),j.set(C,ee,a.dedupingInterval),[4,ue(C,ee,a.cache,c)]);case 1:return P.sent(),[3,4];case 2:return[4,ue(C,O.data,a.cache,c)];case 3:P.sent(),P.label=4;case 4:return y.isValidating=!1,y.isLoading=!1,j.delete(C),y.error!==void 0&&(Re=!u&&a.shouldRetryOnError&&(g?g.shouldRetryOnError:!0),Re&&qe(p,g?g.errorRetryCount:1,a)),[2]}})})},B&&a.revalidateDebounce?(setTimeout(function(){return M(ve,void 0,void 0,function(){return F(this,function(O){switch(O.label){case 0:return u?[3,2]:[4,J()];case 1:O.sent(),O.label=2;case 2:return[2]}})})},a.revalidateDebounce),[3,3]):[3,1])):[2];case 1:return[4,J()];case 2:Z.sent(),Z.label=3;case 3:return[2]}})})},E=function(){return M(e,void 0,void 0,function(){return F(this,function(v){return[2,p(null,{shouldRetryOnError:!1})]})})},h=null;t.onMounted(function(){var v=function(){return M(e,void 0,void 0,function(){return F(this,function(g){switch(g.label){case 0:return!y.error&&a.isOnline()?[4,p()]:[3,2];case 1:return g.sent(),[3,3];case 2:h&&clearTimeout(h),g.label=3;case 3:return a.refreshInterval&&!u&&(h=setTimeout(v,a.refreshInterval)),[2]}})})};a.refreshInterval&&(h=setTimeout(v,a.refreshInterval)),a.revalidateOnFocus&&(document.addEventListener("visibilitychange",E,!1),window.addEventListener("focus",E,!1))}),t.onUnmounted(function(){u=!0,h&&clearTimeout(h),a.revalidateOnFocus&&(document.removeEventListener("visibilitychange",E,!1),window.removeEventListener("focus",E,!1));var v=q.get(f.value);v&&(v.data=v.data.filter(function(g){return g!==y}))});try{t.watch(f,function(v){t.isReadonly(f)||(f.value=v),y.key=v,y.isValidating=!!v,Be(f.value,y,c),!l&&!d&&f.value&&p(),d=!1},{immediate:!0})}catch{}var T=b(b({},t.toRefs(y)),{mutate:function(v,g){return p(v,b(b({},g),{forceRevalidate:!0}))}});return T}function ze(e){return e!==null&&typeof e=="object"&&typeof e.then=="function"}function Pe(e,r,n){const{data:s,error:i,isValidating:a,mutate:u}=xe(e,r,{revalidateDebounce:500,revalidateOnFocus:!1,dedupingInterval:100,...n});return{data:t.computed(()=>s.value),response:s,error:i,isValidating:a,revalidate:u}}const N={useI18n:Se,useMetricCardBuilder:be,useMetricFetcher:De,useRequest:Pe},de=Symbol("METRICS_PROVIDER_KEY"),Ke=e=>{const{datasource:r,dimension:n,dimensionFilterValue:s,additionalFilter:i,queryReady:a,timeframe:u,tz:d,hasTrendAccess:m,refreshInterval:o,abortController:l,queryFn:c,averageLatencies:f}=e;if(s&&!n)throw new Error("Must provide a dimension if filtering by a value");const y=!!(n&&s),p=!!(n&&!s),E=t.computed(()=>{const S=[];return y&&S.push({field:n,operator:"in",value:[s]}),i.value&&S.push(...D.stripUnknownFilters(r.value,i.value)),S}),h={datasource:r,metrics:t.ref(["request_count"]),dimensions:[...n&&!y?[n]:[],"status_code_grouped"],filter:E,queryReady:a,timeframe:u,tz:d,withTrend:t.computed(()=>m.value&&!p),refreshInterval:o,queryFn:c,abortController:l,refreshCounter:e.refreshCounter},T={datasource:r,metrics:t.computed(()=>[f.value?"response_latency_average":"response_latency_p99"]),...n&&!y?{dimensions:[n]}:{},filter:E,queryReady:a,timeframe:u,tz:d,withTrend:t.computed(()=>m.value&&!p),refreshInterval:o,queryFn:c,abortController:l,refreshCounter:e.refreshCounter},v=N.useMetricFetcher(h),g=N.useMetricFetcher(T);return{trafficData:v,latencyData:g}},Ue=t.defineComponent({__name:"MetricsProvider",props:{datasource:{default:void 0},maxTimeframe:{default:D.TimeframeKeys.THIRTY_DAY},overrideTimeframe:{default:void 0},tz:{default:void 0},dimension:{default:void 0},filterValue:{default:void 0},additionalFilter:{default:void 0},queryReady:{type:Boolean,default:!0},refreshInterval:{default:ne},longCardTitles:{type:Boolean,default:!1},containerTitle:{default:void 0},description:{default:void 0},percentileLatency:{type:Boolean,default:void 0},abortController:{default:void 0},refreshCounter:{default:0}},setup(e){const r=e;if(r.dimension&&D.queryableExploreDimensions.findIndex(y=>y===r.dimension)===-1)throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${r.dimension}`);const n=t.inject(ae);let s;n?s=n.queryFn:(console.warn("Analytics dashboards require a query bridge supplied via provide / inject."),console.warn("Please ensure your application has a query bridge provided under the key 'analytics-query-provider', as described in"),console.warn("https://github.com/Kong/public-ui-components/blob/main/packages/analytics/analytics-metric-provider/README.md#requirements"),s=()=>Promise.reject(new Error("Query bridge required")));const i=Te.useAnalyticsConfigStore(),a=t.computed(()=>!0),u=t.computed(()=>!i.loading&&r.queryReady),d=t.computed(()=>r.tz?r.tz:new Intl.DateTimeFormat().resolvedOptions().timeZone),m=t.computed(()=>r.datasource?r.datasource:"basic"),o=t.computed(()=>r.overrideTimeframe||D.TimePeriods.get(D.TimeframeKeys.SEVEN_DAY)),l=t.computed(()=>!r.percentileLatency),{trafficData:c,latencyData:f}=Ke({datasource:m,dimension:r.dimension,dimensionFilterValue:r.filterValue,additionalFilter:t.toRef(r,"additionalFilter"),queryReady:u,timeframe:o,tz:d,hasTrendAccess:a,refreshInterval:r.refreshInterval,queryFn:s,averageLatencies:l,abortController:r.abortController,refreshCounter:t.toRef(r,"refreshCounter")});return t.provide(de,{data:{traffic:c,latency:f},description:t.toRef(()=>r.description),containerTitle:t.toRef(()=>r.containerTitle),hasTrendAccess:a,longCardTitles:r.longCardTitles,averageLatencies:l}),(y,p)=>t.renderSlot(y.$slots,"default",{hasTrendAccess:a.value,timeframe:o.value})}});function $e(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var fe={exports:{}};(function(e){(function(){function r(o,l){if(l.separator===!1||o<1e3)return o.toString();var c=typeof l.separator=="string"?l.separator:",",f=[],y=Math.round(o).toString().split("");return y.reverse().forEach(function(p,E){E&&E%3===0&&f.push(c),f.push(p)}),f.reverse().join("")}function n(o,l,c){var f=o/l,y=c.round?"round":"floor";return c.decimal===!1?(o=Math[y](f),o.toString()):(c.precision?o=f:o=f<10?Math[y](f*10)/10:Math[y](f),o=o.toString(),typeof c.decimal=="string"&&(o=o.replace(".",c.decimal)),o)}var s=1e3,i=1e4,a=1e6,u=1e9,d=1e12;function m(o,l){var c;l=l||{};var f=o<0;f&&(o=Math.abs(o)),l.precision&&(o=parseFloat(o.toPrecision(l.precision)));var y=l.min10k?i:s;return o<y||l.precision&&l.precision>Math.log10(o)?c=r(n(o,1,l),l):o<a?c=n(o,s,l)+"k":o<u?c=n(o,a,l)+"m":o<d?c=r(n(o,u,l),l)+"b":c=r(n(o,d,l),l)+"t",f&&(c="-"+c),l.capital&&(c=c.toUpperCase()),l.prefix&&(c=l.prefix+c),l.suffix&&(c=c+l.suffix),c}m.addCommas=r,e.exports=m})()})(fe);var Xe=fe.exports;const Ge=$e(Xe);var k=(e=>(e.GENERIC_COUNT="GenericCount",e.TRAFFIC="Traffic",e.ERROR_RATE="ErrorRate",e.LATENCY="Latency",e))(k||{}),I=(e=>(e.Small="sm",e.Medium="md",e.Large="lg",e.ExtraLarge="xl",e))(I||{});const H=2,me=H+2,je=(e,r,n=!1)=>{let s=!r||Number(e.toFixed(me))===0?0:Number(e.toFixed(me))>0?1:-1;return n&&(s*=-1),s},He=(e,r,n)=>r?`${Math.abs(e*100).toFixed(H)}%`:n,Ye=(e,r)=>r===0?0:e/r-1,Qe=(e,r=!1)=>(r&&(e*=-1),e>0?_.TrendUpIcon:e<0?_.TrendDownIcon:_.IndeterminateSmallIcon),We="#ad000e",Y="#6c7489",ye="#52596e",Je="#007d60",x="16px",Ze="20px",er={key:0,class:"metricscard-description"},rr={class:"metricscard-valuetrend"},tr={key:0,class:"metricscard-error"},nr={key:2,class:"metricscard-trend"},ar={"data-testid":"metric-trend-change"},ir={key:0,class:"metricscard-trend-range"},or=t.defineComponent({__name:"MetricsCard",props:{cardType:{type:String,required:!0,default:k.GENERIC_COUNT},title:{type:String,default:"0%",required:!0},description:{type:String,default:"",required:!1},tooltip:{type:String,required:!1,default:""},timeframe:{type:String,required:!1,default:""},metricValue:{type:String,default:""},metricChange:{type:String,required:!0},changePolarity:{type:Number,required:!0},trendIcon:{type:Object,default:_.IndeterminateSmallIcon},trendRange:{type:String,default:""},hasError:{type:Boolean,default:!1},errorMessage:{type:String,default:"Vitals data error"},cardSize:{type:String,required:!1,default:()=>I.Large},hasContainerTitle:{type:Boolean,required:!1,default:!1},titleTag:{type:String,default:"span"}},setup(e){const r=new Map([[k.GENERIC_COUNT,_.VitalsIcon],[k.TRAFFIC,_.CloudUploadIcon],[k.ERROR_RATE,_.WarningOutlineIcon],[k.LATENCY,_.ResponseIcon]]),n=e,s=d=>{const m={red:`var(--kui-color-text-danger-strong, ${We})`,green:`var(--kui-color-text-success, ${Je})`,grey:`var(--kui-color-text-neutral-strong, ${ye})`};return d>0?m.green:d<0?m.red:m.grey},i=d=>d>0?"positive":d<0?"negative":"neutral",a=[I.Medium,I.Large].includes(n.cardSize),u=[I.Small].includes(n.cardSize);return(d,m)=>{const o=t.resolveComponent("KTooltip");return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["metricscard",e.cardSize])},[t.createElementVNode("div",{class:t.normalizeClass(["metricscard-title",e.cardSize])},[t.unref(u)?t.createCommentVNode("",!0):(t.openBlock(),t.createBlock(t.resolveDynamicComponent(t.unref(r).get(e.cardType)),{key:0,class:"metricscard-icon",color:`var(--kui-color-text-neutral, ${t.unref(Y)})`,size:t.unref(x)},null,8,["color","size"])),(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.titleTag),null,{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(e.title),1)]),_:1})),e.tooltip?(t.openBlock(),t.createBlock(o,{key:1,class:"metricscard-tooltip",placement:"right",text:e.tooltip},{default:t.withCtx(()=>[t.createVNode(t.unref(_.InfoIcon),{color:`var(--kui-color-text-neutral, ${t.unref(Y)})`,size:t.unref(x)},null,8,["color","size"])]),_:1},8,["text"])):t.createCommentVNode("",!0)],2),e.description&&t.unref(a)?(t.openBlock(),t.createElementBlock("div",er,[t.createElementVNode("span",null,t.toDisplayString(e.description),1)])):t.createCommentVNode("",!0),t.createElementVNode("div",rr,[e.hasError?(t.openBlock(),t.createElementBlock("div",tr,[t.createVNode(t.unref(_.WarningIcon),{color:`var(--kui-color-text-neutral, ${t.unref(Y)})`,size:t.unref(Ze)},null,8,["color","size"]),t.createElementVNode("div",null," "+t.toDisplayString(e.errorMessage),1)])):(t.openBlock(),t.createElementBlock("div",{key:1,class:t.normalizeClass(["metricscard-value",e.cardSize]),"data-testid":"metric-value"},t.toDisplayString(e.metricValue),3)),t.unref(a)?(t.openBlock(),t.createElementBlock("div",nr,[t.createElementVNode("div",{class:t.normalizeClass(["metricscard-trend-change",i(e.changePolarity)]),"data-testid":"metric-trend-parent"},[e.changePolarity!==0?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.trendIcon),{key:0,color:s(e.changePolarity),size:t.unref(x)},null,8,["color","size"])):(t.openBlock(),t.createBlock(t.unref(_.EqualIcon),{key:1,color:`var(--kui-color-text-neutral-strong, ${t.unref(ye)})`,size:t.unref(x)},null,8,["color","size"])),t.createElementVNode("div",ar,t.toDisplayString(e.metricChange),1)],2),e.trendRange?(t.openBlock(),t.createElementBlock("div",ir,t.toDisplayString(e.trendRange),1)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0)])],2)}}}),Q=(e,r)=>{const n=e.__vccOpts||e;for(const[s,i]of r)n[s]=i;return n},sr=Q(or,[["__scopeId","data-v-b1513f6f"]]),lr={},cr={class:"loading-tabs"};function ur(e,r){const n=t.resolveComponent("KSkeletonBox");return t.openBlock(),t.createElementBlock("div",cr,[t.createVNode(n,{width:"100"}),t.createVNode(n,{width:"75"})])}const dr=Q(lr,[["render",ur],["__scopeId","data-v-9c7113d7"]]),fr={key:0,class:"container-title"},mr={key:0,class:"container-description"},yr={key:1,class:"error-display"},hr={key:0,class:"error-display-message"},gr={key:2,class:"cards-wrapper"},pr=Q(t.defineComponent({__name:"MetricCardContainer",props:{fallbackDisplayText:{type:String,required:!0},cards:{type:Array,required:!0},errorMessage:{type:String,required:!1,default:""},loading:{type:Boolean,required:!1,default:!1},hasTrendAccess:{type:Boolean,required:!1,default:!0},cardSize:{type:String,required:!1,default:()=>I.Large},containerTitle:{type:String,required:!1,default:""},containerDescription:{type:String,required:!1,default:""}},setup(e){const r=e,n=t.computed(()=>r.cards.every(i=>(i==null?void 0:i.hasError)===!0)),s=i=>{const a=Ye(i.currentValue,i.previousValue)||0,u=je(a,r.hasTrendAccess,i.increaseIsBad);return{metricValue:i.formatValueFn?i.formatValueFn(i.currentValue):Ge(i.currentValue,{capital:!0,round:!0})||"0",metricChange:i.formatChangeFn?i.formatChangeFn(a):He(a,r.hasTrendAccess,r.fallbackDisplayText),changePolarity:u,trendIcon:Qe(u,i.increaseIsBad),cardSize:r.cardSize,hasContainerTitle:!!r.containerTitle}};return(i,a)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["kong-ui-public-metric-card-container",e.cardSize])},[r.containerTitle||r.containerDescription?(t.openBlock(),t.createElementBlock("div",fr,[t.createTextVNode(t.toDisplayString(r.containerTitle)+" ",1),r.containerDescription?(t.openBlock(),t.createElementBlock("div",mr,t.toDisplayString(r.containerDescription),1)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0),n.value?(t.openBlock(),t.createElementBlock("div",yr,[t.createVNode(t.unref(_.WarningIcon),{class:"error-display-icon"}),e.errorMessage?(t.openBlock(),t.createElementBlock("div",hr,t.toDisplayString(e.errorMessage),1)):t.createCommentVNode("",!0)])):(t.openBlock(),t.createElementBlock("div",gr,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.cards,(u,d)=>(t.openBlock(),t.createElementBlock(t.Fragment,null,[e.loading?(t.openBlock(),t.createElementBlock("div",{key:`skeleton-${d}`,class:"loading-tab"},[t.createVNode(dr,{class:t.normalizeClass(e.cardSize===t.unref(I).Small?"loading-tabs-small":"loading-tabs-large")},null,8,["class"])])):(t.openBlock(),t.createBlock(sr,t.mergeProps({key:d},{ref_for:!0},s(u),{"card-size":e.cardSize,"card-type":u.cardType,description:u.description,"error-message":e.errorMessage,"has-error":u.hasError,title:u.title,"title-tag":u.titleTag,tooltip:u.tooltip,"trend-range":u.trendRange}),null,16,["card-size","card-type","description","error-message","has-error","title","title-tag","tooltip","trend-range"]))],64))),256))]))],2))}}),[["__scopeId","data-v-7080ba56"]]),vr=t.defineComponent({__name:"MetricsConsumer",props:{lookupKey:{default:void 0},cardSize:{default:I.Large},cardToDisplay:{default:void 0}},setup(e){const r=e,n=t.inject(de);if(!n)throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");const{traffic:s,latency:i}=n.data,{i18n:a}=N.useI18n(),u=t.computed(()=>n.containerTitle.value?I.Medium:r.cardSize),d=N.useMetricCardBuilder({cardType:k.TRAFFIC,title:t.computed(()=>n.longCardTitles?a.t("metricCard.long.traffic"):a.t("metricCard.short.traffic")),record:s.mapped,hasError:s.hasError,lookupKey:r.lookupKey,sumGroupedValues:w,trendRange:s.trendRange}),m=h=>`${h.toFixed(H)}%`,o=t.computed(()=>{const h=s.mapped.value,T=L(h,"current",r.lookupKey,K),v=L(h,"current",r.lookupKey,w),g=T/v*100||0,S=L(h,"previous",r.lookupKey,K),C=L(h,"previous",r.lookupKey,w),A=S/C*100||0;return{cardType:k.ERROR_RATE,hasError:s.hasError.value,currentValue:g,previousValue:A,formatValueFn:m,title:n.longCardTitles?a.t("metricCard.long.errorRate"):a.t("metricCard.short.errorRate"),increaseIsBad:!0,trendRange:s.trendRange.value}}),l=h=>`${h}ms`,c=N.useMetricCardBuilder({cardType:k.LATENCY,title:t.computed(()=>{const{longCardTitles:h,averageLatencies:T}=n,v=T.value?"averageLatency":"p99Latency";return h?a.t(`metricCard.long.${v}`):u.value===I.Small?a.t(`metricCard.small.${v}`):a.t(`metricCard.short.${v}`)}),hasError:i.hasError,record:i.mapped,lookupKey:r.lookupKey,increaseIsBad:!0,formatValueFn:l,trendRange:i.trendRange}),f=t.computed(()=>r.cardToDisplay==="TRAFFIC"?[d.value]:r.cardToDisplay==="ERROR_RATE"?[o.value]:r.cardToDisplay==="LATENCY"?[c.value]:[d.value,o.value,c.value]),y=t.computed(()=>r.cardToDisplay==="TRAFFIC"||r.cardToDisplay==="ERROR_RATE"?s.isLoading.value:r.cardToDisplay==="LATENCY"?i.isLoading.value:s.isLoading.value||i.isLoading.value),p=t.computed(()=>({cards:f.value,containerTitle:n.containerTitle.value,containerDescription:n.description.value,loading:y.value,hasTrendAccess:n.hasTrendAccess.value,fallbackDisplayText:a.t("general.notAvailable"),cardSize:u.value,hideTitle:!0})),E=t.computed(()=>({loading:p.value.loading,trafficCard:d.value,errorRateCard:o.value,latencyCard:c.value,errorRateFormatted:m(o.value.currentValue),latencyFormatted:l(c.value.currentValue)}));return(h,T)=>t.renderSlot(h.$slots,"default",{cardValues:E.value},()=>[t.createVNode(pr,t.normalizeProps(t.guardReactiveProps(p.value)),null,16)])}}),z=e=>new Date(e),Er=(e,r)=>{const n=e.body;e.reply({statusCode:200,body:ge(n,r)})},he=e=>e.reduce((r,n)=>(r[n]={name:n},r),{}),ge=(e,r)=>{var p,E;const n=(r==null?void 0:r.timeFrame)||D.TimePeriods.get(D.TimeframeKeys.ONE_DAY),s=e.granularity==="trend"?new D.DeltaQueryTime(n):new D.UnaryQueryTime(n),i=s.endMs(),a=s.startMs(),u=s.granularityMs(),d=e.granularity==="trend"?2:1;if((e.dimensions??[]).length>2)throw new Error(`Explore only supports 0-2 dimensions; got: ${JSON.stringify(e.dimensions)}`);const m=(e.dimensions??[]).find(h=>h!=="time"),o=(r==null?void 0:r.dimensionNames)??[],l=Math.max(o.length,1),c=e.metrics||[],f=[];for(let h=0;h<d;h++)for(let T=0;T<l;T++){const v=m?{[m]:o[T]}:{};(p=e.dimensions)!=null&&p.includes("status_code_grouped")?w.forEach(g=>{const S=c.reduce((C,A)=>((r==null?void 0:r.deterministic)??!0?C[A]=(d-h)*1e3+100*T+1:C[A]=Math.round(Math.random()*1e3),C),{...v,status_code_grouped:g});f.push({version:"v1",timestamp:h===0?z(a).toISOString():z(a+u).toISOString(),event:S})}):f.push({version:"v1",timestamp:h===0?z(a).toISOString():z(a+u).toISOString(),event:c.reduce((g,S)=>((r==null?void 0:r.deterministic)??!0?g[S]=(d-h)*1e3+100*T+1:g[S]=Math.round(Math.random()*1e3),g),{...v})})}const y={start_ms:a,end_ms:i,start:new Date(a).toISOString(),end:new Date(i).toISOString(),granularity_ms:u,display:m?{[m]:he(o),...(E=e.dimensions)!=null&&E.includes("status_code_grouped")?{status_code_grouped:he(w)}:{}}:{},metric_names:e.metrics,query_id:"test"};return{data:f,meta:y}};R.ALL_STATUS_CODE_GROUPS=w,R.DEFAULT_REFRESH_INTERVAL=ne,R.INJECT_QUERY_PROVIDER=ae,R.MAX_ANALYTICS_REQUEST_RETRIES=te,R.MetricCardSize=I,R.MetricCardType=k,R.MetricsConsumer=vr,R.MetricsProvider=Ue,R.STATUS_CODES_FAILED=K,R.STATUS_CODES_SUCCESS=_e,R.mockExploreResponse=ge,R.mockExploreResponseFromCypress=Er,Object.defineProperty(R,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED