songtianlun/prmbr-image-mksaas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update billing and credits pages & move credit balance and packages to credits page

Browse Source
This commit is contained in:
javayhu 2025-08-18 00:19:35 +08:00
parent f1d02720d0
commit 904dceec44
2 changed files with 32 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/app/[locale]/(protected)/settings/billing/page.tsx
View File

@ -1,27 +1,11 @@
import BillingCard from '@/components/settings/billing/billing-card'; import BillingCard from '@/components/settings/billing/billing-card';
import CreditsBalanceCard from '@/components/settings/billing/credits-balance-card';
import { CreditPackages } from '@/components/settings/credits/credit-packages';
import { websiteConfig } from '@/config/website';
import { useMemo } from 'react';
export default function BillingPage() { export default function BillingPage() {
// Memoize the credits enabled state to ensure consistency across renders
const creditsEnabled = useMemo(() => websiteConfig.credits.enableCredits, []);
return ( return (
<div className="space-y-8"> <div className="flex flex-col gap-8">
{/* Billing and Credits Balance Cards */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-8"> <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
<BillingCard /> <BillingCard />
{creditsEnabled && <CreditsBalanceCard />}
</div> </div>
{/* Credit Packages */}
{creditsEnabled && (
<div className="w-full">
<CreditPackages />
</div>
)}
</div> </div>
); );
} }

33
src/app/[locale]/(protected)/settings/credits/page.tsx
View File

@ -1,10 +1,13 @@
import CreditsBalanceCard from '@/components/settings/billing/credits-balance-card';
import { CreditPackages } from '@/components/settings/credits/credit-packages';
import { CreditTransactionsPageClient } from '@/components/settings/credits/credit-transactions-page'; import { CreditTransactionsPageClient } from '@/components/settings/credits/credit-transactions-page';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { websiteConfig } from '@/config/website'; import { websiteConfig } from '@/config/website';
import { Routes } from '@/routes'; import { Routes } from '@/routes';
import { redirect } from 'next/navigation'; import { redirect } from 'next/navigation';
/** /**
* Credits page, show credit transactions * Credits page, show credit balance and transactions
*/ */
export default function CreditsPage() { export default function CreditsPage() {
// If credits are disabled, redirect to billing page // If credits are disabled, redirect to billing page
@ -12,5 +15,31 @@ export default function CreditsPage() {
redirect(Routes.SettingsBilling); redirect(Routes.SettingsBilling);
} }
return <CreditTransactionsPageClient />; return (
<div className="flex flex-col gap-8">
<Tabs defaultValue="balance" className="w-full">
<TabsList className="">
<TabsTrigger value="balance">Balance</TabsTrigger>
<TabsTrigger value="transactions">Transactions</TabsTrigger>
</TabsList>
<TabsContent value="balance" className="mt-2 flex flex-col gap-4">
{/* Credits Balance Card */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
<CreditsBalanceCard />
</div>
{/* Credit Packages */}
<div className="w-full">
<CreditPackages />
</div>
</TabsContent>
<TabsContent value="transactions" className="mt-2">
{/* Credit Transactions */}
<CreditTransactionsPageClient />
</TabsContent>
</Tabs>
</div>
);
} }