@kong-ui-public/analytics-metric-provider 11.3.19 → 11.3.21
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(h,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):(h=typeof globalThis<"u"?globalThis:h||self,t(h["kong-ui-public-vitals-metric-provider"]={},h.Vue,h["kong-ui-public-analytics-utilities"],h["kong-ui-public-i18n"],h.axios,h["kong-ui-public-analytics-config-store"],h.KongIcons))})(this,function(h,t,te,ne,Cr,ke,I){"use strict";const be={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 we(){const e=ne.createI18n("en-us",be);return{i18n:e,i18nT:ne.i18nTComponent(e)}}const ae=2,O=["1XX","2XX","3XX","4XX","5XX"],$=["4XX","5XX"],Ve=["1XX","2XX","3XX"],ie=30*1e3,oe="analytics-query-provider";var se=(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))(se||{});const Ne=e=>{var r,n,o,i,a;return e?!!((r=Object.keys(e))!=null&&r.length||(n=e.data)!=null&&n.length||(i=(o=e.data)==null?void 0:o.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 Oe(e=t.ref({}),r,n,o=Ne){const i=t.ref("PENDING");return t.watchEffect(()=>{const a=o(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:se}}const b=Symbol("default"),K="status_code_grouped",le=(e,r,n,o,i)=>{e[r][n]||(e[r][n]={}),e[r][n][o]=i};function Le(e,r){var f;const n=((f=e.meta.metric_names)==null?void 0:f[0])||"",o=new Date(e.meta.start).getTime(),i=Object.keys(e.meta.display||{}),a=!!i.find(m=>m===K),u=i.find(m=>m!==K);return i.length>2||i.length>1&&!a?(console.error("Don't know how to work with provided dimensions:",i),{previous:{[b]:{[b]:0}},current:{[b]:{[b]:0}}}):e.data.reduce((m,s)=>{const l=s.event[n],c=u?s.event[u]:b,d=a?s.event[K]:b;return new Date(s.timestamp).getTime()===o&&r?le(m,"previous",c,d,l):le(m,"current",c,d,l),m},{previous:{},current:{}})}function Me(e){e.queryReady===void 0&&(e.queryReady=t.computed(()=>!0));const r=t.computed(()=>{var l,c;return{metrics:e.metrics.value,dimensions:[...(l=e.dimensions)!=null&&l.length?[...e.dimensions]:[],...e.withTrend.value?["time"]:[]],granularity:e.withTrend.value?"trend":void 0,...(c=e.filter.value)!=null&&c.length?{filters:e.filter.value}:{},time_range:e.timeRange.value}}),n=t.computed(()=>{var c,d,y,p;if(!((c=e.queryReady)!=null&&c.value))return null;const l=(d=e.filter)!=null&&d.value?JSON.stringify(e.filter.value):"";return`metric-fetcher-${JSON.stringify(e.timeRange.value)}-${(y=e.dimensions)==null?void 0:y.join("-")}-${(p=e.metrics.value)==null?void 0:p.join("-")}-${l}-${e.refreshCounter.value}`}),{response:o,error:i,isValidating:a}=w.useRequest(()=>n.value,()=>e.queryFn({datasource:e.datasource.value,query:r.value},e.abortController??new AbortController),{refreshInterval:e.refreshInterval,revalidateOnFocus:!1,errorRetryCount:ae}),{state:u,swrvState:f}=Oe(o,i,a),m=t.computed(()=>{var l,c,d,y,p,T,E;return!((c=(l=o.value)==null?void 0:l.data)!=null&&c.length)||!((y=(d=o.value)==null?void 0:d.meta)!=null&&y.display)||!((E=(T=(p=o.value)==null?void 0:p.meta)==null?void 0:T.metric_names)!=null&&E.length)?{current:{},previous:{}}:Le(o.value,e.withTrend.value)}),s=w.useTrendRange(e.withTrend,e.timeRange,t.computed(()=>{var l;return(l=o.value)==null?void 0:l.meta}));return{isLoading:t.computed(()=>f.PENDING===u.value),hasError:t.computed(()=>f.ERROR===u.value),raw:o,mapped:m,trendRange:s}}const L=(e,r,n=b,o)=>(o??[b]).reduce((a,u)=>{const f=e[r][n];return f?a+(f[u]||0):a},0);function Fe(e){const{cardType:r,title:n,description:o,record:i,hasError:a,increaseIsBad:u,formatValueFn:f,trendRange:m}=e;return t.computed(()=>{let s=0,l=0;if(i!=null&&i.value)try{s=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:s,previousValue:l,title:n.value,description:o,increaseIsBad:!!u,formatValueFn:f,trendRange:m==null?void 0:m.value}})}function ce(e,r,n){const{i18n:o}=w.useI18n(),i=1e3*60,a=i*60,u=a*24,f=(s,l)=>{let c=l-s;e.value&&(c/=2);const d=c/u,y=c/a,p=c/i;return d>=1?o.t("trendRange.custom_days",{numDays:Math.round(d)}):y>=1?o.t("trendRange.custom_hours",{numHours:Math.round(y)}):p>=1?o.t("trendRange.custom_minutes",{numMinutes:Math.round(p)}):o.t("trendRange.custom_days",{numDays:Math.round(d)})},m=()=>{var s,l;if((s=n==null?void 0:n.value)!=null&&s.start&&n.value.end)return{startMs:new Date(n.value.start).getTime(),endMs:new Date(n.value.end).getTime()};if(((l=r==null?void 0:r.value)==null?void 0:l.type)==="absolute"&&r.value.start&&r.value.end)return{startMs:new Date(r.value.start).getTime(),endMs:new Date(r.value.end).getTime()}};return t.computed(()=>{var s,l;if(((s=r==null?void 0:r.value)==null?void 0:s.type)==="relative"&&e.value)return o.t(`trendRange.${r.value.time_range}`);if(e.value||((l=r==null?void 0:r.value)==null?void 0:l.type)==="absolute"){const c=m();if(c)return f(c.startMs,c.endMs)}return""})}var G=new WeakMap,ue=0;function Be(e){if(!e.length)return"";for(var r="arg",n=0;n<e.length;++n){var o=void 0;e[n]===null||typeof e[n]!="object"&&typeof e[n]!="function"?typeof e[n]=="string"?o='"'+e[n]+'"':o=String(e[n]):G.has(e[n])?o=G.get(e[n]):(o=ue,G.set(e[n],ue++)),r+="@"+o}return r}function qe(e){if(typeof e=="function")try{e=e()}catch{e=""}return Array.isArray(e)?e=Be(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 qe(r)},e.prototype.get=function(r){var n=this.serializeKey(r);return this.items.get(n)},e.prototype.set=function(r,n,o){var i=this.serializeKey(r),a=o||this.ttl,u=Date.now(),f={data:n,createdAt:u,expiresAt:a?u+a:1/0};this.dispatchExpire(a,f,i),this.items.set(i,f)},e.prototype.dispatchExpire=function(r,n,o){var i=this;r&&setTimeout(function(){var a=Date.now(),u=a>=n.expiresAt;u&&i.delete(o)},r)},e.prototype.delete=function(r){this.items.delete(r)},e}();function xe(){return typeof navigator.onLine<"u"?navigator.onLine:!0}function Ue(){return typeof document<"u"&&typeof document.visibilityState<"u"?document.visibilityState!=="hidden":!0}var Pe=function(e){return fetch(e).then(function(r){return r.json()})};const j={isOnline:xe,isDocumentVisible:Ue,fetcher:Pe};var k=function(){return k=Object.assign||function(e){for(var r,n=1,o=arguments.length;n<o;n++){r=arguments[n];for(var i in r)Object.prototype.hasOwnProperty.call(r,i)&&(e[i]=r[i])}return e},k.apply(this,arguments)},M=function(e,r,n,o){function i(a){return a instanceof n?a:new n(function(u){u(a)})}return new(n||(n=Promise))(function(a,u){function f(l){try{s(o.next(l))}catch(c){u(c)}}function m(l){try{s(o.throw(l))}catch(c){u(c)}}function s(l){l.done?a(l.value):i(l.value).then(f,m)}s((o=o.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:[]},o,i,a,u;return u={next:f(0),throw:f(1),return:f(2)},typeof Symbol=="function"&&(u[Symbol.iterator]=function(){return this}),u;function f(s){return function(l){return m([s,l])}}function m(s){if(o)throw new TypeError("Generator is already executing.");for(;n;)try{if(o=1,i&&(a=s[0]&2?i.return:s[0]?i.throw||((a=i.return)&&a.call(i),0):i.next)&&!(a=a.call(i,s[1])).done)return a;switch(i=0,a&&(s=[s[0]&2,a.value]),s[0]){case 0:case 1:a=s;break;case 4:return n.label++,{value:s[1],done:!1};case 5:n.label++,i=s[1],s=[0];continue;case 7:s=n.ops.pop(),n.trys.pop();continue;default:if(a=n.trys,!(a=a.length>0&&a[a.length-1])&&(s[0]===6||s[0]===2)){n=0;continue}if(s[0]===3&&(!a||s[1]>a[0]&&s[1]<a[3])){n.label=s[1];break}if(s[0]===6&&n.label<a[1]){n.label=a[1],a=s;break}if(a&&n.label<a[2]){n.label=a[2],n.ops.push(s);break}a[2]&&n.ops.pop(),n.trys.pop();continue}s=r.call(e,n)}catch(l){s=[6,l],i=0}finally{o=a=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}},ze=function(e,r){var n=typeof Symbol=="function"&&e[Symbol.iterator];if(!n)return e;var o=n.call(e),i,a=[],u;try{for(;(r===void 0||r-- >0)&&!(i=o.next()).done;)a.push(i.value)}catch(f){u={error:f}}finally{try{i&&!i.done&&(n=o.return)&&n.call(o)}finally{if(u)throw u.error}}return a},$e=function(e,r,n){if(n||arguments.length===2)for(var o=0,i=r.length,a;o<i;o++)(a||!(o in r))&&(a||(a=Array.prototype.slice.call(r,0,o)),a[o]=r[o]);return e.concat(a||Array.prototype.slice.call(r))},de=new X,q=new X,H=new X,Y={cache:de,refreshInterval:0,ttl:0,serverTTL:1e3,dedupingInterval:2e3,revalidateOnFocus:!0,revalidateDebounce:0,shouldRetryOnError:!0,errorRetryInterval:5e3,errorRetryCount:5,fetcher:j.fetcher,isOnline:j.isOnline,isDocumentVisible:j.isDocumentVisible};function Ke(e,r,n){var o=q.get(e);if(o)o.data.push(r);else{var i=5e3;q.set(e,[r],n>0?n+i:n)}}function Ge(e,r,n){if(n.isDocumentVisible()&&!(n.errorRetryCount!==void 0&&r>n.errorRetryCount)){var o=Math.min(r||0,n.errorRetryCount),i=o*n.errorRetryInterval;setTimeout(function(){e(null,{errorRetryCount:o+1,shouldRetryOnError:!0})},i)}}function fe(e){var r=e.shouldRetry,n=r===void 0?void 0:r,o=e.error;return typeof n=="function"?n(o):typeof n=="boolean"?n:Y.shouldRetryOnError}var me=function(e,r,n,o){return n===void 0&&(n=de),o===void 0&&(o=Y.ttl),M(void 0,void 0,void 0,function(){var i,a,u,f,m,s,l;return F(this,function(c){switch(c.label){case 0:if(!je(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 f=c.sent(),a=f,[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,o)}catch(d){console.error("swrv(mutate): failed to set cache",d)}return s=q.get(e),s&&s.data.length&&(l=s.data.filter(function(d){return d.key===e}),l.forEach(function(d,y){typeof m.data<"u"&&(d.data=m.data),d.error=m.error,d.isValidating=m.isValidating,d.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 o,i,a=k({},Y),u=!1,f=!1;if(!t.getCurrentScope())return console.error("useSWRV must be called inside setup() or an active effectScope()."),null;var m=typeof window>"u"||typeof document>"u";r.length>=1&&(o=r[0]),r.length>=2&&(i=r[1]),r.length>2&&(a=k(k({},a),r[2]));var s=m?a.serverTTL:a.ttl,l=typeof o=="function"?o:t.ref(o);typeof i>"u"&&(i=a.fetcher);var c=null;c||(c=t.reactive({data:void 0,error:void 0,isValidating:!0,isLoading:!0,key:null}));var d=function(v,g){return M(e,void 0,void 0,function(){var S,R,C,_,V,B,Z,Ce=this;return F(this,function(ee){switch(ee.label){case 0:return S=c.data===void 0,R=l.value,R?(C=a.cache.get(R),_=C&&C.data,c.isValidating=!0,c.isLoading=!_,_&&(c.data=_.data,c.error=_.error),V=v||i,!V||!a.isDocumentVisible()&&!S||(g==null?void 0:g.forceRevalidate)!==void 0&&!(g!=null&&g.forceRevalidate)?(c.isValidating=!1,c.isLoading=!1,[2]):C&&(B=!!(Date.now()-C.createdAt>=a.dedupingInterval||g!=null&&g.forceRevalidate),!B)?(c.isValidating=!1,c.isLoading=!1,[2]):(Z=function(){return M(Ce,void 0,void 0,function(){var N,_e,re,Ie,De,Ae;return F(this,function(z){switch(z.label){case 0:return N=H.get(R),N?[3,2]:(_e=Array.isArray(R)?R:[R],re=V.apply(void 0,$e([],ze(_e),!1)),H.set(R,re,a.dedupingInterval),[4,me(R,re,a.cache,s)]);case 1:return z.sent(),[3,4];case 2:return[4,me(R,N.data,a.cache,s)];case 3:z.sent(),z.label=4;case 4:return c.isValidating=!1,c.isLoading=!1,H.delete(R),c.error!==void 0&&(Ie=fe({shouldRetry:a.shouldRetryOnError,error:c.error}),De=fe({shouldRetry:g?g.shouldRetryOnError:!0,error:c.error}),Ae=!u&&Ie&&De,Ae&&Ge(d,g?g.errorRetryCount:1,a)),[2]}})})},_&&a.revalidateDebounce?(setTimeout(function(){return M(Ce,void 0,void 0,function(){return F(this,function(N){switch(N.label){case 0:return u?[3,2]:[4,Z()];case 1:N.sent(),N.label=2;case 2:return[2]}})})},a.revalidateDebounce),[3,3]):[3,1])):[2];case 1:return[4,Z()];case 2:ee.sent(),ee.label=3;case 3:return[2]}})})},y=function(){return M(e,void 0,void 0,function(){return F(this,function(v){return[2,d(null,{shouldRetryOnError:!1})]})})},p=null;if(!m){var T=function(){return M(e,void 0,void 0,function(){return F(this,function(v){switch(v.label){case 0:return!c.error&&a.isOnline()?[4,d()]:[3,2];case 1:return v.sent(),[3,3];case 2:p&&(clearTimeout(p),p=null),v.label=3;case 3:return a.refreshInterval&&!u&&(p=setTimeout(T,a.refreshInterval)),[2]}})})};a.refreshInterval&&(p=setTimeout(T,a.refreshInterval)),a.revalidateOnFocus&&(document.addEventListener("visibilitychange",y,!1),window.addEventListener("focus",y,!1))}t.onScopeDispose(function(){u=!0,p&&(clearTimeout(p),p=null),!m&&a.revalidateOnFocus&&(document.removeEventListener("visibilitychange",y,!1),window.removeEventListener("focus",y,!1));var v=q.get(l.value);v&&(v.data=v.data.filter(function(g){return g!==c}))});try{t.watch(l,function(v){t.isReadonly(l)||(l.value=v),c.key=v,c.isValidating=!!v,Ke(l.value,c,s),!m&&!f&&l.value&&d(),f=!1},{immediate:!0})}catch{}var E=k(k({},t.toRefs(c)),{mutate:function(v,g){return d(v,k(k({},g),{forceRevalidate:!0}))}});return E}function je(e){return e!==null&&typeof e=="object"&&typeof e.then=="function"}function He(e,r,n){const{data:o,error:i,isValidating:a,mutate:u}=Xe(e,r,{revalidateDebounce:500,revalidateOnFocus:!1,dedupingInterval:100,...n});return{data:t.computed(()=>o.value),response:o,error:i,isValidating:a,revalidate:u}}const w={useI18n:we,useMetricCardBuilder:Fe,useMetricFetcher:Me,useTrendRange:ce,useRequest:He},ye=Symbol("METRICS_PROVIDER_KEY"),Ye=e=>{const{datasource:r,dimension:n,dimensionFilterValue:o,additionalFilter:i,queryReady:a,timeRange:u,hasTrendAccess:f,refreshInterval:m,abortController:s,queryFn:l,averageLatencies:c}=e;if(o&&!n)throw new Error("Must provide a dimension if filtering by a value");const d=!!(n&&o),y=!!(n&&!o),p=t.computed(()=>{const S=[];return d&&S.push({field:n,operator:"in",value:[o]}),i.value&&S.push(...te.stripUnknownFilters(r.value,i.value)),S}),T={datasource:r,metrics:t.ref(["request_count"]),dimensions:[...n&&!d?[n]:[],"status_code_grouped"],filter:p,queryReady:a,timeRange:u,withTrend:t.computed(()=>f.value&&!y),refreshInterval:m,queryFn:l,abortController:s,refreshCounter:e.refreshCounter},E={datasource:r,metrics:t.computed(()=>[c.value?"response_latency_average":"response_latency_p99"]),...n&&!d?{dimensions:[n]}:{},filter:p,queryReady:a,timeRange:u,withTrend:t.computed(()=>f.value&&!y),refreshInterval:m,queryFn:l,abortController:s,refreshCounter:e.refreshCounter},v=w.useMetricFetcher(T),g=w.useMetricFetcher(E);return{trafficData:v,latencyData:g}},Qe=t.defineComponent({__name:"MetricsProvider",props:{datasource:{default:void 0},maxTimeRange:{default:"30d"},overrideTimeRange:{default:void 0},dimension:{default:void 0},filterValue:{default:void 0},additionalFilter:{default:void 0},queryReady:{type:Boolean,default:!0},refreshInterval:{default:ie},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&&te.queryableExploreDimensions.findIndex(d=>d===r.dimension)===-1)throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${r.dimension}`);const n=t.inject(oe);let o;n?o=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"),o=()=>Promise.reject(new Error("Query bridge required")));const i=ke.useAnalyticsConfigStore(),a=t.computed(()=>!0),u=t.computed(()=>!i.loading&&r.queryReady),f=t.computed(()=>r.datasource?r.datasource:"basic"),m=t.computed(()=>{const d=r.overrideTimeRange;return d&&!d.tz&&(d.tz=new Intl.DateTimeFormat().resolvedOptions().timeZone),d||{type:"relative",time_range:"7d",tz:new Intl.DateTimeFormat().resolvedOptions().timeZone}}),s=t.computed(()=>!r.percentileLatency),{trafficData:l,latencyData:c}=Ye({datasource:f,dimension:r.dimension,dimensionFilterValue:r.filterValue,additionalFilter:t.toRef(r,"additionalFilter"),queryReady:u,timeRange:m,hasTrendAccess:a,refreshInterval:r.refreshInterval,queryFn:o,averageLatencies:s,abortController:r.abortController,refreshCounter:t.toRef(r,"refreshCounter")});return t.provide(ye,{data:{traffic:l,latency:c},description:t.toRef(()=>r.description),containerTitle:t.toRef(()=>r.containerTitle),hasTrendAccess:a,longCardTitles:r.longCardTitles,averageLatencies:s}),(d,y)=>t.renderSlot(d.$slots,"default",{hasTrendAccess:a.value,timeRange:m.value})}});function We(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var ge={exports:{}};(function(e){(function(){function r(s,l){if(l.separator===!1||s<1e3)return s.toString();var c=typeof l.separator=="string"?l.separator:",",d=[],y=Math.round(s).toString().split("");return y.reverse().forEach(function(p,T){T&&T%3===0&&d.push(c),d.push(p)}),d.reverse().join("")}function n(s,l,c){var d=s/l,y=c.round?"round":"floor";return c.decimal===!1?(s=Math[y](d),s.toString()):(c.precision?s=d:s=d<10?Math[y](d*10)/10:Math[y](d),s=s.toString(),typeof c.decimal=="string"&&(s=s.replace(".",c.decimal)),s)}var o=1e3,i=1e4,a=1e6,u=1e9,f=1e12;function m(s,l){var c;l=l||{};var d=s<0;d&&(s=Math.abs(s)),l.precision&&(s=parseFloat(s.toPrecision(l.precision)));var y=l.min10k?i:o;return s<y||l.precision&&l.precision>Math.log10(s)?c=r(n(s,1,l),l):s<a?c=n(s,o,l)+"k":s<u?c=n(s,a,l)+"m":s<f?c=r(n(s,u,l),l)+"b":c=r(n(s,f,l),l)+"t",d&&(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})()})(ge);var Je=ge.exports;const Ze=We(Je);var A=(e=>(e.GENERIC_COUNT="GenericCount",e.TRAFFIC="Traffic",e.ERROR_RATE="ErrorRate",e.LATENCY="Latency",e))(A||{}),D=(e=>(e.Small="sm",e.Medium="md",e.Large="lg",e.ExtraLarge="xl",e))(D||{});const x=2,Q=x+2,he=(e,r,n=!1)=>{let o=!r||Number(e.toFixed(Q))===0?0:Number(e.toFixed(Q))>0?1:-1;return n&&(o*=-1),o},pe=(e,r,n)=>r?`${Math.abs(e*100).toFixed(x)}%`:n,ve=(e,r)=>r===0?0:e/r-1,Ee=(e,r=!1)=>(r&&(e*=-1),e>0?I.TrendUpIcon:e<0?I.TrendDownIcon:I.IndeterminateSmallIcon),er="#ad000e",W="#6c7489",Re="#52596e",rr="#007d60",U="16px",tr="20px",nr={key:0,class:"metricscard-description"},ar={class:"metricscard-valuetrend"},ir={key:0,class:"metricscard-error"},or={key:2,class:"metricscard-trend"},sr={"data-testid":"metric-trend-change"},lr={key:0,class:"metricscard-trend-range"},cr=t.defineComponent({__name:"MetricsCard",props:{cardType:{type:String,required:!0,default:A.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:I.IndeterminateSmallIcon},trendRange:{type:String,default:""},hasError:{type:Boolean,default:!1},errorMessage:{type:String,default:"Vitals data error"},cardSize:{type:String,required:!1,default:()=>D.Large},hasContainerTitle:{type:Boolean,required:!1,default:!1},titleTag:{type:String,default:"span"}},setup(e){const r=new Map([[A.GENERIC_COUNT,I.VitalsIcon],[A.TRAFFIC,I.CloudUploadIcon],[A.ERROR_RATE,I.WarningOutlineIcon],[A.LATENCY,I.ResponseIcon]]),n=e,o=f=>{const m={red:`var(--kui-color-text-danger-strong, ${er})`,green:`var(--kui-color-text-success, ${rr})`,grey:`var(--kui-color-text-neutral-strong, ${Re})`};return f>0?m.green:f<0?m.red:m.grey},i=f=>f>0?"positive":f<0?"negative":"neutral",a=[D.Medium,D.Large].includes(n.cardSize),u=[D.Small].includes(n.cardSize);return(f,m)=>{const s=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(W)})`,size:t.unref(U)},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(s,{key:1,class:"metricscard-tooltip",placement:"right",text:e.tooltip},{default:t.withCtx(()=>[t.createVNode(t.unref(I.InfoIcon),{color:`var(--kui-color-text-neutral, ${t.unref(W)})`,size:t.unref(U)},null,8,["color","size"])]),_:1},8,["text"])):t.createCommentVNode("",!0)],2),e.description&&t.unref(a)?(t.openBlock(),t.createElementBlock("div",nr,[t.createElementVNode("span",null,t.toDisplayString(e.description),1)])):t.createCommentVNode("",!0),t.createElementVNode("div",ar,[e.hasError?(t.openBlock(),t.createElementBlock("div",ir,[t.createVNode(t.unref(I.WarningIcon),{color:`var(--kui-color-text-neutral, ${t.unref(W)})`,size:t.unref(tr)},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",or,[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:o(e.changePolarity),size:t.unref(U)},null,8,["color","size"])):(t.openBlock(),t.createBlock(t.unref(I.EqualIcon),{key:1,color:`var(--kui-color-text-neutral-strong, ${t.unref(Re)})`,size:t.unref(U)},null,8,["color","size"])),t.createElementVNode("div",sr,t.toDisplayString(e.metricChange),1)],2),e.trendRange?(t.openBlock(),t.createElementBlock("div",lr,t.toDisplayString(e.trendRange),1)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0)])],2)}}}),J=(e,r)=>{const n=e.__vccOpts||e;for(const[o,i]of r)n[o]=i;return n},ur=J(cr,[["__scopeId","data-v-b1513f6f"]]),dr={},fr={class:"loading-tabs"};function mr(e,r){const n=t.resolveComponent("KSkeletonBox");return t.openBlock(),t.createElementBlock("div",fr,[t.createVNode(n,{width:"100"}),t.createVNode(n,{width:"75"})])}const yr=J(dr,[["render",mr],["__scopeId","data-v-9c7113d7"]]),gr={key:0,class:"container-title"},hr={key:0,class:"container-description"},pr={key:1,class:"error-display"},vr={key:0,class:"error-display-message"},Er={key:2,class:"cards-wrapper"},Rr=J(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:()=>D.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)),o=i=>{const a=ve(i.currentValue,i.previousValue)||0,u=he(a,r.hasTrendAccess,i.increaseIsBad);return{metricValue:i.formatValueFn?i.formatValueFn(i.currentValue):Ze(i.currentValue,{capital:!0,round:!0})||"0",metricChange:i.formatChangeFn?i.formatChangeFn(a):pe(a,r.hasTrendAccess,r.fallbackDisplayText),changePolarity:u,trendIcon:Ee(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",gr,[t.createTextVNode(t.toDisplayString(r.containerTitle)+" ",1),r.containerDescription?(t.openBlock(),t.createElementBlock("div",hr,t.toDisplayString(r.containerDescription),1)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0),n.value?(t.openBlock(),t.createElementBlock("div",pr,[t.createVNode(t.unref(I.WarningIcon),{class:"error-display-icon"}),e.errorMessage?(t.openBlock(),t.createElementBlock("div",vr,t.toDisplayString(e.errorMessage),1)):t.createCommentVNode("",!0)])):(t.openBlock(),t.createElementBlock("div",Er,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.cards,(u,f)=>(t.openBlock(),t.createElementBlock(t.Fragment,null,[e.loading?(t.openBlock(),t.createElementBlock("div",{key:`skeleton-${f}`,class:"loading-tab"},[t.createVNode(yr,{class:t.normalizeClass(e.cardSize===t.unref(D).Small?"loading-tabs-small":"loading-tabs-large")},null,8,["class"])])):(t.openBlock(),t.createBlock(ur,t.mergeProps({key:f},{ref_for:!0},o(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"]]),Tr=t.defineComponent({__name:"MetricsConsumer",props:{lookupKey:{default:void 0},cardSize:{default:D.Large},cardToDisplay:{default:void 0}},setup(e){const r=e,n=t.inject(ye);if(!n)throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");const{traffic:o,latency:i}=n.data,{i18n:a}=w.useI18n(),u=t.computed(()=>n.containerTitle.value?D.Medium:r.cardSize),f=w.useMetricCardBuilder({cardType:A.TRAFFIC,title:t.computed(()=>n.longCardTitles?a.t("metricCard.long.traffic"):a.t("metricCard.short.traffic")),record:o.mapped,hasError:o.hasError,lookupKey:r.lookupKey,sumGroupedValues:O,trendRange:o.trendRange}),m=E=>`${E.toFixed(x)}%`,s=t.computed(()=>{const E=o.mapped.value,v=L(E,"current",r.lookupKey,$),g=L(E,"current",r.lookupKey,O),S=v/g*100||0,R=L(E,"previous",r.lookupKey,$),C=L(E,"previous",r.lookupKey,O),_=R/C*100||0;return{cardType:A.ERROR_RATE,hasError:o.hasError.value,currentValue:S,previousValue:_,formatValueFn:m,title:n.longCardTitles?a.t("metricCard.long.errorRate"):a.t("metricCard.short.errorRate"),increaseIsBad:!0,trendRange:o.trendRange.value}}),l=E=>`${E}ms`,c=w.useMetricCardBuilder({cardType:A.LATENCY,title:t.computed(()=>{const{longCardTitles:E,averageLatencies:v}=n,g=v.value?"averageLatency":"p99Latency";return E?a.t(`metricCard.long.${g}`):u.value===D.Small?a.t(`metricCard.small.${g}`):a.t(`metricCard.short.${g}`)}),hasError:i.hasError,record:i.mapped,lookupKey:r.lookupKey,increaseIsBad:!0,formatValueFn:l,trendRange:i.trendRange}),d=t.computed(()=>r.cardToDisplay==="TRAFFIC"?[f.value]:r.cardToDisplay==="ERROR_RATE"?[s.value]:r.cardToDisplay==="LATENCY"?[c.value]:[f.value,s.value,c.value]),y=t.computed(()=>r.cardToDisplay==="TRAFFIC"||r.cardToDisplay==="ERROR_RATE"?o.isLoading.value:r.cardToDisplay==="LATENCY"?i.isLoading.value:o.isLoading.value||i.isLoading.value),p=t.computed(()=>({cards:d.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})),T=t.computed(()=>({loading:p.value.loading,trafficCard:f.value,errorRateCard:s.value,latencyCard:c.value,errorRateFormatted:m(s.value.currentValue),latencyFormatted:l(c.value.currentValue)}));return(E,v)=>t.renderSlot(E.$slots,"default",{cardValues:T.value},()=>[t.createVNode(Rr,t.normalizeProps(t.guardReactiveProps(p.value)),null,16)])}}),P=e=>new Date(e),Sr=(e,r)=>{const n=e.body;e.reply({statusCode:200,body:Se(n,r)})},Te=e=>e.reduce((r,n)=>(r[n]={name:n},r),{}),Se=(e,r)=>{var T,E,v;const n=r!=null&&r.timeRange&&{start:r.timeRange.start,end:r.timeRange.end}||((T=e.time_range)==null?void 0:T.type)==="absolute"?{start:new Date(e.time_range.start),end:new Date(e.time_range.end)}:{start:new Date(Date.now()-864e5),end:new Date},o=n.end.getTime()-n.start.getTime(),i=e.granularity==="trend"?{start:new Date(n.start.getTime()-o),end:n.end,granularity:n.end.getTime()-n.start.getTime()}:{start:n.start,end:n.end,granularity:n.end.getTime()-n.start.getTime()},a=i.end.getTime(),u=i.start.getTime(),f=i.granularity,m=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 s=(e.dimensions??[]).find(g=>g!=="time"),l=(r==null?void 0:r.dimensionNames)??[],c=Math.max(l.length,1),d=e.metrics||[],y=[];for(let g=0;g<m;g++)for(let S=0;S<c;S++){const R=s?{[s]:l[S]}:{};(E=e.dimensions)!=null&&E.includes("status_code_grouped")?O.forEach(C=>{const _=d.reduce((V,B)=>((r==null?void 0:r.deterministic)??!0?V[B]=(m-g)*1e3+100*S+1:V[B]=Math.round(Math.random()*1e3),V),{...R,status_code_grouped:C});y.push({version:"v1",timestamp:g===0?P(u).toISOString():P(u+f).toISOString(),event:_})}):y.push({version:"v1",timestamp:g===0?P(u).toISOString():P(u+f).toISOString(),event:d.reduce((C,_)=>((r==null?void 0:r.deterministic)??!0?C[_]=(m-g)*1e3+100*S+1:C[_]=Math.round(Math.random()*1e3),C),{...R})})}const p={start:new Date(u).toISOString(),end:new Date(a).toISOString(),granularity_ms:f,display:s?{[s]:Te(l),...(v=e.dimensions)!=null&&v.includes("status_code_grouped")?{status_code_grouped:Te(O)}:{}}:{},metric_names:e.metrics,query_id:"test"};return{data:y,meta:p}};h.ALL_STATUS_CODE_GROUPS=O,h.DECIMAL_DISPLAY=x,h.DECIMAL_ROUNDING_PRECISION=Q,h.DEFAULT_REFRESH_INTERVAL=ie,h.INJECT_QUERY_PROVIDER=oe,h.MAX_ANALYTICS_REQUEST_RETRIES=ae,h.MetricCardSize=D,h.MetricCardType=A,h.MetricsConsumer=Tr,h.MetricsProvider=Qe,h.STATUS_CODES_FAILED=$,h.STATUS_CODES_SUCCESS=Ve,h.calculateChange=ve,h.changePolarity=he,h.defineIcon=Ee,h.metricChange=pe,h.mockExploreResponse=Se,h.mockExploreResponseFromCypress=Sr,h.useTrendRange=ce,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(g,n){typeof exports=="object"&&typeof module<"u"?n(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"],n):(g=typeof globalThis<"u"?globalThis:g||self,n(g["kong-ui-public-vitals-metric-provider"]={},g.Vue,g["kong-ui-public-analytics-utilities"],g["kong-ui-public-i18n"],g.axios,g["kong-ui-public-analytics-config-store"],g.KongIcons))})(this,function(g,n,ae,ie,Ar,Le,_){"use strict";const Me={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 Fe(){const e=ie.createI18n("en-us",Me);return{i18n:e,i18nT:ie.i18nTComponent(e)}}const oe=2,N=["1XX","2XX","3XX","4XX","5XX"],G=["4XX","5XX"],Be=["1XX","2XX","3XX"],se=30*1e3,le="analytics-query-provider";var ce=(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))(ce||{});const qe=e=>{var r,t,i,o,a;return e?!!((r=Object.keys(e))!=null&&r.length||(t=e.data)!=null&&t.length||(o=(i=e.data)==null?void 0:i.data)!=null&&o.length||!((a=e.data)!=null&&a.data)&&typeof e.data=="object"&&Object.keys(e==null?void 0:e.data).length):!1};function Ue(e=n.ref({}),r,t,i=qe){const o=n.ref("PENDING");return n.watchEffect(()=>{const a=i(e.value);if(e.value&&a&&t.value){o.value="VALIDATING_HAS_DATA";return}if(e.value&&t.value){o.value="VALIDATING";return}if(e.value&&r.value){o.value="STALE_IF_ERROR";return}if(e.value===void 0&&!r.value){o.value="PENDING";return}if(e.value&&!r.value&&a){o.value="SUCCESS_HAS_DATA";return}if(e.value&&!r.value){o.value="SUCCESS";return}e.value===void 0&&r&&(o.value="ERROR")}),{state:o,swrvState:ce}}const b=Symbol("default"),X="status_code_grouped",ue=(e,r,t,i,o)=>{e[r][t]||(e[r][t]={}),e[r][t][i]=o};function $e(e,r){var d;const t=((d=e.meta.metric_names)==null?void 0:d[0])||"",i=new Date(e.meta.start).getTime(),o=Object.keys(e.meta.display||{}),a=!!o.find(f=>f===X),l=o.find(f=>f!==X);return o.length>2||o.length>1&&!a?(console.error("Don't know how to work with provided dimensions:",o),{previous:{[b]:{[b]:0}},current:{[b]:{[b]:0}}}):e.data.reduce((f,s)=>{const u=s.event[t],c=l?s.event[l]:b,m=a?s.event[X]:b;return new Date(s.timestamp).getTime()===i&&r?ue(f,"previous",c,m,u):ue(f,"current",c,m,u),f},{previous:{},current:{}})}function xe(e){e.queryReady===void 0&&(e.queryReady=n.computed(()=>!0));const r=n.computed(()=>{var u,c;return{metrics:e.metrics.value,dimensions:[...(u=e.dimensions)!=null&&u.length?[...e.dimensions]:[],...e.withTrend.value?["time"]:[]],granularity:e.withTrend.value?"trend":void 0,...(c=e.filter.value)!=null&&c.length?{filters:e.filter.value}:{},time_range:e.timeRange.value}}),t=n.computed(()=>{var c,m,v,h;if(!((c=e.queryReady)!=null&&c.value))return null;const u=(m=e.filter)!=null&&m.value?JSON.stringify(e.filter.value):"";return`metric-fetcher-${JSON.stringify(e.timeRange.value)}-${(v=e.dimensions)==null?void 0:v.join("-")}-${(h=e.metrics.value)==null?void 0:h.join("-")}-${u}-${e.refreshCounter.value}`}),{response:i,error:o,isValidating:a}=w.useRequest(()=>t.value,()=>e.queryFn({datasource:e.datasource.value,query:r.value},e.abortController??new AbortController),{refreshInterval:e.refreshInterval,revalidateOnFocus:!1,errorRetryCount:oe}),{state:l,swrvState:d}=Ue(i,o,a),f=n.computed(()=>{var u,c,m,v,h,I,E;return!((c=(u=i.value)==null?void 0:u.data)!=null&&c.length)||!((v=(m=i.value)==null?void 0:m.meta)!=null&&v.display)||!((E=(I=(h=i.value)==null?void 0:h.meta)==null?void 0:I.metric_names)!=null&&E.length)?{current:{},previous:{}}:$e(i.value,e.withTrend.value)}),s=w.useTrendRange(e.withTrend,e.timeRange,n.computed(()=>{var u;return(u=i.value)==null?void 0:u.meta}));return{isLoading:n.computed(()=>d.PENDING===l.value),hasError:n.computed(()=>d.ERROR===l.value),raw:i,mapped:f,trendRange:s}}const L=(e,r,t=b,i)=>(i??[b]).reduce((a,l)=>{const d=e[r][t];return d?a+(d[l]||0):a},0);function Pe(e){const{cardType:r,title:t,description:i,record:o,hasError:a,increaseIsBad:l,formatValueFn:d,trendRange:f}=e;return n.computed(()=>{let s=0,u=0;if(o!=null&&o.value)try{s=L(o.value,"current",e.lookupKey,e.sumGroupedValues),u=L(o.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:s,previousValue:u,title:t.value,description:i,increaseIsBad:!!l,formatValueFn:d,trendRange:f==null?void 0:f.value}})}function de(e,r,t){const{i18n:i}=w.useI18n(),o=1e3*60,a=o*60,l=a*24,d=(s,u)=>{let c=u-s;e.value&&(c/=2);const m=c/l,v=c/a,h=c/o;return m>=1?i.t("trendRange.custom_days",{numDays:Math.round(m)}):v>=1?i.t("trendRange.custom_hours",{numHours:Math.round(v)}):h>=1?i.t("trendRange.custom_minutes",{numMinutes:Math.round(h)}):i.t("trendRange.custom_days",{numDays:Math.round(m)})},f=()=>{var s,u;if((s=t==null?void 0:t.value)!=null&&s.start&&t.value.end)return{startMs:new Date(t.value.start).getTime(),endMs:new Date(t.value.end).getTime()};if(((u=r==null?void 0:r.value)==null?void 0:u.type)==="absolute"&&r.value.start&&r.value.end)return{startMs:new Date(r.value.start).getTime(),endMs:new Date(r.value.end).getTime()}};return n.computed(()=>{var s,u;if(((s=r==null?void 0:r.value)==null?void 0:s.type)==="relative"&&e.value)return i.t(`trendRange.${r.value.time_range}`);if(e.value||((u=r==null?void 0:r.value)==null?void 0:u.type)==="absolute"){const c=f();if(c)return d(c.startMs,c.endMs)}return""})}var j=new WeakMap,fe=0;function ze(e){if(!e.length)return"";for(var r="arg",t=0;t<e.length;++t){var i=void 0;e[t]===null||typeof e[t]!="object"&&typeof e[t]!="function"?typeof e[t]=="string"?i='"'+e[t]+'"':i=String(e[t]):j.has(e[t])?i=j.get(e[t]):(i=fe,j.set(e[t],fe++)),r+="@"+i}return r}function Ke(e){if(typeof e=="function")try{e=e()}catch{e=""}return Array.isArray(e)?e=ze(e):e=String(e||""),e}var H=function(){function e(r){r===void 0&&(r=0),this.items=new Map,this.ttl=r}return e.prototype.serializeKey=function(r){return Ke(r)},e.prototype.get=function(r){var t=this.serializeKey(r);return this.items.get(t)},e.prototype.set=function(r,t,i){var o=this.serializeKey(r),a=i||this.ttl,l=Date.now(),d={data:t,createdAt:l,expiresAt:a?l+a:1/0};this.dispatchExpire(a,d,o),this.items.set(o,d)},e.prototype.dispatchExpire=function(r,t,i){var o=this;r&&setTimeout(function(){var a=Date.now(),l=a>=t.expiresAt;l&&o.delete(i)},r)},e.prototype.delete=function(r){this.items.delete(r)},e}();function Ge(){return typeof navigator.onLine<"u"?navigator.onLine:!0}function Xe(){return typeof document<"u"&&typeof document.visibilityState<"u"?document.visibilityState!=="hidden":!0}var je=function(e){return fetch(e).then(function(r){return r.json()})};const Y={isOnline:Ge,isDocumentVisible:Xe,fetcher:je};var k=function(){return k=Object.assign||function(e){for(var r,t=1,i=arguments.length;t<i;t++){r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e},k.apply(this,arguments)},M=function(e,r,t,i){function o(a){return a instanceof t?a:new t(function(l){l(a)})}return new(t||(t=Promise))(function(a,l){function d(u){try{s(i.next(u))}catch(c){l(c)}}function f(u){try{s(i.throw(u))}catch(c){l(c)}}function s(u){u.done?a(u.value):o(u.value).then(d,f)}s((i=i.apply(e,r||[])).next())})},F=function(e,r){var t={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},i,o,a,l;return l={next:d(0),throw:d(1),return:d(2)},typeof Symbol=="function"&&(l[Symbol.iterator]=function(){return this}),l;function d(s){return function(u){return f([s,u])}}function f(s){if(i)throw new TypeError("Generator is already executing.");for(;t;)try{if(i=1,o&&(a=s[0]&2?o.return:s[0]?o.throw||((a=o.return)&&a.call(o),0):o.next)&&!(a=a.call(o,s[1])).done)return a;switch(o=0,a&&(s=[s[0]&2,a.value]),s[0]){case 0:case 1:a=s;break;case 4:return t.label++,{value:s[1],done:!1};case 5:t.label++,o=s[1],s=[0];continue;case 7:s=t.ops.pop(),t.trys.pop();continue;default:if(a=t.trys,!(a=a.length>0&&a[a.length-1])&&(s[0]===6||s[0]===2)){t=0;continue}if(s[0]===3&&(!a||s[1]>a[0]&&s[1]<a[3])){t.label=s[1];break}if(s[0]===6&&t.label<a[1]){t.label=a[1],a=s;break}if(a&&t.label<a[2]){t.label=a[2],t.ops.push(s);break}a[2]&&t.ops.pop(),t.trys.pop();continue}s=r.call(e,t)}catch(u){s=[6,u],o=0}finally{i=a=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}},He=function(e,r){var t=typeof Symbol=="function"&&e[Symbol.iterator];if(!t)return e;var i=t.call(e),o,a=[],l;try{for(;(r===void 0||r-- >0)&&!(o=i.next()).done;)a.push(o.value)}catch(d){l={error:d}}finally{try{o&&!o.done&&(t=i.return)&&t.call(i)}finally{if(l)throw l.error}}return a},Ye=function(e,r,t){if(t||arguments.length===2)for(var i=0,o=r.length,a;i<o;i++)(a||!(i in r))&&(a||(a=Array.prototype.slice.call(r,0,i)),a[i]=r[i]);return e.concat(a||Array.prototype.slice.call(r))},me=new H,$=new H,Q=new H,W={cache:me,refreshInterval:0,ttl:0,serverTTL:1e3,dedupingInterval:2e3,revalidateOnFocus:!0,revalidateDebounce:0,shouldRetryOnError:!0,errorRetryInterval:5e3,errorRetryCount:5,fetcher:Y.fetcher,isOnline:Y.isOnline,isDocumentVisible:Y.isDocumentVisible};function Qe(e,r,t){var i=$.get(e);if(i)i.data.push(r);else{var o=5e3;$.set(e,[r],t>0?t+o:t)}}function We(e,r,t){if(t.isDocumentVisible()&&!(t.errorRetryCount!==void 0&&r>t.errorRetryCount)){var i=Math.min(r||0,t.errorRetryCount),o=i*t.errorRetryInterval;setTimeout(function(){e(null,{errorRetryCount:i+1,shouldRetryOnError:!0})},o)}}function ye(e){var r=e.shouldRetry,t=r===void 0?void 0:r,i=e.error;return typeof t=="function"?t(i):typeof t=="boolean"?t:W.shouldRetryOnError}var ge=function(e,r,t,i){return t===void 0&&(t=me),i===void 0&&(i=W.ttl),M(void 0,void 0,void 0,function(){var o,a,l,d,f,s,u;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 o=c.sent(),[3,4];case 3:return d=c.sent(),a=d,[3,4];case 4:return[3,6];case 5:o=r,c.label=6;case 6:if(l=!1,f={data:o,error:a,isValidating:l},typeof o<"u")try{t.set(e,f,i)}catch(m){console.error("swrv(mutate): failed to set cache",m)}return s=$.get(e),s&&s.data.length&&(u=s.data.filter(function(m){return m.key===e}),u.forEach(function(m,v){typeof f.data<"u"&&(m.data=f.data),m.error=f.error,m.isValidating=f.isValidating,m.isLoading=f.isValidating;var h=v===u.length-1;h||delete u[v]}),u=u.filter(Boolean)),[2,f]}})})};function Je(){for(var e=this,r=[],t=0;t<arguments.length;t++)r[t]=arguments[t];var i,o,a=k({},W),l=!1,d=!1;if(!n.getCurrentScope())return console.error("useSWRV must be called inside setup() or an active effectScope()."),null;var f=typeof window>"u"||typeof document>"u";r.length>=1&&(i=r[0]),r.length>=2&&(o=r[1]),r.length>2&&(a=k(k({},a),r[2]));var s=f?a.serverTTL:a.ttl,u=typeof i=="function"?i:n.ref(i);typeof o>"u"&&(o=a.fetcher);var c=null;c||(c=n.reactive({data:void 0,error:void 0,isValidating:!0,isLoading:!0,key:null}));var m=function(p,y){return M(e,void 0,void 0,function(){var T,R,S,C,V,U,re,be=this;return F(this,function(te){switch(te.label){case 0:return T=c.data===void 0,R=u.value,R?(S=a.cache.get(R),C=S&&S.data,c.isValidating=!0,c.isLoading=!C,C&&(c.data=C.data,c.error=C.error),V=p||o,!V||!a.isDocumentVisible()&&!T||(y==null?void 0:y.forceRevalidate)!==void 0&&!(y!=null&&y.forceRevalidate)?(c.isValidating=!1,c.isLoading=!1,[2]):S&&(U=!!(Date.now()-S.createdAt>=a.dedupingInterval||y!=null&&y.forceRevalidate),!U)?(c.isValidating=!1,c.isLoading=!1,[2]):(re=function(){return M(be,void 0,void 0,function(){var O,we,ne,Ve,Oe,Ne;return F(this,function(K){switch(K.label){case 0:return O=Q.get(R),O?[3,2]:(we=Array.isArray(R)?R:[R],ne=V.apply(void 0,Ye([],He(we),!1)),Q.set(R,ne,a.dedupingInterval),[4,ge(R,ne,a.cache,s)]);case 1:return K.sent(),[3,4];case 2:return[4,ge(R,O.data,a.cache,s)];case 3:K.sent(),K.label=4;case 4:return c.isValidating=!1,c.isLoading=!1,Q.delete(R),c.error!==void 0&&(Ve=ye({shouldRetry:a.shouldRetryOnError,error:c.error}),Oe=ye({shouldRetry:y?y.shouldRetryOnError:!0,error:c.error}),Ne=!l&&Ve&&Oe,Ne&&We(m,y?y.errorRetryCount:1,a)),[2]}})})},C&&a.revalidateDebounce?(setTimeout(function(){return M(be,void 0,void 0,function(){return F(this,function(O){switch(O.label){case 0:return l?[3,2]:[4,re()];case 1:O.sent(),O.label=2;case 2:return[2]}})})},a.revalidateDebounce),[3,3]):[3,1])):[2];case 1:return[4,re()];case 2:te.sent(),te.label=3;case 3:return[2]}})})},v=function(){return M(e,void 0,void 0,function(){return F(this,function(p){return[2,m(null,{shouldRetryOnError:!1})]})})},h=null;if(!f){var I=function(){return M(e,void 0,void 0,function(){return F(this,function(p){switch(p.label){case 0:return!c.error&&a.isOnline()?[4,m()]:[3,2];case 1:return p.sent(),[3,3];case 2:h&&(clearTimeout(h),h=null),p.label=3;case 3:return a.refreshInterval&&!l&&(h=setTimeout(I,a.refreshInterval)),[2]}})})};a.refreshInterval&&(h=setTimeout(I,a.refreshInterval)),a.revalidateOnFocus&&(document.addEventListener("visibilitychange",v,!1),window.addEventListener("focus",v,!1))}n.onScopeDispose(function(){l=!0,h&&(clearTimeout(h),h=null),!f&&a.revalidateOnFocus&&(document.removeEventListener("visibilitychange",v,!1),window.removeEventListener("focus",v,!1));var p=$.get(u.value);p&&(p.data=p.data.filter(function(y){return y!==c}))});try{n.watch(u,function(p){n.isReadonly(u)||(u.value=p),c.key=p,c.isValidating=!!p,Qe(u.value,c,s),!f&&!d&&u.value&&m(),d=!1},{immediate:!0})}catch{}var E=k(k({},n.toRefs(c)),{mutate:function(p,y){return m(p,k(k({},y),{forceRevalidate:!0}))}});return E}function Ze(e){return e!==null&&typeof e=="object"&&typeof e.then=="function"}function er(e,r,t){const{data:i,error:o,isValidating:a,mutate:l}=Je(e,r,{revalidateDebounce:500,revalidateOnFocus:!1,dedupingInterval:100,...t});return{data:n.computed(()=>i.value),response:i,error:o,isValidating:a,revalidate:l}}const w={useI18n:Fe,useMetricCardBuilder:Pe,useMetricFetcher:xe,useTrendRange:de,useRequest:er},he=Symbol("METRICS_PROVIDER_KEY"),rr=e=>{const{datasource:r,dimension:t,dimensionFilterValue:i,additionalFilter:o,queryReady:a,timeRange:l,hasTrendAccess:d,refreshInterval:f,abortController:s,queryFn:u,averageLatencies:c}=e;if(i&&!t)throw new Error("Must provide a dimension if filtering by a value");const m=!!(t&&i),v=!!(t&&!i),h=n.computed(()=>{const T=[];return m&&T.push({field:t,operator:"in",value:[i]}),o.value&&T.push(...ae.stripUnknownFilters(r.value,o.value)),T}),I={datasource:r,metrics:n.ref(["request_count"]),dimensions:[...t&&!m?[t]:[],"status_code_grouped"],filter:h,queryReady:a,timeRange:l,withTrend:n.computed(()=>d.value&&!v),refreshInterval:f,queryFn:u,abortController:s,refreshCounter:e.refreshCounter},E={datasource:r,metrics:n.computed(()=>[c.value?"response_latency_average":"response_latency_p99"]),...t&&!m?{dimensions:[t]}:{},filter:h,queryReady:a,timeRange:l,withTrend:n.computed(()=>d.value&&!v),refreshInterval:f,queryFn:u,abortController:s,refreshCounter:e.refreshCounter},p=w.useMetricFetcher(I),y=w.useMetricFetcher(E);return{trafficData:p,latencyData:y}},tr=n.defineComponent({__name:"MetricsProvider",props:{datasource:{default:void 0},maxTimeRange:{default:"30d"},overrideTimeRange:{default:void 0},dimension:{default:void 0},filterValue:{default:void 0},additionalFilter:{default:void 0},queryReady:{type:Boolean,default:!0},refreshInterval:{default:se},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&&ae.queryableExploreDimensions.findIndex(m=>m===r.dimension)===-1)throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${r.dimension}`);const t=n.inject(le);let i;t?i=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"),i=()=>Promise.reject(new Error("Query bridge required")));const o=Le.useAnalyticsConfigStore(),a=n.computed(()=>!0),l=n.computed(()=>!o.loading&&r.queryReady),d=n.computed(()=>r.datasource?r.datasource:"basic"),f=n.computed(()=>{const m=r.overrideTimeRange;return m&&!m.tz&&(m.tz=new Intl.DateTimeFormat().resolvedOptions().timeZone),m||{type:"relative",time_range:"7d",tz:new Intl.DateTimeFormat().resolvedOptions().timeZone}}),s=n.computed(()=>!r.percentileLatency),{trafficData:u,latencyData:c}=rr({datasource:d,dimension:r.dimension,dimensionFilterValue:r.filterValue,additionalFilter:n.toRef(r,"additionalFilter"),queryReady:l,timeRange:f,hasTrendAccess:a,refreshInterval:r.refreshInterval,queryFn:i,averageLatencies:s,abortController:r.abortController,refreshCounter:n.toRef(r,"refreshCounter")});return n.provide(he,{data:{traffic:u,latency:c},description:n.toRef(()=>r.description),containerTitle:n.toRef(()=>r.containerTitle),hasTrendAccess:a,longCardTitles:r.longCardTitles,averageLatencies:s}),(m,v)=>n.renderSlot(m.$slots,"default",{hasTrendAccess:a.value,timeRange:f.value})}}),pe=1e3,nr=1e4,ve=1e6,Ee=1e9,Re=1e12,q=(e,r)=>{if(r.separator===!1||e<1e3)return e.toString();const t=typeof r.separator=="string"?r.separator:",",i=[];return Math.round(e).toString().split("").reverse().forEach((a,l)=>{l&&l%3===0&&i.push(t),i.push(a)}),i.reverse().join("")},B=(e,r,t)=>{const i=e/r,o=t.round?"round":"floor";if(t.decimal===!1)return Math[o](i).toString();let a;t.precision?a=i:a=i<10?Math[o](i*10)/10:Math[o](i);let l=a.toString();return typeof t.decimal=="string"&&(l=l.replace(".",t.decimal)),l};function Te(e,r={}){let t;const i=e<0;i&&(e=Math.abs(e)),r.precision&&(e=parseFloat(e.toPrecision(r.precision)));const o=r.min10k?nr:pe;return e<o||r.precision&&r.precision>Math.log10(e)?t=q(B(e,1,r),r):e<ve?t=`${B(e,pe,r)}k`:e<Ee?t=`${B(e,ve,r)}m`:e<Re?t=`${q(B(e,Ee,r),r)}b`:t=`${q(B(e,Re,r),r)}t`,i&&(t=`-${t}`),r.capital&&(t=t.toUpperCase()),r.prefix&&(t=`${r.prefix}${t}`),r.suffix&&(t=`${t}${r.suffix}`),t}Te.addCommas=q;var A=(e=>(e.GENERIC_COUNT="GenericCount",e.TRAFFIC="Traffic",e.ERROR_RATE="ErrorRate",e.LATENCY="Latency",e))(A||{}),D=(e=>(e.Small="sm",e.Medium="md",e.Large="lg",e.ExtraLarge="xl",e))(D||{});const x=2,J=x+2,Se=(e,r,t=!1)=>{let i=!r||Number(e.toFixed(J))===0?0:Number(e.toFixed(J))>0?1:-1;return t&&(i*=-1),i},Ce=(e,r,t)=>r?`${Math.abs(e*100).toFixed(x)}%`:t,_e=(e,r)=>r===0?0:e/r-1,Ie=(e,r=!1)=>(r&&(e*=-1),e>0?_.TrendUpIcon:e<0?_.TrendDownIcon:_.IndeterminateSmallIcon),ar="#ad000e",Z="#6c7489",De="#52596e",ir="#007d60",P="16px",or="20px",sr={key:0,class:"metricscard-description"},lr={class:"metricscard-valuetrend"},cr={key:0,class:"metricscard-error"},ur={key:2,class:"metricscard-trend"},dr={"data-testid":"metric-trend-change"},fr={key:0,class:"metricscard-trend-range"},mr=n.defineComponent({__name:"MetricsCard",props:{cardType:{type:String,required:!0,default:A.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:()=>D.Large},hasContainerTitle:{type:Boolean,required:!1,default:!1},titleTag:{type:String,default:"span"}},setup(e){const r=new Map([[A.GENERIC_COUNT,_.VitalsIcon],[A.TRAFFIC,_.CloudUploadIcon],[A.ERROR_RATE,_.WarningOutlineIcon],[A.LATENCY,_.ResponseIcon]]),t=e,i=d=>{const f={red:`var(--kui-color-text-danger-strong, ${ar})`,green:`var(--kui-color-text-success, ${ir})`,grey:`var(--kui-color-text-neutral-strong, ${De})`};return d>0?f.green:d<0?f.red:f.grey},o=d=>d>0?"positive":d<0?"negative":"neutral",a=[D.Medium,D.Large].includes(t.cardSize),l=[D.Small].includes(t.cardSize);return(d,f)=>{const s=n.resolveComponent("KTooltip");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["metricscard",e.cardSize])},[n.createElementVNode("div",{class:n.normalizeClass(["metricscard-title",e.cardSize])},[n.unref(l)?n.createCommentVNode("",!0):(n.openBlock(),n.createBlock(n.resolveDynamicComponent(n.unref(r).get(e.cardType)),{key:0,class:"metricscard-icon",color:`var(--kui-color-text-neutral, ${n.unref(Z)})`,size:n.unref(P)},null,8,["color","size"])),(n.openBlock(),n.createBlock(n.resolveDynamicComponent(e.titleTag),null,{default:n.withCtx(()=>[n.createTextVNode(n.toDisplayString(e.title),1)]),_:1})),e.tooltip?(n.openBlock(),n.createBlock(s,{key:1,class:"metricscard-tooltip",placement:"right",text:e.tooltip},{default:n.withCtx(()=>[n.createVNode(n.unref(_.InfoIcon),{color:`var(--kui-color-text-neutral, ${n.unref(Z)})`,size:n.unref(P)},null,8,["color","size"])]),_:1},8,["text"])):n.createCommentVNode("",!0)],2),e.description&&n.unref(a)?(n.openBlock(),n.createElementBlock("div",sr,[n.createElementVNode("span",null,n.toDisplayString(e.description),1)])):n.createCommentVNode("",!0),n.createElementVNode("div",lr,[e.hasError?(n.openBlock(),n.createElementBlock("div",cr,[n.createVNode(n.unref(_.WarningIcon),{color:`var(--kui-color-text-neutral, ${n.unref(Z)})`,size:n.unref(or)},null,8,["color","size"]),n.createElementVNode("div",null," "+n.toDisplayString(e.errorMessage),1)])):(n.openBlock(),n.createElementBlock("div",{key:1,class:n.normalizeClass(["metricscard-value",e.cardSize]),"data-testid":"metric-value"},n.toDisplayString(e.metricValue),3)),n.unref(a)?(n.openBlock(),n.createElementBlock("div",ur,[n.createElementVNode("div",{class:n.normalizeClass(["metricscard-trend-change",o(e.changePolarity)]),"data-testid":"metric-trend-parent"},[e.changePolarity!==0?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(e.trendIcon),{key:0,color:i(e.changePolarity),size:n.unref(P)},null,8,["color","size"])):(n.openBlock(),n.createBlock(n.unref(_.EqualIcon),{key:1,color:`var(--kui-color-text-neutral-strong, ${n.unref(De)})`,size:n.unref(P)},null,8,["color","size"])),n.createElementVNode("div",dr,n.toDisplayString(e.metricChange),1)],2),e.trendRange?(n.openBlock(),n.createElementBlock("div",fr,n.toDisplayString(e.trendRange),1)):n.createCommentVNode("",!0)])):n.createCommentVNode("",!0)])],2)}}}),ee=(e,r)=>{const t=e.__vccOpts||e;for(const[i,o]of r)t[i]=o;return t},yr=ee(mr,[["__scopeId","data-v-b1513f6f"]]),gr={},hr={class:"loading-tabs"};function pr(e,r){const t=n.resolveComponent("KSkeletonBox");return n.openBlock(),n.createElementBlock("div",hr,[n.createVNode(t,{width:"100"}),n.createVNode(t,{width:"75"})])}const vr=ee(gr,[["render",pr],["__scopeId","data-v-9c7113d7"]]),Er={key:0,class:"container-title"},Rr={key:0,class:"container-description"},Tr={key:1,class:"error-display"},Sr={key:0,class:"error-display-message"},Cr={key:2,class:"cards-wrapper"},_r=ee(n.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:()=>D.Large},containerTitle:{type:String,required:!1,default:""},containerDescription:{type:String,required:!1,default:""}},setup(e){const r=e,t=n.computed(()=>r.cards.every(o=>(o==null?void 0:o.hasError)===!0)),i=o=>{const a=_e(o.currentValue,o.previousValue)||0,l=Se(a,r.hasTrendAccess,o.increaseIsBad);return{metricValue:o.formatValueFn?o.formatValueFn(o.currentValue):Te(o.currentValue,{capital:!0,round:!0})||"0",metricChange:o.formatChangeFn?o.formatChangeFn(a):Ce(a,r.hasTrendAccess,r.fallbackDisplayText),changePolarity:l,trendIcon:Ie(l,o.increaseIsBad),cardSize:r.cardSize,hasContainerTitle:!!r.containerTitle}};return(o,a)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["kong-ui-public-metric-card-container",e.cardSize])},[r.containerTitle||r.containerDescription?(n.openBlock(),n.createElementBlock("div",Er,[n.createTextVNode(n.toDisplayString(r.containerTitle)+" ",1),r.containerDescription?(n.openBlock(),n.createElementBlock("div",Rr,n.toDisplayString(r.containerDescription),1)):n.createCommentVNode("",!0)])):n.createCommentVNode("",!0),t.value?(n.openBlock(),n.createElementBlock("div",Tr,[n.createVNode(n.unref(_.WarningIcon),{class:"error-display-icon"}),e.errorMessage?(n.openBlock(),n.createElementBlock("div",Sr,n.toDisplayString(e.errorMessage),1)):n.createCommentVNode("",!0)])):(n.openBlock(),n.createElementBlock("div",Cr,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(e.cards,(l,d)=>(n.openBlock(),n.createElementBlock(n.Fragment,null,[e.loading?(n.openBlock(),n.createElementBlock("div",{key:`skeleton-${d}`,class:"loading-tab"},[n.createVNode(vr,{class:n.normalizeClass(e.cardSize===n.unref(D).Small?"loading-tabs-small":"loading-tabs-large")},null,8,["class"])])):(n.openBlock(),n.createBlock(yr,n.mergeProps({key:d},{ref_for:!0},i(l),{"card-size":e.cardSize,"card-type":l.cardType,description:l.description,"error-message":e.errorMessage,"has-error":l.hasError,title:l.title,"title-tag":l.titleTag,tooltip:l.tooltip,"trend-range":l.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"]]),Ir=n.defineComponent({__name:"MetricsConsumer",props:{lookupKey:{default:void 0},cardSize:{default:D.Large},cardToDisplay:{default:void 0}},setup(e){const r=e,t=n.inject(he);if(!t)throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");const{traffic:i,latency:o}=t.data,{i18n:a}=w.useI18n(),l=n.computed(()=>t.containerTitle.value?D.Medium:r.cardSize),d=w.useMetricCardBuilder({cardType:A.TRAFFIC,title:n.computed(()=>t.longCardTitles?a.t("metricCard.long.traffic"):a.t("metricCard.short.traffic")),record:i.mapped,hasError:i.hasError,lookupKey:r.lookupKey,sumGroupedValues:N,trendRange:i.trendRange}),f=E=>`${E.toFixed(x)}%`,s=n.computed(()=>{const E=i.mapped.value,p=L(E,"current",r.lookupKey,G),y=L(E,"current",r.lookupKey,N),T=p/y*100||0,R=L(E,"previous",r.lookupKey,G),S=L(E,"previous",r.lookupKey,N),C=R/S*100||0;return{cardType:A.ERROR_RATE,hasError:i.hasError.value,currentValue:T,previousValue:C,formatValueFn:f,title:t.longCardTitles?a.t("metricCard.long.errorRate"):a.t("metricCard.short.errorRate"),increaseIsBad:!0,trendRange:i.trendRange.value}}),u=E=>`${E}ms`,c=w.useMetricCardBuilder({cardType:A.LATENCY,title:n.computed(()=>{const{longCardTitles:E,averageLatencies:p}=t,y=p.value?"averageLatency":"p99Latency";return E?a.t(`metricCard.long.${y}`):l.value===D.Small?a.t(`metricCard.small.${y}`):a.t(`metricCard.short.${y}`)}),hasError:o.hasError,record:o.mapped,lookupKey:r.lookupKey,increaseIsBad:!0,formatValueFn:u,trendRange:o.trendRange}),m=n.computed(()=>r.cardToDisplay==="TRAFFIC"?[d.value]:r.cardToDisplay==="ERROR_RATE"?[s.value]:r.cardToDisplay==="LATENCY"?[c.value]:[d.value,s.value,c.value]),v=n.computed(()=>r.cardToDisplay==="TRAFFIC"||r.cardToDisplay==="ERROR_RATE"?i.isLoading.value:r.cardToDisplay==="LATENCY"?o.isLoading.value:i.isLoading.value||o.isLoading.value),h=n.computed(()=>({cards:m.value,containerTitle:t.containerTitle.value,containerDescription:t.description.value,loading:v.value,hasTrendAccess:t.hasTrendAccess.value,fallbackDisplayText:a.t("general.notAvailable"),cardSize:l.value,hideTitle:!0})),I=n.computed(()=>({loading:h.value.loading,trafficCard:d.value,errorRateCard:s.value,latencyCard:c.value,errorRateFormatted:f(s.value.currentValue),latencyFormatted:u(c.value.currentValue)}));return(E,p)=>n.renderSlot(E.$slots,"default",{cardValues:I.value},()=>[n.createVNode(_r,n.normalizeProps(n.guardReactiveProps(h.value)),null,16)])}}),z=e=>new Date(e),Dr=(e,r)=>{const t=e.body;e.reply({statusCode:200,body:ke(t,r)})},Ae=e=>e.reduce((r,t)=>(r[t]={name:t},r),{}),ke=(e,r)=>{var I,E,p;const t=r!=null&&r.timeRange&&{start:r.timeRange.start,end:r.timeRange.end}||((I=e.time_range)==null?void 0:I.type)==="absolute"?{start:new Date(e.time_range.start),end:new Date(e.time_range.end)}:{start:new Date(Date.now()-864e5),end:new Date},i=t.end.getTime()-t.start.getTime(),o=e.granularity==="trend"?{start:new Date(t.start.getTime()-i),end:t.end,granularity:t.end.getTime()-t.start.getTime()}:{start:t.start,end:t.end,granularity:t.end.getTime()-t.start.getTime()},a=o.end.getTime(),l=o.start.getTime(),d=o.granularity,f=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 s=(e.dimensions??[]).find(y=>y!=="time"),u=(r==null?void 0:r.dimensionNames)??[],c=Math.max(u.length,1),m=e.metrics||[],v=[];for(let y=0;y<f;y++)for(let T=0;T<c;T++){const R=s?{[s]:u[T]}:{};(E=e.dimensions)!=null&&E.includes("status_code_grouped")?N.forEach(S=>{const C=m.reduce((V,U)=>((r==null?void 0:r.deterministic)??!0?V[U]=(f-y)*1e3+100*T+1:V[U]=Math.round(Math.random()*1e3),V),{...R,status_code_grouped:S});v.push({version:"v1",timestamp:y===0?z(l).toISOString():z(l+d).toISOString(),event:C})}):v.push({version:"v1",timestamp:y===0?z(l).toISOString():z(l+d).toISOString(),event:m.reduce((S,C)=>((r==null?void 0:r.deterministic)??!0?S[C]=(f-y)*1e3+100*T+1:S[C]=Math.round(Math.random()*1e3),S),{...R})})}const h={start:new Date(l).toISOString(),end:new Date(a).toISOString(),granularity_ms:d,display:s?{[s]:Ae(u),...(p=e.dimensions)!=null&&p.includes("status_code_grouped")?{status_code_grouped:Ae(N)}:{}}:{},metric_names:e.metrics,query_id:"test"};return{data:v,meta:h}};g.ALL_STATUS_CODE_GROUPS=N,g.DECIMAL_DISPLAY=x,g.DECIMAL_ROUNDING_PRECISION=J,g.DEFAULT_REFRESH_INTERVAL=se,g.INJECT_QUERY_PROVIDER=le,g.MAX_ANALYTICS_REQUEST_RETRIES=oe,g.MetricCardSize=D,g.MetricCardType=A,g.MetricsConsumer=Ir,g.MetricsProvider=tr,g.STATUS_CODES_FAILED=G,g.STATUS_CODES_SUCCESS=Be,g.calculateChange=_e,g.changePolarity=Se,g.defineIcon=Ie,g.metricChange=Ce,g.mockExploreResponse=ke,g.mockExploreResponseFromCypress=Dr,g.useTrendRange=de,Object.defineProperty(g,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kong-ui-public/analytics-metric-provider",
|
|
3
|
-
"version": "11.3.
|
|
3
|
+
"version": "11.3.21",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/vitals-metric-provider.umd.js",
|
|
6
6
|
"module": "./dist/vitals-metric-provider.es.js",
|
|
@@ -33,24 +33,24 @@
|
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@kong/icons": "^1.52.0",
|
|
36
|
-
"approximate-number": "^
|
|
36
|
+
"approximate-number": "^3.0.1",
|
|
37
37
|
"axios": "^1.15.2",
|
|
38
38
|
"swrv": "^1.2.0",
|
|
39
|
-
"@kong-ui-public/core": "^1.11.
|
|
39
|
+
"@kong-ui-public/core": "^1.11.21"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
42
|
"@kong/kongponents": "^9.52.11",
|
|
43
|
-
"@kong-ui-public/
|
|
44
|
-
"@kong-ui-public/analytics-utilities": "^12.13.
|
|
45
|
-
"@kong-ui-public/
|
|
43
|
+
"@kong-ui-public/analytics-config-store": "^1.3.12",
|
|
44
|
+
"@kong-ui-public/analytics-utilities": "^12.13.6",
|
|
45
|
+
"@kong-ui-public/i18n": "^2.4.6"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
|
48
48
|
"@kong/design-tokens": "1.20.1",
|
|
49
49
|
"@kong/kongponents": "9.52.11",
|
|
50
50
|
"pinia": ">= 3.0.4 < 4",
|
|
51
|
-
"@kong-ui-public/analytics-
|
|
52
|
-
"@kong-ui-public/
|
|
53
|
-
"@kong-ui-public/
|
|
51
|
+
"@kong-ui-public/analytics-config-store": "^1.3.12",
|
|
52
|
+
"@kong-ui-public/analytics-utilities": "^12.13.6",
|
|
53
|
+
"@kong-ui-public/i18n": "^2.4.6"
|
|
54
54
|
},
|
|
55
55
|
"scripts": {
|
|
56
56
|
"dev": "cross-env USE_SANDBOX=true vite",
|