root
29 lines
1.1 KiB
TypeScript
29 lines
1.1 KiB
TypeScript
'use client';
|
|
|
|
import { useEffect, useState } from 'react';
|
|
import { getHeaderTotalHeight } from '@/components/LanguageSwitcher';
|
|
import { useCustomerAuth } from '@/presentation/providers/customer-auth-provider';
|
|
|
|
/** Keeps `--header-height` in sync with the dynamic language bar + navbar. */
|
|
export default function HeaderHeightSync() {
|
|
const { isAuthenticated, isMenuManager, isLoading } = useCustomerAuth();
|
|
const [isMobile, setIsMobile] = useState(false);
|
|
|
|
useEffect(() => {
|
|
const update = () => setIsMobile(window.innerWidth < 640);
|
|
update();
|
|
window.addEventListener('resize', update);
|
|
return () => window.removeEventListener('resize', update);
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
const height = isLoading
|
|
? getHeaderTotalHeight(true, isMobile, true)
|
|
: getHeaderTotalHeight(isAuthenticated, isMobile, isMenuManager);
|
|
|
|
document.documentElement.style.setProperty('--header-height', `${height}px`);
|
|
document.documentElement.dataset.auth = isAuthenticated ? 'true' : 'false';
|
|
}, [isAuthenticated, isMenuManager, isLoading, isMobile]);
|
|
|
|
return null;
|
|
} |