diff --git a/client/src/hooks/useScroll.js b/client/src/hooks/useScroll.js index f91ae985..c6a30366 100644 --- a/client/src/hooks/useScroll.js +++ b/client/src/hooks/useScroll.js @@ -10,7 +10,6 @@ const useScroll = () => { window.addEventListener('scroll', onScroll); return () => window.removeEventListener('scroll', onScroll); }, [scrollTop]); - return { scrollTop }; }; diff --git a/client/src/layout/Header.jsx b/client/src/layout/Header.jsx index 44aa8aec..b68f2229 100644 --- a/client/src/layout/Header.jsx +++ b/client/src/layout/Header.jsx @@ -5,11 +5,9 @@ import { Logo, Service, } from '@dataesr/react-dsfr'; -import { useEffect, useState } from 'react'; import { NavLink } from 'react-router-dom'; import Beta from '../components/beta'; -import useScroll from '../hooks/useScroll'; const { VITE_APP_NAME, @@ -20,76 +18,38 @@ const { } = import.meta.env; export default function Header() { - const [isSticky, setIsSticky] = useState(false); - const { scrollTop } = useScroll(); - - useEffect(() => { - if (!isSticky && scrollTop > 68) { - setIsSticky(true); - } - if (isSticky && scrollTop < 20) { - setIsSticky(false); - } - }, [isSticky, scrollTop]); - return ( // eslint-disable-next-line react/jsx-no-useless-fragment <> - {isSticky ? ( - <> - - - } - className="fr-p-0" - description={VITE_DESCRIPTION} - title={( - <> - {VITE_APP_NAME} - {VITE_HEADER_TAG && ( - - )} - - )} - /> - - - ) : ( - <> - - - } - splitCharacter={9} - > - {VITE_MINISTER_NAME} - - } - description={VITE_DESCRIPTION} - title={( - <> - {VITE_APP_NAME} - {VITE_HEADER_TAG && ( - - )} - - )} - /> - - - )} + <> + + + } + splitCharacter={9} + > + {VITE_MINISTER_NAME} + + } + description={VITE_DESCRIPTION} + title={( + <> + {VITE_APP_NAME} + {VITE_HEADER_TAG && ( + + )} + + )} + /> + + ); diff --git a/client/src/pages/filters.jsx b/client/src/pages/filters.jsx index d5a434e1..2c0df341 100644 --- a/client/src/pages/filters.jsx +++ b/client/src/pages/filters.jsx @@ -33,11 +33,9 @@ export default function Filters({ sendQuery }) { const { scrollTop } = useScroll(); useEffect(() => { - const filters = document.querySelector('.filters'); - if (!isSticky && filters.offsetTop - scrollTop > 100) { + if (!isSticky && scrollTop > 50) { setIsSticky(true); - } - if (isSticky && scrollTop < 50) { + } else if (isSticky && scrollTop < 50) { setIsSticky(false); } }, [isSticky, scrollTop]); @@ -140,7 +138,7 @@ export default function Filters({ sendQuery }) { // eslint-disable-next-line react/jsx-no-useless-fragment <> {isSticky ? ( - + Filters : @@ -167,7 +165,7 @@ export default function Filters({ sendQuery }) { ) : ( - +