Rapid ships with a ready-to-use Auth react hook that you can use to get the session along with a loading state.

import { useState, useEffect } from "react";
import { useSession } from "next-auth/react"; // replace 'your-session-library' with the actual library you're using

function useSessionWithLoading() {
  const [loading, setLoading] = useState(true);
  const { data: session } = useSession();
  useEffect(() => {
    // If session data is not yet available (still loading), set loading to true
    if (session === undefined) {
      setLoading(true);
    } else {
      setLoading(false);
    }
  }, [session]);

  return { loading, session };
}

export default useSessionWithLoading;
Auth optionsIntroduction