Is it possible to simulate an authentication without the back-end for placeholding?

[Ashlc]

Basically, I'm in the front-end of the development, and at this point I'd like to have a mock log in. The thing is, I apparently can't get it to work even using the example in the documentation. After I attempt the useSignIn method, it falls back on the login page again (fallback declaration below). It doesn't return anything falsey, so it does get to the navigate, but it logs false to "isAuthenticated". The timeout was an attempt of checking if it had anything to do with state updates.

This is how I'm trying to call it in my Login page:

const handleSubmit = (e) => {
    e.preventDefault();

    if (!password || !email) {
      return;
    }

    console.log('email', email);
    console.log('password', password);

    if (signIn({
      auth: {
        token: 'ey.........o1',
        type: 'Bearer',
      },
      userState: {
        name: 'The Dev',
        uuid: 'fff-fff-ffff',
      },
    })) {
      setTimeout(
        () => {
          console.log(isAuthenticated);
        },
        1000,
      );
      navigate('/');
    } else {
      console.log('Not logged in');
    }
  };

My browser router its:

export const AppRoutes = createBrowserRouter([
  {
    element: <AppLayout />,
    children: [
      { path: '/', element: <Home /> },
      { path: '/actions', element: <Projects /> },
// ...
      { path: '/action/:id', element: <ViewAction /> },
    ],
  },
  { path: '/login', element: <Login /> },
  // ...
]);

and my AppLayout is where i have my outlet:

const index = () => (
  <div>
    <Header />
    <PageLayout>
      <AuthOutlet fallbackPath="/login" />
      <Outlet />
    </PageLayout>
  </div>
);