import { auth } from "@/auth"
import { redirect } from "next/navigation"
import Link from "next/link"
import { getUserGuilds } from "@/lib/discord"
import Toast from "@/components/Toast"

export default async function Dashboard() {
    const session = await auth()

    if (!session) {
        redirect("/")
    }

    // Fetch user's guilds from Discord API
    let managedGuilds: any[] = [];
    if (session?.accessToken) {
        managedGuilds = await getUserGuilds(session.accessToken as string);
    }

    return (
        <div className="min-h-screen bg-black/50 relative">
            <Toast />
            {/* Header / User Corner */}
            <div className="absolute top-4 right-4 flex items-center gap-3 bg-white/5 px-4 py-2 rounded-full border border-white/10 backdrop-blur-md z-10">
                <div className="text-right hidden sm:block">
                    <p className="text-sm font-semibold text-white">{session.user?.name}</p>
                </div>
                {session.user?.image && (
                    <img
                        src={session.user.image}
                        alt="User"
                        className="w-10 h-10 rounded-full border border-blue-500/50"
                    />
                )}
            </div>

            <div className="container mx-auto px-4 py-20 flex flex-col items-center">
                <div className="w-full max-w-4xl mb-8 p-4 bg-blue-500/10 border border-blue-500/20 rounded-lg text-center text-blue-200 text-sm">
                    If you would like to be participating in the beta program of void sentinel, please send a DM to <span className="font-mono bg-blue-500/20 px-1 rounded">_void_x_</span> on discord.
                </div>

                <h1 className="text-4xl md:text-5xl font-bold tracking-tighter bg-clip-text text-transparent bg-gradient-to-r from-white via-blue-200 to-slate-400 mb-8">
                    Select a Server
                </h1>

                {managedGuilds.length === 0 ? (
                    <div className="text-gray-400 text-center bg-white/5 p-8 rounded-xl border border-white/10 backdrop-blur-sm max-w-lg">
                        <p className="text-lg mb-2">No servers found where you have management permissions.</p>
                        <p className="text-sm">Make sure you have "Manage Server" or "Administrator" permissions.</p>
                    </div>
                ) : (
                    <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6 w-full max-w-6xl">
                        {managedGuilds.map((guild: any) => (
                            <div key={guild.id} className="group relative bg-white/5 hover:bg-white/10 border border-white/10 hover:border-blue-500/50 rounded-xl p-6 transition-all duration-300 hover:-translate-y-1 overflow-hidden block">
                                <div className="absolute inset-0 bg-gradient-to-br from-blue-500/10 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />

                                <div className="flex flex-col items-center text-center relative z-10">
                                    {guild.icon ? (
                                        <img
                                            src={`https://cdn.discordapp.com/icons/${guild.id}/${guild.icon}.png`}
                                            alt={guild.name}
                                            className="w-20 h-20 rounded-full mb-4 shadow-lg group-hover:scale-105 transition-transform"
                                        />
                                    ) : (
                                        <div className="w-20 h-20 rounded-full mb-4 bg-gray-700 flex items-center justify-center text-2xl font-bold text-gray-400 group-hover:text-white transition-colors">
                                            {guild.name.substring(0, 2)}
                                        </div>
                                    )}
                                    <h3 className="font-semibold text-lg text-white mb-3 truncate w-full">{guild.name}</h3>

                                    {guild.botInGuild ? (
                                        <Link href={`/dashboard/${guild.id}`} className="px-4 py-2 bg-blue-500/10 hover:bg-blue-500/20 text-blue-300 rounded-lg border border-blue-500/30 transition-colors w-full">
                                            Manage
                                        </Link>
                                    ) : guild.isBetaServer ? (
                                        <a
                                            href={`/api/oauth/invite?guild_id=${guild.id}`}
                                            className="px-4 py-2 bg-white/5 hover:bg-white/10 text-gray-300 rounded-lg border border-white/10 hover:border-white/20 transition-colors w-full flex items-center justify-center gap-2"
                                        >
                                            Add to Server
                                        </a>
                                    ) : (
                                        <button
                                            disabled
                                            className="px-4 py-2 bg-white/5 text-gray-500 rounded-lg border border-white/5 cursor-not-allowed w-full flex items-center justify-center gap-2"
                                        >
                                            Request Access
                                        </button>
                                    )}
                                </div>
                            </div>
                        ))}
                    </div>
                )}
            </div>
        </div>
    )
}