diff --git a/src/components/settings/credits/credits-balance-card.tsx b/src/components/settings/credits/credits-balance-card.tsx
index 2373ed5..c7bc5f0 100644
--- a/src/components/settings/credits/credits-balance-card.tsx
+++ b/src/components/settings/credits/credits-balance-card.tsx
@@ -15,7 +15,7 @@ import { websiteConfig } from '@/config/website';
 import { useCredits } from '@/hooks/use-credits';
 import { useMounted } from '@/hooks/use-mounted';
 import { usePayment } from '@/hooks/use-payment';
-import { LocaleLink, useLocaleRouter } from '@/i18n/navigation';
+import { useLocaleRouter } from '@/i18n/navigation';
 import { formatDate } from '@/lib/formatter';
 import { cn } from '@/lib/utils';
 import { Routes } from '@/routes';
@@ -104,7 +104,7 @@ export default function CreditsBalanceCard() {
       // Clean up URL parameters
       const url = new URL(window.location.href);
       url.searchParams.delete('credits_session_id');
-      localeRouter.replace(Routes.SettingsBilling + url.search);
+      localeRouter.replace(Routes.SettingsCredits + url.search);
     }
   }, [searchParams, localeRouter, fetchCredits, fetchCreditStats, t]);
 
@@ -135,9 +135,7 @@ export default function CreditsBalanceCard() {
             <Skeleton className="h-6 w-3/5" />
           </div>
         </CardContent>
-        <CardFooter className="mt-2 px-6 py-4 flex justify-end items-center bg-background rounded-none">
-          <Skeleton className="h-10 w-1/2" />
-        </CardFooter>
+        <CardFooter className="">{/* show nothing */}</CardFooter>
       </Card>
     );
   }
@@ -227,12 +225,12 @@ export default function CreditsBalanceCard() {
           )}
         </div>
       </CardContent>
-      <CardFooter className="mt-2 px-6 py-4 flex justify-end items-center bg-background rounded-none">
-        <Button variant="default" className="cursor-pointer" asChild>
+      <CardFooter className="">
+        {/* <Button variant="default" className="cursor-pointer" asChild>
           <LocaleLink href={Routes.SettingsCredits}>
             {t('viewTransactions')}
           </LocaleLink>
-        </Button>
+        </Button> */}
       </CardFooter>
     </Card>
   );
diff --git a/src/components/settings/credits/credits-page-client.tsx b/src/components/settings/credits/credits-page-client.tsx
index 3b35756..dc5172f 100644
--- a/src/components/settings/credits/credits-page-client.tsx
+++ b/src/components/settings/credits/credits-page-client.tsx
@@ -22,7 +22,7 @@ export default function CreditsPageClient() {
           </TabsTrigger>
         </TabsList>
 
-        <TabsContent value="balance" className="mt-2 flex flex-col gap-4">
+        <TabsContent value="balance" className="mt-4 flex flex-col gap-8">
           {/* Credits Balance Card */}
           <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
             <CreditsBalanceCard />
@@ -34,7 +34,7 @@ export default function CreditsPageClient() {
           </div>
         </TabsContent>
 
-        <TabsContent value="transactions" className="mt-2">
+        <TabsContent value="transactions" className="mt-4">
           {/* Credit Transactions */}
           <CreditTransactions />
         </TabsContent>
diff --git a/src/credits/credits.ts b/src/credits/credits.ts
index 7992c6a..d82b0a0 100644
--- a/src/credits/credits.ts
+++ b/src/credits/credits.ts
@@ -13,13 +13,23 @@ import { CREDIT_TRANSACTION_TYPE } from './types';
  * @returns User's current credit balance
  */
 export async function getUserCredits(userId: string): Promise<number> {
-  const db = await getDb();
-  const record = await db
-    .select()
-    .from(userCredit)
-    .where(eq(userCredit.userId, userId))
-    .limit(1);
-  return record[0]?.currentCredits || 0;
+  try {
+    const db = await getDb();
+
+    // Optimized query: only select the needed field
+    // This can benefit from covering index if we add one later
+    const record = await db
+      .select({ currentCredits: userCredit.currentCredits })
+      .from(userCredit)
+      .where(eq(userCredit.userId, userId))
+      .limit(1);
+
+    return record[0]?.currentCredits || 0;
+  } catch (error) {
+    console.error('getUserCredits, error:', error);
+    // Return 0 on error to prevent UI from breaking
+    return 0;
+  }
 }
 
 /**
@@ -28,11 +38,15 @@ export async function getUserCredits(userId: string): Promise<number> {
  * @param credits - New credit balance
  */
 export async function updateUserCredits(userId: string, credits: number) {
-  const db = await getDb();
-  await db
-    .update(userCredit)
-    .set({ currentCredits: credits, updatedAt: new Date() })
-    .where(eq(userCredit.userId, userId));
+  try {
+    const db = await getDb();
+    await db
+      .update(userCredit)
+      .set({ currentCredits: credits, updatedAt: new Date() })
+      .where(eq(userCredit.userId, userId));
+  } catch (error) {
+    console.error('updateUserCredits, error:', error);
+  }
 }
 
 /**
@@ -41,11 +55,15 @@ export async function updateUserCredits(userId: string, credits: number) {
  * @param date - Last refresh time
  */
 export async function updateUserLastRefreshAt(userId: string, date: Date) {
-  const db = await getDb();
-  await db
-    .update(userCredit)
-    .set({ lastRefreshAt: date, updatedAt: new Date() })
-    .where(eq(userCredit.userId, userId));
+  try {
+    const db = await getDb();
+    await db
+      .update(userCredit)
+      .set({ lastRefreshAt: date, updatedAt: new Date() })
+      .where(eq(userCredit.userId, userId));
+  } catch (error) {
+    console.error('updateUserLastRefreshAt, error:', error);
+  }
 }
 
 /**