many fixes

frontend/src/components/dashboard/CreditBalanceWidget.tsx

@@ -1,9 +1,10 @@
 import { useEffect } from 'react';
 import { useBillingStore } from '../../store/billingStore';
 import ComponentCard from '../common/ComponentCard';
+import Button from '../ui/button/Button';
 
 export default function CreditBalanceWidget() {
-  const { balance, loading, loadBalance } = useBillingStore();
+  const { balance, loading, error, loadBalance } = useBillingStore();
   
   useEffect(() => {
     loadBalance();
@@ -16,6 +17,17 @@ export default function CreditBalanceWidget() {
       </ComponentCard>
     );
   }
+
+  if (error && !balance) {
+    return (
+      <ComponentCard title="Credit Balance" desc="Balance unavailable">
+        <div className="text-sm text-red-600 dark:text-red-400 mb-3">{error}</div>
+        <Button variant="outline" size="sm" onClick={loadBalance}>
+          Retry
+        </Button>
+      </ComponentCard>
+    );
+  }
   
   if (!balance) return null;
   
@@ -53,6 +65,11 @@ export default function CreditBalanceWidget() {
             <span className="text-sm text-gray-600 dark:text-gray-400">Remaining</span>
             <span className="text-sm font-medium text-success">{balance.credits_remaining}</span>
           </div>
+          {error && (
+            <div className="mt-2 text-xs text-amber-600 dark:text-amber-400">
+              Balance may be outdated. {error}
+            </div>
+          )}
         </div>
       </div>
     </ComponentCard>