Seazn/profit-planet-frontend
2
2
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

bug: fix header

Browse Source
This commit is contained in:
DeathKaioken 2026-01-13 20:30:57 +01:00
parent d2773ffd14
commit 4d1453a527
1 changed files with 16 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/app/components/nav/Header.tsx
View File

@ -68,6 +68,7 @@ export default function Header({ setGlobalLoggingOut }: HeaderProps) {
const refreshAuthToken = useAuthStore(s => s.refreshAuthToken) const refreshAuthToken = useAuthStore(s => s.refreshAuthToken)
const router = useRouter() const router = useRouter()
const pathname = usePathname() const pathname = usePathname()
const isHome = pathname === '/'
const [hasReferralPerm, setHasReferralPerm] = useState(false) const [hasReferralPerm, setHasReferralPerm] = useState(false)
const [adminMgmtOpen, setAdminMgmtOpen] = useState(false) const [adminMgmtOpen, setAdminMgmtOpen] = useState(false)
@ -122,8 +123,8 @@ export default function Header({ setGlobalLoggingOut }: HeaderProps) {
useEffect(() => { useEffect(() => {
if (!mounted) return if (!mounted) return
if (pathname !== '/') { if (!isHome) {
// non-home: header always visible // non-home: header always visible, no scroll listeners
setScrollY(100) setScrollY(100)
return return
} }
@ -148,7 +149,7 @@ export default function Header({ setGlobalLoggingOut }: HeaderProps) {
window.removeEventListener('scroll', handleScroll) window.removeEventListener('scroll', handleScroll)
window.removeEventListener('wheel', handleWheel) window.removeEventListener('wheel', handleWheel)
} }
}, [mounted, pathname]) }, [mounted, isHome])
// Fetch user permissions and set hasReferralPerm // Fetch user permissions and set hasReferralPerm
useEffect(() => { useEffect(() => {
@ -307,15 +308,23 @@ export default function Header({ setGlobalLoggingOut }: HeaderProps) {
((user as any)?.roles?.includes?.('admin')) ((user as any)?.roles?.includes?.('admin'))
) )
const isAdmin = mounted && rawIsAdmin const isAdmin = mounted && rawIsAdmin
const headerVisible = pathname !== '/' ? animateIn : animateIn && scrollY > 24
const parallaxOffset = pathname === '/' ? Math.max(-16, -scrollY * 0.15) : 0 // Only gate visibility by scroll on home; elsewhere just use animateIn
const headerVisible = isHome ? animateIn && scrollY > 24 : animateIn
const parallaxOffset = isHome ? Math.max(-16, -scrollY * 0.15) : 0
return ( return (
<header <header
className={`fixed top-0 left-0 w-full isolate z-10 shadow-lg shadow-black/30 after:pointer-events-none after:absolute after:inset-0 after:-z-10 after:bg-[radial-gradient(circle_at_20%_20%,rgba(56,124,255,0.18),transparent_55%),radial-gradient(circle_at_80%_35%,rgba(139,92,246,0.16),transparent_60%)] ${isAdmin ? '' : 'border-b border-white/10'} ${headerVisible ? 'opacity-100 translate-y-0' : 'opacity-0 -translate-y-6 pointer-events-none'} transition-all duration-500 ease-out`} className={`${
isHome ? 'fixed top-0 left-0 w-full' : 'relative'
} isolate z-10 shadow-lg shadow-black/30 after:pointer-events-none after:absolute after:inset-0 after:-z-10 after:bg-[radial-gradient(circle_at_20%_20%,rgba(56,124,255,0.18),transparent_55%),radial-gradient(circle_at_80%_35%,rgba(139,92,246,0.16),transparent_60%)] ${
isAdmin ? '' : 'border-b border-white/10'
} ${
headerVisible ? 'opacity-100 translate-y-0' : 'opacity-0 -translate-y-6 pointer-events-none'
} transition-all duration-500 ease-out`}
style={{ style={{
background: 'linear-gradient(135deg, #0F1D37 0%, #0A162A 50%, #081224 100%)', background: 'linear-gradient(135deg, #0F1D37 0%, #0A162A 50%, #081224 100%)',
transform: `translateY(${parallaxOffset}px)`, ...(isHome ? { transform: `translateY(${parallaxOffset}px)` } : {}),
}} }}
> >
<nav <nav