Laravel Sanctum in same project folder

[ianrussel]

Hello, I tried sanctum for my api authentication, but after many hours of trying I still cant figure out. I have two user provider, one for api and one for admin. Previously I used passport for my admin users, but decided to give sanctum a shot. Heres my configurations

auth.php

   ` 'guards' => [
    'web' => [
        'driver' => 'session',
        'provider' => 'users',
    ],

    'api' => [
        'driver' => 'passport',
        'provider' => 'users',
        'hash' => false,
    ],
    'admin' => [
        'driver' => 'sanctum',
        'provider' => 'admin_users',
        'hash' => false,
    ],
],

`
cors.php

   `   'paths' => ['api/*', 'admin/*', 'login', 'logout', 'sanctum/csrf-cookie'],   `

admin.php / my custom route

           `Route::group(["prefix" => "{$version}", "middleware" => "auth:admin"], function () {

                   // login admin user info
                  Route::middleware('auth:admin')->get('/auth/user', function (Request $request) {
                      return $request->user();
             });`

sanctum.php

         `'stateful' => 'http://laravel.test/admin',` 

.env

        `SESSSION_DRIVER=cookie
         SESSION_DOMAIN=laravel.test 

I am using fetch to call login route

   `login: ({ username, password }) => {
          const sanctum = new Request(`${base}/sanctum/csrf-cookie`);
          return fetch(sanctum).then(response => {
            console.log(response, "the response");

            const request = new Request(`${url}/auth/login`, {
                 method: "POST",
                 body: JSON.stringify({ username, password }),
                 headers: new Headers({ "Content-Type": "application/json" }),
                redentials: "include"
           });
           return fetch(request)
               .then(response => {
                   if (response.status < 200 || response.status >= 300) {
                        throw new Error(response.statusText);
                    }
                   return response.json();
                })
               .then(({ token, roles, permissions, email }) => {
                    localStorage.setItem("roles", roles);
                    localStorage.setItem("permissions", permissions);
                    localStorage.setItem("authenticated", true);
            });
    });
},`

This login is working, And I can see the cookies are returned(laravel_sessions, XSRF-TOKEN, and a token) but once I tried to call the protected routes, example /admin/V1/showcustomers,it always 401, and I can confirm that the requests headers contains those three, I dont understand why I always got 401. The frontend that calling the api is in the same project folder with the api, and its located inside /resources.js. The frontend(which houses the admin dashboard) is in laravel.test/admin, since the base url laravel.test is configured to redirect to laravel.test/admin and the api is in the laravel.test/admin/V1.I also noticed that the cookie contains weird string in the end ..longstringYWQzMzkifQ%3D%3D instead of ...longstringYWQzMzkifQ==

Any ideas ?