37 lines
1004 B
JavaScript
37 lines
1004 B
JavaScript
"use client";
|
|
|
|
import { useState, Suspense } from "react";
|
|
import { UsageStats, RequestLogger, CardSkeleton, SegmentedControl } from "@/shared/components";
|
|
import ProviderLimits from "./components/ProviderLimits";
|
|
|
|
export default function UsagePage() {
|
|
const [activeTab, setActiveTab] = useState("overview");
|
|
|
|
return (
|
|
<div className="flex flex-col gap-6">
|
|
<SegmentedControl
|
|
options={[
|
|
{ value: "overview", label: "Overview" },
|
|
{ value: "logs", label: "Logger" },
|
|
// { value: "limits", label: "Limits" },
|
|
]}
|
|
value={activeTab}
|
|
onChange={setActiveTab}
|
|
/>
|
|
|
|
{/* Content */}
|
|
{activeTab === "overview" && (
|
|
<Suspense fallback={<CardSkeleton />}>
|
|
<UsageStats />
|
|
</Suspense>
|
|
)}
|
|
{activeTab === "logs" && <RequestLogger />}
|
|
{activeTab === "limits" && (
|
|
<Suspense fallback={<CardSkeleton />}>
|
|
<ProviderLimits />
|
|
</Suspense>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|