'use client';
import { useSession } from "next-auth/react";

export default function Home() {
  const { data: session } = useSession();
  
  useEffect(() => {
    // run getPosts() everytime the user scrolls to the bottom of the page.
  }, []);

  async function getPosts() {

    if (!session) {
      // I see this text printed out every time this function runs except the first render.   
      console.log("no session")           
      return;
    };

    const response = await fetch(`/api/post/get?userId=${session.user.id}`);
    .
    .
    .
  }
}

The problem is that, data: session is lost after the page renders.

Every time except the first time getPosts() is run, !session is true, and fetch doesn’t get to run.

I wonder why, and how do I keep the session data?

Thanks in advance!