SolidJS + PocketBase not working ?

import { A } from "@solidjs/router";
import Counter from "~/components/Counter";

import PocketBase from 'pocketbase';

const pb = new PocketBase('http://127.0.0.1:8090');

export default function Home() {


  const onLogin = async () => {
    try {
      const authData = await pb.collection('users').authWithOAuth2({ provider: 'google' });
      console.log('Logged in successfully:', authData);
    } catch (error) {
      console.error('Login failed:', error);
    }
  };

  return (
    <main class="text-center mx-auto text-gray-700 p-4">
      <h1 class="max-6-xs text-6xl text-sky-700 font-thin uppercase my-16">Hello world!</h1>
      <Counter />
      <button onClick={onLogin} class="bg-sky-600 text-white px-4 py-2 rounded hover:bg-sky-700">
        Login with Google
      </button>
      <p class="mt-8">
        Visit{" "}
        <a href="https://solidjs.com" target="_blank" class="text-sky-600 hover:underline">
          solidjs.com
        </a>{" "}
        to learn how to build Solid apps.
      </p>
      <p class="my-4">
        <span>Home</span>
        {" - "}
        <A href="/about" class="text-sky-600 hover:underline">
          About Page
        </A>{" "}
      </p>
    </main>
  );