import { useState, useEffect } from 'react'; function setCookie(name: string, value: string, days = 365) { const expires = new Date(Date.now() + days * 864e5).toUTCString(); document.cookie = `${name}=${encodeURIComponent(value)};expires=${expires};path=/;SameSite=Lax`; } export default function AccountIcon() { const [loggedIn, setLoggedIn] = useState(false); const [watchlistCount, setWatchlistCount] = useState(0); useEffect(() => { const getSession = (window as any).__spSession || (() => fetch('/api/auth/session').then(r => r.json())); getSession() .then((data: any) => { if (data.user) { setLoggedIn(true); // Set gender preference cookie if user has one if (data.user.gender_preference && data.user.gender_preference !== 'all') { setCookie('sp_gender', data.user.gender_preference); } fetch('/api/watchlist', { credentials: 'include' }) .then(r => r.json()) .then(wl => setWatchlistCount(wl.items?.length || 0)) .catch(() => {}); } }) .catch(() => {}); }, []); return (

{/* Watchlist icon — always visible */} {loggedIn && watchlistCount > 0 && ( {watchlistCount > 9 ? '9+' : watchlistCount} )} {/* Profile icon */} {loggedIn ? ( ) : ( )}

); }