Using React to complete challenge

You can use the hooks for this :

     const [WidthScreem, setWidthSreem] = useState(window.innerWidth)
useEffect(()=>{
	const handleResize = ()=> setWidthSreem(window.innerWidth)
	window.addEventListener('resize', handleResize)
	return ()=> window.removeEventListener('resize', handleResize)
},[])  

A litle explain :

const [WidthScreem, setWidthSreem] = useState(window.innerWidth) Here we used the state hook and initialized it with the screen size After , you can use an Event on the window so that every time the screen size changes we call seTsetWidthSreem() again . Here we can say that useEffect allows you to automatically refresh the page

I found the solution, here is my updated code:

function Banner() {
  return (
    <picture>
      <source media="(min-width:800px )" srcSet={BannerDesktop} />
      <img src={BannerMobile} alt="Banner Mobile" className="banner-mobile" />
    </picture>
  );
}