supabase auth-helpers-nextjs package not working properly - authentication

Question

I am using supabase auth helper package in my project. When the user enters the login details it should be redirected to the order page. I am using supabase auth condition in the order page. But when the user enters the login details it is not redirected to the order page.
code for the authentication in the order-page is given below :-
export const getServerSideProps = withPageAuth({ redirectTo: '/admin/login',
async getServerSideProps(ctx) {
// Access the user object
const { user, accessToken } = await getUser(ctx);
return { props: { email: user?.email } };
}
});
login page code is given below:-
async function handleSubmit(e) {
e.preventDefault();
const { user, error } = await supabase.auth.signIn({
email,
password
})
router.push('/orders')
}
return (
<Layout>
<div className="flex items-center justify-center h-screen">
<form onSubmit={handleSubmit}>
<p className="text-center text-[27px] text-white">Admin Login</p>
<div className="mt-4 text-white">
<p className="text-[14px]">Email</p>
<input type="text" className="bg-[#4A4949] rounded-md py-2 px-1 w-[300px]"
placeholder="Email Address"
value={email}
onChange={(e) => setEmail(e.target.value)}
/>
</div>
<div className="mt-4 text-white">
<p className="text-[14px]">Password</p>
<input type="password" className="bg-[#4A4949] rounded-md py-2 px-1 w-[300px]"
placeholder="Password"
value={password}
onChange={(e) => setPassword(e.target.value)}
/>
</div>
<button className="mt-8 bg-[#4A4949] text-white rounded w-[300px] py-2">Login</button>
</form>
</div>
</Layout >
)
}

Answer 1

You will need to wait for the user object to be defined before calling router.push:
import { useUser } from '#supabase/supabase-auth-helpers/react';
const { user } = useUser();
useEffect(() => {
if (user) {
router.push('/orders');
}
}, [user]);
async function handleSubmit(e) {
e.preventDefault();
const { user, error } = await supabase.auth.signIn({
email,
password
})
}