UNPKG

unleash-server

Version:

Unleash is an enterprise ready feature flag service. It provides different strategies for handling feature flags.

2 lines (1 loc) • 10.5 kB
import{E as _,j as i,F as z,e9 as j,hE as k,e8 as N,r as d,e6 as P,B as W,j8 as J,s as u,i as H,J as G,gr as O,gQ as D,fO as Q,fU as V,ea as R,cp as B,b6 as L,b8 as T,e4 as Y,eb as K,cQ as X,b as Z,bp as tt,ln as et}from"./index-Cikp5fMR.js";import{f as b,T as ot,a as p,p as f,b as g,d as at,c as rt,u as nt,e as st,g as lt,h as ct}from"./LazyAdminExport-CE3juyvl.js";import{f as it}from"./formatTickValue-BxmGFWwJ.js";var y={},ut=z;Object.defineProperty(y,"__esModule",{value:!0});var I=y.default=void 0,dt=ut(_()),pt=i,gt=(0,dt.default)((0,pt.jsx)("path",{d:"m7 14 5-5 5 5z"}),"ArrowDropUp");I=y.default=gt;const M=(t,e,r=!0)=>{const o=t.getFullYear(),a=t.getMonth(),s=b(t),n=N(t);return{key:s,year:o,month:a,dayCount:n,shortLabel:t.toLocaleString("en-US",{month:"short"}),label:e||t.toLocaleString("en-US",{month:"long",year:"numeric"}),selectable:r}},ht=t=>{const e=[M(t,"Current month")],r=j(t);for(let o=1;o<12;o++){const a=k(r,o);e.push(M(a,void 0,a>=ot))}return e},C=ht(p),mt=Object.fromEntries(C.map(t=>[t.key,t])),$="15rem",x=t=>t.spacing(3),q=u("button",{shouldForwardProp:t=>t!=="selected"})(({theme:t,selected:e})=>({cursor:"pointer",border:"none",backgroundColor:e?t.palette.secondary.light:"inherit",fontSize:t.typography.body1.fontSize,padding:t.spacing(.5),borderRadius:t.shape.borderRadius,color:t.palette.text.primary,transition:"background-color 0.2s ease",":focus-visible":{outline:`2px solid ${t.palette.primary.main}`},":hover:not(:disabled)":{backgroundColor:t.palette.action.hover}})),bt=u(q)(({theme:t})=>({":disabled":{cursor:"default",color:t.palette.text.disabled}})),ft=u(q)(({theme:t})=>({width:"100%",paddingBlock:t.spacing(1),textAlign:"left",borderRadius:0,paddingInline:x(t)})),yt=u(H)(({theme:t})=>({whiteSpace:"nowrap",width:$,justifyContent:"space-between",fontWeight:"normal",color:t.palette.text.primary,borderColor:t.palette.divider,":focus-within":{borderColor:t.palette.primary.main},":hover":{borderColor:t.palette.text.disabled,backgroundColor:"inherit"},transition:"border-color 0.1s ease"})),Ct=u("article")(({theme:t})=>({width:$,paddingBlock:t.spacing(2),display:"flex",flexFlow:"column",gap:t.spacing(2)})),xt=u("article")(({theme:t})=>({paddingInline:x(t)})),St=u("hgroup")(({theme:t})=>({h3:{margin:0,fontSize:t.typography.h3.fontSize},p:{color:t.palette.text.secondary,fontSize:t.typography.body2.fontSize}})),vt=u("ul")(({theme:t})=>({listStyle:"none",padding:0,display:"grid",gridTemplateColumns:"repeat(4, 1fr)",rowGap:t.spacing(1)})),Dt=u("article")(({theme:t})=>({display:"flex",width:"100%",flexFlow:"column",gap:t.spacing(.5)})),Rt=u("p")(({theme:t})=>({paddingInline:x(t),fontSize:t.typography.body2.fontSize,margin:0,color:t.palette.text.secondary,fontWeight:"bold"})),Mt=u("ul")(({theme:t})=>({listStyle:"none",margin:0,padding:0,width:"100%",li:{width:"100%"}})),wt=u(G)(({theme:t})=>({"& .MuiPaper-root":{borderRadius:t.shape.borderRadiusLarge,border:`1px solid ${t.palette.divider}`}})),_t=({selectedPeriod:t,setPeriod:e})=>{const r=[3,6,12].map(l=>({value:l,label:`Last ${l} months`})),[o,a]=d.useState(!1),s=d.useRef(null),n=l=>{e(l),a(!1)},c=t.grouping==="daily"?t.month===P(new Date,"yyyy-MM")?"Current month":f(t.month).toLocaleDateString("en-US",{month:"long",year:"numeric"}):`Last ${t.monthsBack} months`;return i.jsxs(W,{ref:s,children:[i.jsx(yt,{endIcon:o?i.jsx(I,{}):i.jsx(J,{}),variant:"outlined",disableRipple:!0,onClick:()=>a(!0),children:c}),i.jsxs(wt,{open:o,anchorEl:s.current,onClose:()=>a(!1),anchorOrigin:{vertical:"bottom",horizontal:"center"},transformOrigin:{vertical:"top",horizontal:"center"},children:[i.jsxs(Ct,{children:[i.jsxs(xt,{children:[i.jsxs(St,{children:[i.jsx("h3",{children:"Select month"}),i.jsx("p",{children:"Last 12 months"})]}),i.jsx(vt,{children:C.map(l=>i.jsx("li",{children:i.jsx(bt,{selected:t.grouping==="daily"&&l.key===t.month,disabled:!l.selectable,onClick:()=>{n({grouping:"daily",month:l.key})},children:l.shortLabel})},l.label))})]}),i.jsxs(Dt,{children:[i.jsx(Rt,{children:"Range"}),i.jsx(Mt,{children:r.map(l=>i.jsx("li",{children:i.jsxs(ft,{selected:t.grouping==="monthly"&&l.value===t.monthsBack,type:"button",onClick:()=>{n({grouping:"monthly",monthsBack:l.value})},children:["Last ",l.value," months"]})},l.label))})]})]})," "]})]})},h={"/api/admin":{label:"Admin",color:"#6D66D9",order:1},"/api/frontend":{label:"Frontend",color:"#A39EFF",order:2},"/api/client":{label:"Server",color:"#D8D6FF",order:3}},jt=(t,e)=>{const{newRecord:r,labels:o}=S(t);return{datasets:t.apiData.filter(s=>!0).sort((s,n)=>h[s.apiPath].order-h[n.apiPath].order).map(s=>{const n=r();for(const l of Object.values(s.dataPoints))n[l.period]=l.trafficTypes[0].count;const c=h[s.apiPath];return{label:c.label,data:Object.values(n),backgroundColor:c.color,hoverBackgroundColor:c.color}}),labels:o}},kt=t=>{const{newRecord:e,labels:r}=S(t);return{datasets:t.apiData.map(a=>{const s=e();for(const c of Object.values(a.dataPoints)){const l=c.connections;s[c.period]=l}const n={label:"Connections",color:"#6D66D9"};return{label:n.label,data:Object.values(s),backgroundColor:n.color,hoverBackgroundColor:n.color}}),labels:r}},Pt=t=>{const{newRecord:e,labels:r}=S(t);return{datasets:t.apiData.map(a=>{const s=e();for(const c of Object.values(a.dataPoints)){const l=c.requests;s[c.period]=l}const n={label:"Frontend requests",color:"#A39EFF"};return{label:n.label,data:Object.values(s),backgroundColor:n.color,hoverBackgroundColor:n.color}}),labels:r}},S=t=>{if(t.grouping==="monthly"){const e=g(t.dateRange.from),r=g(t.dateRange.to),o=Math.abs(O(r,e))+1,a={};for(let n=0;n<o;n++)a[b(D(e,n))]=0;const s=Array.from({length:o}).map((n,c)=>c===o-1?"Current month":b(D(e,c)));return{newRecord:()=>({...a}),labels:s}}else{const e=g(t.dateRange.from),r=g(t.dateRange.to),o=Math.abs(Q(r,e))+1,a={};for(let n=0;n<o;n++)a[at(V(e,n))]=0;const s=Array.from({length:o}).map((n,c)=>(c+1).toString());return{newRecord:()=>({...a}),labels:s}}},[Ot,...Bt]=Object.values(h).map(t=>t.label.toLowerCase()).toReversed(),w=`${Bt.toReversed().join(", ")}, and ${Ot}`,zt=t=>t.grouping==="daily"?`A bar chart showing daily traffic usage for ${new Date(t.month).toLocaleDateString("en-US",{month:"long",year:"numeric"})}. Each date shows ${w} requests.`:`A bar chart showing monthly total traffic usage for the current month and the preceding ${t.monthsBack} months. Each month shows ${w} requests.`,v=(t,e=new Date)=>{const r=o=>P(o,"yyyy-MM-dd");if(t.grouping==="daily"){const o=f(t.month),a=r(o),s=r(R(o));return{from:a,to:s}}else{const o=r(j(k(e,t.monthsBack))),a=r(R(e));return{from:o,to:a}}},Lt=t=>{if(t.grouping==="daily")return 0;const e=Math.abs(O(new Date(t.dateRange.to),new Date(t.dateRange.from))),r=t.apiData.map(o=>o.dataPoints.filter(({period:a})=>a!==rt).reduce((a,s)=>a+s.trafficTypes[0].count,0)).reduce((o,a)=>o+a,0);return Math.round(r/e)},Tt=(t,{from:e,to:r})=>{const o=`api/admin/metrics/connection?grouping=${t}&from=${e}&to=${r}`,{data:a,error:s,mutate:n}=B(L(o),It);return d.useMemo(()=>({refetch:()=>n(),result:a?{state:"success",data:a}:s?{state:"error",error:s}:{state:"loading"}}),[a,s,n])},It=t=>fetch(t).then(T("Metered Connections Metrics")).then(e=>e.json()),$t=(t,{from:e,to:r})=>{const o=`api/admin/metrics/request?grouping=${t}&from=${e}&to=${r}`,{data:a,error:s,mutate:n}=B(L(o),qt);return d.useMemo(()=>({refetch:()=>n(),result:a?{state:"success",data:a}:s?{state:"error",error:s}:{state:"loading"}}),[a,s,n])},qt=t=>fetch(t).then(T("Consumption Requests Metrics")).then(e=>e.json()),Nt=(t,e,r)=>{const{result:o}=nt(e.grouping,v(e,p)),{instanceStatus:a}=Y(),{instancePrices:s}=K(),n=(a==null?void 0:a.billing)==="pay-as-you-go"?s.payg.traffic:s.pro.traffic;return d.useMemo(()=>{if(o.state!=="success")return{chartData:{datasets:[],labels:[]},usageTotal:0,overageCost:0,estimatedMonthlyCost:0,requestSummaryUsage:0};const l=o.data,A=jt(l),m=st(l),E=ct(m,t,n),F=lt(l.apiData,t,p,n),U=e.grouping==="daily"?m:Lt(l);return{chartData:A,usageTotal:m,overageCost:E,estimatedMonthlyCost:F,requestSummaryUsage:U}},[JSON.stringify(o),t,JSON.stringify(e),n])},Wt=t=>{const{result:e}=Tt(t.grouping,v(t,p));return d.useMemo(()=>{if(e.state!=="success")return{chartData:{datasets:[],labels:[]}};const o=e.data;return{chartData:kt(o)}},[JSON.stringify(e),JSON.stringify(t)])},Jt=t=>{const{result:e}=$t(t.grouping,v(t,p));return d.useMemo(()=>{if(e.state!=="success")return{chartData:{datasets:[],labels:[]}};const o=e.data;return{chartData:Pt(o)}},[JSON.stringify(e),JSON.stringify(t)])},Ht=u(X)(({theme:t})=>({display:"grid",gap:t.spacing(5)})),Gt=u("div")(({theme:t})=>({display:"flex",flexFlow:"row wrap",justifyContent:"space-between",gap:t.spacing(2,4),alignItems:"start"})),Qt=u("span")(({theme:t})=>({fontWeight:"bold"})),At=(t,e,r,o)=>({plugins:{annotation:{clip:!1,annotations:{line:{type:"line",borderDash:[5,5],yMin:r?r/30:0,yMax:r?r/30:0,borderColor:"gray",borderWidth:1,display:!!r&&!!o,label:{backgroundColor:"rgba(192, 192, 192, 0.8)",color:"black",padding:{top:10,bottom:10,left:10,right:10},content:"Average daily requests included in your plan",display:!!r}}}},legend:{position:"bottom",labels:{color:t.palette.text.primary,pointStyle:"circle",usePointStyle:!0,boxHeight:6,padding:15,boxPadding:5}},tooltip:{backgroundColor:t.palette.background.paper,titleColor:t.palette.text.primary,bodyColor:t.palette.text.primary,bodySpacing:6,padding:{top:20,bottom:20,left:30,right:30},borderColor:"rgba(0, 0, 0, 0.05)",borderWidth:3,usePointStyle:!0,caretSize:0,boxPadding:10,callbacks:{title:e}}},responsive:!0,scales:{x:{stacked:!0,ticks:{color:t.palette.text.secondary},grid:{display:!1}},y:{stacked:!0,ticks:{color:t.palette.text.secondary,maxTicksLimit:5,callback:it},grid:{drawBorder:!1}}},elements:{bar:{borderRadius:5}},interaction:{mode:"index",intersect:!1}}),Vt=t=>{const e=Z(),{locationSettings:r}=tt(),[o,a]=d.useState({grouping:"daily",month:C[0].key}),s=d.useMemo(()=>At(e,n=>{if(o.grouping==="daily"){const c=mt[o.month];return new Date(c.year,c.month,Number.parseInt(n[0].label,10)).toLocaleDateString((r==null?void 0:r.locale)??"en-US",{month:"long",day:"numeric",year:"numeric"})}else{const c=f(n[0].label);return Number.isNaN(c.getTime())?"Current month to date":c.toLocaleDateString((r==null?void 0:r.locale)??"en-US",{month:"long",year:"numeric"})}},t,o.grouping==="daily"),[e,o,t]);return{chartDataSelection:o,setChartDataSelection:a,options:s}},Yt=et({bottomOverflow:34});export{Qt as B,_t as P,Ht as S,Gt as T,Nt as a,Wt as b,Jt as c,zt as g,Yt as n,Vt as u};