feat: Update response handling and logging for improved usage tracking

This commit is contained in:
decolua 2026-02-03 10:22:43 +07:00
parent a33924b336
commit df0e1d6485
7 changed files with 348 additions and 152 deletions

View file

@ -17,7 +17,7 @@ export default function RequestLogger() {
if (autoRefresh) {
interval = setInterval(() => {
fetchLogs(false);
}, 500);
}, 3000);
}
return () => clearInterval(interval);
}, [autoRefresh]);
@ -43,17 +43,15 @@ export default function RequestLogger() {
<h2 className="text-xl font-semibold">Request Logs</h2>
<div className="flex items-center gap-2">
<label className="text-sm font-medium text-text-muted flex items-center gap-2 cursor-pointer">
<span>Auto Refresh (500ms)</span>
<span>Auto Refresh (3s)</span>
<div
onClick={() => setAutoRefresh(!autoRefresh)}
className={`relative inline-flex h-5 w-9 items-center rounded-full transition-colors focus:outline-none ${
autoRefresh ? "bg-primary" : "bg-bg-subtle border border-border"
}`}
className={`relative inline-flex h-5 w-9 items-center rounded-full transition-colors focus:outline-none ${autoRefresh ? "bg-primary" : "bg-bg-subtle border border-border"
}`}
>
<span
className={`inline-block h-3 w-3 transform rounded-full bg-white transition-transform ${
autoRefresh ? "translate-x-5" : "translate-x-1"
}`}
className={`inline-block h-3 w-3 transform rounded-full bg-white transition-transform ${autoRefresh ? "translate-x-5" : "translate-x-1"
}`}
/>
</div>
</label>
@ -101,11 +99,10 @@ export default function RequestLogger() {
<td className="px-3 py-1.5 border-r border-border truncate max-w-[150px]" title={parts[3]}>{parts[3]}</td>
<td className="px-3 py-1.5 border-r border-border text-right text-primary">{parts[4]}</td>
<td className="px-3 py-1.5 border-r border-border text-right text-success">{parts[5]}</td>
<td className={`px-3 py-1.5 font-bold ${
isSuccess ? 'text-success' :
isFailed ? 'text-error' :
'text-primary animate-pulse'
}`}>
<td className={`px-3 py-1.5 font-bold ${isSuccess ? 'text-success' :
isFailed ? 'text-error' :
'text-primary animate-pulse'
}`}>
{status}
</td>
</tr>