'use client';

import { useWallet } from '@/hooks/useWallet';
import { formatCurrency } from '@/lib/utils';

export function WalletBalanceCard() {
  const { wallet, loading } = useWallet();

  return (
    <div className="hidden rounded-xl border border-line bg-surface px-3 py-2 md:block">
      <div className="text-[10px] text-ink-faint">Wallet Balance</div>
      <div className="text-sm font-semibold text-ink">
        {loading ? '—' : formatCurrency(wallet?.balance ?? 0)}
      </div>
    </div>
  );
}