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

fix: add loading state handling in credit packages

Browse Source
This commit is contained in:
javayhu 2025-09-04 23:46:32 +08:00
parent 3fd47869a2
commit 48c045fb73
1 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/settings/credits/credit-packages.tsx
View File

@ -12,7 +12,6 @@ import { getCreditPackages } from '@/config/credits-config';
import { websiteConfig } from '@/config/website'; import { websiteConfig } from '@/config/website';
import { useCurrentUser } from '@/hooks/use-current-user'; import { useCurrentUser } from '@/hooks/use-current-user';
import { useCurrentPlan } from '@/hooks/use-payment'; import { useCurrentPlan } from '@/hooks/use-payment';
import { authClient } from '@/lib/auth-client';
import { formatPrice } from '@/lib/formatter'; import { formatPrice } from '@/lib/formatter';
import { cn } from '@/lib/utils'; import { cn } from '@/lib/utils';
import { CircleCheckBigIcon, CoinsIcon } from 'lucide-react'; import { CircleCheckBigIcon, CoinsIcon } from 'lucide-react';
@ -32,8 +31,9 @@ export function CreditPackages() {
// Get current user and payment info // Get current user and payment info
const currentUser = useCurrentUser(); const currentUser = useCurrentUser();
const { data: session } = authClient.useSession(); const { data: paymentData, isLoading: isLoadingPayment } = useCurrentPlan(
const { data: paymentData } = useCurrentPlan(session?.user?.id); currentUser?.id
);
const currentPlan = paymentData?.currentPlan; const currentPlan = paymentData?.currentPlan;
// Get credit packages with translations - must be called here to maintain hook order // Get credit packages with translations - must be called here to maintain hook order
@ -41,6 +41,11 @@ export function CreditPackages() {
(pkg) => !pkg.disabled && pkg.price.priceId (pkg) => !pkg.disabled && pkg.price.priceId
); );
// Don't render anything while loading to prevent flash
if (isLoadingPayment) {
return null;
}
// Check if user is on free plan and enablePackagesForFreePlan is false // Check if user is on free plan and enablePackagesForFreePlan is false
const isFreePlan = currentPlan?.isFree === true; const isFreePlan = currentPlan?.isFree === true;