diff --git a/ui/src/app/usage/page.tsx b/ui/src/app/usage/page.tsx index e66355e5..a91451d2 100644 --- a/ui/src/app/usage/page.tsx +++ b/ui/src/app/usage/page.tsx @@ -6,8 +6,8 @@ import { useCallback, useEffect, useId, useState } from 'react'; import TimezoneSelect, { type ITimezoneOption } from 'react-timezone-select'; import { toast } from 'sonner'; -import { downloadUsageRunsReportApiV1OrganizationsUsageRunsReportGet, getDailyUsageBreakdownApiV1OrganizationsUsageDailyBreakdownGet, getMpsCreditsApiV1OrganizationsUsageMpsCreditsGet, getUsageHistoryApiV1OrganizationsUsageRunsGet } from '@/client/sdk.gen'; -import type { DailyUsageBreakdownResponse, MpsCreditsResponse, UsageHistoryResponse, WorkflowRunUsageResponse } from '@/client/types.gen'; +import { downloadUsageRunsReportApiV1OrganizationsUsageRunsReportGet, getDailyUsageBreakdownApiV1OrganizationsUsageDailyBreakdownGet, getUsageHistoryApiV1OrganizationsUsageRunsGet } from '@/client/sdk.gen'; +import type { DailyUsageBreakdownResponse, UsageHistoryResponse, WorkflowRunUsageResponse } from '@/client/types.gen'; import { CallTypeCell } from '@/components/CallTypeCell'; import { DailyUsageTable } from '@/components/DailyUsageTable'; import { FilterBuilder } from '@/components/filters/FilterBuilder'; @@ -15,7 +15,6 @@ import { MediaPreviewButton, MediaPreviewDialog } from '@/components/MediaPrevie import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; -import { Progress } from '@/components/ui/progress'; import { Table, TableBody, @@ -39,10 +38,6 @@ export default function UsagePage() { const { userConfig, saveUserConfig, loading: userConfigLoading, organizationPricing } = useUserConfig(); const auth = useAuth(); - // MPS credits state - const [mpsCredits, setMpsCredits] = useState(null); - const [isLoadingCredits, setIsLoadingCredits] = useState(true); - // Usage history state const [usageHistory, setUsageHistory] = useState(null); const [isLoadingHistory, setIsLoadingHistory] = useState(false); @@ -76,21 +71,6 @@ export default function UsagePage() { const [savingTimezone, setSavingTimezone] = useState(false); const timezoneSelectId = useId(); // Stable ID for react-select to prevent hydration mismatch - // Fetch MPS credits - const fetchMpsCredits = useCallback(async () => { - if (!auth.isAuthenticated) return; - try { - const response = await getMpsCreditsApiV1OrganizationsUsageMpsCreditsGet(); - if (response.data) { - setMpsCredits(response.data); - } - } catch (error) { - console.error('Failed to fetch MPS credits:', error); - } finally { - setIsLoadingCredits(false); - } - }, [auth.isAuthenticated]); - // Translate the FilterBuilder state into the query-param shape the // backend expects. Shared between the listing fetch and the CSV export // so they stay in lockstep. @@ -232,10 +212,9 @@ export default function UsagePage() { // Initial load - fetch when auth becomes available useEffect(() => { if (auth.isAuthenticated) { - fetchMpsCredits(); fetchUsageHistory(currentPage, appliedFilters); } - }, [auth.isAuthenticated, currentPage, appliedFilters, fetchUsageHistory, fetchMpsCredits]); + }, [auth.isAuthenticated, currentPage, appliedFilters, fetchUsageHistory]); // Fetch daily usage when organizationPricing becomes available useEffect(() => { @@ -409,46 +388,6 @@ export default function UsagePage() { - {/* MPS Credits Card */} - - - Dograh Model Credits - - These track usage of Dograh models using Dograh Service Keys. - - - - {isLoadingCredits ? ( -
-
-
-
-
- ) : mpsCredits ? ( -
-
-
-

- {mpsCredits.total_credits_used.toFixed(2)} / {mpsCredits.total_quota.toFixed(2)} -

-

Credits Used

-
-
-

{mpsCredits.remaining_credits.toFixed(2)}

-

Remaining

-
-
- - {mpsCredits.total_quota > 0 && ( - - )} -
- ) : ( -

No Dograh service keys configured. Set up a service key in your model configuration to see usage.

- )} -
-
- {/* Daily Usage Table - Only for paid organizations */} {organizationPricing?.price_per_second_usd && (