Fixed an active state bug on wider view

Author: Satoshi-Sh

components/layout/Nav/index.js

@@ -11,6 +11,7 @@ export default function Nav() {
   const [isSticky, setIsSticky] = useState(false);
   const headerRef = useRef();
   const containerRef = useRef();
+  const DESKTOP_BREAKPOINT = 1024;
 
   useEffect(() => {
     const observer = new IntersectionObserver(
@@ -51,6 +52,19 @@ export default function Nav() {
     };
   }, []);
 
+  useEffect(() => {
+    const handleResize = () => {
+      if (window.innerWidth > DESKTOP_BREAKPOINT) {
+        setActive(false);
+      }
+    };
+
+    window.addEventListener('resize', handleResize);
+    return () => {
+      window.removeEventListener('resize', handleResize);
+    };
+  }, []);
+
   return (
     <header className={styles.header} ref={headerRef}>
       <Container>