https://studio.d-id.com/v0.1262.0/assets/UsageDashboardPage-f3jD8IzA.js

1import{ao as ie,aq as ce,r as p,aM as N,aN as H,aO as z,aP as O,aQ as m,V as k,aR as P,aS as j,aT as L,bf as E,bI as A,n as W,j as v,e as r,be as de,aE as G,i as g,at as B,T as pe,f8 as ue,bR as ge,F as he,Q as be,x as ye,M as fe,bK as se,dr as me}from"./index-dK-KQR3u.js";import{D as _,g as Y}from"./dateRange-BueZcd3G.js";import{D as xe}from"./DownloadMinimalistic-nb9BzaTU.js";import{A as ve}from"./Alert-DdPxodJE.js";import"./chunk-hHWxwtHM.js";const Ce=async({from_date:e,to_date:t,token:o})=>{const a=new URL(`${ie}/credits/usage`);a.searchParams.set("from_date",e),a.searchParams.set("to_date",t),o&&a.searchParams.set("token",o);const l=await ce.get(a.toString());return l==null?void 0:l.data},le=p.createContext();function Te(e){return N("MuiTable",e)}H("MuiTable",["root","stickyHeader"]);const we=["className","component","padding","size","stickyHeader"],Re=e=>{const{classes:t,stickyHeader:o}=e;return j({root:["root",o&&"stickyHeader"]},Te,t)},Se=L("table",{name:"MuiTable",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:o}=e;return[t.root,o.stickyHeader&&t.stickyHeader]}})(({theme:e,ownerState:t})=>m({display:"table",width:"100%",borderCollapse:"collapse",borderSpacing:0,"& caption":m({},e.typography.body2,{padding:e.spacing(2),color:(e.vars||e).palette.text.secondary,textAlign:"left",captionSide:"bottom"})},t.stickyHeader&&{borderCollapse:"separate"})),q="table",ke=p.forwardRef(function(t,o){const a=z({props:t,name:"MuiTable"}),{className:l,component:s=q,padding:i="normal",size:n="medium",stickyHeader:d=!1}=a,h=O(a,we),u=m({},a,{component:s,padding:i,size:n,stickyHeader:d}),y=Re(u),x=p.useMemo(()=>({padding:i,size:n,stickyHeader:d}),[i,n,d]);return k.jsx(le.Provider,{value:x,children:k.jsx(Se,m({as:s,role:s===q?null:"table",ref:o,className:P(y.root,l),ownerState:u},h))})}),I=p.createContext();function De(e){return N("MuiTableBody",e)}H("MuiTableBody",["root"]);const Me=["className","component"],_e=e=>{const{classes:t}=e;return j({root:["root"]},De,t)},Ue=L("tbody",{name:"MuiTableBody",slot:"Root",overridesResolver:(e,t)=>t.root})({display:"table-row-group"}),$e={variant:"body"},K="tbody",Ae=p.forwardRef(function(t,o){const a=z({props:t,name:"MuiTableBody"}),{className:l,component:s=K}=a,i=O(a,Me),n=m({},a,{component:s}),d=_e(n);return k.jsx(I.Provider,{value:$e,children:k.jsx(Ue,m({className:P(d.root,l),as:s,ref:o,role:s===K?null:"rowgroup",ownerState:n},i))})});function Ee(e){return N("MuiTableCell",e)}const Ne=H("MuiTableCell",["root","head","body","footer","sizeSmall","sizeMedium","paddingCheckbox","paddingNone","alignLeft","alignCenter","alignRight","alignJustify","stickyHeader"]),He=["align","className","component","padding","scope","size","sortDirection","variant"],ze=e=>{const{classes:t,variant:o,align:a,padding:l,size:s,stickyHeader:i}=e,n={root:["root",o,i&&"stickyHeader",a!=="inherit"&&`align${E(a)}`,l!=="normal"&&`padding${E(l)}`,`size${E(s)}`]};return j(n,Ee,t)},Oe=L("td",{name:"MuiTableCell",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:o}=e;return[t.root,t[o.variant],t[`size${E(o.size)}`],o.padding!=="normal"&&t[`padding${E(o.padding)}`],o.align!=="inherit"&&t[`align${E(o.align)}`],o.stickyHeader&&t.stickyHeader]}})(({theme:e,ownerState:t})=>m({},e.typography.body2,{display:"table-cell",verticalAlign:"inherit",borderBottom:e.vars?`1px solid ${e.vars.palette.TableCell.border}`:`1px solid
2    ${e.palette.mode==="light"?A.lighten(A.alpha(e.palette.divider,1),.88):A.darken(A.alpha(e.palette.divider,1),.68)}`,textAlign:"left",padding:16},t.variant==="head"&&{color:(e.vars||e).palette.text.primary,lineHeight:e.typography.pxToRem(24),fontWeight:e.typography.fontWeightMedium},t.variant==="body"&&{color:(e.vars||e).palette.text.primary},t.variant==="footer"&&{color:(e.vars||e).palette.text.secondary,lineHeight:e.typography.pxToRem(21),fontSize:e.typography.pxToRem(12)},t.size==="small"&&{padding:"6px 16px",[`&.${Ne.paddingCheckbox}`]:{width:24,padding:"0 12px 0 16px","& > *":{padding:0}}},t.padding==="checkbox"&&{width:48,padding:"0 0 0 4px"},t.padding==="none"&&{padding:0},t.align==="left"&&{textAlign:"left"},t.align==="center"&&{textAlign:"center"},t.align==="right"&&{textAlign:"right",flexDirection:"row-reverse"},t.align==="justify"&&{textAlign:"justify"},t.stickyHeader&&{position:"sticky",top:0,zIndex:2,backgroundColor:(e.vars||e).palette.background.default})),Pe=p.forwardRef(function(t,o){const a=z({props:t,name:"MuiTableCell"}),{align:l="inherit",className:s,component:i,padding:n,scope:d,size:h,sortDirection:u,variant:y}=a,x=O(a,He),f=p.useContext(le),S=p.useContext(I),U=S&&S.variant==="head";let D;i?D=i:D=U?"th":"td";let T=d;D==="td"?T=void 0:!T&&U&&(T="col");const M=y||S&&S.variant,c=m({},a,{align:l,component:D,padding:n||(f&&f.padding?f.padding:"normal"),size:h||(f&&f.size?f.size:"medium"),sortDirection:u,stickyHeader:M==="head"&&f&&f.stickyHeader,variant:M}),b=ze(c);let $=null;return u&&($=u==="asc"?"ascending":"descending"),k.jsx(Oe,m({as:D,ref:o,className:P(b.root,s),"aria-sort":$,scope:T,ownerState:c},x))});function je(e){return N("MuiTableContainer",e)}H("MuiTableContainer",["root"]);const Le=["className","component"],Be=e=>{const{classes:t}=e;return j({root:["root"]},je,t)},Ie=L("div",{name:"MuiTableContainer",slot:"Root",overridesResolver:(e,t)=>t.root})({width:"100%",overflowX:"auto"}),Fe=p.forwardRef(function(t,o){const a=z({props:t,name:"MuiTableContainer"}),{className:l,component:s="div"}=a,i=O(a,Le),n=m({},a,{component:s}),d=Be(n);return k.jsx(Ie,m({ref:o,as:s,className:P(d.root,l),ownerState:n},i))});function Ge(e){return N("MuiTableHead",e)}H("MuiTableHead",["root"]);const We=["className","component"],Ye=e=>{const{classes:t}=e;return j({root:["root"]},Ge,t)},qe=L("thead",{name:"MuiTableHead",slot:"Root",overridesResolver:(e,t)=>t.root})({display:"table-header-group"}),Ke={variant:"head"},Q="thead",Qe=p.forwardRef(function(t,o){const a=z({props:t,name:"MuiTableHead"}),{className:l,component:s=Q}=a,i=O(a,We),n=m({},a,{component:s}),d=Ye(n);return k.jsx(I.Provider,{value:Ke,children:k.jsx(qe,m({as:s,className:P(d.root,l),ref:o,role:s===Q?null:"rowgroup",ownerState:n},i))})});function Je(e){return N("MuiTableRow",e)}const J=H("MuiTableRow",["root","selected","hover","head","footer"]),Ve=["className","component","hover","selected"],Xe=e=>{const{classes:t,selected:o,hover:a,head:l,footer:s}=e;return j({root:["root",o&&"selected",a&&"hover",l&&"head",s&&"footer"]},Je,t)},Ze=L("tr",{name:"MuiTableRow",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:o}=e;return[t.root,o.head&&t.head,o.footer&&t.footer]}})(({theme:e})=>({color:"inherit",display:"table-row",verticalAlign:"middle",outline:0,[`&.${J.hover}:hover`]:{backgroundColor:(e.vars||e).palette.action.hover},[`&.${J.selected}`]:{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})`:A.alpha(e.palette.primary.main,e.palette.action.selectedOpacity),"&:hover":{backgroundColor:e.vars?`rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))`:A.alpha(e.palette.primary.main,e.palette.action.selectedOpacity+e.palette.action.hoverOpacity)}}})),V="tr",F=p.forwardRef(function(t,o){const a=z({props:t,name:"MuiTableRow"}),{className:l,component:s=V,hover:i=!1,selected:n=!1}=a,d=O(a,Ve),h=p.useContext(I),u=m({},a,{component:s,hover:i,selected:n,head:h&&h.variant==="head",footer

2:h&&h.variant==="footer"}),y=Xe(u);return k.jsx(Ze,m({as:s,ref:o,className:P(y.root,l),role:s===V?null:"row",ownerState:u},d))}),et=g(Fe,{target:"e1r1ifwk7"})("border:1px solid ",({theme:e})=>e.colors.black[200],";border-radius:8px;background-color:",({theme:e})=>e.colors.chill.panelBg,";"),C=g(Pe,{target:"e1r1ifwk6"})("font-size:13px;padding:10px 16px;color:",({theme:e})=>e.colors.secondary.main,";border-bottom:1px solid ",({theme:e})=>e.colors.black[100],";white-space:nowrap;max-width:160px;overflow:hidden;text-overflow:ellipsis;cursor:default;"),tt=g(C,{target:"e1r1ifwk5"})({name:"p4355k",styles:"min-width:180px"}),ot=g(C,{target:"e1r1ifwk4"})({name:"16ceglb",styles:"font-weight:600"}),w=g(C,{target:"e1r1ifwk3"})("font-weight:600;font-size:12px;color:",({theme:e})=>e.colors.black[600],";background-color:",({theme:e})=>e.colors.black[50],";text-transform:none;letter-spacing:0;"),at=g("div",{target:"e1r1ifwk2"})({name:"85ktet",styles:"display:flex;flex-direction:column;align-items:center;justify-content:center;padding:64px 24px;gap:8px"}),nt=g("div",{target:"e1r1ifwk1"})("display:flex;justify-content:center;padding:16px;border-top:1px solid ",({theme:e})=>e.colors.black[100],";"),rt=g(B,{target:"e1r1ifwk0"})({name:"10bfmxy",styles:"padding:8px 24px;border-radius:8px;height:36px"}),st=8,lt=11,X=e=>{const t=new Date(e),o=t.getFullYear(),a=String(t.getMonth()+1).padStart(2,"0"),l=String(t.getDate()).padStart(2,"0"),s=String(t.getHours()).padStart(2,"0"),i=String(t.getMinutes()).padStart(2,"0");return`${o}-${a}-${l} ${s}:${i}`},Z=e=>e!=null?`${(+e).toFixed(1)}s`:"—",R=e=>String(e??"—"),it=({items:e,isLoading:t,isFetchingNextPage:o,hasNextPage:a,onLoadMore:l})=>{const s=W(),i=t&&e.length===0;return v(et,{children:[v(ke,{size:"small",children:[r(Qe,{children:v(F,{children:[r(w,{children:"Time"}),r(w,{children:"Product"}),r(w,{children:"Type"}),r(w,{children:"Entity ID"}),r(w,{children:"Chat ID"}),r(w,{children:"Agent"}),r(w,{children:"Source"}),r(w,{children:"Duration"}),r(w,{children:"Credits Used"}),r(w,{children:"User"}),r(w,{children:"Email"})]})}),r(Ae,{children:i?Array.from({length:st}).map((n,d)=>r(F,{children:Array.from({length:lt}).map((h,u)=>r(C,{children:r(de,{variant:"text",width:"80%"})},u))},d)):e.map(n=>v(F,{hover:!0,children:[r(tt,{title:X(n.created_at),children:X(n.created_at)}),r(C,{title:n.product,children:R(n.product)}),r(C,{title:n.entity_type,children:R(n.entity_type)}),r(C,{title:n.id,children:R(n.id)}),r(C,{title:n.chat_id,children:R(n.chat_id)}),r(C,{title:n.agent_id,children:R(n.agent_id)}),r(C,{title:n.source,children:R(n.source)}),r(C,{title:Z(n.duration),children:Z(n.duration)}),r(ot,{title:R(n.credits),children:R(n.credits)}),r(C,{title:n.created_by,children:R(n.created_by)}),r(C,{title:n.email,children:R(n.email)})]},n.id))})]}),!t&&e.length===0&&r(at,{children:r(G,{variant:"subtitle",style:{color:s.colors.black[500]},children:"No usage data found for the selected date range."})}),(a||o)&&r(nt,{children:r(rt,{variant:"outlined",color:"secondary",onClick:l,disabled:o,children:o?"Loading...":"Load more"})})]})},ct=g("div",{target:"e1tp8bd96"})("display:flex;justify-content:flex-end;margin-left:auto;gap:4px;padding:4px;border-radius:8px;border:1px solid ",({theme:e})=>e.colors.black[300],";background-color:",({theme:e})=>e.colors.chill.panelBg,";"),dt=g(B,{target:"e1tp8bd95"})("padding:0 12px;border-radius:8px;&.MuiButtonBase-root{background-color:",({active:e,theme:t})=>e?t.colors.black[100]:t.colors.chill.panelBg,";&:hover{background-color:",({active:e,theme:t})=>e?t.colors.black[100]:t.colors.black[50],"!important;}}.dark &{color:",({theme:e})=>e.colors.secondary.main,";}"),pt=g("div",{target:"e1tp8bd94"})({name:"112xic",styles:"padding:20px;display:flex;flex-direction:column;gap:16px;min-width:280px"}),ee=g("div",{target:"e1tp8bd93"})({name:"3w0yoi",styles:"display:flex;flex-direction:column;gap:8px"}),te=g(be,{target:"e1tp8bd92"})("& .MuiInputBase-root{background:",({theme:e})=>e.colors.chill.panelBg,";height:40px;cursor:pointer;}& input{padding:8px 12px;font-size:14px;cursor:pointer;}& .MuiOutlinedInput-notchedOutline{border-radius:8px;border-color:",({theme:e})=>e.colors.black[300],";}&:hover .MuiOutlinedInput-notchedOutline{border-color:",({theme:e})=>e.colors.primary[500],";}"),ut=g("div",{target:"e1tp8bd91"})({name:"v691a2",styles:"display:flex;gap:8px;justify-content:flex-end;margin-top:8px"}),oe=g(B,{target:"e1tp8bd90"})({name:"uwq5jb",styles:"padding:8px 16px;border-radius:8px;font-size:14px;height:36px;min-width:80px"}),ae=e=>{const t=e.getFullYear(),o=String(e.getMonth()+1).padStart(2,"0"),a=String(e.getDate()).padStart(2,"0");return`${t}-${o}-${a}`},ne=(e,t=!1)=>{const[o,a,l]=e.split("-").map(Number);return t?new Date(o,a-1,l,23,59,59,999):new Date(o,a-1,l,0,0,0,0)},gt=({options:e,customValue:t,value:o,from:a,to:l,onChange:s})=>{const[i,n]=p.useState(null),[d,h]=p.useState(""),[u,y]=p.useState(""),x=p.useRef(null),f=p.useRef(null),S=W(),U=(c,b)=>{c===t&&b?(n(b.currentTarget),h(ae(a)),y(ae(l))):(n(null),s(c))},D=()=>{const c=d?ne(d):new Date(1970,0,1,0,0,0,0),b=u?ne(u,!0):new Date;s(t,c,b),n(null)},T=()=>{n(null)},M=c=>{if(c.value!==t||o!==t)return c.label;const b=a.toLocaleDateString("en-US",{month:"short",day:"numeric",year:"numeric"}),$=l.toLocaleDateString("en-US",{month:"short",day:"numeric",year:"numeric"});return`${b} - ${$}`};return v(he,{children:[r(ct,{children:e.map((c,b)=>v(pe.Fragment,{children:[b>0&&r(ue,{orientation:"vertical",flexItem:!0}),r(dt,{active:o===c.value,onClick:$=>U(c.value,$),children:M(c)})]},c.value))}),r(ge,{open:!!i,anchorEl:i,onClose:T,anchorOrigin:{vertical:"bottom",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},slotProps:{paper:{sx:{marginTop:1,borderRadius:"8px",boxShadow:"0px 4px 20px rgba(0, 0, 0, 0.1)"}}},children:v(pt,{children:[v(ee,{children:[r(G,{variant:"title-sm",weight:500,style:{color:S.colors.secondary.main},children:"Start Date"}),r(te,{type:"date",value:d,onChange:c=>h(c.target.value),onClick:()=>{var c,b;return(b=(c=x.current)==null?void 0:c.showPicker)==null?void 0:b.call(c)},inputRef:x,size:"small",fullWidth:!0})]}),v(ee,{children:[r(G,{variant:"title-sm",weight:500,style:{color:S.colors.secondary.main},children:"End Date"}),r(te,{type:"date",value:u,onChange:c=>y(c.target.value),onClick:()=>{var c,b;return(b=(c=f.current)==null?void 0:c.showPicker)==null?void 0:b.call(c)},inputRef:f,size:"small",fullWidth:!0})]}),v(ut,{children:[r(oe,{variant:"outlined",color:"secondary",onClick:T,children:"Cancel"}),r(oe,{variant:"contained",color:"primary",onClick:D,children:"Apply"})]})]})})]})},ht=[{value:_.LAST_30_DAYS,label:"30D"},{value:_.LAST_7_DAYS,label:"7D"},{value:_.CUSTOM,label:"Custom"}],bt=g("div",{target:"e10dnmfi5"})({name:"g6c5vq",styles:"display:flex;flex-direction:column;gap:16px;margin-bottom:32px"}),yt=g("div",{target:"e10dnmfi4"})({name:"uh5xjc",styles:"display:flex;align-items:center;gap:12px"}),ft=g(se,{target:"e10dnmfi3"})("color:",({theme:e})=>e.colors.secondary.main,";font-weight:600;font-size:18px;margin-right:20px;"),mt=g(B,{target:"e10dnmfi2"})({name:"37lm7v",styles:"display:flex;align-items:center;gap:6px;padding:0 16px;height:40px;min-height:40px;border-radius:8px;white-space:nowrap"}),xt=g("div",{target:"e10dnmfi1"})({name:"1d3w5wq",styles:"width:100%"}),vt=g(se,{target:"e10dnmfi0"})("font-size:13px;color:",({theme:e})=>e.colors.black[500],";"),Ct=({dateRange:e,from:t,to:o,onDateRangeChange:a,onDownload:l,isDownloading:s,downloadError:i,clearDownloadError:n})=>{const d=W(),h=(u,y,x)=>{n(),a(u,y,x)};return v(bt,{children:[v(yt,{children:[r(ft,{children:"Usage Activity"}),r(gt,{options:ht,customValue:_.CUSTOM,value:e,from:t,to:o,onChange:h}),v(mt,{variant:"outlined",color:"secondary",onClick:l,disabled:s,children:[s?r(ye,{size:16}):r(fe,{src:xe,size:"16px",color:d.colors.secondary[900]}),s?"Exporting...":"Export CSV"]})]}),r(vt,{children:"Usage data available starting March 12, 2026"}),i&&r(xt,{children:r(ve,{severity:"error",onClose:n,children:i})})]})},re=["created_at","product","entity_type","id","chat_id","agent_id","source","duration","credits","created_by","email","owner_id"],Tt=e=>{if(e==null)return"";const t=String(e);return t.includes(",")||t.includes('"')||t.includes(`
3`)?`"${t.replace(/"/g,'""')}"`:t},wt=e=>{const t=re.join(",");if(e.length===0)return t;const o=e.map(a=>re.map(l=>Tt(a[l])).join(","));return[t,...o].join(`
4`)},Rt=e=>{const t=new Blob([e],{type:"text/csv;charset=utf-8;"});return URL.createObjectURL(t)},St="credits-usage.csv",kt=(e,t)=>

4{const o=document.createElement("a");o.href=e,o.download=t,document.body.appendChild(o),o.click(),document.body.removeChild(o),setTimeout(()=>URL.revokeObjectURL(e),0)};function Dt(){const[e,t]=p.useState(!1),[o,a]=p.useState(null);return{downloadCsv:async(s,i,n)=>{var d;t(!0),a(null);try{let h=s;if(i){let x=await n();for(;x.hasNextPage;)x=await n();h=((d=x.data)==null?void 0:d.pages.flatMap(f=>f.items))??s}const u=wt(h),y=Rt(u);kt(y,St)}catch{a("Failed to download usage data. Please try again.")}finally{t(!1)}},isDownloading:e,error:o,clearError:()=>a(null)}}const Mt="GET_CREDITS_USAGE_KEY";function _t(e,t){var l;const o=me([Mt,{from_date:e,to_date:t}],({pageParam:s})=>Ce({from_date:e,to_date:t,token:s}),{refetchOnWindowFocus:!1,staleTime:6e4,getNextPageParam:s=>s.next_token??void 0}),a=p.useMemo(()=>{var s;return((s=o.data)==null?void 0:s.pages.flatMap(i=>i.items))??[]},[(l=o.data)==null?void 0:l.pages]);return{...o,allItems:a}}const Ut=g("div",{target:"ey2v6nr0"})({name:"b6wrti",styles:"display:flex;flex-direction:column;width:100%"}),zt=()=>{const[e,t]=p.useState(_.LAST_30_DAYS),[o,a]=p.useState(()=>Y(new Date,_.LAST_30_DAYS)),[l,s]=p.useState(()=>new Date),i=(T,M,c)=>{if(t(T),T===_.CUSTOM&&M&&c)a(M),s(c);else{const b=new Date;a(Y(b,T)),s(b)}},{allItems:n,isLoading:d,isFetchingNextPage:h,hasNextPage:u,fetchNextPage:y}=_t(o.toISOString(),l.toISOString()),{downloadCsv:x,isDownloading:f,error:S,clearError:U}=Dt();return v(Ut,{children:[r(Ct,{dateRange:e,from:o,to:l,onDateRangeChange:i,onDownload:()=>x(n,u,y),isDownloading:f,downloadError:S,clearDownloadError:U}),r(it,{items:n,isLoading:d,isFetchingNextPage:h,hasNextPage:u,onLoadMore:y})]})};export{zt as UsageDashboardPage};