import { redirect } from "next/navigation";
import {
  isUserAuthenticated,
  getServerUserEvaluation,
  getServerSkillCategories,
  getServerTeams,
} from "@/lib/server-auth";
import { generateRadarData } from "@/lib/evaluation-utils";
import {
  WelcomeHeader,
  RadarSection,
  CategoryBreakdown,
  ActionSection,
  ClientWrapper,
  WelcomeScreen,
} from "@/components/home";

export default async function HomePage() {
  // Vérifier l'authentification
  const isAuthenticated = await isUserAuthenticated();

  // Si pas de cookie d'authentification, rediriger vers login
  if (!isAuthenticated) {
    redirect("/login");
  }

  // Charger les données côté serveur
  const [userEvaluation, skillCategories, teams] = await Promise.all([
    getServerUserEvaluation(),
    getServerSkillCategories(),
    getServerTeams(),
  ]);

  // Si pas d'évaluation, afficher l'écran d'accueil
  if (!userEvaluation) {
    return <WelcomeScreen />;
  }

  // Générer les données radar côté serveur
  const radarData = generateRadarData(
    userEvaluation.evaluations,
    skillCategories
  );

  // Tout en server-side, seul le ClientWrapper gère setUserInfo
  return (
    <ClientWrapper userEvaluation={userEvaluation} teams={teams}>
      <div className="min-h-screen bg-gradient-to-br from-slate-950 via-slate-900 to-slate-950 relative overflow-hidden">
        {/* Background Effects */}
        <div className="absolute inset-0 bg-[radial-gradient(ellipse_at_top,_var(--tw-gradient-stops))] from-blue-900/20 via-slate-900 to-slate-950" />
        <div className="absolute inset-0 bg-grid-white/5 bg-[size:50px_50px]" />
        <div className="absolute inset-0 bg-gradient-to-t from-slate-950 via-transparent to-transparent" />

        <div className="relative z-10 container mx-auto px-6 py-8 max-w-7xl space-y-8">
          {/* Header */}
          <WelcomeHeader firstName={userEvaluation.profile.firstName} />

          {/* Main Content Grid */}
          <div className="grid grid-cols-1 lg:grid-cols-2 gap-8">
            {/* Radar Chart */}
            <RadarSection radarData={radarData} />

            {/* Category Breakdown */}
            <CategoryBreakdown
              radarData={radarData}
              userEvaluation={userEvaluation}
              skillCategories={skillCategories}
            />
          </div>

          {/* Action Button */}
          <ActionSection />
        </div>
      </div>
    </ClientWrapper>
  );
}