So i've tried using the

const { status } = useSession({
    required: true,
    onUnauthenticated() {
      router.push('/login')
    },
  })

and it works, but the only problem is that the page shows for a second when the sessions status is loading and when it becomes unauthorized it redirects the user to the login page, but i want the checking of session to happen before the rendering of the page, i've seen people use middleware with getServerSideProps and it was what i wanted but it seems that getServerSideProps isn't working, like for example when i return props to the page, it is undefined so how can i do?