From 9941798a858586937a9f8dadb3ab8c510b3cdd46 Mon Sep 17 00:00:00 2001 From: Your Name Date: Sat, 25 Jul 2026 21:16:14 -0400 Subject: [PATCH] x --- apps/website/src/components/Navbar.tsx | 21 ++++++++++++++++++- .../components/ProductStickyPurchaseBar.tsx | 14 ++++++++++++- 2 files changed, 33 insertions(+), 2 deletions(-) diff --git a/apps/website/src/components/Navbar.tsx b/apps/website/src/components/Navbar.tsx index 4bfbe42..3352fd3 100644 --- a/apps/website/src/components/Navbar.tsx +++ b/apps/website/src/components/Navbar.tsx @@ -177,12 +177,31 @@ export default function Navbar({ categories = [], initialMenu = [], settings = n const activeLanguage = LANGUAGES.find((language) => lang.startsWith(language.code) || language.code.startsWith(lang)) ?? LANGUAGES[0] const brandName = settings?.brandName || '' + const [productStickyVisible, setProductStickyVisible] = useState(false) + + useEffect(() => { + const handleStickyChange = (e: Event) => { + const customEvent = e as CustomEvent + if (typeof customEvent.detail === 'boolean') { + setProductStickyVisible(customEvent.detail) + } else { + setProductStickyVisible(document.documentElement.dataset.productStickyVisible === 'true') + } + } + + setProductStickyVisible(document.documentElement.dataset.productStickyVisible === 'true') + window.addEventListener('product-sticky-change', handleStickyChange) + return () => window.removeEventListener('product-sticky-change', handleStickyChange) + }, []) + const isHome = getPathWithoutLocale(pathname) === '/' const isTransparent = isHome && !scrolled && !mobileOpen && !searchOpen && !langSheetOpen const pathWithoutLocale = getPathWithoutLocale(pathname) const isCommercePath = ['/shop', '/products', '/category', '/cart', '/checkout', '/wishlist', '/profile', '/order', '/track'] .some((route) => pathWithoutLocale === route || pathWithoutLocale.startsWith(`${route}/`)) - const hideDesktopHeader = !isCommercePath && scrollingDown && !mobileOpen && !searchOpen && !langSheetOpen + const hideDesktopHeader = + (!isCommercePath && scrollingDown && !mobileOpen && !searchOpen && !langSheetOpen) || + (productStickyVisible && !mobileOpen && !searchOpen && !langSheetOpen) useEffect(() => { setIsClientReady(true) diff --git a/apps/website/src/components/ProductStickyPurchaseBar.tsx b/apps/website/src/components/ProductStickyPurchaseBar.tsx index 8761a08..93dd859 100644 --- a/apps/website/src/components/ProductStickyPurchaseBar.tsx +++ b/apps/website/src/components/ProductStickyPurchaseBar.tsx @@ -72,10 +72,20 @@ export default function ProductStickyPurchaseBar({ const trigger = document.getElementById(triggerId) if (!trigger) { setIsVisible(false) + if (document.documentElement.dataset.productStickyVisible !== 'false') { + document.documentElement.dataset.productStickyVisible = 'false' + window.dispatchEvent(new CustomEvent('product-sticky-change', { detail: false })) + } return } - setIsVisible(trigger.getBoundingClientRect().top <= 0) + const nextVisible = trigger.getBoundingClientRect().top <= 0 + setIsVisible(nextVisible) + const nextStr = nextVisible ? 'true' : 'false' + if (document.documentElement.dataset.productStickyVisible !== nextStr) { + document.documentElement.dataset.productStickyVisible = nextStr + window.dispatchEvent(new CustomEvent('product-sticky-change', { detail: nextVisible })) + } } updateVisibility() @@ -83,6 +93,8 @@ export default function ProductStickyPurchaseBar({ window.addEventListener('resize', updateVisibility) return () => { + document.documentElement.dataset.productStickyVisible = 'false' + window.dispatchEvent(new CustomEvent('product-sticky-change', { detail: false })) window.removeEventListener('scroll', updateVisibility) window.removeEventListener('resize', updateVisibility) }