I'm stuck with Next Auth authorize part. Error: This action with HTTP GET is not supported

Question

For the past couple of weeks I'm unable to solve the following error in next.js with authorization. I'm stuck at the NextAuth signIn part. Below are the images for my auth.js file inside lib directory,

import NextAuth from "next-auth"
import GitHub from "next-auth/providers/github"

export const { 
    handlers: {GET, POST}, 
    auth, 
    signIn, 
    signOut, 
} = NextAuth({ 
    providers: [ 
        GitHub({
            clientId: process.env.GITHUB_ID, 
            clientSecret: process.env.GITHUB_SECRET,
        }) ,
    ],
});

Below is the code for action.js.

"use server"
import { revalidatePath } from "next/cache";
import { Post } from "./models";
import { connectToDb } from "./utils";
import { signIn, signOut } from "./auth";

export const addPost = async (formData) => {
    // const title = formData.get("title");
    // const desc = formData.get("desc");
    // const slug = formData.get("slug");

    const {title, desc, slug, userId} = Object.fromEntries(formData);

    try{
        connectToDb();
        const newPost = new Post({
            title,
            desc,
            slug,
            userId,
        });

        await newPost.save();
        console.log("saved to db")
        revalidatePath("/blog")
    } catch (err){
        console.log(err);
        return {error: "Something went wrong!"}
    }
}

export const deletePost = async (formData) => {

    const {id} = Object.fromEntries(formData);

    try{
        connectToDb();
        await Post.findByIdAndDelete(id);
        console.log("deleted from db")
        revalidatePath("/blog")
    } catch (err){
        console.log(err);
        return {error: "Something went wrong!"}
    }
}

export const handleGithubLogin = async () => {
    "use server";
    await signIn("github");
}

export const handleLogout = async () => {
    "use server";
    await signOut();
}

Inside app/(auth)/login/page.jsx, I've the following code which is not working and giving me error at await signIn("github") part in action.js.

import { handleGithubLogin } from "@/lib/action";

const LoginPage = async () => {
  
  return (
    <div>
      <form action={handleGithubLogin}>
        <button>Login with Github</button>
      </form>
    </div>
  )
}

export default LoginPage

Inside app/api/auth/[...nextauth]/route.js I've the following code

export { GET, POST } from "@/lib/auth";

Please, help me solve this api routing problem with nextauth, I've tried the documentation but nothing helped.