diff --git a/components/global-navbar.tsx b/components/global-navbar.tsx index 5d819ee9..60868f8b 100644 --- a/components/global-navbar.tsx +++ b/components/global-navbar.tsx @@ -12,6 +12,7 @@ import { useSmartWallet } from "@/components/providers/smart-wallet-provider"; import { WalletInfo } from "@/types/wallet"; import { CreditBalance } from "@/components/reputation/credit-balance"; import { Button } from "@/components/ui/button"; +import { authClient } from "@/lib/auth-client"; import { ModeToggle } from "./mode-toggle"; import { SecureAccountStep } from "./onboarding/secure-account-step"; import { @@ -27,6 +28,8 @@ import { Wallet, LogIn, Fingerprint } from "lucide-react"; export function GlobalNavbar() { const pathname = usePathname(); + const { data: session } = authClient.useSession(); + const userId = session?.user?.id; const userRole = useUserRole(); const { walletInfo, isConnected, isRegistered, connect, isLoading } = useSmartWallet(); @@ -140,9 +143,8 @@ export function GlobalNavbar() {
- - - {/* TODO: Replace with actual auth user ID */} + + diff --git a/components/reputation/credit-balance.tsx b/components/reputation/credit-balance.tsx index f3727373..8f1d7f91 100644 --- a/components/reputation/credit-balance.tsx +++ b/components/reputation/credit-balance.tsx @@ -12,13 +12,15 @@ import { cn } from "@/lib/utils"; import { Zap } from "lucide-react"; interface CreditBalanceProps { - userId: string; + userId?: string; className?: string; } export function CreditBalance({ userId, className }: CreditBalanceProps) { const { data, isLoading, isError } = useSparkCreditsBalance(userId); + if (!userId) return null; + if (isLoading) { return ; } diff --git a/components/ui/global-resizable-navbar.tsx b/components/ui/global-resizable-navbar.tsx index f0d92bea..62795b7f 100644 --- a/components/ui/global-resizable-navbar.tsx +++ b/components/ui/global-resizable-navbar.tsx @@ -12,10 +12,14 @@ import { MobileNavMenu, } from "@/components/ui/resizable-navbar"; import { NavRankBadge } from "@/components/leaderboard/nav-rank-badge"; +import { CreditBalance } from "@/components/reputation/credit-balance"; import { SearchCommand } from "@/components/search-command"; import { ModeToggle } from "@/components/mode-toggle"; +import { authClient } from "@/lib/auth-client"; export default function GlobalResizableNavbar() { + const { data: session } = authClient.useSession(); + const userId = session?.user?.id; const navItems = [ { name: "Explore", link: "/bounty" }, @@ -37,7 +41,8 @@ export default function GlobalResizableNavbar() {
- + +
diff --git a/hooks/use-spark-credits.ts b/hooks/use-spark-credits.ts index d5259c6e..29cfff1b 100644 --- a/hooks/use-spark-credits.ts +++ b/hooks/use-spark-credits.ts @@ -9,10 +9,10 @@ export const SPARK_CREDITS_KEYS = { [...SPARK_CREDITS_KEYS.all, "history", userId, limit] as const, }; -export function useSparkCreditsBalance(userId: string) { +export function useSparkCreditsBalance(userId?: string) { return useQuery({ - queryKey: SPARK_CREDITS_KEYS.balance(userId), - queryFn: () => sparkCreditsApi.fetchBalance(userId), + queryKey: SPARK_CREDITS_KEYS.balance(userId ?? ""), + queryFn: () => sparkCreditsApi.fetchBalance(userId ?? ""), enabled: !!userId, staleTime: 1000 * 60 * 2, // 2 minutes });