TypeError: client.query is not a function

enter image description here

enter image description here

Hi I was trying to do a next js project and i got this error while trying to connect database.
I am using neon database.

app/provider.js

"use client";
import React, { useEffect } from "react";
import { useUser } from "@clerk/nextjs";
import { db } from "@/configs/db"; 
import { eq } from "drizzle-orm";
import { Users } from "@/configs/schema";

function Provider({ children }) {
  const { user } = useUser();

  const isNewUser = async () => {
    try {
      const result = await db
        .select()
        .from(Users)
        .where(eq(Users.email, user?.primaryEmailAddress?.emailAddress));

      console.log(result);

      if (!result.length) {
        await db.insert(Users).values({
          name: user?.fullName,
          email: user?.primaryEmailAddress?.emailAddress,
          imageUrl: user?.profileImageUrl,
        });
        console.log("New user added to the database.");
      }
    } catch (error) {
      console.error("Error during user validation or insertion:", error);
    }
  };

  useEffect(() => {
    if (user) {
      isNewUser();
    }
  }, [user]);

  return <div>{children}</div>;
}

export default Provider;

configs/db.js

import { neon } from '@neondatabase/serverless';
import { drizzle } from 'drizzle-orm/neon-serverless';

const sql = neon(process.env.NEXT_PUBLIC_DATABASE_URL);
export const db = drizzle(sql);

configs/schema.js

import { boolean, pgTable, serial, varchar } from "drizzle-orm/pg-core";

export const Users = pgTable('users',{
    id:serial('id').primaryKey(),
    name:varchar('name').notNull(),
    email:varchar('email').notNull(),
    imageUrl:varchar('imageUrl'),
    subscription:boolean('subscription').default(false)
})

I tried making db.js into async function based on some related answers it but still i am getting same error. Thanks in advance