@jheavenknows/bluerouter 5.0.51 → 5.0.52

package/app/.next-cli-build/static/chunks/app/(dashboard)/dashboard/token-saver/{page-b319a99804dd1d97.js → page-bc238ec79f5a6553.js}

@@ -1 +1 @@
-(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[9839],{93413:(e,t,s)=>{Promise.resolve().then(s.bind(s,96180))},96180:(e,t,s)=>{"use strict";s.d(t,{default:()=>p});var r=s(95155),a=s(12115);let l=[{value:"24h",label:"24h"},{value:"7d",label:"7 ng\xe0y"},{value:"30d",label:"30 ng\xe0y"},{value:"all",label:"Tất cả"}];function d(e){return new Intl.NumberFormat("en-US").format(Number(e||0))}function i(e){let t=Number(e||0);if(t<1024)return`${d(t)} B`;let s=["KB","MB","GB","TB"],r=t/1024,a=0;for(;r>=1024&&a<s.length-1;)r/=1024,a+=1;return`${r>=100?r.toFixed(0):r>=10?r.toFixed(1):r.toFixed(2)} ${s[a]}`}function n(e){let t=Number(e||0);return`${t.toFixed(t>=10?1:2)}%`}function x(e){let t=String(e||"");return t.length<=18?t||"-":`${t.slice(0,10)}…${t.slice(-6)}`}function c({icon:e,label:t,value:s,hint:a,tone:l="default"}){return(0,r.jsxs)("div",{className:`rounded-2xl border p-5 shadow-sm ${"success"===l?"border-emerald-500/20 bg-emerald-500/5 text-emerald-700 dark:text-emerald-300":"warning"===l?"border-amber-500/20 bg-amber-500/5 text-amber-700 dark:text-amber-300":"border-border bg-background text-text-main"}`,children:[(0,r.jsxs)("div",{className:"flex items-start justify-between gap-3",children:[(0,r.jsxs)("div",{children:[(0,r.jsx)("div",{className:"text-xs font-semibold uppercase tracking-wide text-text-muted",children:t}),(0,r.jsx)("div",{className:"mt-2 text-2xl font-bold text-text-main",children:s})]}),(0,r.jsx)("span",{className:"material-symbols-outlined rounded-xl bg-surface px-2.5 py-2 text-[22px] text-primary",children:e})]}),a?(0,r.jsx)("div",{className:"mt-3 text-xs text-text-muted",children:a}):null]})}function m({value:e}){let t=Math.max(0,Math.min(100,Number(e||0)));return(0,r.jsx)("div",{className:"h-2 w-full overflow-hidden rounded-full bg-surface",children:(0,r.jsx)("div",{className:"h-full rounded-full bg-primary",style:{width:`${t}%`}})})}function o({title:e,icon:t,rows:s,columns:a="default"}){return(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsx)("div",{className:"mb-4 flex items-center justify-between gap-3",children:(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-primary",children:t}),(0,r.jsx)("h2",{className:"text-base font-bold text-text-main",children:e})]})}),(0,r.jsx)("div",{className:"overflow-x-auto",children:(0,r.jsxs)("table",{className:"min-w-full text-sm",children:[(0,r.jsx)("thead",{className:"text-left text-xs uppercase tracking-wide text-text-muted",children:(0,r.jsxs)("tr",{className:"border-b border-border",children:[(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"T\xean"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Requests"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Hits"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Saved"}),(0,r.jsx)("th",{className:"pb-2 text-right font-semibold",children:"filter"===a?"Share":"Ratio"})]})}),(0,r.jsx)("tbody",{children:s?.length?s.map(e=>(0,r.jsxs)("tr",{className:"border-b border-border/60 last:border-0",children:[(0,r.jsxs)("td",{className:"max-w-[280px] py-3 pr-4 font-medium text-text-main",children:[(0,r.jsx)("div",{className:"truncate",title:e.key,children:e.key}),"filter"===a?(0,r.jsxs)("div",{className:"text-xs text-text-muted",children:[d(e.hitCount)," hit \xb7 ~",d(e.estimatedTokensSaved)," token"]}):null]}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right text-text-muted",children:d(e.requests||e.appliedRequests)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right text-text-muted",children:d(e.hitCount)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right font-semibold text-emerald-600 dark:text-emerald-300",children:i(e.bytesSaved)}),(0,r.jsx)("td",{className:"py-3 text-right text-text-muted",children:n(e.savedPct)})]},e.key)):(0,r.jsx)("tr",{children:(0,r.jsx)("td",{colSpan:5,className:"py-6 text-center text-text-muted",children:"Chưa c\xf3 dữ liệu RTK trong khoảng thời gian n\xe0y."})})})]})})]})}function h({rows:e}){let t=Math.max(1,...(e||[]).map(e=>Number(e.bytesSaved||0))),s=(e||[]).slice(-30);return(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsxs)("div",{className:"mb-4 flex items-center justify-between gap-3",children:[(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-primary",children:"stacked_bar_chart"}),(0,r.jsx)("h2",{className:"text-base font-bold text-text-main",children:"Savings trend"})]}),(0,r.jsx)("div",{className:"text-xs text-text-muted",children:"Theo bucket thời gian"})]}),s.length?(0,r.jsx)("div",{className:"flex h-56 items-end gap-2 rounded-2xl bg-surface/60 px-4 py-4",children:s.map(e=>{let s=Math.max(4,Math.round(Number(e.bytesSaved||0)/t*100));return(0,r.jsxs)("div",{className:"flex h-full min-w-0 flex-1 flex-col items-center gap-2",children:[(0,r.jsxs)("div",{className:"group relative flex min-h-0 w-full flex-1 items-end justify-center",children:[(0,r.jsx)("div",{className:"w-full rounded-t-lg bg-primary/80 transition hover:bg-primary",style:{height:`${s}%`,minHeight:4}}),(0,r.jsxs)("div",{className:"pointer-events-none absolute bottom-full z-10 mb-2 hidden min-w-max rounded-xl border border-border bg-background px-3 py-2 text-xs shadow-lg group-hover:block",children:[(0,r.jsx)("div",{className:"font-semibold text-text-main",children:e.key}),(0,r.jsxs)("div",{className:"text-text-muted",children:["Saved: ",i(e.bytesSaved)]}),(0,r.jsxs)("div",{className:"text-text-muted",children:["Requests: ",d(e.requests)]})]})]}),(0,r.jsx)("div",{className:"w-full truncate text-center text-[10px] text-text-muted",title:e.key,children:e.key.slice(-5)})]},e.key)})}):(0,r.jsx)("div",{className:"rounded-2xl bg-surface/60 py-12 text-center text-sm text-text-muted",children:"Chưa c\xf3 trend data."})]})}function u({rows:e}){return(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsxs)("div",{className:"mb-4 flex items-center justify-between gap-3",children:[(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-primary",children:"history"}),(0,r.jsx)("h2",{className:"text-base font-bold text-text-main",children:"Recent RTK hits"})]}),(0,r.jsx)("div",{className:"text-xs text-text-muted",children:"Kh\xf4ng hiển thị nội dung prompt/tool output"})]}),(0,r.jsx)("div",{className:"overflow-x-auto",children:(0,r.jsxs)("table",{className:"min-w-full text-sm",children:[(0,r.jsx)("thead",{className:"text-left text-xs uppercase tracking-wide text-text-muted",children:(0,r.jsxs)("tr",{className:"border-b border-border",children:[(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Time"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Source"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Provider / Model"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"API key"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Filters"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Saved"}),(0,r.jsx)("th",{className:"pb-2 text-right font-semibold",children:"Request"})]})}),(0,r.jsx)("tbody",{children:e?.length?e.map((e,t)=>(0,r.jsxs)("tr",{className:"border-b border-border/60 last:border-0",children:[(0,r.jsx)("td",{className:"whitespace-nowrap py-3 pr-4 text-text-muted",children:function(e){if(!e)return"-";let t=new Date(e);return Number.isNaN(t.getTime())?String(e):t.toLocaleString("vi-VN",{hour12:!1})}(e.timestamp)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-text-muted",children:e.sourceTool||"unknown"}),(0,r.jsxs)("td",{className:"max-w-[260px] py-3 pr-4",children:[(0,r.jsx)("div",{className:"font-medium text-text-main",children:e.provider}),(0,r.jsx)("div",{className:"truncate text-xs text-text-muted",title:e.model,children:e.model})]}),(0,r.jsxs)("td",{className:"max-w-[200px] py-3 pr-4",children:[(0,r.jsx)("div",{className:"truncate font-medium text-text-main",title:e.apiKeyName||e.apiKeyId||"-",children:e.apiKeyName||e.apiKeyId||"-"}),e.apiKeyOwner?(0,r.jsx)("div",{className:"truncate text-xs text-text-muted",title:e.apiKeyOwner,children:e.apiKeyOwner}):null]}),(0,r.jsx)("td",{className:"py-3 pr-4",children:(0,r.jsx)("div",{className:"flex max-w-[320px] flex-wrap gap-1.5",children:(e.filters||[]).slice(0,4).map(e=>(0,r.jsx)("span",{className:"rounded-full border border-border bg-surface px-2 py-0.5 text-xs text-text-muted",children:e},e))})}),(0,r.jsxs)("td",{className:"py-3 pr-4 text-right font-semibold text-emerald-600 dark:text-emerald-300",children:[i(e.bytesSaved),(0,r.jsx)("div",{className:"text-xs font-normal text-text-muted",children:n(e.savedPct)})]}),(0,r.jsx)("td",{className:"py-3 text-right font-mono text-xs text-text-muted",title:e.requestId,children:x(e.requestId)})]},`${e.requestId||t}-${e.timestamp}`)):(0,r.jsx)("tr",{children:(0,r.jsx)("td",{colSpan:7,className:"py-6 text-center text-text-muted",children:"Chưa c\xf3 request n\xe0o được RTK n\xe9n th\xe0nh c\xf4ng."})})})]})})]})}function b({rows:e}){return(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsx)("div",{className:"mb-4 flex items-center justify-between gap-3",children:(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-primary",children:"vpn_key"}),(0,r.jsx)("h2",{className:"text-base font-bold text-text-main",children:"Top API keys"})]})}),(0,r.jsx)("div",{className:"overflow-x-auto",children:(0,r.jsxs)("table",{className:"min-w-full text-sm",children:[(0,r.jsx)("thead",{className:"text-left text-xs uppercase tracking-wide text-text-muted",children:(0,r.jsxs)("tr",{className:"border-b border-border",children:[(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"API key"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Owner"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Requests"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Hits"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Saved"}),(0,r.jsx)("th",{className:"pb-2 text-right font-semibold",children:"Ratio"})]})}),(0,r.jsx)("tbody",{children:e?.length?e.map(e=>(0,r.jsxs)("tr",{className:"border-b border-border/60 last:border-0",children:[(0,r.jsxs)("td",{className:"max-w-[260px] py-3 pr-4 font-medium text-text-main",children:[(0,r.jsx)("div",{className:"truncate",title:e.apiKeyName||e.apiKeyId||e.key,children:e.apiKeyName||e.apiKeyId||e.key}),e.apiKeyId?(0,r.jsx)("div",{className:"truncate font-mono text-xs text-text-muted",title:e.apiKeyId,children:x(e.apiKeyId)}):null]}),(0,r.jsx)("td",{className:"max-w-[200px] py-3 pr-4 text-text-muted",children:(0,r.jsx)("div",{className:"truncate",title:e.apiKeyOwner||"-",children:e.apiKeyOwner||"-"})}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right text-text-muted",children:d(e.requests||e.appliedRequests)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right text-text-muted",children:d(e.hitCount)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right font-semibold text-emerald-600 dark:text-emerald-300",children:i(e.bytesSaved)}),(0,r.jsx)("td",{className:"py-3 text-right text-text-muted",children:n(e.savedPct)})]},e.key)):(0,r.jsx)("tr",{children:(0,r.jsx)("td",{colSpan:6,className:"py-6 text-center text-text-muted",children:"Chưa c\xf3 API key n\xe0o c\xf3 RTK stats."})})})]})})]})}function p(){let[e,t]=(0,a.useState)("24h"),[s,x]=(0,a.useState)(null),[p,j]=(0,a.useState)(!0),[N,f]=(0,a.useState)(""),g=(0,a.useMemo)(()=>{let t=new URLSearchParams;return t.set("period",e),t.toString()},[e]),v=(0,a.useCallback)(async()=>{j(!0),f("");try{let e=await fetch(`/api/dashboard/token-saver?${g}`,{cache:"no-store"}),t=await e.json().catch(()=>({}));if(!e.ok)throw Error(t?.error||`HTTP ${e.status}`);x(t)}catch(e){f(e?.message||"Kh\xf4ng tải được Token Saver Analytics"),x(null)}finally{j(!1)}},[g]);(0,a.useEffect)(()=>{v()},[v]);let y=s?.summary||{},w=y.measuredRequests>0;return(0,r.jsx)("main",{className:"space-y-6 p-6",children:(0,r.jsxs)("section",{className:"overflow-hidden rounded-3xl border border-border bg-background shadow-sm",children:[(0,r.jsx)("div",{className:"border-b border-border bg-gradient-to-r from-primary/10 via-background to-background p-6",children:(0,r.jsxs)("div",{className:"flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between",children:[(0,r.jsxs)("div",{children:[(0,r.jsxs)("div",{className:"mb-2 flex flex-wrap items-center gap-2",children:[(0,r.jsx)("span",{className:"rounded-full border border-emerald-500/20 bg-emerald-500/10 px-3 py-1 text-xs font-semibold text-emerald-700 dark:text-emerald-300",children:"Read-only"}),(0,r.jsx)("span",{className:"rounded-full border border-border bg-surface px-3 py-1 text-xs font-semibold text-text-muted",children:"Admin only"}),(0,r.jsx)("span",{className:"rounded-full border border-border bg-surface px-3 py-1 text-xs font-semibold text-text-muted",children:"No routing change"})]}),(0,r.jsx)("h1",{className:"text-2xl font-bold text-text-main",children:"Token Saver Analytics"}),(0,r.jsx)("p",{className:"mt-1 max-w-3xl text-sm text-text-muted",children:"Theo d\xf5i hiệu quả RTK Token Saver tr\xean request thật: byte tiết kiệm, filter n\xe0o hoạt động, source tool/provider/model n\xe0o tiết kiệm nhiều nhất."})]}),(0,r.jsxs)("div",{className:"flex flex-wrap items-center gap-2",children:[(0,r.jsx)("div",{className:"flex rounded-2xl border border-border bg-surface p-1",children:l.map(s=>(0,r.jsx)("button",{type:"button",onClick:()=>t(s.value),className:`rounded-xl px-3 py-2 text-sm font-semibold transition ${e===s.value?"bg-primary text-white":"text-text-muted hover:bg-background hover:text-text-main"}`,children:s.label},s.value))}),(0,r.jsxs)("button",{type:"button",onClick:v,disabled:p,className:"inline-flex items-center gap-2 rounded-2xl border border-border bg-background px-4 py-2 text-sm font-semibold text-text-main transition hover:bg-surface disabled:opacity-50",children:[(0,r.jsx)("span",{className:`material-symbols-outlined text-[18px] ${p?"animate-spin":""}`,children:"refresh"}),"Refresh"]})]})]})}),N?(0,r.jsx)("div",{className:"m-6 rounded-2xl border border-red-500/20 bg-red-500/10 p-4 text-sm text-red-700 dark:text-red-300",children:"Admin access required"===N?"Chỉ Admin mới xem được Token Saver Analytics.":N}):null,p&&!s?(0,r.jsxs)("div",{className:"flex min-h-[320px] items-center justify-center text-sm text-text-muted",children:[(0,r.jsx)("span",{className:"material-symbols-outlined mr-2 animate-spin",children:"progress_activity"}),"Đang tải Token Saver Analytics..."]}):(0,r.jsxs)("div",{className:"space-y-6 p-6",children:[s?.unavailable?(0,r.jsx)("div",{className:"rounded-2xl border border-amber-500/20 bg-amber-500/10 p-4 text-sm text-amber-700 dark:text-amber-300",children:"MySQL observability chưa sẵn s\xe0ng, kh\xf4ng đọc được dữ liệu Token Saver."}):null,s?.summary?.truncated?(0,r.jsxs)("div",{className:"rounded-2xl border border-amber-500/20 bg-amber-500/10 p-4 text-sm text-amber-700 dark:text-amber-300",children:["Đang hiển thị mẫu ",d(y.sampledRows)," / ",d(y.totalRows)," rows. Tăng TOKEN_SAVER_ANALYTICS_MAX_ROWS nếu cần thống k\xea chi tiết hơn."]}):null,(0,r.jsxs)("div",{className:"grid gap-4 md:grid-cols-2 xl:grid-cols-4",children:[(0,r.jsx)(c,{icon:"compress",label:"Measured requests",value:d(y.measuredRequests),hint:`${d(y.enabledRequests)} request c\xf3 RTK enabled`}),(0,r.jsx)(c,{icon:"savings",label:"Estimated tokens saved",value:`~${d(y.estimatedTokensSaved)}`,hint:`${i(y.bytesSaved)} saved / ${i(y.bytesBefore)} scanned`,tone:"success"}),(0,r.jsx)(c,{icon:"bolt",label:"Hit rate",value:n(y.hitRate),hint:`${d(y.appliedRequests)} request c\xf3 n\xe9n th\xe0nh c\xf4ng`}),(0,r.jsx)(c,{icon:"speed",label:"Avg saved / hit",value:i(y.avgBytesSavedPerAppliedRequest),hint:`${d(y.hitCount)} total filter hits`})]}),(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsxs)("div",{className:"mb-3 flex items-center justify-between gap-3",children:[(0,r.jsxs)("div",{children:[(0,r.jsx)("h2",{className:"font-bold text-text-main",children:"RTK efficiency"}),(0,r.jsx)("p",{className:"text-sm text-text-muted",children:"Tỷ lệ byte giảm sau khi RTK n\xe9n tool output."})]}),(0,r.jsxs)("div",{className:"text-right",children:[(0,r.jsx)("div",{className:"text-2xl font-bold text-text-main",children:n(y.savedPct)}),(0,r.jsx)("div",{className:"text-xs text-text-muted",children:"overall saving ratio"})]})]}),(0,r.jsx)(m,{value:y.savedPct})]}),w?null:(0,r.jsxs)("div",{className:"rounded-2xl border border-border bg-surface/60 p-8 text-center",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-4xl text-text-muted",children:"compress"}),(0,r.jsx)("div",{className:"mt-3 font-semibold text-text-main",children:"Chưa c\xf3 rtkStats"}),(0,r.jsx)("p",{className:"mt-1 text-sm text-text-muted",children:"Dữ liệu sẽ xuất hiện sau khi c\xf3 request đi qua RTK-enabled route v\xe0 được ghi v\xe0o usage_events/request_details."})]}),(0,r.jsx)(h,{rows:s?.timeSeries||[]}),(0,r.jsxs)("div",{className:"grid gap-6 xl:grid-cols-2",children:[(0,r.jsx)(o,{title:"Top RTK filters",icon:"filter_alt",rows:s?.byFilter||[],columns:"filter"}),(0,r.jsx)(o,{title:"Top source tools",icon:"terminal",rows:s?.bySourceTool||[]})]}),(0,r.jsxs)("div",{className:"grid gap-6 xl:grid-cols-2",children:[(0,r.jsx)(o,{title:"Top providers",icon:"dns",rows:s?.byProvider||[]}),(0,r.jsx)(o,{title:"Top models",icon:"memory",rows:s?.byModel||[]})]}),(0,r.jsx)(b,{rows:s?.byApiKey||[]}),(0,r.jsx)(u,{rows:s?.recentHits||[]})]})]})})}}},e=>{e.O(0,[8441,3794,7358],()=>e(e.s=93413)),_N_E=e.O()}]);
+(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[9839],{93413:(e,t,s)=>{Promise.resolve().then(s.bind(s,96180))},96180:(e,t,s)=>{"use strict";s.d(t,{default:()=>p});var r=s(95155),a=s(12115);let l=[{value:"24h",label:"24h"},{value:"7d",label:"7 ng\xe0y"},{value:"30d",label:"30 ng\xe0y"},{value:"all",label:"Tất cả"}];function d(e){return new Intl.NumberFormat("en-US").format(Number(e||0))}function i(e){let t=Number(e||0);if(t<1024)return`${d(t)} B`;let s=["KB","MB","GB","TB"],r=t/1024,a=0;for(;r>=1024&&a<s.length-1;)r/=1024,a+=1;return`${r>=100?r.toFixed(0):r>=10?r.toFixed(1):r.toFixed(2)} ${s[a]}`}function n(e){let t=Number(e||0);return`${t.toFixed(t>=10?1:2)}%`}function x(e){let t=String(e||"");return t.length<=18?t||"-":`${t.slice(0,10)}…${t.slice(-6)}`}function c({icon:e,label:t,value:s,hint:a,tone:l="default"}){return(0,r.jsxs)("div",{className:`rounded-2xl border p-5 shadow-sm ${"success"===l?"border-emerald-500/20 bg-emerald-500/5 text-emerald-700 dark:text-emerald-300":"warning"===l?"border-amber-500/20 bg-amber-500/5 text-amber-700 dark:text-amber-300":"border-border bg-background text-text-main"}`,children:[(0,r.jsxs)("div",{className:"flex items-start justify-between gap-3",children:[(0,r.jsxs)("div",{children:[(0,r.jsx)("div",{className:"text-xs font-semibold uppercase tracking-wide text-text-muted",children:t}),(0,r.jsx)("div",{className:"mt-2 text-2xl font-bold text-text-main",children:s})]}),(0,r.jsx)("span",{className:"material-symbols-outlined rounded-xl bg-surface px-2.5 py-2 text-[22px] text-primary",children:e})]}),a?(0,r.jsx)("div",{className:"mt-3 text-xs text-text-muted",children:a}):null]})}function m({value:e}){let t=Math.max(0,Math.min(100,Number(e||0)));return(0,r.jsx)("div",{className:"h-2 w-full overflow-hidden rounded-full bg-surface",children:(0,r.jsx)("div",{className:"h-full rounded-full bg-primary",style:{width:`${t}%`}})})}function o({title:e,icon:t,rows:s,columns:a="default"}){return(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsx)("div",{className:"mb-4 flex items-center justify-between gap-3",children:(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-primary",children:t}),(0,r.jsx)("h2",{className:"text-base font-bold text-text-main",children:e})]})}),(0,r.jsx)("div",{className:"overflow-x-auto",children:(0,r.jsxs)("table",{className:"min-w-full text-sm",children:[(0,r.jsx)("thead",{className:"text-left text-xs uppercase tracking-wide text-text-muted",children:(0,r.jsxs)("tr",{className:"border-b border-border",children:[(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"T\xean"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Requests"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Hits"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Saved"}),(0,r.jsx)("th",{className:"pb-2 text-right font-semibold",children:"filter"===a?"Share":"Ratio"})]})}),(0,r.jsx)("tbody",{children:s?.length?s.map(e=>(0,r.jsxs)("tr",{className:"border-b border-border/60 last:border-0",children:[(0,r.jsxs)("td",{className:"max-w-[280px] py-3 pr-4 font-medium text-text-main",children:[(0,r.jsx)("div",{className:"truncate",title:e.key,children:e.key}),"filter"===a?(0,r.jsxs)("div",{className:"text-xs text-text-muted",children:[d(e.hitCount)," hit \xb7 ~",d(e.estimatedTokensSaved)," token"]}):null]}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right text-text-muted",children:d(e.requests||e.appliedRequests)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right text-text-muted",children:d(e.hitCount)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right font-semibold text-emerald-600 dark:text-emerald-300",children:i(e.bytesSaved)}),(0,r.jsx)("td",{className:"py-3 text-right text-text-muted",children:n(e.savedPct)})]},e.key)):(0,r.jsx)("tr",{children:(0,r.jsx)("td",{colSpan:5,className:"py-6 text-center text-text-muted",children:"Chưa c\xf3 dữ liệu RTK trong khoảng thời gian n\xe0y."})})})]})})]})}function h({rows:e}){let t=Math.max(1,...(e||[]).map(e=>Number(e.bytesSaved||0))),s=(e||[]).slice(-30);return(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsxs)("div",{className:"mb-4 flex items-center justify-between gap-3",children:[(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-primary",children:"stacked_bar_chart"}),(0,r.jsx)("h2",{className:"text-base font-bold text-text-main",children:"Savings trend"})]}),(0,r.jsx)("div",{className:"text-xs text-text-muted",children:"Theo bucket thời gian"})]}),s.length?(0,r.jsx)("div",{className:"flex h-56 items-end gap-2 rounded-2xl bg-surface/60 px-4 py-4",children:s.map(e=>{let s=Math.max(4,Math.round(Number(e.bytesSaved||0)/t*100));return(0,r.jsxs)("div",{className:"flex h-full min-w-0 flex-1 flex-col items-center gap-2",children:[(0,r.jsxs)("div",{className:"group relative flex min-h-0 w-full flex-1 items-end justify-center",children:[(0,r.jsx)("div",{className:"w-full rounded-t-lg bg-primary/80 transition hover:bg-primary",style:{height:`${s}%`,minHeight:4}}),(0,r.jsxs)("div",{className:"pointer-events-none absolute bottom-full z-10 mb-2 hidden min-w-max rounded-xl border border-border bg-background px-3 py-2 text-xs shadow-lg group-hover:block",children:[(0,r.jsx)("div",{className:"font-semibold text-text-main",children:e.key}),(0,r.jsxs)("div",{className:"text-text-muted",children:["Saved: ",i(e.bytesSaved)]}),(0,r.jsxs)("div",{className:"text-text-muted",children:["Requests: ",d(e.requests)]})]})]}),(0,r.jsx)("div",{className:"w-full truncate text-center text-[10px] text-text-muted",title:e.key,children:e.key.slice(-5)})]},e.key)})}):(0,r.jsx)("div",{className:"rounded-2xl bg-surface/60 py-12 text-center text-sm text-text-muted",children:"Chưa c\xf3 trend data."})]})}function u({rows:e}){return(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsxs)("div",{className:"mb-4 flex items-center justify-between gap-3",children:[(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-primary",children:"history"}),(0,r.jsx)("h2",{className:"text-base font-bold text-text-main",children:"Recent RTK hits"})]}),(0,r.jsx)("div",{className:"text-xs text-text-muted",children:"Kh\xf4ng hiển thị nội dung prompt/tool output"})]}),(0,r.jsx)("div",{className:"overflow-x-auto",children:(0,r.jsxs)("table",{className:"min-w-full text-sm",children:[(0,r.jsx)("thead",{className:"text-left text-xs uppercase tracking-wide text-text-muted",children:(0,r.jsxs)("tr",{className:"border-b border-border",children:[(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Time"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Source"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Provider / Model"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"API key"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Filters"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Saved"}),(0,r.jsx)("th",{className:"pb-2 text-right font-semibold",children:"Request"})]})}),(0,r.jsx)("tbody",{children:e?.length?e.map((e,t)=>(0,r.jsxs)("tr",{className:"border-b border-border/60 last:border-0",children:[(0,r.jsx)("td",{className:"whitespace-nowrap py-3 pr-4 text-text-muted",children:function(e){if(!e)return"-";let t=new Date(e);return Number.isNaN(t.getTime())?String(e):t.toLocaleString("vi-VN",{hour12:!1})}(e.timestamp)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-text-muted",children:e.sourceTool||"unknown"}),(0,r.jsxs)("td",{className:"max-w-[260px] py-3 pr-4",children:[(0,r.jsx)("div",{className:"font-medium text-text-main",children:e.provider}),(0,r.jsx)("div",{className:"truncate text-xs text-text-muted",title:e.model,children:e.model})]}),(0,r.jsxs)("td",{className:"max-w-[200px] py-3 pr-4",children:[(0,r.jsx)("div",{className:"truncate font-medium text-text-main",title:e.apiKeyName||e.apiKeyId||"-",children:e.apiKeyName||e.apiKeyId||"-"}),e.apiKeyOwner?(0,r.jsx)("div",{className:"truncate text-xs text-text-muted",title:e.apiKeyOwner,children:e.apiKeyOwner}):null]}),(0,r.jsx)("td",{className:"py-3 pr-4",children:(0,r.jsx)("div",{className:"flex max-w-[320px] flex-wrap gap-1.5",children:(e.filters||[]).slice(0,4).map(e=>(0,r.jsx)("span",{className:"rounded-full border border-border bg-surface px-2 py-0.5 text-xs text-text-muted",children:e},e))})}),(0,r.jsxs)("td",{className:"py-3 pr-4 text-right font-semibold text-emerald-600 dark:text-emerald-300",children:[i(e.bytesSaved),(0,r.jsx)("div",{className:"text-xs font-normal text-text-muted",children:n(e.savedPct)})]}),(0,r.jsx)("td",{className:"py-3 text-right font-mono text-xs text-text-muted",title:e.requestId,children:x(e.requestId)})]},`${e.requestId||t}-${e.timestamp}`)):(0,r.jsx)("tr",{children:(0,r.jsx)("td",{colSpan:7,className:"py-6 text-center text-text-muted",children:"Chưa c\xf3 request n\xe0o được RTK n\xe9n th\xe0nh c\xf4ng."})})})]})})]})}function b({rows:e}){return(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsx)("div",{className:"mb-4 flex items-center justify-between gap-3",children:(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-primary",children:"vpn_key"}),(0,r.jsx)("h2",{className:"text-base font-bold text-text-main",children:"Top API keys"})]})}),(0,r.jsx)("div",{className:"overflow-x-auto",children:(0,r.jsxs)("table",{className:"min-w-full text-sm",children:[(0,r.jsx)("thead",{className:"text-left text-xs uppercase tracking-wide text-text-muted",children:(0,r.jsxs)("tr",{className:"border-b border-border",children:[(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"API key"}),(0,r.jsx)("th",{className:"pb-2 pr-4 font-semibold",children:"Owner"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Requests"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Hits"}),(0,r.jsx)("th",{className:"pb-2 pr-4 text-right font-semibold",children:"Saved"}),(0,r.jsx)("th",{className:"pb-2 text-right font-semibold",children:"Ratio"})]})}),(0,r.jsx)("tbody",{children:e?.length?e.map(e=>(0,r.jsxs)("tr",{className:"border-b border-border/60 last:border-0",children:[(0,r.jsxs)("td",{className:"max-w-[260px] py-3 pr-4 font-medium text-text-main",children:[(0,r.jsx)("div",{className:"truncate",title:e.apiKeyName||e.apiKeyId||e.key,children:e.apiKeyName||e.apiKeyId||e.key}),e.apiKeyId?(0,r.jsx)("div",{className:"truncate font-mono text-xs text-text-muted",title:e.apiKeyId,children:x(e.apiKeyId)}):null]}),(0,r.jsx)("td",{className:"max-w-[200px] py-3 pr-4 text-text-muted",children:(0,r.jsx)("div",{className:"truncate",title:e.apiKeyOwner||"-",children:e.apiKeyOwner||"-"})}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right text-text-muted",children:d(e.requests||e.appliedRequests)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right text-text-muted",children:d(e.hitCount)}),(0,r.jsx)("td",{className:"py-3 pr-4 text-right font-semibold text-emerald-600 dark:text-emerald-300",children:i(e.bytesSaved)}),(0,r.jsx)("td",{className:"py-3 text-right text-text-muted",children:n(e.savedPct)})]},e.key)):(0,r.jsx)("tr",{children:(0,r.jsx)("td",{colSpan:6,className:"py-6 text-center text-text-muted",children:"Chưa c\xf3 API key n\xe0o c\xf3 RTK stats."})})})]})})]})}function p(){let[e,t]=(0,a.useState)("24h"),[s,x]=(0,a.useState)(null),[p,j]=(0,a.useState)(!0),[N,f]=(0,a.useState)(""),g=(0,a.useMemo)(()=>{let t=new URLSearchParams;return t.set("period",e),t.toString()},[e]),v=(0,a.useCallback)(async()=>{j(!0),f("");try{let e=await fetch(`/api/dashboard/token-saver?${g}`,{cache:"no-store"}),t=await e.json().catch(()=>({}));if(!e.ok)throw Error(t?.error||`HTTP ${e.status}`);x(t)}catch(e){f(e?.message||"Kh\xf4ng tải được Token Saver Analytics"),x(null)}finally{j(!1)}},[g]);(0,a.useEffect)(()=>{v()},[v]);let y=s?.summary||{},w=y.measuredRequests>0;return(0,r.jsx)("main",{className:"space-y-6 p-6",children:(0,r.jsxs)("section",{className:"overflow-hidden rounded-3xl border border-border bg-background shadow-sm",children:[(0,r.jsx)("div",{className:"border-b border-border bg-gradient-to-r from-primary/10 via-background to-background p-6",children:(0,r.jsxs)("div",{className:"flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between",children:[(0,r.jsxs)("div",{children:[(0,r.jsxs)("div",{className:"mb-2 flex flex-wrap items-center gap-2",children:[(0,r.jsx)("span",{className:"rounded-full border border-emerald-500/20 bg-emerald-500/10 px-3 py-1 text-xs font-semibold text-emerald-700 dark:text-emerald-300",children:"Read-only"}),s?.viewerScope==="own"?(0,r.jsx)("span",{className:"rounded-full border border-amber-500/20 bg-amber-500/10 px-3 py-1 text-xs font-semibold text-amber-700 dark:text-amber-300",children:"Chỉ hiển thị API key của bạn"}):(0,r.jsx)("span",{className:"rounded-full border border-border bg-surface px-3 py-1 text-xs font-semibold text-text-muted",children:"To\xe0n hệ thống"}),(0,r.jsx)("span",{className:"rounded-full border border-border bg-surface px-3 py-1 text-xs font-semibold text-text-muted",children:"No routing change"})]}),(0,r.jsx)("h1",{className:"text-2xl font-bold text-text-main",children:"Token Saver Analytics"}),(0,r.jsx)("p",{className:"mt-1 max-w-3xl text-sm text-text-muted",children:"Theo d\xf5i hiệu quả RTK Token Saver tr\xean request thật: byte tiết kiệm, filter n\xe0o hoạt động, source tool/provider/model n\xe0o tiết kiệm nhiều nhất."})]}),(0,r.jsxs)("div",{className:"flex flex-wrap items-center gap-2",children:[(0,r.jsx)("div",{className:"flex rounded-2xl border border-border bg-surface p-1",children:l.map(s=>(0,r.jsx)("button",{type:"button",onClick:()=>t(s.value),className:`rounded-xl px-3 py-2 text-sm font-semibold transition ${e===s.value?"bg-primary text-white":"text-text-muted hover:bg-background hover:text-text-main"}`,children:s.label},s.value))}),(0,r.jsxs)("button",{type:"button",onClick:v,disabled:p,className:"inline-flex items-center gap-2 rounded-2xl border border-border bg-background px-4 py-2 text-sm font-semibold text-text-main transition hover:bg-surface disabled:opacity-50",children:[(0,r.jsx)("span",{className:`material-symbols-outlined text-[18px] ${p?"animate-spin":""}`,children:"refresh"}),"Refresh"]})]})]})}),N?(0,r.jsx)("div",{className:"m-6 rounded-2xl border border-red-500/20 bg-red-500/10 p-4 text-sm text-red-700 dark:text-red-300",children:"Authentication required"===N?"Vui l\xf2ng đăng nhập lại để xem Token Saver Analytics.":N}):null,p&&!s?(0,r.jsxs)("div",{className:"flex min-h-[320px] items-center justify-center text-sm text-text-muted",children:[(0,r.jsx)("span",{className:"material-symbols-outlined mr-2 animate-spin",children:"progress_activity"}),"Đang tải Token Saver Analytics..."]}):(0,r.jsxs)("div",{className:"space-y-6 p-6",children:[s?.unavailable?(0,r.jsx)("div",{className:"rounded-2xl border border-amber-500/20 bg-amber-500/10 p-4 text-sm text-amber-700 dark:text-amber-300",children:"MySQL observability chưa sẵn s\xe0ng, kh\xf4ng đọc được dữ liệu Token Saver."}):null,s?.summary?.truncated?(0,r.jsxs)("div",{className:"rounded-2xl border border-amber-500/20 bg-amber-500/10 p-4 text-sm text-amber-700 dark:text-amber-300",children:["Đang hiển thị mẫu ",d(y.sampledRows)," / ",d(y.totalRows)," rows. Tăng TOKEN_SAVER_ANALYTICS_MAX_ROWS nếu cần thống k\xea chi tiết hơn."]}):null,(0,r.jsxs)("div",{className:"grid gap-4 md:grid-cols-2 xl:grid-cols-4",children:[(0,r.jsx)(c,{icon:"compress",label:"Measured requests",value:d(y.measuredRequests),hint:`${d(y.enabledRequests)} request c\xf3 RTK enabled`}),(0,r.jsx)(c,{icon:"savings",label:"Estimated tokens saved",value:`~${d(y.estimatedTokensSaved)}`,hint:`${i(y.bytesSaved)} saved / ${i(y.bytesBefore)} scanned`,tone:"success"}),(0,r.jsx)(c,{icon:"bolt",label:"Hit rate",value:n(y.hitRate),hint:`${d(y.appliedRequests)} request c\xf3 n\xe9n th\xe0nh c\xf4ng`}),(0,r.jsx)(c,{icon:"speed",label:"Avg saved / hit",value:i(y.avgBytesSavedPerAppliedRequest),hint:`${d(y.hitCount)} total filter hits`})]}),(0,r.jsxs)("section",{className:"rounded-2xl border border-border bg-background p-5 shadow-sm",children:[(0,r.jsxs)("div",{className:"mb-3 flex items-center justify-between gap-3",children:[(0,r.jsxs)("div",{children:[(0,r.jsx)("h2",{className:"font-bold text-text-main",children:"RTK efficiency"}),(0,r.jsx)("p",{className:"text-sm text-text-muted",children:"Tỷ lệ byte giảm sau khi RTK n\xe9n tool output."})]}),(0,r.jsxs)("div",{className:"text-right",children:[(0,r.jsx)("div",{className:"text-2xl font-bold text-text-main",children:n(y.savedPct)}),(0,r.jsx)("div",{className:"text-xs text-text-muted",children:"overall saving ratio"})]})]}),(0,r.jsx)(m,{value:y.savedPct})]}),w?null:(0,r.jsxs)("div",{className:"rounded-2xl border border-border bg-surface/60 p-8 text-center",children:[(0,r.jsx)("span",{className:"material-symbols-outlined text-4xl text-text-muted",children:"compress"}),(0,r.jsx)("div",{className:"mt-3 font-semibold text-text-main",children:"Chưa c\xf3 rtkStats"}),(0,r.jsx)("p",{className:"mt-1 text-sm text-text-muted",children:"Dữ liệu sẽ xuất hiện sau khi c\xf3 request đi qua RTK-enabled route v\xe0 được ghi v\xe0o usage_events/request_details."})]}),(0,r.jsx)(h,{rows:s?.timeSeries||[]}),(0,r.jsxs)("div",{className:"grid gap-6 xl:grid-cols-2",children:[(0,r.jsx)(o,{title:"Top RTK filters",icon:"filter_alt",rows:s?.byFilter||[],columns:"filter"}),(0,r.jsx)(o,{title:"Top source tools",icon:"terminal",rows:s?.bySourceTool||[]})]}),(0,r.jsxs)("div",{className:"grid gap-6 xl:grid-cols-2",children:[(0,r.jsx)(o,{title:"Top providers",icon:"dns",rows:s?.byProvider||[]}),(0,r.jsx)(o,{title:"Top models",icon:"memory",rows:s?.byModel||[]})]}),(0,r.jsx)(b,{rows:s?.byApiKey||[]}),(0,r.jsx)(u,{rows:s?.recentHits||[]})]})]})})}}},e=>{e.O(0,[8441,3794,7358],()=>e(e.s=93413)),_N_E=e.O()}]);

package/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bluerouter-app",
-  "version": "5.0.51",
+  "version": "5.0.52",
   "description": "Router web dashboard",
   "private": false,
   "scripts": {

package/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@jheavenknows/bluerouter",
- "version": "5.0.51",
+ "version": "5.0.52",
  "description": "Bluerouter CLI - Start and manage Bluerouter server",
  "bin": {
   "bluerouter": "./cli.js"