"use client"; import Image from "next/image"; import Link from "@/app/components/LocaleLink"; import { useEffect, useState } from "react"; import { useRouter } from "next/navigation"; import toast from "react-hot-toast"; import ProfileAvatar from "@/app/components/ProfileAvatar"; import NotificationBell from "@/app/components/notifications/NotificationBell"; import { logout as logoutRequest, getProfile } from "@/app/lib/auth"; import { getAuthToken } from "@/app/lib/auth-token"; import { getWalletBalance } from "@/app/lib/wallet"; import { useLanguage } from "@/app/context/LanguageContext"; export default function Header() { const router = useRouter(); const { locale, t, setLocale, availableLocales } = useLanguage(); const [user, setUser] = useState(null); const [walletBalance, setWalletBalance] = useState(0); const [consultationOpen, setConsultationOpen] = useState(false); const [horoscopeOpen, setHoroscopeOpen] = useState(false); const [freeServiceOpen, setFreeServiceOpen] = useState(false); const [panchangOpen, setPanchangOpen] = useState(false); const [tarotOpen, setTarotOpen] = useState(false); useEffect(() => { const loadUser = () => { const userData = localStorage.getItem("user"); if (userData) { setUser(JSON.parse(userData)); } }; // The cached `user` object in localStorage is only a login-time // snapshot — it never reflects a balance change from a later // recharge or consultation, so the dropdown's "Wallet Transactions" // amount needs its own live fetch (same GET /user/profile + // getWalletBalance() the wallet page itself uses), not a read from // that snapshot. const loadWallet = async () => { const token = getAuthToken(); if (!token) return; const response = await getProfile(token); if (response?.success !== false) { setWalletBalance(getWalletBalance(response?.user)); } }; loadUser(); loadWallet(); // Refresh when EditProfileModal saves a new photo, so the // header avatar updates without a full page reload. "wallet-updated" // is dispatched after a recharge completes or the wallet page loads // a fresh balance, so this dropdown figure doesn't go stale either. window.addEventListener("profile-updated", loadUser); window.addEventListener("wallet-updated", loadWallet); return () => { window.removeEventListener("profile-updated", loadUser); window.removeEventListener("wallet-updated", loadWallet); }; }, []); const logout = () => { localStorage.removeItem("token"); localStorage.removeItem("refresh_token"); localStorage.removeItem("user"); setUser(null); toast.success("Logged out successfully"); router.push("/"); }; const handleLogoutOtherDevices = async () => { const token = localStorage.getItem("token"); try { if (token) { await logoutRequest(token); } toast.success("Logged out from other devices"); } catch { toast.error("Something went wrong, but you've been logged out here"); } finally { localStorage.removeItem("token"); localStorage.removeItem("refresh_token"); localStorage.removeItem("user"); setUser(null); router.push("/"); } }; return ( ); }