After placing this piece of code in my component, getting this error,

Error: Rendered fewer hooks than expected. This may be caused by an accidental early return statement

enter image description here

        if ("IntersectionObserver" in window == false) {
            await import("intersection-observer");
        }
    }

useEffect(() => {
        if (ref.current) {
            importIntersectionObserver();
            let intersectionObserver = new IntersectionObserver(
                swimlanes => {
                    checkSwimlaneVisibility(swimlanes);
                },
                {
                    root: ref.current.parentElement, 
                    threshold: 0.9 
                }
            );
            const allSearchSwimlanes = ref.current.getElementsByClassName("pwaSwimlaneTile");
            if (allSearchSwimlanes) {
                for (let i = 0; i < allSearchSwimlanes.length; i++) {
                    intersectionObserver.observe(allSearchSwimlanes[i]);
                }
            }
        }
    }, []);```



How can I fix this Error?