Creating authentication pages

To allow users to post and reply to questions, we need to provide a way for them to register and log in. As stated in the Root layout, those pages will have the src/pages/auth/AuthRoot.tsx layout as their layout component.

Inside the layout for authentication pages, we need to redirect users back to the Home page if they are already logged in. We don’t want to display the register and login forms for already logged-in users. This feature becomes particularly useful when the browser remembers the login link with the next parameter. In such cases, instead of encountering an error, users can be seamlessly redirected to the appropriate page.

Here is the AuthRoot component code that is the base for the login and register forms:

import { jwtToken } from '@/atoms';
import { useAtom } from 'jotai';
import { useEffect } from 'react';
import {
  Outlet,
  useNavigate,
  useSearchParams...